GrantBoard ができるまで — データ可視化 4 本目を 補助金 洗い出しで開く
GrantBoard は 国 + 自治体 補助金 / 給付金 / 助成金 洗い出し ビューア。 年齢 × 世帯 × 子供数 × 雇用 × 住居 × 所得帯 + 7 ライフイベント (妊娠 / 移住 / 住宅取得 / EV / 太陽光 / 起業 / 障害) から、 約 30 制度の中で 該当しそうなものを 公民館 コルクボード風に表示。 ラボ 43 本目、 データ可視化 thesis 4 本目 (wiki-orbit 知識 / astro-cast 天文 / pop-drift 人口 / grant-board 補助金、 「知識 / 天文 / 人口 / 補助金」 4 軸)。
なぜこの形にしたか
外部 AI 90 案リスト 「¥0 月コスト + PV 巨大」 候補の 6 本目として 案 54 「自治体補助金 洗い出し」 を選定。 マネー計算機 8 本柱は 「払う / 貯める」 側 (NISA / 住宅 / ふるさと / 副業税 / 育休 / 教育費 / 無駄遣い / 一人暮らし) で、 「もらう側」 のラインが ラボ全体で 唯一存在しなかった。 「補助金 一覧 / 給付金 / 助成金 / もらえる お金 / 申請漏れ」 系の検索意図は 「自分が知らないだけで貰える金があるんじゃ?」 という 強い不安 / 期待で、 通年 巨大需要。 既存大手 (政府 e-Gov / 厚労省 HP / 自治体個別 HP) は 「公式一次情報」 として優秀だが、 縦割り + 個別ページで 「自分に該当する制度」 を 横断的に見るツールが ほぼ存在しない。 純 JS + 静的データテーブルで 完結。
技術スタック
30 制度 × eligibility 述語マッチング
interface Eligibility {
ageMin?: number; ageMax?: number
needChildren?: boolean
needPregnant?: boolean
needMoved?: boolean; needBought?: boolean
needEv?: boolean; needSolar?: boolean
needStartup?: boolean; needDisability?: boolean
needUnemployed?: boolean; needRetired?: boolean
needLowIncome?: boolean; needSelf?: boolean
}
interface Grant {
id: string; name: string; category: Category
amount: string; amountYen: number; oneTime: boolean
agency: "国" | "都道府県" | "市区町村"
notes: string; eligibility: Eligibility; url: string
}
各制度に eligibility を持たせ、 eligibilityMatch(grant, userState) で 1 件ずつ judge。 失敗した述語を reason として記録、 「該当しなかった理由」 まで表示。
11 カテゴリ + 4 色 プッシュピン
const CATEGORY_COLOR = {
出産育児: "#e88aa0", 子育て: "#d8923a", 教育: "#7a2a2a",
住宅: "#2d5a8b", 移住: "#2d7d5e", シニア: "#6a4828",
障害: "#8a5aa8", 起業: "#b8923a", 環境: "#4a8a6a",
失業医療: "#c63224", 税制: "#4a4a4a",
}
各 note カードの 左 border-left を category color に統一、 ピンは 4 色 (赤/青/緑/黄) を :nth-child(2n/3n/4n) で 循環。
一時金 / 経常 を分けて合算
const totalYearly = matched.filter((r) => !r.grant.oneTime).reduce((acc, r) => acc + r.grant.amountYen, 0)
const totalOneTime = matched.filter((r) => r.grant.oneTime).reduce((acc, r) => acc + r.grant.amountYen, 0)
「年に 〇〇 万円もらえる」 vs 「ライフイベント 1 回で 〇〇 万円もらえる」 を 別カードで表示。 子育て世帯では 経常 (児童手当 + 子ども医療 + 高校無償化) で 年 30-50 万、 住宅取得時は 一時金 (エコホーム + 住宅ローン減税初年度) で 100-150 万、 のように 性格の違う金が並ぶ。
不該当理由 表示
if (e.needPregnant && !u.pregnant) fails.push("妊娠中 限定")
if (e.ageMin !== undefined && u.age < e.ageMin) fails.push(`年齢 ${e.ageMin}+ 必要`)
// ...
return { grant, matched: fails.length === 0, reason: fails[0] }
「条件が変われば対象に」 として 不該当リストも 灰色で表示、 「妊娠したらこれが追加」 「移住すればこれが追加」 が一目で見える設計。
visual direction
公民館 コルクボード + プッシュピン + 黄色 受付票 + 蛍光マーカー motif:
- palette: cork tan
#c8a26a+ cork dark#9a7a48+ ivory paper#f6efde+ 役所 deep teal#2d4a5a+ push-pin 4 色 (red / blue / green / yellow) + 黄色 受付票#ffe96b+ 蛍光ハイライト#fff36b+ 朱赤 該当 stamp#c63224 - motif: 12px cork-deep border + cork texture (5 個の radial-gradient で 砂 / 木目 偽装) + 4 隅 thumb-tack (
::before/::after+.boardCornerL/Rの 4 つで red/blue/green/yellow 4 色のピン) + bulletin head (teal banner + Instrument Serif italic 「公報」 + 黄色 mono sub label) + 受付票風 yellow chip (1deg rotate + 2px 2px 0 cork shadow) + 付箋 note カード (border-left = category color + 中央上に push-pin + nth-child で rotate -0.4 / 0.5 / -0.25 deg のジッタ + 3px 3px 0 cork shadow + 蛍光マーカー highlight) - typography: Space Grotesk 800 (banner display) + JetBrains Mono (numerics / readout) + Instrument Serif italic (公報 / 朱印) + Noto Sans JP body + 漢数字ステップ (壱/弐/参)
既存 42 本柱と完全別軸 (データ可視化 3 本柱 = wiki-orbit 古地図 / astro-cast 天文台 / pop-drift Risograph 統計年鑑 とは palette + motif 完全別、 SoloRoost kraft 段ボール と cork brown は色相が近いが motif (引越し vs 公民館) と 構造 (cross-stripe マステ vs cork radial + thumb-tack) で別、 唯一の 「公民館 コルクボード + 4 色 thumb-tack」 motif)。
8 プリセット
- 20 代 単身 / 賃貸 / 中所得
- 新婚 + 妊娠中 / 賃貸
- 子育て 30 代 / 子 2 / 中所得
- 住宅取得 + EV + 太陽光 / 子 1
- 地方移住 + 起業 / 単身
- ひとり親 / 子 1 / 低所得
- シニア 退職後 / 夫婦 / 低所得
- 学生 19 歳 / 低所得
やっていない / これからの IMPROVE
- 47 都道府県 + 主要市区 プルダウンで 「自治体独自制度」 も拡充 (家賃補助 / 移住支援 / 太陽光 補助 等)
- 申請期限 アラート (年度内 / 数ヶ月以内 の制度を 朱赤 帯で)
- 正確な所得制限 計算 (児童扶養手当 / 修学支援 / 高校無償化 等の所得テーブル)
- 公式 HP ディープリンク (現在は所管省庁トップへの暫定リンク)
- チェックリスト印刷 (該当制度を CSV / PDF で 役所窓口 持参用)
- クロス導線 (Linked from StorkCast / GradFund / SoloRoost / RoofFund に 「対応する補助金は GrantBoard で」 リンク)
次の SHIP は何 thesis に振るか
無料運営 (¥0/月) 候補の次:
- 85 占い 的中率 トラッキング (占い 4 本目)
- 30 請求書 催促代行 (ジェネレーター 7 本目)
- 19 寝かしつけ 物語 (ジェネレーター 8 本目 / 学習系)
- 副業 提案文 v2 (StackTale 改善)
[ ./next_action ]
読んだら、 GrantBoard を実際に動かす。
この開発ログは GrantBoard をどう作ったかの記録です。 読み終わったらそのままサービス本体へ戻って、 実物で価値を確かめてください。