家族の生活には、思った以上に紙の書類が多いです。
学校のおたより、献立表、行事予定、地域のお知らせ、提出物、持ち物の案内。必要なときに限って「あれ、どこに置いたっけ？」となりがちです。
そこで、家族向けの書類管理アプリ FAMIAEL を開発しています。
写真やPDFで書類を保存し、OCRで読み取ったテキストも一緒に残し、AIにあとから質問できるアプリです。今回は、実際のUIの方向性をもとに、記事用の生成AIビジュアルとして画面イメージを作成して紹介します。
FAMIAELとは
FAMIAELは、家庭に届く書類をまとめて管理するためのアプリです。
スマホで写真を撮る、PDFを登録する、OCRで文字を読み取る、AIに質問する。そういう流れを、できるだけ迷わず使えるようにしています。
ホーム画面では、登録した書類がカード形式で並びます。
書類の種類や日付、タグ、要約を見ながら、必要な情報へすぐ戻れるようにしました。さらに、OCRで読み取った本文も保存しているので、あとからAIに「明日の給食は？」「遠足の持ち物は？」のように質問できます。ゲストモードでは端末内に保存し、ログイン後はクラウド側へつなげられる構成にしています。
できること
FAMIAELでやりたいことは、かなりはっきりしています。
「家族の書類を、なくさず、探しやすく、忘れにくくする」ことです。
主な機能は次の通りです。
- 写真またはPDFで書類を登録
- OCRで読み取ったテキストの保存
- おたよりに多い表形式のテキストを見やすく整理
- AIによる要約
- AIに質問して、保存済みのOCRテキストから回答
- タグとカテゴリーで整理
- 予定日や提出日をカレンダーで確認
- キーワード検索とAI検索
- メモの追加
- ピン留め
- ゲストモードでの端末保存
- ログイン後のクラウド保存
「全部をきれいに分類する」というより、あとから困らないように必要な情報をすぐ取り出せることを重視しています。特に、画像として保存するだけでなく、OCRテキストを検索やAI質問に使える形で残すことを大事にしています。
OCRテキストとAI質問
書類を登録すると、OCRで文字を読み取り、Geminiを使って内容を解析します。
たとえば、学校のおたよりなら「行事予定」「持ち物」「提出物の期限」など、あとから確認したいポイントを短くまとめます。さらに、読み取ったOCRテキスト自体も保存するので、あとから「明日の給食は？」「〇〇の日の持ち物は？」「提出期限はいつ？」のようにAIへたずねられます。
詳細画面では、AI要約、メモ、イベント日を分けて表示しています。裏側ではOCRで読み取った本文も残しているため、画面に見えている要約だけでなく、元のおたより本文をもとにAIが答えられるようにしています。
ただOCRで文字を読むだけだと、長い文章や表の中から必要な部分を探す手間が残ります。FAMIAELでは、おたよりにありがちな表形式の情報も、あとから読み返しやすい形に整えて保存します。画像を「あとで見る」だけでなく、保存したテキストにAIで「たずねる」ことで「あとで使える」書類に変えることを狙っています。
UIでこだわったこと
今回かなりこだわったのがUIです。
FAMIAELは、普通の家計簿や書類管理アプリのような落ち着いたデザインではなく、あえて Dark Neo-Brutalism っぽい見た目にしています。
黒い背景、太い枠線、強い影、黄色・青・赤のはっきりした色。カードやボタンも、少しコミック風で、見た瞬間に「どこを押せばいいか」が分かるようにしました。
家族向けの実用アプリではありますが、毎日見る画面だからこそ、少しクセがあって楽しいほうがいいと考えています。
特に意識したのは次の点です。
- ボタンやカードの境界を太くして迷いにくくする
- 重要な操作を色で分ける
- 書類カードの情報量を増やしすぎない
- 下部ナビゲーションを大きくして片手でも移動しやすくする
- ゲストモードの状態をはっきり表示する
このUIはかなり好みが出るところですが、FAMIAELらしさとして大事にしていきたい部分です。
使用した技術
アプリ本体はFlutterで作っています。
Flutterを使っている理由は、Android/iOSの両方を見据えつつ、UIを細かく作り込みやすいからです。今回のように、太い線や影、独自のカード表現を多用する画面でも、同じ設計で作りやすいのが助かっています。
主な技術は次の通りです。
| 技術 | 役割 |
|---|---|
| Flutter / Dart | アプリ画面と全体の実装 |
| Firebase Auth | ログイン |
| Cloud Firestore | クラウド側の書類データ保存 |
| Firebase Storage | 画像やPDFの保存 |
| Drift / SQLite | ゲストモードやオフライン寄りの保存 |
| Gemini | 書類の要約、タグ、予定日の整理、OCRテキストへの質問応答 |
| Google ML Kit | OCRによる文字認識 |
| Syncfusion PDF | PDF表示 |
| Provider | アプリ内の状態共有 |
技術的には、クラウドだけに寄せず、ゲストモードでも使えるようにしているのがポイントです。
最初からログイン必須にすると、試すまでの心理的なハードルが上がります。まず端末内に保存して使い始められて、必要になったらクラウドへつなげられるほうが、家族向けアプリとして自然だと感じています。
データの扱い
FAMIAELでは、ログインしているかどうかで保存先を切り替えています。
ゲストモードではローカル保存、ログイン後はFirebase側に保存します。
この切り替えは、アプリ内のデータ取得・保存処理をまとめた層で吸収しています。画面側は「書類を取得する」「書類を保存する」とだけ考えればよく、保存先の違いをあまり意識しなくて済むようにしています。
また、写真やPDFは容量が大きくなりやすいため、画像圧縮やPDF表示も組み合わせています。OCRで読み取ったテキストは、検索やAI質問に使える重要なデータとして扱います。特におたよりの表は、そのままだと読みづらくなりやすいので、あとから見返しやすい形に整えて保存することを意識しています。家庭の書類管理では、きれいに保存すること、重くなりすぎないこと、そして必要な情報を聞けば返ってくることのバランスが重要です。
これからやりたいこと
今後は、さらに実用寄りに磨いていきたいです。
たとえば、通知まわり、検索の精度、カレンダーとの連携、家族で共有するための導線などは、まだ改善できる余地があります。
UIについても、今の方向性はかなり気に入っています。太い線と強い色を活かしつつ、文字の読みやすさやカードの密度を調整して、もっと使いやすくしていきたいです。
FAMIAELは、ただ書類を保存するだけのアプリではなく、OCRで読み取った情報にAIでたずねられるアプリです。家族の「あとで確認しなきゃ」を少し軽くするためのアプリとして育てていきます。