ChatGPTの画像生成機能で遊んでみたことはありませんか？
遊ぶだけじゃなく、これで副業ができないのか？と思ったことはありませんか？
AIの進化によって、今や誰でも一瞬でクオリティの高い美女画像を作れるようになりました。
その一方で、ネット上には綺麗な画像が溢れ、価値がなくなったように感じます。
自分のオリジナルコンテンツを作って副業にしたいと思い、まずは試しに占いアプリを作ってみることにした。
ここでは私が実際にアプリ開発してネット上に公開するまでの流れと、やり方がわからなくて迷ったことを記事にします。同じようにAIでアプリ開発にチャレンジしたいと考えている方の助けになれば嬉しいです。
作ったアプリ「AI美女の占い」とは？
今回、試しに作成したのはスマホやPCのブラウザから誰でも遊べるミニアプリです。
AI美女が、今日の運勢（大吉〜大凶） に合わせて辛口でシュールなコメントと意味のないラッキーアイテムを教えてくれるような占いアプリです。占った結果はX（Twitter）でそのままシェアすることもできます。
アプリ開発はAIにお任せ
「アプリなんて作ったことない」という方でも今の時代はAIでプログラムコードを作ってくれるので、経験ゼロでも簡単に作れます。
開発までの流れは以下です。
- アプリの設計：大吉、中吉、小吉、凶、大凶の5パターンで占い結果と美女のコメントとくだらないラッキーアイテムを考える。
AIに考えてといえば、考えてくれるけど。なんかちょっとイメージと違う。結果自分で考えることに。 - 画像の生成：トップ画像、大吉から大凶までの合計6種類の画像を生成する。
美女のイメージや服装など。表情やポーズ（仕草）を変えて作成します。 - コードの生成：GitHubで公開できるhtmlのコードを生成する。
ちょっと迷ったところ
ChatGPTのおかげでアプリの仕組み自体は一瞬で作れるけど、アプリ開発はハードルが高い。
そのため比較的簡単にネット上に公開できるようにGitHub（ギットハブ）を使うことにしました。
GitHubには不慣れなので少し手間取りました。実際の公開手順を簡単にまとめておきます。
- レポジトリの作成： まずはGitHubでアカウントを作成したら、「新しいレポジトリ（New repository）」を作成します。今回は名称を「ai-beauty-fortune」としました（※名称は自由です）。
- コードのアップロード： Code内の「Add file」＞「Create new file」で新しいファイルを作成し、ChatGPTに生成してもらったコードをそのまま貼り付けます。ファイル名は必ず 「index.html」 にして保存します。
- 画像のアップロード： 同じレポジトリ内に、作成したAI美女の画像たちもアップロードします。
- ファイル名の紐付け： 画像のファイル名は、コード内で指定している名前と完全に一致させます。今回は、トップ画像なら「top.png」、大吉なら「daikichi.png」という名前にしました。
- 公開設定： 最後に公開です。レポジトリの「Settings ＞ Pages」を開き、Branchを「main」（または「master」）に指定して「Save」を押します。
GitHubは英語なのでちょっととっつきにくいですね。
「新しいレポジトリ（New repository）」がどこにあるかわからなくて少し迷ったりしませんか？
「New repository」を押すと以下のような画面になります。
Repository nameに適当に名前をつけましょう。Descriptionは「説明」です。何も書かなくてもOK。このアプリの説明文を簡単に書いておくと後で見返したときにわかりやすくなります。Add READMEはONにしておくことをおすすめします。READMEはより詳細な説明を書くことができます。
Code内の「Create New File」で新しい空のファイルを作成したら、生成したコードを貼り付けてファイル名は「index.html」にして保存。同じくCode内に生成した画像をアップロードすると以下のようになります。
画像のファイル名は、トップ画像は「top.png」、大吉は「daikichi.png」という感じで変更しました。ファイル名を変えてからアップロードしてもいいし、アップロード後にGitHub上で変更してもOK。
最後に公開。リポジトリの「Settings ＞ Pages」から、Branchを「main」（または「master」）に指定して「Save」を押す。は以下の画像を参照してください。
これでしばらく待てば公開完了。自分専用のURLが発行されてネット上に公開することができました。
「visit site」を押すことでサイトに移動することもできます。
私が公開しているURLは以下になります。
最初は「画像をどこに保存するのか」、「保存した画像をどうやってコードと連動させるのか」がよくわからず苦労しました。GitHubの仕組みがわかるまではもう少し練習が必要そうです。
まとめ
苦労したけど、無事にアプリをネット上に公開することができました。
ブラウザ上で動き、X（Twitter）でシェアできる機能も実装できました。
コードはChatGPTで作ったまんまですが、非常に満足感があります。
AI画像で作って遊ぶだけではなく、自作のコンテンツ化という副業の第一歩を実際に踏み出した感がありますね。
プログラミングができなくても生成AIがあれば、アイデアを形にすることができます。
何か新しいことに挑戦したいという方は、ぜひ気軽にチャレンジしてみてください。
