UIデザインに必要な『一貫性』へのアプローチ - 管理画面のアップデートに際して

私たち Wantedly, Inc. では、デザイン・開発・ビジネスのメンバーでクロスファンクショナルなチームを組み、2020年9月より管理画面のUIスタイルの刷新に取り組んできました。長い間使われ、一方で今のご利用状況やビジネス、トレンドに対してフィットしない部分の目立ってきた管理画面のデザインに対して、久々のテコ入れです。

プロジェクトを始めるにあたり、デザインチームでは管理画面のUXとして、UIで実現していくべき4つの原則を定めました。その中で、今回のアップデートでは「2. REPEATABLE : 1つを分かればすべてが分かる」ための『一貫性』を主要なスコープとしたUIの統一を行いました。

さらに、トップの「採用の概要」画面に関しては「1. DEMONSTRATIVE : やるべきことは明白だ。」を実現すべく、機能開発も含めたフルリニューアルを行っています。

コンセプト検討フェーズでの「採用の概要」画面デザイン

一貫性はなぜ必要か？

UI/UXの一貫性は、プロダクトが成長を成し遂げる中での機能変更によって損なわれやすいものの一つです。機能開発の速度と全体の一貫性は、短期/長期のトレードオフの関係になってしまいやすいからです。それぞれの機能の価値はしっかりと実現されるべきですが、だからといって全体の一貫性を蔑ろにしてよいわけではありません。この一貫性の重要さについては、漠然と感じていても説明に困る方もいらっしゃるのではないでしょうか。私達は以下3つの観点があると考えデザインに取り組みました。

1. ユーザビリティとして

使い勝手の上で一貫性が必要とされる最も大きな理由としては、上の原則「2. REPEATABLE : 1つ分かればすべてが分かる」という言葉でも表現されているように、使い方を学習しやすくすることです。

これまで、Wantedlyの採用管理画面では残念ながら画面ごとにレイアウトが異なり、似た機能であってもUIの場所や見た目、操作方法が違う、という状態でした。これを今回のアップデートによって改善、画面間で一貫したレイアウトとすることで、画面を跨いでどこに何がありそうかを想像しやすく。同じ機能は一貫したインタラクション、見た目として、一度やったことのあるコトは再学習の必要がないように改修を行っています。

同じく、コンセプト検討フェーズでの各画面の標準化デザイン。

2. ブランドのUXとして

２つ目としては少し抽象的になりますがブランディングの話として。ブランドとして世界観を統一することで、UXとして「この範囲は同じ使い方で、同じ価値を提供してくれる」という安心感を作り出すことができます。AppleのアプリにはAppleのアプリとしての作法とブランドの提供価値が、GoogleのアプリにはGoogleのアプリとしての作法とブランドの提供価値が存在します。それぞれの世界の使い方と、そこで出来ることのイメージを定義しているのが、世界観としてのトーンの一貫性です。

3. 生産性として

3つ目は開発・デザイン効率としての捉え方です。今回のアップデートにあたり、Wantedlyの全サービスに跨って基本となるUIデザインシステムの実装にプラスして、管理画面で標準的に使える多くのUIコンポーネント実装を開発しました。今後開発する機能に対し、一般的な容れ物を提供することで、長期的なUX変更のためのデザインとフロントエンド開発、社内コミュニケーションコストの削減を図っています。

Wantedly UI デザインシステムのスタイルガイド

私たちは、常にアップデートを続けます。

このような重要性を持ちながらも、開発速度との両立、またメンバーそれぞれの自律的な判断との両立が難しい「一貫性」を担保し、UIの細部で悩むことなく重要な課題に高速に対応していけるよう、私達 Wantedly のデザイン、開発チームはUIデザインシステム実装の整備にも力を入れています。エンジニアの方はこちらの記事もぜひご参照ください。

今回のプロジェクトでは、デザインだけでなく社内の開発・ビジネスのメンバーの強い連携と課題意識への共感によって、ビジネス影響懸念や開発の困難さから手を加えられなくなりがちなレガシーな部分にも手を加えることができました。これは小さな一歩であっても、今後のサービスの持続的な発展にとって大変重要なことだと考えています。

この改修によって、管理画面をお使いいただく方々の体験と使い方の学習がよりスムーズで現代的なものになることを願っています。私達Wantedlyが、組織づくり行う方々のシゴトの充実「ココロオドル」のためのパートナーで居られるよう、これからも皆でアップデートを継続して行きます。どうぞよろしくお願いいたします。