ヤフー株式会社 テクノロジーグループ サービス統括本部 PIM本部
／デザイナー 星野美佳氏
現在はYahoo!メール WebのUI／UXを担当。兼務でYahoo! JAPANの新機能・サービスをリリース前にウォークスルー形式でチェックする「品質管理コミッティ」の運営を担当。
趣味はものづくり、漫画・映画・美術鑑賞など。よく使うソフトウエアはSketch、Photoshop。
ヤフー全体やアプリ版Yahoo!メールとの「一貫性」の確保が課題に
2021年9月に実施された「PC版Yahoo!メール」のリニューアルは、同サービスの大規模な改善としては、実に10年ぶりだったという。PC版Yahoo!メールは、日本におけるインターネットサービスの黎明期である1999年に提供を開始。現在では、月間2400万ユーザーに利用されている、国内有数の大規模ネットサービスの一つだ。
前回のリニューアルから、長い時間がかかった主な理由として、星野氏は「規模の大きさ」と、長くサービスを提供してきたことによる「構造の複雑さ」を挙げる。
「PC版Yahoo!メールは、ユーザー数が非常に多く、それゆえに、変更に伴う影響範囲も極めて大きくなる。また、長い歴史の中でサービス自体も多機能で複雑な作りになっており、近年ではスマートフォンアプリ版に、開発スピードの面で追従できない状況が続いていた」（星野氏）
そうした状況の中、Web版とスマートフォンアプリ版（以下、アプリ版）との間で、UIや機能面での差異が大きくなり、Yahoo! JAPANが提供する他のサービスとの、デザイン面でのかい離も進んでいたという。
Yahoo! JAPANでは、2016年に「ヤフーらしさ」をビジュアル面から表現することを目指した「Yahoo! JAPAN Visual Identity」を定義している。Yahoo! JAPANの各サービスは、この定義に準じたデザインで統一が進められてきたが、PC版Yahoo!メールについては対応が遅れ、アプリ版との間でも、デザインの一貫性が失われている状況だったという。
PC版Yahoo!メールのこうした「課題」を解消できる機会をうかがう中、Yahoo! JAPAN全体で、改善作業を容易にするための技術刷新を図る取り組みがスタートする。PC版Yahoo!メールは、この機会に、よりモダンな開発環境への移行と、特にアプリ版との機能面、デザイン面での一貫性向上を目指したリニューアルを実施することになる。
PC版Yahoo!メールがリニューアルで目指した「4つの改善ポイント」
リニューアルでの改善ポイントに挙げられたのは、大きく「全デバイスのUI／UXを統一」「Yahoo! JAPAN全体のデザイン方針への追従」「アクセシビリティの向上」「Webメールアプリとしてのトレンドへの追随」の4点だ。
「全デバイスのUI／UXを統一」するというのは、主にiOS／Androidアプリ版Yahoo!メールと、PC版との使い勝手の統一を指す。色合いやアイコンのようなデザイン要素だけでなく、機能名やその説明文についても、全デバイスで統一していくことに取り組んだ。これまでアプリ版でのみ利用できた「メール一覧の文字サイズ変更」「メール移動時のフィルタ自動作成」といった機能も、PC版に取り入れた。
「Yahoo! JAPAN全体のデザイン方針への追随」は、「Yahoo! JAPAN Visual Identity」や、UIガイドラインに準拠したデザインの導入だ。各ガイドラインを参照し、定義がない要素については、ガイドラインのとりまとめを行っているチームにリクエストを出し、新たに追加してもらうプロセスを踏んだという。一方で、リニューアルに伴う既存ユーザーの違和感を減らすため、「既存機能や要素の配置は可能な限り変更しない」「色合いについては、旧デザインに準じたものを『きせかえテーマ』として提供する」などの対応を行った。
多くのユーザーが日常的に利用するツールとして配慮すべきポイントとして「アクセシビリティの向上」にも取り組んだ。W3Cの提唱する「WCAG（Web Content Accessibility Guidelines） 2.0」へ準拠するよう、コントラストなどを調整した上で、ヤフーに在籍する色弱の社員に新しいデザインを見てもらい、そのフィードバックも反映したという。メールへの「スター」に分かりやすく縁取りをし、オンとオフがわかりやすくなるように色を変更するなども、その一環として実装された。
4つ目のポイントとなる「Webメールアプリとしてのトレンドへの追随」では、他社のWebメールサービスなども研究しながら、現在、標準的となっているモダンなデザインを取り入れた。例えば、従来のPC版では、画面上で一覧できるメールの件数をより多くすることを目的に、マージンやパディングなどでタイトなデザインが行われていたが、リニューアルでは、それらにゆとりを持たせることで、読みやすい画面にすることを重視した。また、ユーザー操作の結果を知らせるフィードバックの表示も、ポップアップでより分かりやすく表示するようにしたという。
