アプリの作り方は大きく3つあります。プログラミング言語を学んで自分でコードを書く方法、ノーコードツールで部品を組み合わせる方法、そしてAIに日本語で作りたいものを伝えてコードを書いてもらう方法です。どれを選んでも、最初に「誰が、何のために使うアプリか」を一文で決め、必要な画面とデータを書き出しておくことが近道になります。
まず決める：Webアプリかネイティブアプリか
アプリには、App StoreやGoogle Playからインストールする「ネイティブアプリ」と、ブラウザでURLを開くだけで使える「Webアプリ」があります。初めて作るなら、審査がなく、リンクを送ればすぐ使ってもらえるWebアプリから始めるのがおすすめです。スマホのブラウザでも普通に動きます。
- Webアプリ：インストール不要、すぐに公開でき、修正もすぐ全員に反映されます
- ネイティブアプリ：カメラや通知などスマホの機能を深く使えますが、開発者登録やストアの審査が必要です
違いをもっと詳しく知りたい場合は、英語の記事web app vs native appが参考になります。
アプリを作る3つの方法
- プログラミング：HTML、JavaScript、Pythonなどを学んで自分で書きます。自由度は最も高いものの、形になるまで数週間から数か月かかるのが普通です。
- ノーコード：用意された部品を画面上で並べて作ります。早く始められますが、ツールにない機能は作れず、作ったものを別の場所へ移しにくくなります。詳しくはノーコードとはで説明しています。
- AIに頼む：作りたいものを文章で説明すると、AIが本物のコードを書きます。プレビューを触りながら会話で直していく作り方で、バイブコーディングとも呼ばれます。
プログラミングを学ぶこと自体が目的ならコードを書く方法、早く道具がほしいならノーコードかAI、作ったコードを自分で持っておきたいならAIの方法が向いています。
手順1：企画を5つの質問で書き出す
どの方法でも、作り始める前にメモ帳で次の5つに答えておくと、途中で迷いにくくなります。ここでは町内会の行事出欠アプリを例にします。
- 誰が使う？町内会の会員30世帯ほど。多くはスマホから使います
- 何をする？行事ごとに出欠と人数を集め、幹事が一覧で確認します
- どんな画面？行事一覧、出欠の回答、幹事用の集計の3つ
- 何を保存する？世帯名、行事、出欠、人数、ひとことメモ
- 決まりは？締め切りを過ぎたら回答できない、集計は幹事だけが見られる
手順2：AIで最初の形を作る
ここではAIを使う方法を例に進めます。VibeDreamでNew Projectを押し、メモをもとにした文章を貼り付けるか、マイクを押して話しかけます。VibeDreamの画面は現在英語ですが、チャットには日本語でそのまま書けます。
町内会の行事の出欠を集めるWebアプリを作ってください。
画面は「行事一覧」「出欠の回答」「幹事用の集計」の3つです。
会員は世帯名、出欠、人数、ひとことメモを入力します。
行事ごとに締め切り日を設定し、過ぎたら回答できないようにしてください。
集計画面はパスワードを知っている幹事だけが見られるようにしてください。
スマホで使いやすい大きめの文字とボタンで、文言はすべて日本語にしてください。チャットの横にプレビューが現れ、AIの作業に合わせて画面が組み上がっていきます。できあがったら会員になったつもりで回答し、締め切りを過ぎた行事にも回答できてしまわないかを試します。気になる点は1回のメッセージで1つずつ伝えます。
手順3：直して、公開する
- 「集計画面に、行事ごとの参加人数の合計を表示してください」
- 「回答した世帯には、回答済みの印を一覧に出してください」
- 「締め切りの3日前から、行事一覧に締め切り間近と表示してください」
思いどおりに動いたら、Put it onlineを押して公開用の名前を決めます。1〜3分ほどで chonaikai.vibedreams.ai のようなHTTPS付きのアドレスで公開され、1回の公開で5クレジットを使います。公開後に直した内容は、Update itを押すまで公開中の画面には反映されないので、安心して試せます。
アプリ作りにかかる費用
自分でプログラミングすればお金はあまりかからない代わりに時間がかかり、ノーコードやAIのツールは月額料金がかかる代わりに短い時間で形にできます。VibeDreamの最新の料金は料金ページで確認できます。
企画の立て方やテストの進め方をもっと詳しく知りたい場合は、英語のガイドHow to build an appも参考にしてください。