1.はじめに
私はIT業界でインフラ業務に携わってきましたが、以前から
「プログラミングできる人ってかっこいい!」
「アプリ開発って難しそう・・・」
と感じており、未経験者には少しハードルが高い世界だと思っていました。
しかしAI技術の進化により、「コードを書けなくてもアプリ開発できるのでは?」と考えるようになりました。
そこで今回は、Google Antigravityを活用し、WebアプリをGitHub経由で公開し、最終的にiPhoneで通常のアプリのように使えるようにするまでの流れをまとめます。
私と同じように、
「アプリ開発に興味はあるけど、プログラミングには自信がない」
という方の参考になれば幸いです。
※本記事では、Google AntigravityおよびGitHubの導入手順や基本的な利用方法については省略しています。
未導入の場合は、以下の参考記事をご確認ください。
・GoogleAntigravity
https://www.i3design.jp/in-pocket/google-antigravity2/
・GitHub
https://www.kagoya.jp/howto/it-glossary/develop/howtousegithub/
2.完成イメージ
今回の記事では、Google Antigravityで作成したWebアプリをGitHubへ登録し、公開URLを発行します。
その後、発行したURLをiPhoneのホーム画面へ追加することで、ネイティブアプリのように利用できる環境を構築します。
| No. | 役割 | 内容 |
|---|---|---|
| 1 | Google Antigravity | アプリ作成 |
| 2 | Windows PCで検証 | 動作確認・デバッグ |
| 3 | GitHubでURL発行 | Web公開 |
| 4 | iPhoneホーム画面追加 | ホーム画面へ追加して利用 |
◆利用環境
Windows 11
Google Antigravity
GitHub
iPhone 17
3.Google Antigravityでアプリ作成
まずはGoogle Antigravityを利用してアプリを作成します。
と言っても、AIとの対話形式で要件を伝えながら、画面や機能を構築していきます。
本記事で紹介するのは、簡単なルーレットアプリの仕様書になります。
例えば、関係値が薄い方との飲み会で、話題に困ったことなどありませんか?
そんな場面の時に使うアプリとして、参考例として以下のような仕様書を作成しました。
※仕様書はAI(Copilot)に作らせるのが手っ取り早いですが、詳細なルールや項目については人間が考えたほうが自分で開発した感を味わえます。
あくまでもAI(Copilot)は仕様書作成の為の補助ツールとして利用してください。
AIへの指示は具体的なほど意図したものに近づきます。
仕様書例(クリックで展開)
スマートフォン向けの「飲み会向けお題ルーレットアプリ」を作成してください。【目的】
飲み会や懇親会の場で、会話のきっかけ作りやゲーム要素として利用するアプリです。
【画面構成】
1画面構成とする。
【表示項目】
・アプリタイトル
・ルーレット開始ボタン
・再抽選ボタン
・お題表示エリア
【機能】
■ルーレット開始
ボタン押下時にランダムでお題を1つ表示する。
■再抽選
現在表示中のお題とは異なるお題を再表示する。
【お題一覧】
・学生時代の黒歴史を話す
・最近買った高いもの
・初恋の思い出を話す
・明日から1か月休みなら何をするか
・自分の意外な特技を話す
・人生で一番焦った出来事
・今だから言える失敗談
・おすすめの旅行先を紹介する
・子どもの頃の夢を話す
【デザイン】
・スマートフォン利用を前提
・ポップで親しみやすいデザイン
・背景は明るめ
・カード形式でお題を表示
・ボタンは大きめ
・文字は見やすく表示
【レスポンシブ対応】
iPhoneでの利用を前提とする。
【技術要件】
・単一HTMLで動作可能
・JavaScriptを利用
・外部APIは使用しない
・ローカルで完結する
【その他】
・初心者でも直感的に操作できるUIにする
・お題表示時に軽いアニメーションを追加する
4.Windows PC上で動作検証
生成されたアプリをそのまま公開するのではなく、まずはローカル環境(WindowsPC上)で十分に動作検証を行います。
画面レイアウトや機能面に問題がないか確認し、必要に応じてデバッグや修正を実施します。
●確認ポイント
画面表示
ボタン操作
入力チェック
レスポンシブ対応
エラーハンドリング

5.GitHubでURL発行
Windows PC上で動作確認を行ったアプリをGitHubへ登録します。
今回はGitHub Pages機能を利用してアプリを公開し、インターネット上からアクセスできるURLを発行しました。
これにより、自身のPCだけで動いていたアプリが、ブラウザからアクセス可能なWebアプリとして利用できるようになります。

6.iPhoneへ追加
続いてはGitHub Pagesで発行したURLをiPhoneのホーム画面にアイコンとして追加します。
①Safariで公開URL(5で発行したURL)へアクセス
②画面下部の「共有」アイコンをタップ

7.最後に
Google Antigravityを利用することで、プログラミング経験が少なくても、
「こんなアプリを作りたい」というアイデアを日本語で伝えるだけで、AIとの対話を通じてアプリを作成できました。
実際に利用してみて、AIの生成能力の高さには驚かされました。一方で、AIは完璧ではありません。
本記事では触れていませんが、作成したアプリを動作検証してみると、不具合が発生したり、意図した動作にならなかったりする場面が何度もありました。
その為、アプリ開発においてはAIへ指示を出すための発想力や要件整理、そして完成した成果物をテスト・評価する工程が非常に重要であり、
AIが開発を支援する時代になっても、それらは依然として人間に求められる役割であると実感しました。
本記事が、AIを活用したアプリ開発へ挑戦するきっかけになれば幸いです。




