日本企業はこれまで、業務システムにおけるデザインをそれほど重視してこなかった。だが昨今、業務において使い勝手の悪いUIが仕事の効率を低下させたり、機会損失を生んだりするリスクが指摘されている。また、テクノロジーの発達によりサービスのコモディティ化が進行、機能面での差別化が難しくなったため、一人ひとりの行動や嗜好に応じた体験を提供し、持続可能な関係性を構築することが求められている。これまでおざなりにされてきた業務システムのUX/UIを再考し、改善する時期が、ようやく到来しているのだ。実際にUX/UIデザインの改善によって成果を挙げた大手生命保険会社や京セラコミュニケーションシステム株式会社の事例を交えながら、業務システムにおけるデザイン改善のポイントなどについて解説する。
大手生命保険会社や京セラコミュニケーションシステム株式会社は、どのようにデザイン改善を行って成果を挙げたのか
おざなりだったデザイン…なぜ“超重視”され始めているのか？
これまでUX/UIデザインというと、日本ではB2C（企業対消費者）領域で重視されてきた。2000年代後半にiPhoneが普及し始め、それをお手本に、見た目のカッコ良さや使いやすさを追求するようになったからである。一方、B2B（企業間）領域では業務システムにおけるデザインがどちらかというと軽視されてきた背景がある。
しかし見た目のカッコ良さが問題なのではなく、デザイン次第でシステムのインターフェースが業務の効率に大きな影響を及ぼすことが問題なのだ。たとえば、1日に多くの問い合わせを受けるコールセンター業務の例がわかりやすいだろう。顧客に応対する担当者は、通話と同時並行で、相手の情報や質問に対する情報をシステム上で調べて迅速に回答する必要がある。
問い合わせ内容が多岐にわたると、その情報が別のシステムに入っていることもあり、それに合わせて担当者は複数あるシステムを行き来しながら画面メニューを何度も操作しなければならないなど、負担が大きい。業務の処理フローや必要な情報を適切に考慮したUIデザインにしておけば、担当者は迷わずに目的の情報を取得でき、回答までの時間が短縮できるし、業務を行う人に対するシステムのトレーニング時間も少なくて済む。
1件あたりの処理時間が短くなれば、そのぶん多くの顧客に対応でき、人件費も削減できる。ユーザー側もムダな待ち時間が短くなり、ストレスから解放されるだろう。このように業務システムでは、仕事の効率やサービス品質を高めるためにUX/UIデザインが非常に重要なファクターになるのだ。そのためにはデザインの改善が必須になる。
業務システムのデザインを改善する際のポイントは、無闇にB2Cのようなデザインをしないことだという。多数の業務システムのUX/UIデザインを手掛け、デザインシステムのプラットフォームなどを提供しているFixel（フィクセル） 代表取締役 CEOの金 成哲氏は、次のように注意を促す。
Fixel 代表取締役 CEO 金 成哲氏
「業務システムでは、不特定多数のユーザーを対象とするB2Cサービスとは異なり、対象ユーザーは従業員に特定され、使用の目的は明確に決まっています。そのため、カッコ良さなどではなく、システムの目的を考慮した使い勝手や効率を改善しなければなりません。ですが、大前提としてコンテキストが違うのに、B2Cと同様のデザインを考えてしまいがちです。実際に市販のUX/UIデザインの解説本もB2Cのサービス向けのものが多いため、なおさら勘違いしやすいのです」
そこでFixelでは、業務システムにおけるデザインを改善して企業の生産性向上に貢献するためのサポートを行っている。ここから、同社が支援して実際に大きな成果を得られた例として、国内の大手生命保険会社のコールセンターでの事例を紹介しよう。
同社では、顧客の応対をするコールアシスタント（CA）を中心に2500名の社内スタッフがコールセンター業務に携わっていた。以前までは、顧客の電話応対をする際にCAは10個以上のシステムを立ち上げ、それぞれ並行してデータの入力や参照を行っており、大きな負担がかかっていたという。そこで各システムから必要な情報と機能を統合した新システムを構築することにした。
この新システムのUXデザインを担当したのがFixelだ。Fixelが選ばれたのは、ただ単に画面を作成するのではなく、業務を理解した上でUX/UIの改善を具体的に提案したからだという。Fixelがデザインを手掛けた結果、従来と比較してコール1件あたりの平均処理時間が4割削減し、目標を大幅に上回る成果を出せた。
CAの顧客応対数も増えて、スタッフからは「使いやすくなった」という評価の声も多くなった。同社では今後も、CAからの改善要望を反映し、成長し続けるシステムにする方針だ。
こうした成果創出を支援しているFixelだが、デザイン改善のサポートを手がける競合他社は多い。それでも同社が選ばれる理由はどこにあるのだろうか。この問いに対し、金氏はこう答える。
「B2Bを対象にすると言っている他社の多くがマーケティングや集客のためのWebサイトなどのデザインに集中しているのに対し、当社はB2BやB2E（企業対従業員）向けの業務システムや製造業システムのUX/UIデザインに特化した企業です。仕事で使われる業務用システムのUX/UIデザインだけにフォーカスして10年以上の実績を持つ専門的なデザイン会社は、国内でも数少ないと自負しています」
10年以上にわたるノウハウが蓄積されているため、IT企業や大手企業のIT部門などの仕事のやり方やプロセスにデザインとデザインシステムを導入する手伝いもできるのだという。
デジタル庁も推進で大注目の「デザインシステム」
このように業務システムにおけるデザインが重要視されていく中で、デザインシステムという手法が注目を集めている。デザインシステムとは、デザインの原則やデザインガイドライン、それらに沿ってデザインされたUIコンポーネントとその実装コードを体系的にまとめたものだ。欧米の大手企業を中心に7～8年前から広がり、日本では2年前に発足したデジタル庁でもデザインシステムが採用されたことで国内でも注目されるようになった。
Fixelは、デザインシステムを簡単に構築・運用できるプラットフォームとして「UXHub」を提供している。このUXHubでは、デザインシステムをテンプレートからまるでブログを書くかのような手軽さで簡単に作成でき、さらには企業や製品のブランドを意識したカスタマイズを行なった上で適用することが可能だ。1つのテンプレートをベースに作成し、それを複製・カスタマイズして多数のシステムに適用することが簡単に行える。まさにデザインシステムの量産が可能になるのだ。
UXHubでは汎用的なデザインシステムのテンプレートをベースに作成できる
またUXHubで運用されるデザインシステムは、デザイン修正による工数を削減することも可能だ。UXHub上でスタイルを変更するか、一緒に提供されるFigmaのデザインシステムテンプレートでデザインを変更するだけで、その変更がUXHubに格納されているUIコンポーネントのコードにも適用される。
作業画面からリアルタイムでデザインの変更点を把握できるため、ユーザーは確認しながら作業を進められる
もちろん前出のように、デザインシステムの共有や、UIコンポーネントの再利用などによって、デザイン品質を保ちながらフロントエンドの開発効率を向上できるようになる。
これからのデザインについて金氏は「デザイナーが一から白いキャンバスに描いていくのではなく、デザインシステムが提供する部品（UIコンポーネント）の一覧から適切なものを探してそれらを組み合わせ、新しい画面を制作することが当たり前になります。デザインシステムの活用によってフロントエンドの品質と開発生産性はグンと上がります。Fixel内部の仕事では30～50％のコスト低減効果を見ております。デザインシステムが提供する各種リソースを再利用することで、どんなシステム・画面でも一貫性のあるUXを提供できるので、システムの分かりやすさや使いやすさの向上にも役立ちます」と説明。
続けて、「またFixelの提供するFDS（Fixel Design System）という、デザインシステムのテンプレートを使うと要件定義のときに、ユーザーの要望を聞きながら即時に画面を作成して見せることができるので、顧客との合意を得やすく、認識の齟齬が発生することもないので、開発の手戻りも少なくなります」と話す。
このUXHubはお試し利用として、無料で使えるプラン（デザインシステム数は3、編集者数3名まで）を用意。また本格的な利用を想定して、SIerや事業会社の情シスのためのエンタープライズプランも提供している。
京セラコミュニケーションシステム株式会社が開発工期を“大幅に短縮”できたワケ
システムコンサルティングから開発、運用・保守、管理までを行うSIerの京セラコミュニケーションシステム株式会社は、Fixelによる支援の下、UX/UIデザインの手法やデザインシステムを活用した開発プロセスを再定義して開発効率を高めた1社だ。
同社は従来まで、JAVAベースのフレームワークを活用して各システムを開発してきたが、出来上がったシステムは洗練されたデザインではなかったり、使いやすさ、画面の一貫性という点にも課題意識を感じ、克服したいと考えていた。 快適な操作性や見やすいレイアウト、素早い情報アクセスといった要件を満たすUIのデザインにしつつ、クラウドコンピューティングを意識してシステムアーキテクチャーを再定義しながら、更に開発工数を最小限に抑えられるように、開発プロセスを見直そうとしていたのだ。
そこで従来の標準的な開発プロセスにUX/UIデザインの手法とデザインシステムを導入し、フロントエンド開発に活用することを進めた。これによりデザインの品質と一貫性を保ちながら、ユーザーが使いやすいシステムを迅速に構築する仕組みができたため、それを新しい開発プロセスとして再定義して開発効率を高める道筋を見出せるようになった。
新プロセスではバックエンドとフロントエンドの開発を同時並行に進められる。その結果、プロジェクト全体の開発工期を大幅に短縮し、手戻りのリスクも大きく軽減できた。同社は、この効果を鑑みてUX/UIデザインの支援とデザインシステムの活用を推進する組織を立ち上げ、より対応範囲を広げていく方針だ。
DXを成し遂げるにはSIerにもデザイン視点が必須
以上のように、業務システムにおけるデザインの改善や、デザインシステムの提供・支援を手掛けるFixelは2022年に、国内大手の独立系SIerであるTISと協業を開始。デザインシステムの優位性や価値をさらに高めて、ユーザーに提供できるようになった。TIS DXビジネスユニット DX企画ユニット DXクリエイティブデザイン部 部長の鈴木 翔一朗氏は次のように評価する。
TIS DXビジネスユニット DX企画ユニット DXクリエイティブデザイン部 部長 鈴木 翔一朗氏
「これまで我々は数多くの業務システムを手掛けてきましたが、近年多数のDX人材の採用を始めてきました。TISはDX視点で仕事を進めながら顧客ニーズを捉えてきており、さらに業務システムのデザインに特化したFixelとタッグを組むことで、単にシステムを提供するのではなく、コスト面やビジネス面でのメリットを提供できるようになりました」
Fixelと協業してから約1年。TISは、既存の業務システム上にUX/UIデザインのサービスを強化して提供する体制を構築することで、これまでのエンジニアリングにデザインを加えた新しい視点で、業務システムの効果的なUX/UIを実現できている。これにより、顧客のビジネス課題をより解決できるようになり、さらには顧客の成長に貢献できるようになったという。
これまでのSIerは業務システムなどを開発する黒子的な存在だった。だが時代は変わり、業務システムに対する顧客の要件が高まってきた。安心安全なシステムを構築するのは当たり前となり、ただ「見た目がいい」「操作性がいい」のではなく、ビジネス目標に対して適切な「見た目」や「操作性」を作ることが重要となっているのだ。デザインもシステムも根幹である「設計」が重要であり、今後はエンジニアがシステムの目的も考慮したデザインを取り入れることが重視されていくだろう。
TISが手掛ける業務システムにFixelのデザインに対する論理的なアプローチが加わることで、顧客の課題を明らかにした上で、デザインとテクノロジーの両面からアプローチする、より効果的な改善案を顧客に伝えることができるようになった。それにより両社は、顧客のビジネスの発展にこれまで以上に貢献できるパートナーになれるだろう。
業務システムにおけるUX/UIデザインとデザインシステムの導入効果は非常に大きい。興味を持った企業担当者は、まずはFixelに相談してみてはいかがだろうか？
*大手生命保険会社の詳しい事例内容： https://fixel.co.jp/works/orixlife/
*京セラコミュニケーションシステム株式会社の詳しい事例内容： https://fixel.co.jp/works/kccs/
*「UXHub」サービスページ： https://uxhub.tokyo/
※本コラムは2023年9月1日にビジネス＋ITで掲載された内容を転載しています。
※この記事が参考になった!面白かった! と思った方は是非「シェア」ボタンを押してください。