2018ニューヨークを拠点とするFineryは、ECサイトと連動してユーザーの購入履歴をインポートして自分の手持ちの服を管理し、コーディネートの作成ができるサービスです。機能の多さから複雑になってしまっていたユーザー体験を設計し直し、カレンダー機能を中心としたダッシュボードのリニューアル提案を行いました。クリエイティブの統括も担い、Fineryの世界観を表現する色や余白のサイズのルールを定めて、5人のデザイナーを率いてプロジェクトを進めました。デザイン課題とゴールリニューアル前のFineryのダッシュボードユーザーのアクションの起点となるダッシュボードには6つのメニューが並んでおり、メインの体験が分かりづらいものとなっていました。結果、ユーザーのアクションが減少傾向にあり、エンゲージメントを高めることが課題でした。そこでユーザーの関心を持続させるために、メインのアクションであるコーディネートの作成頻度が上がるような、機能的なダッシュボードを設計する必要がありました。私たちはプロジェクトのゴールを以下のように設定しました。パーソナライズされたコンテンツを提供するダッシュボードにする日々のスケジュールと共にコーディネートを表示するカレンダーを設計する新しいダッシュボードを一貫性をもって設計できるようにデザインシステムを構築するユーザー体験のコアまず最初に、デザインスタジオと呼ばれるUIスケッチのワークショップを複数回行い、各機能をどのようなインターフェースでダッシュボードに落とし込むのかを議論しました。Fineryにはカレンダー機能の他に「返品アラート」「セールスアラート」「リファラル紹介」といった重要な機能があり、当初はこれらもダッシュボードに入れる方向で設計をしていました。スケッチを繰り返しながら、これらの機能はビジネス視点では重要であるものの、ユーザーにとってコアな部分ではない、ショッピング中心の体験だと気づきました。そこで、Fineryにおけるメインの体験は「自分のワードローブを管理し、日々のコーディネートのインスピレーションを得るのに役立つこと」と定義し、それを実現するためのカレンダー機能のみでダッシュボードを設計し直すことにしました。カレンダーを中心とした新しいダッシュボードのデザインデザインルールの整理モックアップ制作の前に、現存するコンポーネントをすべて集めたところ、ボタンの色や形状、余白のサイズに一貫性がないことが分かりました。そこでデザインルールの整理を行い、ガイドラインを制作しました。「Yes/No」といった2択の表示に同じ色が使われており、ユーザーを迷わせてしまう要因となっていました。緑色や水色などさまざまな色が使われていましたが、ファッショナブルなFineryの世界観とは異なるものでした。そこで、使用色を制限し、Fineryのブランディングに沿う橙色、ヌードカラーと黒のみで、ボタンなどのコンポーネントを構成することにしました。色の他にも、書体やアイコンのサイズを統一しました。カレンダービューカレンダーは、新しいダッシュボードのコアとなる機能です。ユーザーは「Week」「Month」「Day」の異なるカレンダーの表示の仕方を、自分の好みに合わせて切り替えられます。これら3つのカレンダーを、どのデバイスからアクセスしても体験できるようにレスポンシブに対応したデザインにしました。1週間ごとの表示ユーザーインタビューの結果、コーディネートを考えるのは週ごとに行うという意見が多かったため、1週間ごとの表示をデフォルトで表示するようにしました。モバイルではスワイプしないと1週間すべてのカレンダーを確認することができないため、一番左に今日の曜日が配置されるように設計しました。「旅行のために少し先の日程のコーディネートを考えたい」といった要望に月のカレンダーは役立ちます。デスクトップでは毎月のコーディネートが一覧で確認できます。モバイルでは日付のみのシンプルなレイアウトに切り替わり、どの日にコーディネートが登録されているかを素早く知ることができます。他のカレンダーよりも大きめのコーディネート写真が表示され、その日のスケジュールも確認できます。詳細表示その日の全スケジュールの確認や、予定の追加、そしてコーディネートのアイテムリストも見ることができます。いう少しおちゃめなコピーで、コーディネートの登録を促します。アイテムフィードの設計Fineryが複雑な設計になっていた要因の1つが、カレンダーに追加できるコンテンツが複数あることでした。WardrobeとWishlistなどの関連した情報はタブでまとめました。ユーザーはこれら3つの項目の中からアイテムを選び、カレンダーに登録することができます。Looksへ登録できます。コーディネートの作成頻度をあげるために、ワードローブからアイテムの登録がスムーズに行えるようにすることが設計のポイントでした。まとめ単にダッシュボードのレイアウトの変更を行っただけでなく、機能の多さから複雑な動線となってしまっていたユーザー体験を、カレンダー機能を起点に設計し直しました。個人的なチャレンジとして、クリエイティブディレクターとしてビジュアル面での意思決定を行いました。