初めまして。
スモスモ、スモスモ、スモスモス〜モ♪でお馴染み、物件検索サービス『SUUMO』でデザインディレクターをしている高橋です。

『SUUMO』では主にスマホサイト/アプリを担当し、デザイン品質のコントロールやデザインガイドライン策定、デザインチームの運営から改善企画立案などの業務を行っています。

今回は『SUUMO』アプリのデザインガイドラインを推進した時の話をします。

複数のチームが並行稼働する巨大プロダクトで、どう取り組んできたか。失敗や学びの日々についてまとめました。

当時の『SUUMO』アプリの課題

元々『SUUMO』アプリには以下のような課題がありました。

・デザインの意思決定が属人化していることで、無駄なコミニュケーションコスト、開発工数が発生している
・意思決定方針やルールがないため、現状のトンマナをデザイナーが汲み取り属人的な判断でデザインを作成している
・賃貸、戸建て、マンション、土地などの取り扱い物件種別（以下単に種別、と呼びます）ごとにチームが存在し並行して開発を進めるため、一貫性のないスタイルが乱立し、デザイン意思決定までのコミニュケーションコストがかかり、実装面でも無駄工数が発生している
・デザインアップデートのタイミングが無い
・開発サイドのリファクタリング工数は確保されていたが、デザインアップデート工数が確保されていなかった。そのため何年も前に作られたデザインを利用し続け、UIトレンドとの乖離が広がり続けている

事業KPIの明確な効果改善企画などと比べ「プロダクトの表層デザインのアップデート」は事業優先度的に低く扱われており、放っておけばしばらくこのままの状態が続くだろうな…と不安な気持ちになったことを覚えています。

当時、私はまだ入社して半年ほどで、どうやってこの横断的なデザイン改善を推進すればいいのかよくわからないまま、上記の課題を解決しようと動き出すことになります。

『SUUMO』の新しいアプリデザインガイドライン

概要

『SUUMO』では賃貸、戸建て、マンション、土地など様々な物件種別を扱っており、それぞれカスタマーニーズや事業戦略に違いがあります。

そのため、デザインガイドラインで代表的なHuman Interface Guidelineや Material Design Guidelineのように一律なルールを策定しても運用できず形骸化してしまうことが予想されました。

そこで『SUUMO』の新しいアプリデザインガイドラインはデザインの原則や方針を示すものに留め、それらを実際の画面に反映するときには、ユーザーのコンテキストや事業優先度を考慮し柔軟に取り込むようにしました。

ガチガチのルールブックではなく、原則ベースのガイドラインとすることで、効果観点とデザイン観点の両方を柔軟に取り込めるものとしました。 

目指したこと

・ 一定のアクセシビリティ基準をクリアできる
・ デザイン意思決定の際のコミュニケーションコストを削減できる
・ モジュール・パーツの煩雑化を抑制し、実装工数を削減できる
・ OS基準に合わせ、実装工数を削減できる

● 一定のアクセシビリティ基準をクリアできる
テキストサイズ、カラーコントラスト、タッチターゲットなど、一部の項目に関してはWeb Content Accessibility Guidelinesを参考に、『SUUMO』アプリとして目指すところを明確にしました。

● デザイン意思決定のコミュニケーションコストを削減できる
アクセシビリティ基準や、カラーやスペーシングなどの基準を作ることにより無駄な検討コストやコミュニケーション削減を目指しました。

● モジュール・パーツの煩雑化を抑制し、実装工数を削減できる
カラーやアイコン、エレベーションレベルなど、物件種別をまたぐ共通項目に関してはデザイナーが利用しやすいライブラリーを整備。それによりモジュール・パーツの煩雑化を抑制し、実装工数削減を目指しました。

● OSに沿った実装で工数を削減できる
これまではiOS用に作成されたデザインをAndroidでも実装してきたため、iOS標準の挙動をAndroidで無理やり実現しようとし、工数がかさむような場面がしばしばありました。これは開発工数がかかるだけでなく、Androidユーザーとっても親切ではありません。
OSごとの２つのデザインを完全には作成・開発できないとしても、よく登場する表現に関してはOSごとに標準の挙動・モジュールを利用できるようにガイドラインで定めました。

いざ装着

表層デザイン部分のみの変更であっても、事業KPIに悪影響がないように反映しなければなりません。またデザインアップデート用の開発工数も確保していませんでした。

なので、下記のように取り込みを進めることを決め、各チームと合意しました。

・一覧ページ、詳細ページなど日々UIUX改善する画面は、その改善施策に混ぜて取り込む
・CVから遠く、普段エンハンスしないトップページはエンジニアの空きを利用して取り込む
・ABテストを実施し、KPIにネガティブな結果が出た場合は反映しない
　　事業KPI良化(100%~)→本番反映
　　事業KPI無風（100%前後)→他指標に悪影響なければ本番反映
　　事業KPI悪化(~99%)→棄却+リトライ

日々のエンハンスの中で、悪影響なく自然にデザインがアップデートされていくことのできる取り込み方です。

ABテストでどこかの指標で悪影響が確認された場合はその要因を潰しつつ、根気よくリトライを続けました。

ガイドライン整備の効果

ガイドラインを取り込み始めてしばらくたった頃、どんな変化があったのか振り返りを行いました。

その結果、新しいガイドラインで示された原則ベースでの意思決定による生産性向上、ムダ工数削減の効果を確認することができました。

私の失敗

このようにデザインや開発、コミュニケーションの無駄が削減され一定のグローバル基準を取り込むことができて素晴らしかった一方で、もっとこうすればよかった…ということもありました。

それは「ガイドラインを取り込むことがプロダクトに一貫性をもたらし、効率化を促す以外に、事業にとって良い影響があると証明しておくべきだった」ことです。

ガイドラインがデザインに一貫性をもたらし、意思決定や作業の効率化を促すことは想像しやすく、簡単に理解を得ることができましたが、これだけのメリットでは素早い装着を促すことはできませんでした。

グロースチームではABテストを主体とした効果判定を行なっており、デザイン変更がAB判定の結果を濁らせる原因になるため、事業KPI達成に向けて改善活動行う中で優先度を落とさざるを得なかったためです。

どのくらい時間がかかったかというと、デザインガイドラインを装着し始めてから１年経った今ようやく全体で取り込みが進み始めた、くらいのスピード感です。

ですが、あまりにも装着に時間がかかってしまうと、例えば装着に５年かかってしまったとしたら、最後の画面にガイドラインを反映しているときには新しいガイドラインを作っているということにもなりかねません…。

このことを通して、デザイン課題が事業に影響を及ぼすプロダクト全体の課題だと捉えてもらうためには、デザインをアップデートすることによる事業貢献、または、デザインを放置することで起こり得る棄損を明らかにし、共有することが必要だということを学びました。

もし、これらが事前にできていれば、もっとスピーディかつスムーズな推進が可能だったはずです。

学びを生かして

アプリガイドライン推進で学んだことを生かして、今後はデザイン改善による事業貢献の可視化も視野に入れ『SUUMO』のデザイン品質を日々改善していきたいと考えています。

デザイン評価を高めることの事業に対する良い影響や、逆に古いデザインを放置することの棄損リスクの調査結果も少しずつ得られてきました。

感覚的に「古いデザインより時代に沿ったデザインの方が良い」とデザイナーなら誰でも感じると思いますが、「本当に？」と聞かれた時にエビデンスを示しながら影響説明することはあまりしてこなかったのではないかと思います。

年齢や性別差はあるのか、事業特性によって差はあるのか、どんな観点に影響を与えるのか、事業KPIまたはブランド指標とはどのように関連しているのかなどなど、今まで明らかになっていなかったデザインと事業との関連性を調べるのは興味深い発見の連続です。

どのくらい放置すると影響が出るのか、ということも推進していく上で気になるポイントかと思います。

スマートフォンが出始めた頃と比べると、デザイントレンドのスパンは長くなっており、いつまでに対応しなければマイナス影響が出始める、という明確な期間を示すことは難しいです。ですが放置していてはいけないことは確かです。大きなプロダクトでは、デザインを変えていけるスピードが遅いため、なおさら未来を見据えて手を打っていく必要があると感じています。

リクルートでデザインディレクターをすることの醍醐味

私は前職でクライアントワークのアプリ開発をしていたのですが、その頃は様々なプロダクトに携われる楽しさはあったものの、請負という立場だったのでリリース後も長くプロダクトに関わっていくことが難しく、寂しさと物足りなさを感じていました。

リクルートでは大変なこともありますが、今は時間をかけてプロダクトの成長に寄り添えるというインハウスデザイナーならではの醍醐味を存分に味わっています。

リクルートには信念に基づいて業務に取り組んでいる人を応援する文化があります。困っている人や課題を見つけた時、もっとこうしたらいいんじゃないかと気がついた時、自ら周りを巻き込みながらプロダクトや組織を変えていけるのはとても楽しいです。

『SUUMO』がもっと多くの人に愛されるプロダクトになるよう、これからも試行錯誤を続けていきます。