既存クライアントを管理するためのログイン機能付きホームページの作成
1. ログイン機能で、情報を見られる人を限定 Firebase Authenticationでログイン機能を実装し、許可したクライアントだけが専用ページに入れるようにした クライアントごとに専用ページ（/agent/:id）を用意し、自分の情報だけが表示されるようにした reCAPTCHAで不正ログインやbotを防いだ 2. クライアント情報の一元管理 Firestoreにクライアント情報を保存し、メールやExcelに散らばっていた管理を1か所にまとめた 代理店・クライアントの関係をツリー形式で表示し、階層構造がひと目でわかるようにした Google Apps Scriptと連携し、スプレッドシートで管理しているデータをそのままサイトに反映させた（非エンジニアでも更新できる） 3. 資料共有をセルフサービス化 Google Driveのフォルダを埋め込み、報告書などの資料を年月を選ぶだけで閲覧できるようにした 資料をメールで個別に送る手間をなくし、クライアントが必要な時に自分で確認できるようにした 4. 問い合わせを減らす仕組み 操作マニュアルをNotionで公開し、ログイン後の画面に常にリンクを置いた 使い方の質問をクライアント自身で解決できるようにした 5. 公開ページとの両立 会社紹介などの公開ページと、会員専用ページを1つのサイトにまとめた ブログはmicroCMSで管理し、コードを触らずに更新できるようにした React Routerで画面遷移を速くし、アプリのように使えるようにした 6. ブランドにふさわしい見た目 Three.jsによる3D表現と、Framer Motionのアニメーションで、金融サービスらしい先進的で信頼感のあるデザインにした Tailwind CSSで、PC・スマホの両方に対応した
1. スプレッドシート頼りの管理から、ホームページでの一括管理へ これまでスプレッドシートで個別に管理していたクライアント情報・資料・代理店との関係を、ホームページ上でまとめて管理できるようになった ファイルの場所を探したり、どれが最新版か確認したりする手間がなくなり、管理業務の負担が減った 情報が1か所にまとまったので、担当者が変わっても引き継ぎやすくなった 2. お客様が問い合わせをせず、自分の情報を確認できるようになった お客様がログインするだけで、いつでも自分の情報や資料を確認できるようになった 「資料を送ってほしい」「最新の状況を知りたい」といった問い合わせや、個別の対応が減った お客様が必要な時にすぐ確認できるので、サービスの満足度と信頼感が上がった