エンジニアじゃない私が自分でアプリを作ってみた話

はじめに ―― なぜ私がアプリを作ることになったか

Webディレクターとして20年以上、クライアントのWebサイトやアプリをつくる仕事をしてきました。

要件定義も、画面構成も、仕様書も、自分でつくれます。「こういうサービスがあったらいいな」という構想を、具体的な形に落とし込む作業は得意です。でも、ずっとできないことがありました。デザインをつくること、そしてそれをプログラミングすること。

だから、「自分自身のために作りたいサービス」が頭にあっても、それをアプリという形にすることは、これまでできませんでした。自分でできるのは「設計まで」。実現するには、エンジニアやデザイナーに依頼するしかなかった。

それが、自分の手でアプリをリリースすることになるとは思っていませんでした。

きっかけは着物です。

2024年1月、着付け教室に通い始めました。最初は「たまに着られたらいいな」くらいの気持ちだったのに、気づいたら和装検定師範の資格まで取得して、人への着付けもできるようになっていました。着物の世界に、すっかりはまってしまいました。

着物生活を続けるうちに、やりたいことがでてきました。

タンスの中に何があるか把握できない。コーディネートを考えるとき、どの帯と合わせたか記憶が曖昧になる。「今日の茶会、何を着ていこう」と迷ったとき、誰かに相談したくなる。

着物の写真を登録して管理する。コーディネートを記録して見返せる。迷ったらAIに相談できる。この3つが全部できるアプリが、なかったんです。

「……自分でつくるか」

ディレクター歴20年の頭の中で、なぜかその選択肢が浮かびました。コードは書けないのに。

 作ったもの ――「きもの日和」の紹介

こうして生まれたのが、iOS向けの着物コーディネートアプリ「きもの日和」です。一言で言うと、「着物好きのための、着物生活をまるごとサポートするアプリ」。主な機能は6つです。

① 私の箪笥（クローゼット管理） 着物・帯・帯揚げ・帯締め・半衿・草履・バッグなど、手持ちのアイテムを写真付きで登録できます。産地・季節・格・タグで整理できるので、「あの着物、どこにしまったっけ」がなくなります。

② コーディネート作成 登録したアイテムを重ねるだけで、平置きスタイルのコーディネートが完成します。エンジニアに説明するのが難しくて、一番こだわった機能です。

③ AIコーデ提案 「お出かけ」「茶道」「フォーマル」などシーンを選ぶだけで、手持ちのアイテムから3パターンのコーディネートをAIが提案してくれます。迷ったときの相棒です。

④ 着物日記 着用した日の写真・場所・思い出を記録できます。タイムラインとカレンダーで振り返れて、和風月名や二十四節気も表示されます。

⑤ 着物店舗検索 全国47都道府県の着物店舗を収録。旅先でも使えます。

⑥ 今日のきもの日和 現在地の天気・気温・降水確率を表示。今日何を着るか選ぶ参考になります。

App Storeで無料公開しています。

正直に書く ―― 私の技術レベル

「非エンジニアが作った」と書くと、「どのくらい非エンジニアなの？」と思われると思うので、正直に書きます。

マークアップはできます。HTML・CSSで静的なページを書くことや、Web制作を始めた頃はWordPressやMovable Typeの組み込みも自分でやっていました。ただ、アプリをつくるようなプログラミング言語は書けません。デザインツールは使えますが、それをコードに落とし込む作業も別の話です。

一方で、Webディレクターとして20年以上、こういう仕事をしてきました。

• クライアントの要望をヒアリングして、仕様に落とし込む
• 制作チームを仕切り、プロジェクトを最後まで導く
• テストチームと一緒に動作確認をして、修正を指示する
• 「何が必要か」を整理して、関係者に伝わる形にまとめる

アプリを作ってみて気づいたのは、AIと一緒に開発するとき、この力が一番効くということでした。

コードは書けなくていい。でも「何を作りたいか」を正確に伝えられないと、AIも動けない。クライアントの要望を仕様に落とす作業も、チームを動かすためのコミュニケーションも、構造としてはまったく同じでした。

ただ、相手がAIになったことで変わったこともありました。それは次のセクションで。

開発の進め方 ―― AIを相方にするとはどういうことか

使ったのは主にこの3つです。

• Flutter：iOSとWebを、ひとつのコードで同時に作れるフレームワーク
• Firebase：ログイン・データ保存・画像保存などをまとめて担うGoogleのサービス
• Claude Code：Anthropicが提供するAIコーディングアシスタント。ターミナル上で動くツールで、日本語で指示を書くとコードを生成・修正してくれます。実質的な開発パートナーです。

何で作ればいいかもわからなかったので、まずClaudeに相談しました。「iOSアプリを作りたい、着物の写真を管理してコーディネートを記録できるものを」と伝えたところ、FlutterとFirebaseの組み合わせを提案されました。技術選定もAIに聞く、という始まり方でした。

コードはどう作ったか

実際の開発の流れはこうです。

① やりたいことを日本語で書く 「着物アイテムを写真付きで登録できる画面を作りたい。カテゴリは着物・帯・帯揚げ・帯締め・草履・バッグ」といった形で、仕様をテキストに書きます。ここはまさにディレクターの仕事です。

② Claudeに実装してもらう 書いた仕様をClaude（以降こう呼びます）に渡すと、コードを書いてくれます。

③ 動かして確認する 受け取ったコードをアプリに反映して、実際に触って確認します。「ここが違う」「この動きにしたい」をまた日本語で伝え、修正してもらって、また確認する。この繰り返しです。

④ エラーが出たらそのままAIに投げる 動かなかったとき、エラーメッセージが画面に表示されます。そのテキストをそのままコピーしてClaudeに渡すと、原因と対処法を教えてくれます。

振り返ると、クライアントの要望をヒアリングして仕様に落とし、制作チームに渡して確認して修正して…という、ふだんのプロジェクト進行とほぼ同じでした。違ったのは、時間を選ばず、何度でも聞き直せること。「もう一回説明して」「やっぱり変えたい」を気兼ねなく言えるので、遠慮がいらない分、思った以上にはかどりました。

デザインと画像はどう作ったか

コードと同じくらい、デザインにも試行錯誤しました。

Google StitchやFigma AIも試しましたが、なかなかイメージに近いものが出てこず。最終的にclaude.designを使ったところ、方向性が決まりました。

ただし、アプリ内で使う画像の生成はClaudeでは対応できないため、ChatGPTやGeminiを使いました。AIといっても、得意不得意があるので、目的に合わせて使い分けています。

タイムライン ―― 2ヶ月でリリースまでの実録

2026年3月：構想・準備

まず要件定義と画面構成をまとめました。ここはディレクターとして慣れた作業なので、スムーズに進みました。

ただ、開発環境の準備でいきなり苦戦しました。Claude Codeを使うためにターミナルを開くところから始まるのですが、エンジニアが当たり前のようにやっていることが、私にはわかりません。プラグインの導入、CLAUDE.mdファイルの作成（Claudeにプロジェクトの情報を伝えるための設定ファイルです）、環境変数の設定……。「え、これって何？」の連続でした。

開発に入る前の準備だけで、かなりの時間を使いました。

2026年4月：本格開発スタート

Flutterの環境構築から始まり、ログイン・アイテム登録・コーディネート作成・日記・店舗検索・AI提案と、ひとつずつ機能を実装していきました。毎日Claudeと会話しながら進める日々です。

エラーとの格闘も多かったですが、それとは別に「Claudeが間違っていること」もありました。

たとえば、アプリ内の写真が暗くなってしまう問題。画像が何度も再ダウンロードされてしまう問題。どちらもClaudeが実装したコードに原因がありましたが、それを「おかしい」と気づけたのは、実際に触って確認し続けていたからです。

テストをして、違和感を言語化して、Claudeに伝えて直してもらう。この流れはまさにディレクターとしてこれまでやってきたことで、経験が活きたと感じた部分でもありました。

2026年5月：仕上げ・申請・リリース

デザインの調整、動作確認、App Store申請用の文章やスクリーンショットの準備。Apple審査を通過して、5月下旬にリリースしました。

3月から数えると約3ヶ月、本格的に作り始めた4月からは約2ヶ月でのリリースでした。

壁と乗り越え方

意外とてこずった実機テスト

開発中、想定外に手こずったのがテストの方法でした。

実機（iPhoneの実物）をパソコンにつないでテストする方法をまず試しましたが、うまくいかないことが多く。APIキーをどこに保管すればいいかわからず行き詰まることもありました。

最終的に行き着いたのがTestFlight（Appleが提供するアプリのテスト配信サービス）でした。実機で本番に近い状態のアプリを触れるので、自分にはこれが一番やりやすかったです。

Apple審査に出すまでの準備

Apple審査自体は、一回目で通りました。

ただ、審査に出すまでの準備に手間取りました。Apple Developer Program（年会費制のデベロッパー登録）に加入するためにDUNS番号の取得が必要で、App Store Connectでの設定も初めてのことばかり。審査に出す前の段階が、実は一番「何をすればいいんだろう」となった時間でした。

逆に、「あ、これ私にもできる」と感じた瞬間もありました。

Claudeが間違えたコードを、テストしていて自分で気づけたとき。「仕様を決める」「確認する」「言語化して伝える」——ディレクターとしてやってきたことが、そのまま通用すると気づいた瞬間でした。

ディレクターの視点から見えたこと

作り終えて、改めて思うことがあります。

AIと一緒に開発する流れは、ディレクターがエンジニアと仕事をする流れとほぼ同じでした。やりたいことを言語化して、渡して、確認して、フィードバックする。この繰り返しです。

違うのは、「伝え方がそのまま品質に直結する」ということでした。

エンジニアに依頼するときは、多少あいまいでも経験や文脈で補ってもらえることがあります。AIはそれができません。あいまいに伝えると、あいまいなものが返ってきます。仕様を丁寧に言語化する力が、そのままアプリの完成度に影響しました。

自分でFlutterやFirebaseを触ったことで、「これがどれくらい大変なのか」の感覚が以前よりつかめるようになりました。エンジニアが「それは難しい」と言うとき、前より少しだけ具体的に想像できるようになった気がします。

同時に、わからないことはまだたくさんあります。

コードの中身を読んで理解する、ということは今もできません。Claudeが書いてくれたコードが「なぜ動くのか」を説明できない部分も多いです。「作れた」と「わかっている」は、別の話だと思っています。

デザインも同じです。AIにデザインを出してもらうことはできますが、「これでいいか」を判断する目は別に必要で、そこは結局自分の感覚頼みでした。作り終えて改めて、デザイナーの目というのは簡単には代替できないと感じています。

おわりに

リリースしたとき、素直に「やった」と思いました。

AIが書いたコードでも、自分の意志で設計して、自分の言葉で伝えて、自分の手でApp Storeに出した。それは紛れもなく、自分が作ったアプリです。

ずっと「設計まで」しかできなかった自分が、0から1を作りきった。その事実が、何より大きかったです。

これまでクライアントのために積み上げてきた経験が、自分のプロダクトを生み出すことに使えた。そのことが、作り終えて一番嬉しかったことかもしれません。

きもの日和は、これからも育てていくつもりです。よかったら使ってみてください。

補足：使ったツールとコストについて

使ったツール一覧

カテゴリ	ツール・サービス	用途
開発言語・フレームワーク	Flutter	iOSとWebを同時に作れる
開発環境	Xcode	iOSアプリのビルド
AIアシスタント	Claude Code	コードを書いてもらう相方
ログイン機能	Firebase Authentication	Google・Appleログイン
データベース	Cloud Firestore	アイテム・日記・コーデの保存
画像保存	Firebase Storage	写真データの保存
AIコーデ提案の中継	Firebase Functions	APIキーを安全に隠す橋渡し役
AIコーデ提案の本体	Claude API（Haiku）	AIが提案文を生成
天気表示	Open Meteo API	無料の天気API
広告	Google AdMob	バナー広告（収益化）
デザイン	claude.design	UIデザインの方向性決め
画像生成	ChatGPT / Gemini	アプリ内画像の生成

かかったコスト概算

項目	金額	備考
Apple Developer Program	¥12,800/年	App Storeに出すために必須
Firebase	ほぼ無料	無料枠内で収まる
Claude API	数円〜/回	AI提案1回ごとに課金
天気API（Open Meteo）	無料
Flutter・Xcode	無料
Claude Code	Proプラン（月額）