Project 03
オンラインで保険申込みを完結させるWebダイレクト画面の継続的なUI改善、およびデザインと実装の乖離を極小化する運用設計を担当しました。100画面を超える大規模プロダクトの品質を死守したプロセスについて解説します。
クライアントから「最新仕様が不明瞭」という課題をヒアリング。デザインと実装の乖離を根本から解消し、開発効率を最大化するために、Figmaによる一元管理体制と運用フローを構築しました。
「正解（実装済み）」と「検討（改善案）」を分離した運用フローを設計しました。マスターFigmaファイルでは実装画面と乖離をなくした正解のデザインを画面単位で管理。改善Figmaファイルでは修正案を既存画面と比較配置し、変更箇所を黄色帯でハイライトすることで、エンジニアやクライアントが差分を一目で把握できるようにしました。
「実装の都合で色を増やしたい」という要求に対し、単に拒絶するのではなく、「負債をコントロール下に置く」アプローチを採用。特定の箇所に限定した「例外色」としてFigmaに登録し、ガイドラインに「使用禁止・限定」の旨を明文化。チームで共通認識が取れるようにして誤用を防ぎました。
主要UIをコンポーネント化することで、不必要なUIの量産を防ぎ、クライアントとの議論の質を向上させました。また修正コストの削減にも大きく貢献しました。