0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

子どもの「お手伝い × お小遣い × 金融学習」アプリ Finoko を一人で作ってみた

0
Last updated at Posted at 2026-09-13

小中学生向けのファミリーアプリ Finoko(フィノコ) を、企画から開発・運用・課金まで一人で作って、家族で毎日使っています。この記事は「何を作ったか」「どう動くか」「一人で回すために何を決めたか」の概要編です。技術の詳細は Zenn に連載として書いたので、末尾にリンクを置きます。

Finoko の子ども画面(今日のタスク)

なぜ作ったか

自分の子どもに「お手伝いをしたらお小遣い」という仕組みを入れたかったのですが、紙のシールやノートだと続きませんでした。親は忙しくて確認を忘れるし、子どもは「やったのに数えてもらえてない」と不満を持つ。

欲しかったのは、

  • 子どもが自分で「やった!」を報告できて
  • 親がスマホから 10 秒で承認できて
  • 承認した瞬間に子どもの画面の残高が増える

という、お金の流れが親子の目の前で見える仕組みです。ついでに、「貯める・使う・あげる・増やす」を体験しながらお金の感覚を学べるようにしたい。既存のアプリも見ましたが、設定が多すぎて親が挫折しそうだったので、自分で作ることにしました。

何ができるか

お手伝い → 報告 → 承認 → 残高

親がタスクを作ります。「ゴミ出し ¥100」「くつをそろえる 毎日」のように、報酬あり / 報酬なし(習慣づけ用)、毎日 / 毎週(曜日指定)/ 毎月(日付指定)/ 1 回限り、対象は全員 / 特定の子、を設定できます。

子どもはタスクを終えたら「報告する」を押します。メッセージや写真も付けられます。親は承認待ちの一覧からまとめて承認、または理由付きで差し戻し。承認すると残高に加算され、子どもの画面にリアルタイムで反映されます。

保護者の承認画面

「早い者勝ち」のタスクも作れます。全員向けの 1 回限りタスクで「誰か 1 人がやったら終わり」にすると、きょうだいで取り合いになるので盛り上がります(アプリ内では「ゲリラ」と呼んでいます)。

つかう・あげる

貯めたお小遣いは、親が用意した「つかうアイテム」(おかし ¥100、ゲーム時間 1 時間 ¥200 など)に使えます。きょうだいに「あげる」こともでき、これは親の設定で ON / OFF を切り替えられます。

残高は本物のお金ではなく「記録」です。実際にお金を渡すかどうかは家庭のルールに任せています。ここは法律的にも大事なところで、残高を課金と接続したり、実物と交換できるようにしたりすると前払式支払手段などの規制に入るので、あえて記録に留めています。

クイズ

お金に関する 4 択クイズ。AI が学年ごとに問題を生成して DB に貯めておき、子どもが解いて正解すると、親が決めた金額がお小遣いに入ります。カテゴリは「ためる / つかう / よさん / とうし」。

クイズ画面

とうし(疑似投資)

架空の 20 銘柄(インデックス・大型・新興・生活・低成長・斜陽・逆相関…)を、実際のニュースに連動させて平日の朝に 1 回だけ値動きさせる、疑似投資機能です。お小遣いの一部を投資に回して、「短期は上下する」「分散は長期で増える」「配当が高い=おトクではない」といったことを体験します。

実在の株価を使わないのは意図的です。無料で子どもに株価を表示できる正規のデータ提供元が存在しなかったことと、架空なら「なぜ動いたか」の因果を自分で作れて教材として優れているからです。

とうし画面

ファミリーモード

リビングのタブレットを家族で共有する使い方に対応しています。端末を「共有」に設定すると、起動時に子どもを選んで絵文字の PIN で入り、保護者の画面はパスコードで解錠しないと入れません。

子どもに合わせた表記

生年月日から学年帯(小 1-2 / 小 3-4 / 小 5-6 / 中学生)を出して、低学年にはひらがな表記に切り替わります。達成時には紙吹雪、3 日連続なら炎、7 日連続ならトロフィー、という具合に演出も変わります。

技術構成(ざっくり)

レイヤー 採用
フロント Nuxt 4(ssr: false の SPA)+ Nuxt UI 4 + Tailwind CSS v4 + Pinia
バックエンド Supabase(PostgreSQL + RLS + Realtime + Storage + Edge Functions)
ホスティング Cloudflare Pages
通知 Web Push(VAPID)。テーブルへの INSERT を Webhook が拾って Edge Function が送信
認証 Google OAuth
課金 Stripe(サブスクリプション)
AI クイズ生成と相場ニュースの生成に Claude(Sonnet / Opus)
テスト Vitest 137 件 / Playwright E2E 153 件

共通しているのは「常時稼働のサーバーを持たない」こと。一人で運用するので、深夜に落ちる要素を最初から持たない構成にしました。ランニング費用もほぼ固定費なしです。

一人で回すために決めたこと

親が挫折しない設定画面。 設定は ON / OFF のトグルだけを並べ、ON にしたときだけ詳細が展開されます。初期設定は 3 ステップのウィザード(家族名 → 子ども追加 → 完了)で、PIN は共有端末にするときに初めて聞きます。

間違えると困る処理はサーバーに閉じ込める。 残高の加算、クイズの採点、PIN の照合は、すべて DB 側の関数(RPC)で行い、クライアントから直接テーブルを触れません。実は初期の実装では「クイズの点数をクライアントが送る」「PIN が平文で家族全員から読める」という穴があり、設計し直しました。この話は Zenn の詳細編に書いています。

テストを書く。 レビューしてくれる人がいないので、テストが唯一の「自分以外の目」です。290 件のテストと dev / prod の 2 環境で、本番の残高が狂わないようにしています。

法務を先にやる。 課金を始める前に、特定商取引法の表記・利用規約・プライバシーポリシーを整備して法務レビューを受けました。「残高を課金と接続しない」「実物と交換させない」といった、やってはいけない設計もこの時点で確定させています。

作ってみて

家族が毎日使っているので、要望がその場で来ます。「ゲリラタスクが欲しい」「クイズは 1 日 1 問でいい」「投資の上限は 1 日で見てほしい」——ユーザーが家の中にいる個人開発は、フィードバックの速さが段違いです。

一方で、一人だと「動いたからヨシ」で終わりがちです。テストと、設計判断を文書に残すこと(docs/decisions.md に「なぜそうしたか」を全部書いています)で、後から自分を疑えるようにしています。

詳細編(Zenn)

技術の中身は Zenn に 4 本の連載として書きました。

  1. Nuxt 4 + Supabase + Cloudflare で家族向けアプリを一人で作って運用する構成
  2. 「お手伝い → 承認 → 残高」の設計:RLS・RPC・Realtime で残高を狂わせない
  3. AI 生成クイズと架空市場の「とうし」:子どもの金融学習をどう設計したか
  4. 共有タブレットと PIN、通知、課金の線引き:家族で使うアプリのセキュリティ設計

フリーランスの IT コンサルタント兼エンジニアとして、同じような構成での Web / SaaS 開発を請けています。ご相談は namespace(ネームスペース) からどうぞ。

0
0
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
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?