こんにちは、AIQ株式会社のフロントエンドエンジニアのまさぴょんです！
今回は、現在位置とUserの好みから、おすすめの遊び場・スポットを提案してくれるAIコンシェルジュをハッカソンで作ったので、ご紹介します🐱
『あなたと地域のつながりを🌟』 AI コンシェルジュ ロボ玉🐹
ハッカソンの詳細や、テーマ、発表スライドなどについて話す前に、まず実際に開発したアプリの画面や機能などについて、ご紹介します。
【アプリ概要】
AI コンシェルジュが、あなたの現在位置(GPS)情報と、好みの場所のタイプから、距離的に近いおすすめの遊び場・スポットを5つ提案してくれるというWebアプリです。
Topページ: GPS取得・パラメーター入力のページ
まずTopページでは、GPS情報(位置情報)や、好きな場所のタイプなどのAIコンシェルジュが提案するためのParameterをUserに準備してもらうページになります。
- 「位置情報を取得」Buttonで、Userの位置情報(緯度・経度)を取得する
- 位置情報(緯度・経度)から住所を特定する処理は、 Google Maps APIを活用
- 好きな場所のタイプを選択してもらう(複数選択・可能🙆♂️)
- 「遊び場を提案」Buttonで、AIコンシェルジュに提案してもらう処理がスタートする🌟
- BackEnd処理起動
- BackEndでは、LangChainを通して、LLM(GPT V4)とやり取りをする。
- 距離の近いUserの好きそうなおすすめスポットを5つ提案してもらう。
Resultページ: AIコンシェルジュからのおすすめ・スポットが表示されるページ
続いて、BackEndの処理が完了して、AIコンシェルジュからのおすすめ・スポットのデータが、FrontEndに返却されると、Resultページが表示されます。
- AIコンシェルジュによって提案された場所は、次のような、おすすめ・スポットCardとして表示されます。
- 画像を取得する処理までは、実装ができませんでした。。。😭
- おすすめ・スポットの場所は、Mapでどこに位置するのかが、視覚的にわかりやすく表示されるようになっています。
- Mapの表示は、Leafletを使っています。
位置情報(GPS)がモロバレなのには、要注意🌟
本当は、Youtubeに動作の動画を投稿して、動きを共有したいのですが、
いかんせん現在の位置情報がわかる仕様なもので。。。😭
(どこか、遠くに出かけて、そこで使用動画を撮るのは、ありかも🙆♂️)
審査員のちょまとさんも、X(Twitter)に実況投稿する時に、配慮してくれていました。。。😭
発表資料(Qiitaハッカソン2024の予選会)
先述のAIコンシェルジュは、Qiitaハッカソン2024の予選会(2024/2/10〜2/11)にて、開発&発表をしました🌟
こちらが、チーム『ワンオペ・Developer』(チーム人数1人)として出場した際の発表資料です🐱
開発図・アーキテクチャ🌟
開発図・アーキテクチャは、次のとおりです。
【開発に使用した技術】
上記の開発図に記載していないものもあるので、まとめると次のような感じ。
ハッカソン中の調査系スクラップ
ハッカソン中に、初めてキャッチアップするようなことは、Zennのスクラップにまとめておりました💪🥺
- JavaScript で 現在地をGPSで取得する方法は？
- 現在の緯度経度などの位置情報から、近くの遊び場を取得するには？
- React で Reafletを使用する方法は？
などなど、ハッカソン中に学ぶことは、いつも多いでござる。
私のハッカソン・Status
ハッカソンは、今回で2回目です🌟
初ハッカソンは、AIQ株式会社のWeb開発チームのメンバーで「第１回24時間AIハッカソン」に参加して、AI同士の恋愛ゲームをチームで開発しました。
その時のハッカソンのレポート記事は、こちら👀
実際に作った「ひろゆきを攻略したいシャアさんと、ジョルノさんの告白シーン」の撮影動画は、こんな感じでございます🔥
今回のQiitaハッカソン、社内で、メンバー募集しましたが、メンバー集まらず。。。🥺
ならば、1人でやろう💪🥺🔥
1人でやる覚悟のネーミングが『ワンオペ・Developer』だったりします。。。🐱
Qiitaハッカソン2024・予選会のテーマは『つながり』
Qiitaハッカソン2024は、次のようなスケジュールで、選ばれし10組のみが本選に出場できるという熱い展開でした💪🥺🔥
(実際、補欠通過が、2組出るほどに、熱い戦いでした。。。)
- 予選：2024年2月10日（土）、2月11日（日）10:00～18:00
- 本選：2024年3月2日（土）、3月3日（日）10:00～18:00
地域(遊び場・スポット)とのつながりをテーマに
Qiitaハッカソン2024・予選会のテーマは、「つながり」 と言うことで、
今回作った作品のテーマは、『あなたと地域のつながり』というものにしてみました。
先述のとおり、Userがいる現在位置(GPS)とUserの好きなスポットの傾向から、UserにおすすめのスポットをAIコンシェルジュが提案するWeb App です🌟
価値提供ポイント・作品のコンセプトをまとめると次のとおりです。
- Userの今、いる場所を起点に、近くの好きなタイプの場所を気軽に探せる(新しい発見)🙌
- Userとその地域(遊び場・スポット)のつながりが深まる🌟
まとめ・感想
改善したい点として、
- UI・UXをもっと、改善したい。。。
- Seleniumで、画像取得 or OpenAI のAPIでおすすめスポットの画像を作成するなどして、画像を表示したかった。。。
などなど、よくを言えばキリはありませんが、
ワンパス通して、動くAppを1日ぐらいの工数で作成できたのは、よかったと思いました🌟
あと、何より楽しくハッカソンに取り組めたので、それが一番です🔥
注意事項
この記事は、AIQ 株式会社の社員による個人の見解であり、所属する組織の公式見解ではありません。
求む、冒険者！
AIQ株式会社では、一緒に働いてくれるエンジニアを絶賛、募集しております🐱🐹✨
詳しくは、Wantedly (https://www.wantedly.com/companies/aiqlab)を見てみてください。
参考・引用
AIQ 株式会社 に所属するエンジニアが技術情報をお届けします。 ※ AIQ 株式会社 社員による個人の見解であり、所属する組織の公式見解ではありません。 Wantedly: wantedly.com/companies/aiqlab
Discussion