Case

部署ごとに異なるデザイン仕様をルール定義し、パーツ化
代理店支援システムをマルチデバイス対応にリニューアル

デザイン制作

サイト構築

大同生命保険株式会社

業種: 生命保険業
導入サービス: 代理店支援システム（WEBサービス）のリニューアル
課題: 既存システムのマルチデバイス化　各部署で異なるフォーマットの統一

課題・目的

部署ごとに異なるデザイン仕様の機能インターフェイスを一つに統合する

今回ご依頼いただいたお客さまでは、既にデジタル化したツールを運用していましたが、二つの大きな課題がありました。一つ目は専用のソフトウェアがインストールされたＰＣでしか使用できないこと。二つ目は、各機能の制作や修正を各部署でしていたために、統一感に欠けるデザイン仕様になっていたことでした。

そこで、今回のリニューアルプロジェクトの基本方針では、代理店支援システムをWEB化・マルチデバイス化することとしました。これにより、PCだけでなく、スマートフォン、タブレットを使って、担当者がどこでも活用できるように、約150画面もあるシステムを再構築する必要がありました。

マルチデバイス化に対応したデザインに変更
部署ごとにバラバラのデザイン仕様を統一感のあるシステムに再構築

制作の流れ

既存のシステムの情報を精査し共通ルールの元、パーツ化する

ネオスではこのプロジェクトに着手する数年前から、お客様のシステムの更新を断片的に担当していました。そこでの成果が認められ、全体リニューアルのご依頼に進展したのです。

最初に集中して着手したのは、画面構造とデザインのルールづくりでした。
通常、既存システムにおける各画面の要素や機能を変更する場合、膨大な作業時間を要します。

しかし、短納期のため基本方針としては、画面ごとのシステムはそのままに、UI設計とデザインでユーザビリティの刷新を行うこととしました。
それぞれ異なったフォーマットに対し、共通化を図ることで、最大公約数を導き出し、汎用的に使えるようパーツ化し、UIデザインを構築する方針としました。
重複などの無駄をそぎ落とし、極力シンプルなデザインを施すために、共通ルールを定め、パーツ化を行いました。

初動段階でしっかりと検証とトライアンドエラーを繰り返し、その後の約150画面に及ぶ実制作ではスムーズに進めることができました。

入力カテゴリーごとの情報をブロック化するデザイン思考を導入
ブロックごとに編集する機能を追加
「読む」「見る」動作ごとにデザインする位置をルール化
情報の属性に対するカラーを統一

制作の体制

スピーディに仕上げるため複数のデザインラインを用意

初動段階で固めた画面構築とデザインのルールに従い、制作するのは約150画面。ユーザビリティを意識したUIデザイン思考を取り入れ、整理と統廃合を行いました。

大量の画面をスピーディに完成させるために、ネオスの制作チームは複数のデザインラインを同時に動かす体制を整備し、デザインテイストやトーンに揺れが生じないよう、豊富なUIデザインの知見を有したディレクターが全体を監修しました。

大量の画面を短納期で完成させるため、複数のデザインラインを整備
統一したデザインテイストになるよう、ネオスのディレクターが管理

成果

マルチデバイス化により業務効率化の実現とペーパーレス化を促進

今回のプロジェクトで新たに誕生した代理店支援システム『D-Plus』は、既存のシステムに比べて、「見やすい、使いやすい、伝えやすい」を実現しました。html形式のマルチデバイス化により担当者が外出先からでもシステムにアクセスできるため、場所・デバイスを限定せず保険料の試算や保険の加入内容を確認することも可能となり、業務の効率化を実現しています。

また、営業活動におけるペーパーレス化を促進し、エンドユーザー様とのよりスピーディなコミュニケーションが可能に。バラバラだったアプリケーションの仕様を統一したことで、担当者も情報を整理・把握しやすいシステムとなりました。