株式会社TIMEWELLの濱本です。
プログラミング経験ゼロでも、たった5回のやり取りで本格的なゲームアプリが作れる時が到来しました。「V0」というAIサービスは、「インベーダーゲームを作って」という一言の指示だけで、実際に動くゲームを生成してくれます。起業を考えているが技術的な壁に悩む人にとって、もはやコーディングスキルは必須ではないのです。AIと自然言語で対話しながら、アイデアを形にする「バイブコーディング(vibe coding) 」という新しい開発手法が、ビジネスの可能性を無限に広げていくでしょう。
今回の記事では、エンジニア講座第2回として、プログラミング経験がなくても本格的なアプリケーションを作る方法として、V0(ヴイゼロ)というサービスとGitHubの使い方をお伝えしていきます。前回はCursorの使い方を説明しましたが、今回の前半はAIを楽しく触ってみて、後半は少し触りにくいGitHubの設定を進めていきます。
講師紹介
名前:安藤 義記
所属:株式会社TIMEWELL テクノロジー部 GM・プリンシパルエンジニア
プロフィール:東京都出身。ロボティクスとAIの研究に情熱を傾け、大学時代には家庭用ロボットのコンテストで世界2位の成績を収めた。
大手電機メーカーにてIoT開発に従事し、10年間で幅広いシステム開発の経験を積む。1000戸を超える住宅区画向けホームマネジメントシステムの仕様設計を主導し、プロジェクトを成功に導く。
ハッカソン、ものづくりイベントへの挑戦を続け、ONE JAPAN Hackathon x Tokaiで大賞を受賞。クラウド技術を独学で習得し、ソーシャルゲームプレイヤー向けサイトを自ら立ち上げ、運営。
趣味はゲームやVTuberなどのオタク文化。ゲームからUIデザインを学び、日々の仕事に活かす。
名前:内藤 一樹
所属:株式会社TIMEWELL 共同創業者 兼 取締役CTO
プロフィール:東京都出身。新卒でNTTアドバンステクノロジに入社。NTTアドバンステクノロジではクラウドサービスを主軸としたSI事業に従事。その後事業会社の新規サービス創出・開発部門のテクニカルリード兼スクラムマスターとしてPOSサービス、デジタルサイネージなどのサービスを開発。個人での活動としてはOSSのコントリビュートやピーク50万PV/月、平均30万PV/月ほどの特定業種向けの転職サイトを開発し運用を行ってきた。現在は、チャレンジャーアシスタントサービス「TIMEWELL」の設計・開発・運用に加え、新たなサービス開発に専念。テクノロジーに対してワクワクしながらも不安を抱える人々や団体、企業を支援。意味的報酬を重視し、As a serviceの活用を駆使し、スピーディに業務を効率化するためのアプリケーションを実装する事が得意。
講師紹介 バイブコーディングという新しい開発手法 V0でプロトタイプを作る楽しさ 実際の作成プロセス 要件定義書をV0で活用する方法 GitHubという世界標準のコード管理サービス 実際の設定と操作 今後の学習について まとめ:AIがプログラミングの民主化を実現する時代へ バイブコーディングという新しい開発手法
ます初めにお伝えしたいのは、私たちがこれから学んでいく開発手法が「バイブコーディング(vibe coding) 」と呼ばれる最新のアプローチだということです。これは、コーディングの中身が分かっていなくても問題ない、とりあえずAIに触らせてみてコーディングしようという考え方です。自然言語、つまり皆さんが普段喋っている言葉を使ってコーディングをしていく開発手法です。
まずは触り、中が分からなくても できる時代になってきています。今回のWARPでは、自然言語を使ってなんとなくコーディングできるようになることを目指していきます。
V0でプロトタイプを作る楽しさ
V0は、私たちのWARPの講座でも使うウェブアプリケーションを簡単に作れるサービスです。ReactやNext.jsという今時の技術を使いながら、いい感じにコーディングしてくれます。無料プランでもある程度使えますが、使いすぎると「お金を払え」と言われてしまう時があるので、その場合は時間を置くか、プロプラン(月20ドル)を契約していただければと思います。
実際にどういうことができるかというと、ChatGPTと同じ感じで、普通に私たちが使っている言葉で話しかけるだけで、簡単にウェブサイトやアプリケーション、ゲームも作れます。
私が最近作った例として、インベーダーゲーム、ブロック崩し、五目並べなどがあります。インベーダーゲームは方向キーを使って敵が撃ってくるところに対してスペースボタンを押しながら撃ったりできる、ちゃんと動くゲームが比較的簡単に作れるのです。
実際の作成プロセス
作り方は結構シンプルです。ChatGPTと似た感じで、やりたいことを指示し、変えてほしいところを言葉で伝えていくだけです。例えば、最初に「インベーダーゲームを作って」と指示しただけで、基本的な形ができあがりました。その後、「敵がかっこ悪いので、もっとインベーダーっぽい感じのデザインにして」とか「プレイボタンが2個あるから変えてほしい」とか「ゲームが終わったらもう一回動いてしまう」といった問題を素直にAIに説明して修正してもらい、このインベーダーゲームは、約5回のやり取りで完成しています。
V0の画面には、ChatGPTのようなコメント入力欄があり、そこに指示を入力するのですが、「Enhance」というボタンを押すと、適当な指示をもう少し詳しくしてくれます。そして送信すると、コーディングが勝手に始まります。
要件定義書をV0で活用する方法
前回作成していただいた要件定義書をV0でどう使うかについても説明しました。V0のトップページには添付ファイル機能があるので、前回の宿題で作成した要件定義書の詳細版をアップロードします。そして、「添付したドキュメントが要件定義書になっているので、初期的なUIをまず作ってください」というプロンプトを追加します。
参考になるUIデザインがあれば、画像として添付することで、より思い通りのものが出てきます。AIもだいぶ頭が良くなってきたので、エラーはほぼ起きませんが、もしエラーが出た場合は、そのエラーメッセージをそのまま次の指示として貼り付ければ修正できます。
また、一度にあまり多くの指示をしすぎず、徐々に更新していくことを心がけてください。無料プランでは1日の利用制限があるので、もし無料で使い続けたい方は、日にちを分けながらやっていくといいでしょう。
GitHubという世界標準のコード管理サービス
後半はGitHubについてです。GitHubはプログラマーやエンジニアがソースコードファイルをオンライン上で保管して管理するためのサービスです。今はMicrosoftが運営している世界最大のコード共有プラットフォームとして、ソフトウェアエンジニアといえばこれを使っているというくらい、世の中のデファクトスタンダードになっています。
コードの履歴をしっかり管理できる機能があり、複数の人で一緒にソースコードを作っていくときにとても使いやすい機能がついています。実際に作ったものを共有でき、「私こんなのを作ったよ」というのを簡単に共有できるため、ポートフォリオ的な扱い方もできます。また、使っているパソコンが壊れてもクラウドにバックアップがあるので安心です。
GitHubを使うと、どこを編集したかが全部記録されます。例えば、「outline」という書き方を「secondary」に変えましたよ、というような変更履歴が全部残ります。誰がいつどこを書き換えたかがすべて記録され、最新に戻す、前に戻す、といった作業も簡単にできるのです。
実際の設定と操作
GitHubを使うためには、まずアカウントを作成し、その後Gitというツールをインストールする必要があります。Windowsの方は専用のインストーラーを使い、Macの方はターミナルで「git --version」と打ち込んで確認します。基本的にCursorをインストールしていれば自動的に入っているはずです。
その後、CursorでGitHubのユーザー名とメールアドレスを設定します。これもAIに「Gitのユーザー名とメールアドレスを設定したいです」とプロンプトを投げれば、必要なコマンドを教えてくれて設定できます。
今後の学習について
V0は本当に楽しいサービスです。プログラミング経験がなくても、AIとの対話だけで実際に動くアプリケーションが作れる時代になりました。ぜひ次回までにV0を使いこなして、皆さんのアイデアを形にしてきてください。GitHubは最初は難しく感じるかもしれませんが、徐々に慣れていけば大丈夫です。エンジニアでも最初は「GitHubって意味分からない、死にやがれ」という感じでしたから。
今日の講座で、AIの力、特にV0のすごさを感じていただけたと思います。これからも楽しみながら、一緒にアプリケーション開発を学んでいきましょう。
まとめ:AIがプログラミングの民主化を実現する時代へ
今回の講座を通じて、プログラミングの専門知識がなくても、誰もが本格的なアプリケーションを作れる時代が到来したことを実感していただけたと思います。V0という革新的なサービスを使えば、「インベーダーゲームを作って」という一言の指示から、わずか5回のやり取りで実際に動くゲームが完成します。これは単なる技術の進歩ではなく、ものづくりの根本的な変革を意味しています。
バイブコーディング(vibe coding)という新しい開発手法は、自然言語を使ってAIと対話しながらアプリケーションを作り上げていく方法です。コードの中身を理解していなくても、作りたいものをAIに伝え、修正したい部分を素直に説明するだけで、思い通りのアプリケーションが形になっていきます。シンプルなものから始めて、徐々に複雑なアプリケーションへと発展させることができるのです。
そして、要件定義書とV0を組み合わせることで、ビジネスアイデアから実際に動くプロトタイプまでの道のりが劇的に短縮されます。前回作成した要件定義書を添付し、適切なプロンプトを加えるだけで、AIが仕様に沿ったアプリケーションを生成してくれます。エラーが出ても、そのメッセージをそのまま次の指示として使えば解決できるという手軽さも魅力です。
GitHubについては、確かに最初は難しく感じるかもしれません。しかし、これは世界中のエンジニアが使っているデファクトスタンダードであり、コードの履歴管理やバックアップ、ポートフォリオとしての活用など、多くのメリットがあります。第5回までの講座を通じて、徐々に慣れていけば必ず使いこなせるようになります。
重要なのは、これらのツールが起業を考えている方々にとって、技術的な壁を取り除く強力な武器になるということです。もはやプログラミングスキルの有無は、アイデアを形にする上での決定的な障壁ではありません。V0のようなAIツールを活用すれば、ビジネスアイデアを素早くプロトタイプ化し、顧客からのフィードバックを得て、改善を重ねていくことができるのです。
AIとの対話によるアプリケーション開発は、もはや未来の話ではなく、今まさに皆さんの手の中にある現実です。この新しい開発手法を習得することで、皆さんのビジネスアイデアが次々と形になっていく。その第一歩を、今日踏み出していただけたことを心から嬉しく思います。
講演・ご相談はこちら
