「Xero」の組織詳細

「Xero」は、オーストラリアとニュージーランドで最大のクラウド会計プラットフォームで、数百万の中小企業に利用されています。 私は、企業の基本情報を管理する「Organisation Details」ページのUIと機能のリデザインを担当しました。

このページは長年にわたり、古い設計パターンやレガシーな制約が積み重なったことで、機能追加や改善が難しい状態になっていました。チームの目標は、このページを単なる情報入力画面ではなく、お客様が事業情報を一元的に管理し、「Xero」の利用期間を通じてその正確性を維持・確認できる、価値あるハブへと進化させることでした。

「Organisation Details」に入力されたデータは、「Xero」内のさまざまな機能で利用されているため、このページでの設計変更はプロダクト全体に影響を及ぼします。そのため、関係する各チームの認識を揃えることが重要でした。

私は、ステークホルダーマップとジャーニーマップを作成し、変更を進める前に、各機能との依存関係や地域ごとの違いを整理・可視化しました。

その結果、他の機能で必要とされる項目を誤って削除するリスクを防ぎ、安心して設計を進めるための基盤を整えることができました。

関連するプロダクトチームと変更可能な範囲・制約を確認した上で、「Xero」のデザインシステムである「XUI」を活用し、複数のデザインを作成しました。また、正常系のフローだけでなく、エラーフローも含めて設計しました。

その後、Fableを通じてアクセシビリティテストを実施し、以下のフィードバックを得ました。

• バナーが目立ちすぎて、ユーザーを混乱させていた
• 必須項目と任意項目の区別が分かりにくかった。
• フィールドタイトルやプレースホルダーテキストの表現が不明確だった

これらのフィードバックをもとにデザインを改善し、最終的にエンジニア向けのハンドオーバードキュメントを作成しました。

新しい「Organisation Details」ページは、2023年4月26日にオーストラリアのユーザー向けにリリースされ、以下の改善を行いました。

• XUIデザインシステムのガイドラインに沿ってUIをアップデートした
• 必須項目を明確にするため、「必須」ラベルを追加
• ロゴアップロードのフローを2ステップから1ステップに変化
• 注意を引きすぎていたバナーを、より控えめなトグルに変更
• フィールドタイトルやプレースホルダーテキストの表現を明確化
• 業種や国のフィールドにおけるデータ収集方法を改善し、今後のアップデートでのカスタマイズに対応できる基盤を整備

今回のモダナイゼーションにより、今後の機能拡張に向けた基盤を整え、ビジネス情報を管理するハブとしての役割に近づけることができました。現在、このページは月間約12,000件のユニークアクセスを記録しています。