FindNPO

Decisions

決めたこと

1. 01

   見出しを明朝体にする

   見出しとロゴの文字、経常収益などの数字に Noto Serif JP を使いました。公的な資料や新聞に近い字面にすることで、扱っている情報の性質（届出にもとづく公開データ）と見た目を一致させています。

2. 02

   藍と生成りの紙に、線で区切る

   真っ白な背景ではなく、わずかに黄みのある生成りを地にし、影と丸い角は使わずに 1px の線で区切りました。一覧も面のカードではなく、罫線で区切った台帳の行にしています。同じ作りの Findcare（やわらかい緑と丸み）とは顔を分け、「施設を選ぶ道具」ではなく「法人の台帳を引く道具」に見せるためです。朱は、押してほしい「探す」「問い合わせる」とロゴの一点、見出しの前の短い線にだけ使いました。

3. 03

   地域と分野の二軸で入口を作る

   検索窓だけに頼らず、内閣府の 20 の活動分野を 7 つにまとめた分野から入り、都道府県・市区町村へ辿れる入口を用意しました。分野の名前を知らない人のために「子どもの育ちを応援したい」のような言葉からも選べます。探している団体の名前を知らない人のほうが多いためです。

4. 04

   データの出どころを各ページに書く

   団体ページの基本情報のすぐ下に、出典と、いつの時点の公表データかを明記し、出典の元のページへのリンクを置きました。公開データを扱うサイトでは、これが無いと数字の正しさを自分で確かめられません。

5. 05

   公表データのページに、団体が足せる道を付ける

   団体ページに「この団体の運営者の方へ」の案内を置き、団体の方が無料で写真・活動の紹介・募集状況を足し、問い合わせを受け付けられるようにしました。載せた情報があるかどうかは、一覧の絞り込みにも使えます。

Build

どう作ったか

• Astro ＋ Cloudflare Pages。団体のデータは Cloudflare D1（SQLite）に持ち、地域・分野・名称（社会福祉法人が運営する事業所の名前を含む）から引けるようにしています。
• Findcare と同じ作り（団体向けの管理画面まで）を元にし、色・書体・線の決まりを上書きするファイルで顔だけを変えました。
• 公表データを取り込み直すときは、変わった行だけを書き換え、公表から外れた法人は自動で非表示にします。
• ログインしていない人に出すページはエッジに保存し、団体や運営が内容を書き換えたときに、全ページを一斉に新しくします。ページの数が多くても、同じページを開くたびにデータベースを読み直しません。
• 団体の方は BORDERCROSS ID で無料で登録し、公表されている連絡先などで本人であることを確かめてから、管理画面で掲載の内容を更新し、届いた問い合わせを記録できます。掲載の停止の依頼は、アカウントを作らずに受け付けます。

この事例と同じ考え方・同じ作り方で、ご依頼いただいた制作にも取り組みます。作るものと毎月のことを選ぶと、その場で概算のお見積りが出ます。

この事例を見て相談する → 概算のお見積りを出す → サービスと料金を見る →