5
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【React】ChatGPTを使っておみくじサイトを作ってみた

Last updated at Posted at 2024-01-02

はじめに

あけましておめでとうございます。KDDIアジャイル開発センター所属のtakateinです。
大晦日の日に「今年はAIが本当に流行ったけど、chatGPT使って開発してないなぁ」と、ふと思い作ることにしました。

なぜ、chatGPTを使うのか

"おみくじを引くだけ" のアプリだと面白くなくて、一言メッセージを添えるとユーザーも楽しそう。
この一言メッセージを人間が考えてDBとかに保存してランダムで使用するよりかは対話型AIに考えてもらった方が面白そうだから。

完成品

こちら
http://agorophius.com/game/2024_AgoMikuji/index.html

個人でバンド活動をしており、SNSを観てくれる方が年始から気軽に楽しめるコンテンツが提供出来たらいいなー と思い作りました。
chatGPTには、「ユーザー名を読み込み、ランダムにおみくじの結果を返す。その結果からバンド名にあった面白い曲名」を考えてもらうようにしました。

↓↓↓こんな感じで返ってきます↓↓↓


「ふん、たかてぃ~んさんへのおみくじね。せーのっ!中吉!2024年はにやけ充実!さて、バンドAgorophiusのオススメ曲は『キラキラ☆デストラクション』!元気が湧いてくるようなカラフルな曲よ。楽しんでね♪」


実現したいこと(ユーザーストーリー)

  • おみくじを引き、結果が出る
  • 名前などを記入し、結果に影響
  • アドバイス等のメッセージを出す
  • ハッシュタグを使いSNSに投稿

参考にした記事たち

Reactで書きました。中身は非公開にしますが、参考にした記事たちです。
やっぱりreactはパッケージが優秀すぎ…

公開方法

AWSとかは使わず使用しているドメインにファイル1式をアップロードしてます。

最後に

12月31日23時にやる気が出てテレビ見ながら4時間ぐらいで作ったので異常系考慮やローディング画面未実装です。気が向いたらやります。

今年もよろしくお願いします!!!

おまけ

Bingに「おみくじアプリを使ってみたい人のユーザーストーリーを考えてみて」と質問してみたら以下の答えが返ってきました。
割と良いものができた気がします。


おみくじアプリを使ってみたい人のユーザーストーリーを考えてみました。

例えば、新年を迎えたばかりのあなたは、おみくじアプリを使って、今年の運勢を占ってみたいと思っています。あなたは、アプリストアでおみくじアプリを検索し、ランキング上位のアプリをダウンロードします。アプリを開くと、アプリ内で自分の名前や生年月日を入力するように促されます。あなたは、自分の情報を入力し、おみくじを引くことができます。アプリは、あなたの運勢を表示し、吉凶の結果に応じて、アドバイスやメッセージを表示します。あなたは、毎日の運勢をチェックすることもでき、アプリ内で運勢の履歴を確認することもできます。

おみくじアプリを使うことで、あなたは、自分の運勢を知ることができ、吉凶の結果に応じて、自分自身を振り返ることができます。また、アプリ内で表示されるアドバイスやメッセージを参考に、自分自身を成長させることもできます。

以上のようなユーザーストーリーが考えられます。おみくじアプリを使って、あなたも自分自身を振り返ってみませんか?🎉

5
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?