Yuicleanerの開発チームの一員としてUI/UXデザインを担当
0. 概要
Yuicleanerは医療データに特化したデータクレンジング・分析プロセスをノーコードで実施するソフトウェアです。医療データを二次活用するにあたって、データソースそれぞれでデータ構造が違うことが問題となっています。毎回違うデータを処理(構造化、表記ゆれ修正や標準化)を行う作業はとても煩雑で、今までは専門的なエンジニアでしか扱えない領域の業務でした。
エンジニア以外のすべてのステークホルダーがこの複雑な操作をできるようになるには、UIが重要になります。プロダクト開発当初は開発チームにデザイナーがいなかったので、ユーザーのUIに対する不満は高まっていました。そこで私が既存画面のデザイン改修を担当することになりました。操作頻度や現状を踏まえてデザイン改修する順序を決める必要がありますが、POは最初に改修する箇所をコンバート画面だと決定しました。表記ゆれを修正する画面なのですが、この画面で効率よく操作を終えられていることをUI改修の目標としました。
改修前コンバート画面
1. 業界とユーザーの理解
デザインの形を決めるにあたって、ユーザーのことを知ることは不可欠です。とはいえ、ここに時間をかけすぎてカタチを決める時間が少なくなっては本末転倒です。最小公倍数となるようなキャッチアップ範囲をPOとともに決定して、できるだけ効率的にユーザーに共感できるような方法を策定しました。それは自分でデータクレンジングを行ってみることと、そのあとにクレンジングを行っているユーザーを属性ごとに数名分観察することです。初見操作の自分の操作完了の時間と慣れているユーザーではかなり操作完了までの時間に差がありましたが、慣れているユーザーでもマウスカーソルの動きが大きい箇所もあり、そこがデザイン改修のポイントかもしれないとインサイトを得ることができました。
2. 解決策の策定
これらのキャッチアップした背景知識を踏まえて、コンバート画面においてのベスト課題は、 どのカラムにどういう表記ゆれ修正操作が行われているかを把握することが難しいことだと判断しました。
フォーカスする課題が決まったところでカタチを決める作業に入ります。この段階で、色や細かいコンポーネントのサイズまで検討する必要はなく、先に決めるのは改修後の情報構造やレイアウトです。これを最速で進めるには低精度のプロトタイプが適しています。3つ低精度なプロトタイプを示して、方向性を決めました。
案1:ノード内にすべての情報を常に表示
案2:ノードの詳細情報は格納されている
案3:ノード内には要約された情報だけ表示
3. 課題の解決
最終案です。レイアウトが決まったので、細かい修正のみで、大まかに方向性がずれることはありませんでした。 とあるクライアントではデータクレンジングの作業時間を**90%**削減しました。私のUIデザイン改修は医療データの流通が促進したと言えます。より正確な情報が患者や医療従事者に届き、より適した製品やサービスが作れるようになります。
