「本当に誰でも」AIとの会話だけでアイデアをアプリに Claude Designは手取り足取り助けてくれる：生成AIお悩み相談室（5）（3/3 ページ）
デプロイしてスマホで日常的に使う
さて、ここからが仕上げです。「自分のスマホで日常的に使う」という今回の目標は、前節のエクスポートだけではまだ達成できていません。
Claude Designには標準でShare機能があり、作ったプロトタイプを共有できます。
ただし、このShare機能は基本的に、同じ組織内のメンバーとの共同作業を想定したものです。つまり、「自分が日常的に使うアプリとして、スマホのブラウザからいつでも開きたい」、あるいは「お客さまにデモ環境を触ってもらいたい」といったケースはShare機能ではカバーできません。
そこで活躍するのが、先ほどエクスポートしたファイル一式と、静的サイトの簡易デプロイサービスです。代表格の「Netlify Drop」と、2026年7月8日にリリースされたばかりの「Cloudflare Drop」は、どちらもブラウザにファイル一式をドラッグ＆ドロップするだけで、数秒で共有可能なURLが発行されるサービスです。ターミナルも設定ファイルも登場しないため、本稿の読者層にとって最も現実的な公開手段だと思います。
筆者が両方を実際に試した範囲では、使い方はほぼ同じでした。単体のHTMLファイルやフォルダ、ZIPをドロップするとURLが発行されます。ただしアカウントなしの一時URLは、どちらのサービスでも1時間ほどで削除されます。そのため、「使い捨て公開」は当てにせず、無料アカウントを作ってクレーム（自分のアカウントへのひも付け）まで済ませるのが前提と考えてください。
両者の違いは、無料の範囲で閲覧制限をかけられるかどうかです。Netlify Dropのパスワード保護は有償プランが必要ですが、Cloudflare Dropなら「Cloudflare Access」によるメールアドレス認証を50ユーザーまで無料で追加できます（支払い方法の登録は必要です）。自分用アプリの置き場所としては、Cloudflare Dropの方が一歩使いやすい印象です。
今回の「呑み旅」アプリは自分が日常的に使う想定なので、Cloudflare Dropでデプロイしてみます。手順は次の通りです。
1. ダウンロードしたZIPファイルを展開し、中に入っているアプリ本体のHTMLファイルをindex.htmlにリネームします（リネームせずにZIPのままドロップしても動きません）
2. https://www.cloudflare.com/drop/を開き、展開したファイル一式をフォルダごとドラッグ＆ドロップします
3. 発行されたURLを確認したら、60分以内に「Claim」ボタンから無料アカウントにひも付けます
あとはスマホのブラウザでそのURLを開き、「ホーム画面に追加」をすれば、アプリに近い感覚で日常的に使えます。
最後に、公開範囲についてだけ注意してください。発行されるURLは「知っている人は誰でも見られる」全世界への公開が基本です（エクスポート時に「noindex」「nofollow」を入れることで検索結果には載りにくくなりますが、URLを知っている人が見られる点は変わりません）。今回のような、見られても困らない個人用アプリならクレームだけの運用で十分ですが、見られてまずい内容を扱うなら、前述のCloudflare Accessで「許可したメールアドレスの人だけが開ける」認証を追加しておくといいでしょう。設定の詳細は本稿の主題から外れるため割愛します。
おわりに
いかがでしたでしょうか。今回は、Claude Designを使って思い付きレベルのアイデアを動くモックアップにし、データが消えないプロトタイプへ育て、自分のスマホで日常的に使えるところまで持っていく流れを紹介しました。
筆者が特に価値を感じたのは、生成されるUIの見た目以上に、「作る前のヒアリング」と「作った後の反復改善」がどちらも会話だけで回ることです。要件を引き出してもらい、複数案から選び、触ってみて気づいたことをまた一言で直してもらう。この一連の流れは、これまで企画者・デザイナー・エンジニアの3者で数週間かけていたキャッチボールの、最初の数往復を1人と1つのAIで済ませてしまう体験ではないかと思います。もちろん、このまま本番サービスとしてリリースできる品質のものではありませんが、「アイデアの価値を検証する」「関係者と認識を合わせる」という目的には十分すぎるほどです。
また、従来のチャットAIでは、複数の案を並べて見比べながら検討することが難しく、生成される画面のデザイン性にも物足りなさを感じていました。Claude Designはこの2点が大きく改善されている印象です。
さらに、「このアプリをもっと本格的に作り込みたい」と思ったときの道がサービス内に用意されているのも大きな魅力です。「Share」メニューから「Claude Code」を選ぶと、ここまで作ってきたプロジェクトをそのまま引き継いで、本格的な開発を継続できます。アイデアを形にして試すまではClaude Design、その先の作り込みはClaude Codeという使い分けが、同じClaudeのサービス内で完結しているのです。今回のプロトタイプも作って終わりではなく、ここで固めた要件や画面デザインを、本格開発の材料として引き継げます。
皆さんの中に眠っている「こんなアプリがあったら」も、今回筆者がお見せしたように、30分ほどで同僚に見せられる形になるかもしれません。ぜひチャレンジしてみてください。
筆者紹介
山下城司
NTTテクノクロス株式会社
デジタル革新部
開発技術部門
生成AIによるソフトウェア開発効率化の調査・全社展開および生成AI人材育成業務に従事。近年は自身のソフトウェア開発経験や生成AI活用経験を活かし、さまざまな生成AI活用研修を企画・検討し、社内に多数提供している。
Copyright © ITmedia, Inc. All Rights Reserved.
アイティメディアからのお知らせ
注目のテーマ
ITmediaはアイティメディア株式会社の登録商標です。