Zenn
🤖

煩雑なよくわからん手続きを自動でTODOリストにしてくれるTODOMakerを開発しました

に公開
32
Firebase
Flutter
ハッカソン
Gemini
AI Agent Hackathon
tech

AI Agent Hackathon with Google Cloud の応募記事です。TODOMaker というアプリを作りました

ところで確定申告シーズンですね

作ったもの

TODOMaker というモバイルアプリを作りました。iOS・Androidで動作するFlutterアプリです。

TODOMaker は、「やりたい」「なりたい」「やらないと」、そういった感情を思い浮かべる出来事をAIに教えることでTODOリスト化してくれるモバイルアプリになっています。例えば以下のようなユースケースが考えられます

  • やりたい: 結婚の手続き
  • なりたい: プログラマーになる方法
  • やらないと: 確定申告のやりかた

このような「知らない」「わからない」から調べるのも大変、手をつけるのも億劫。特に確定申告。そういったハードルを下げるために自動でWebから情報を収集し、TODOリストまで落とし込んでくれます。さらに詳細な説明が必要な場合はVertex AI上のGeminiが Google Search(Retrival)を通じて情報を検索して、丁寧に各ステップごとに解説を入れてくれます。さらに、Groundingにより情報のソースも確認できるようになっています

プロジェクトが対象とするユーザー像と課題

ユーザー像

  • 総じてブラウザでの検索やAIから情報を引き出し、その情報を難なくまとめることができない・苦手なユーザー
  • 何か行動を起こす際に何からどの手順で手をつければ良いのか知りたい人

具体例は以下の通りです

  • 結婚の手続きのように「やりたい」けど何をすれば良いかわからない人
  • 「なりたい」像があるが、どういうステップを辿れば良いかわからない人
  • 確定申告のようにやる必要があるが、「知らない」「わからない」が多く、着手するのにハードルを感じているユーザー。また、確定申告は毎年やっているのに何をやれば良いのか毎年忘れてしまう私のようなユーザー。
  • 手順ごとに調べて目を通しておいた方が良い確定申告のような手続きに直面している人
  • 確定申告を今から始めるユーザー。確定申告の苦労を軽くしたい人

課題とソリューション

課題を総括すると「慣れない行動は手順が不明瞭でわからない。だから行動のハードルが高い」。ソリューションは「慣れない行動の手順を明確に用意してくれる。行動のハードルを低くする」になります。以下もう少し詳細に書きます

前述したように自分が「知らない」「わからない」といったものに対して何かしら行動をするのはとてもコストがかかることです。確定申告とか特に。おそらくみなさんこのような問題が起きた時に検索,記事を読む,理解する といった行動をブラウザ上で繰り返し、自分の手元のメモ帳に行動の細分化,順序づけをしてチェックリストを作るのでは無いでしょうか。または場合によっては億劫すぎて先延ばしなどの逃げる方向に気持ちが向くことも多いと思います

もちろん最近はChatGPTなどでAIに問い合わせる。そしてマークダウンのような形でTODOリストみたいなものを出力するといったこともできますが、慣れてないことなので各手順の解説や根拠も一緒に欲しくなります。TODOリストを作る専用ソフトウェアでも無いのでそこまで便利にフォーマットしてくれるわけではありません。自力で繰り返しAIに問い合わせ・検索・そして自分で整形することを考えると手間です

TODOMakerは、「これをやりたい」だけAIに伝えると、実現のためにTODOリストを作ってくれます。同時にTODOごとの解説・さらには情報のソースも紐付けてくれます。検索の手間なく解説とWebの(おそらくはそこそこ信頼性の高い)ソースも用意されています。不明な点もすぐに確認ができます。太文字で書いた検索,記事を読む,理解する,行動の細分化,順序づけをAIが代わりにやってくれます。生成された成果物で気になった点は自分でAIがまとめた詳細な情報やGroundingで提示されたソースを見ることでより安心してTODOに臨むことができます

これにより「慣れない行動の手順を明確に用意してくれる。行動のハードルを低くする」につながります

慣れない行動。そう。確定申告。あなたのことです。毎年やるけど忘れる

機能紹介

まずは動画です

https://youtu.be/QWrFEefqfEM

  • 動画の補足
    • スクロールが早いのはiPhone SimulatorとFlutterの開発で既知のFlutter側の問題なのでスルーしてください
    • 後述しますが、GeminiのAPI経由で複数回叩く設計なので読み込みが長い箇所があります。Cloud Tasksの利用等でなるべく軽減をしています

主要機能

  • 🤖 に「やりたいこと」を入力します。デモでは「確定申告の方法」にあたる部分です
  • 待っているとTODOリストが出来上がります。ここで構造が親のTaskと子供のTODOと分かれているのでこれより以降はこの用語を使います。画面上では大まかに、 Taskが「確定申告の方法」のカード部分で、TODOが各チェックリストを表しています
  • Task,TODO の両方で詳細ページがあります。それぞれ、詳しい解説を確認することができ、情報のソースも確認することができます
  • Task,TODO それぞれにチェックを入れることができ完了済みにすることができます
    -AIによりTODOの作業にかかる所要時間が割り出されます。Taskの詳細ページにもTODOの所要時間の合計が表示されます
  • TODOの詳細画面より、TODOの所要時間を元にデバイスのカレンダーアプリに書き込みができるようになっています
  • Task,TODOの詳細画面より、自宅・職場などの住所入力、もしくは現在地を中心として関連する場所を探してくれます。例えば確定申告だと税務署の情報や役場などの情報が出てきます。場所情報には位置情報以外に電話やメールアドレスの取得も含まれています。それぞれ、マップ・電話・メール アプリが開くようにされています

おまけ

  • どこかを10回タップするとなんか出てきます。スターください
    • 審査員さんへ、もし出てきたらアプリ再起動で消えるので減点しないでください。確定申告でむしゃくしゃしてただけなんです

アーキテクチャ

システム図です

全体の流れは

  1. Flutterアプリからの入力をCloud Functionsに送信
  2. Cloud Functionsで重たい処理・並行処理が可能なものはCloud Tasksに処理を移譲する。軽い処理はそのまま処理
  3. 2 から GenKitのVertex AIのモジュールを通じて、もしくは直接 Geminiに問い合わせる
  4. 問い合わせた結果が返ってきたら整形してFirestoreに書き込み
  5. クライアントではFirestoreの変更を検知するようにしているため、Geminiからの問い合わせが帰ってきたら都度UIが更新される

クライアント

  • Flutter
    • iOS・Androidも動きます
  • Firebase SDK
    • Firebase Auth
    • Cloud Firestore
    • Cloud Functions

バックエンド

次のサービスをFirebaseを通じて使用しました

  • Cloud Firestore
  • Cloud Functions
  • Cloud Tasks

また、次のフレームワークを使用してVertex AIを使用しました

  • GenKit
    • GenKitではサポートされてないインタフェースがあったので、Geminiを別ライブラリから使用している箇所もあります

選定基準

  • 審査基準を一番広くカバーできる技術選定にしました
  • 当初はハッカソンの前提を誤解してて、Cloud Runを使用していましたが誤解だとわかってFirebaseファミリーで構成することにしました。これはFlutter x Firebaseの情報量が多い点と、やはりmBaaSはモバイルアプリ開発でとても使いやすいので途中でインフラ等を移植しました。

工夫・苦労した点

  • GenKitは動作確認がしやすいため選びました。デメリットもあって、Gemini 2.0 x Grounding の組み合わせのインタフェースが用意されていない点があります。なので、1.5系を使っている場所が多々あります。ただ精度的に大きな問題もなかったのでconfigの書き方が少し違う程度の差になります
    • 具体的には 1.5 までは { googleSearchRetrieval } , 2.0からは { googleSearch }
  • Cloud Tasks までは当初手を出す気は無かったのですが、TODOの件数が割と多くなり、並行で作業しないと速度的にかなり厳しくなりました。確定申告とか件数が多いです。また、Geminiがよく 429 Too Many Requestで止まるので、Cloud Tasksの throw error でリトライしてくれる性質と相性が良いと感じて早期に導入しました
    • リミットを申請すれば上げてもらえて問題の緩和・ 解決につながるかも。と思ったりしたのですが、不確実性が高いのと開発の着手が2月になったので確実に捌ける方にアーキテクチャを寄せました
  • promptはなるべくTask,TODOのプロパティごとに用意しました。これは挙動面ではAIのレスポンスの精度と速度のトレードオフになります。promptが簡素であればあるほど開発者が欲しいレスポンスを返してくれると感じています。今回は Cloud Tasks を導入する代わりに、いろいろなものを返してくれる スーパーprompt みたいなのを用意せずに開発しました。結果的に微妙なプロンプトの調整をするのは早く終わったと感じています
  • Androidアプリを提出したかったので、モバイルアプリなのは決定してました。最後にモバイルアプリっぽさを足したくて、場所情報(位置情報、地図、電話、メール) と カレンダー登録 機能を入れてみたりしてます。特にGeocodingを気軽に使えるのがモバイルアプリは良いですね

動作させる上での注意点

審査時にリポジトリも公開しているので手元で動かす人もいるのかなと思ったのでいくつか注意点。環境変数の用意レベルのことは書きません。そこら辺はリポジトリのREADMEに記載します

  • Geminiのエラーで429 Too Many Requestが時たま発生します。Cloud Tasksを利用して並行にGeminiを使用しているので発生しやすくなります。リトライもある程度設定してますが、クライアント側の表示とCloud Tasksを利用しての非同期処理の進捗状況やエラー表示について同期を取る仕組みは用意していません。雑に「時間がかかったら停止してやり直してね」という機能は用意されているので5分とかかかってたらやり直してみてください。一番良いのはGeminiの制限を緩めるようにGoogleにお願いすることです
  • GeminiのJSON Modeで string | null の型を指定した場合に 「"null"」って文字が返ってくることがしばしばあります。AIの精度が上がれば解決するのでそのまま表示される場所もあったりします
  • 実機では全部動きます。Simulator,Emulatorだと動かなかったり、動作が微妙な機能があります。Geo Coding, LocationやCalendarへの追加機能がありそこら辺です

まとめ

TODOMakerによりフットワーク軽くよく知らない未知の領域への行動も起こせるようになりました。とても素晴らしいアプリですね。これで確定申告もやらないといけなくなってしまった...

ハッカソンの提出物としてpub repoに公開してあるのでよかったらスターください⭐️

https://github.com/bannzai/zenn_ai_hackathon/

おしまい\(^o^)/

32

Discussion

ログインするとコメントできます