思いついてから3時間で公開!AIと協業する開発の舞台裏
「業務の詰まりを可視化するツールがあったら、相談のきっかけになるんじゃないか」
ふと思いついたのが朝。
3時間後、そのツールは公開されていました。
これは魔法でも誇張でもなく、AIと協業する開発の実例です。
今回は、tugiloが実際にどうやってこの速度を実現しているのか、舞台裏をお見せします。
- AI駆動開発って本当に速いの?と疑っている
- AIに任せていい範囲がわからない
- 自社でもAIを活用したいが、イメージが湧かない
- システム開発を外注したいが、期間やコストが不安
結論から言うと、3時間で公開できたのは「構想を先に固め、AIと人間の役割を分け、完璧より公開」したからです。 以下では、tugiloが実際にどうやってこの速度を実現したか、舞台裏をまとめます。
関連記事:
「こんなツールが欲しい」から始まった
tugiloには、中小企業や個人事業主の方から「何から手をつければいいかわからない」という相談が多く寄せられます。
Excel、紙、LINE、口頭連絡が混在している。
特定の人しか分からない業務がある。
問い合わせ対応に追われて本業が進まない。
こうした"詰まり"は、当人には見えにくいものです。
毎日の業務に追われていると、「これが普通」と思ってしまう。
でも客観的に見ると、明らかに改善できるポイントがある。
だから、自分で診断できるツールがあれば、相談の前に「自分の状況」を整理できる。
「うちはこういう状態なんです」と言語化できれば、相談もスムーズになる。
そう思いついたのが、朝9時。
「じゃあ作ろう」と決めた瞬間から、3時間のカウントダウンが始まりました。
AIとの対話で「構想」を固める
最初の30分:何を作るかを言語化する
最初にやったのは、コードを書くことではありません。
AIと一緒に「何を作るか」を言語化することです。
従来の開発では、ここで「要件定義書」を作ります。
何週間もかけて、関係者にヒアリングして、ドキュメントを整備して…。
でもAI駆動開発では、AIと対話しながら即座に要件を固めていきます。
「中小企業向けに、業務の詰まりを可視化するセルフ診断ツールを作りたい。5〜7問の質問で、業務タイプと改善優先度がわかるようにしたい。どんな質問項目と診断ロジックが考えられる?」
AIは即座に、以下を提案してきました。
- 質問項目の候補: 情報管理の方法、コミュニケーション手段、属人化の度合い、対応の頻度など
- 診断ロジックの設計案: 各質問にスコアを設定し、合計点で業務タイプを分類
- 業務タイプの分類: 4つのタイプ(アナログ混在型、属人依存型、対応追われ型、バランス型)
- 結果画面で伝えるべき内容: 現在の状況、改善優先度TOP3、想定されるムダ時間、次の一手
AIの提案を「自分のもの」にする
ここで重要なのは、AIの提案を鵜呑みにしないことです。
AIは「一般的に良さそうな案」を出します。
でも、それがtugiloのターゲットに刺さるかは別問題です。
提案を見ながら、こう考えました。
- 「この質問、うちに相談に来る人の悩みに合ってるか?」
- 「診断結果の表現、上から目線になってないか?」
- 「改善提案、具体的すぎて押し売りっぽくないか?」
AIは壁打ち相手であり、最終判断は人間がする。
この境界線を守るから、「自分たちのツール」になるわけです。
結果、AIの提案をベースにしつつ、以下を調整しました。
- 質問の表現を「現場あるある」に寄せる
- 診断結果は「問題の指摘」ではなく「次の一歩」にフォーカス
- tugiloらしい「伴走感」を結果テキストに込める
この構想フェーズに30分。
ここがしっかりしていれば、あとは実装するだけです。
実装はAIが加速し、人間が方向を決める
実装フェーズの役割分担
構想が固まったら、実装フェーズです。
ここでもAIは大活躍しますが、役割分担が明確です。
- コード生成: UIコンポーネント、診断ロジック、状態管理
- PDF出力機能: 診断結果をPDFでダウンロードできる機能
- レビューと修正: 「ここ動かない」と伝えると、原因特定と修正案を提示
- テスト補助: ブラウザで動作確認しながら、不具合を即座に修正
- SEO対応: OGP設定、Schema.org構造化データの実装
- 診断結果のトーン: 「問題を指摘する」ではなく「次の一歩を示す」表現にしたかった
- UI/UXの細部: ボタンの色、進捗バーの見せ方、結果カードのレイアウト
- 導線設計: 結果画面から相談フォームへの自然な誘導
- 公開範囲: どこまでを無料で見せるか、相談への誘導をどう設計するか
実装中のAIとの対話例
実装中も、AIとは常に対話しながら進めます。
例えば、こんなやり取りがありました。
私: 「診断結果をPDFでダウンロードできるようにしたい。日本語フォントが文字化けしないように」
AI: 「html2canvasでHTML要素を画像化し、jsPDFでPDFに変換する方法が安定します。日本語フォントはブラウザのレンダリングを利用するので文字化けしません」
私: 「結果画面から相談フォームに遷移するとき、診断結果を自動で入力欄に入れたい」
AI: 「sessionStorageに診断結果を保存し、相談フォーム側で読み取って自動入力する方法が良いでしょう。ページ遷移後も保持されますし、ブラウザを閉じれば消えるのでプライバシー面も安心です」
このように、「何をしたいか」を伝えれば、「どうすれば実現できるか」をAIが提案してくれる。
人間は「その方法でいいか」を判断すればいい。
これが、開発速度を劇的に上げる秘訣です。
AIに丸投げするとこうなる
ただし、注意点があります。
- 機能は動くが、ターゲットに刺さらない
- 見た目は整うが、ブランドと合わない
- 完成はするが、「で、何がしたいの?」になる
- 技術的には正しいが、ユーザー体験が悪い
AIは優秀な実行者ですが、意思決定者ではありません。
AIは「作れる」けど、「何を作るべきか」は人間が決める。
この原則があるから、ツールに"思想"が宿ります。
3時間で公開できた理由
振り返ると、3時間でできた理由は4つあります。
1. 構想を最初に固めた
「何を作るか」が曖昧なまま走ると、途中で迷いが生じます。
「やっぱりこうしたい」「いや、こっちの方が…」と行ったり来たりする。
最初の30分で構想を言語化したことで、残り2時間半を「実装」に集中できました。
これは従来の開発でも同じです。
要件定義がしっかりしていれば、開発はスムーズに進む。
違いは、その要件定義を「AIとの対話で即座に固められる」こと。
2. AIに任せる範囲を明確にした
コード生成、バグ修正、レビューはAIに任せる。
ターゲット理解、表現のトーン、最終判断は人間がやる。
この切り分けがあるから、迷わず進められました。
「これはAIに聞こう」「これは自分で決めよう」が明確だと、判断が速くなります。
逆に、全部自分でやろうとすると遅くなるし、全部AIに任せようとすると品質が下がる。
3. 完璧を目指さなかった
最初から100点を狙うと、永遠に公開できません。
「まず動くものを出して、フィードバックをもらって改善する」。
この姿勢が、スピードを生みます。
今回も、公開後にいくつか改善しました。
- PDFのレイアウト調整
- 結果テキストの微調整
- 相談フォームへの導線改善
でも、それは「公開してから」でいい。
動くものがあれば、改善点も見えやすくなります。
4. 技術スタックの知識があった
これは正直に言うと、前提条件です。
LaravelやJavaScriptの基礎知識がなければ、AIの提案を評価できません。
ただ、ゼロから学ぶ必要はありません。
「この方法で合ってる?」とAIに確認しながら進めれば、学びながら作れます。
AI駆動開発は「魔法」ではない
3時間で公開できたのは、AIが魔法を使ったからではありません。
人間が「何を作るか」を明確にし、AIを「どう使うか」を設計したから実現できたのです。
逆に言えば、AIを使いこなすには「自分が何をしたいか」が必要です。
それがないと、AIは力を発揮できません。
「AIを導入すれば速くなる」は半分正解で、半分間違い。
正確には、「AIを正しく使えば速くなる」です。
今回作ったツールがこれです。5〜7問の質問に答えるだけで、あなたの業務の「詰まりやすいポイント」を可視化します。登録不要・無料で即座に利用可能。
tugiloのAI駆動開発
tugiloでは、この「AI × 人間の協業」をすべての開発に適用しています。
開発プロセス
各フェーズでのAIと人間の役割分担は以下の通りです。
構想フェーズ
- AI: 要件の壁打ち、選択肢の提示
- 人間: ターゲット理解、最終判断
設計フェーズ
- AI: 設計案の提示、技術選定の補助
- 人間: ビジネス要件との整合性確認
実装フェーズ
- AI: コード生成、バグ修正
- 人間: コードレビュー、品質判断
テストフェーズ
- AI: テストケース提案、自動修正
- 人間: ユーザー視点での確認
改善フェーズ
- AI: 改善案の提示
- 人間: 優先度判断、方向性決定
従来比70%の開発期間短縮
この方式により、tugiloでは従来の開発と比較して約70%の期間短縮を実現しています。
- 従来2週間かかっていた機能開発 → 3〜4日
- 従来1ヶ月かかっていたシステム構築 → 1〜2週間
- 小規模なツール開発 → 数時間〜1日
ただし、これは「手抜き」ではありません。
人間が判断すべきことに集中できるから、品質も上がるのです。
まとめ:速さの秘訣は「AIとの役割分担」
今回の事例から得られる教訓は、以下の3つです。
- 構想を先に固める: 何を作るかが明確なら、実装は速い
- AIと人間の役割を分ける: 任せることと、判断することを明確に
- 完璧より公開: まず動くものを出して、改善サイクルを回す
「うちの業務にもシステムが必要かも」
「でも、何から相談すればいいかわからない」
そんなときは、まずは無料相談から。
構想を一緒に言語化するところから、お手伝いします。
- 構想を先に固める。 何を作るかが明確なら実装は速い。最初の30分で言語化し、残りを実装に集中する。
- AIと人間の役割を分ける。 コード生成・バグ修正はAI、ターゲット理解・最終判断は人間。任せることと判断することを明確に。
- tugiloは「完璧より公開」で回す。 まず動くものを出して、フィードバックをもらって改善する。動くものがあれば改善点も見えやすい。
「こんなことできる?」という段階から歓迎です。AI駆動開発で、あなたの業務課題を一緒に解決しましょう。