Google Play Best of 2023受賞 ユーザーの安全をデザインするYahoo!カーナビ
こんにちは、Yahoo!カーナビでデザインを担当している石沢優衣です。
この度Yahoo!カーナビは「Google Play Best of 2023 生活お役立ち部門」の大賞を受賞しました。生活お役立ち部門は「毎日の生活をもっと快適で効率的にする、何度も使いたくなるような」アプリに与えられる賞です。
今回は、そんなアプリをデザイナーがいつもどのように考えて作っているのかをご紹介します。
Yahoo!カーナビとは？
今年サービス提供開始から10年目を迎えるカーナビアプリです。
慣れない道でも安心して運転できるよう広い道を優先案内したり、交通規制や渋滞を回避して計画通りに目的地に辿り着けるルートを提案します。
運転中に使うアプリをデザインするということ
カーナビアプリが他のアプリと違う所は、ユーザーがソファに座ってのんびりしている時ではなく、素早く周囲の情報を把握し判断を行わなければいけない車での運転中に使用するアプリだということです。
そのため、UIもそのシチュエーションで便利に利用できるかという事を検討して作られています。
1.瞬時に情報を判断できるUI/VUI
運転中はスマートフォンの画面を長時間注視する時間はありません。
ルート案内中は文字や音声案内で素早くユーザーに情報を伝える必要があります。
LINEヤフーにはUIデザインガイドラインがあり、文字サイズの指定もなされていますが、Yahoo!カーナビで使用している文字サイズは車内でパッと見ただけでも文字が判別できるようにガイドラインよりも少し大きめのサイズを採用しています。
特に、ルート案内中は地図上の文字やアイコンサイズが大きく表示されており、通常の地図と比べるとその大きさがわかりやすいです。
また音声案内は、ルート案内中にどのタイミングでどんな発話がなされたらユーザーがスムーズに運転できるのかなど、タイミングを意識して設計されています。
高速道路走行中なら、一般道よりも車の速度が速いため、一般道走行中よりも遠い曲がり角の手前2km、1km、500m、100m付近の計4回に分けてアナウンスがなされます。
さらにより車内で利用しやすいよう、Yahoo!カーナビは昨年Apple CarPlayに続いてAndroid Autoにも対応しました。
Android Autoとは、車載ディスプレイにスマートフォンアプリを繋いで大画面でナビゲーションができる機能です。ルート案内を利用しながら音楽を聴いたり音声通話を行うこともできます。
現在はシステム上の制約が多くアプリに比べて機能も少なめですが、その中でも必要不可欠な機能をシンプルに見えやすく表示することを心がけています。
2.車の世界を意識した色選び
Yahoo!カーナビはアプリで使用するカラーパレットにもこだわっています。例えばLINEヤフーといえばブランドカラーの赤を思い浮かべる方が多いかもしれませんが、交通標識や信号など、車の世界で赤は「止まれ」など危険を表すものであるため、アプリ内で赤色を使うときは慎重にしています。
また緑は高速道路や渋滞の有無などを示すものなので、こちらも多用はしません。
通常、Yahoo!カーナビではタップできるボタン、選択中のボタンなどアプリを開いてからナビを開始するまでの主なアクションとなるボタンを青色に揃えることで、ユーザーがナビを開始するまでの導線をわかりやすくしています。
3.どんな状況でも見やすい地図
Yahoo!カーナビの地図には通常モードと運転中モードが存在します。
これは運転中とそれ以外の場合で地図に表示するべき情報の優先度が違うと考えているからで、例えばルート計画中は自宅ピンや検索結果などのピンが前面に表示されますが、運転中はより必要な情報である規制アイコンやオービスアイコンなどが上のレイヤーに表示されます。
また地図の色味は昼モードと夜モードのパターンがありますが、夜モードの色は明るすぎず、しかしルートや標識、信号や渋滞情報などの情報がしっかり見えるように何度もチューニングされています。
私も地図の色の改善を行ったことがありますが、夜中に部屋の電気を消して数十分間目を慣れさせ、夜の車内を想定した環境で高速道や渋滞表示、信号や地名などの情報のバランスを見ながら色を調整しました。
4.走行テストで実機確認
このようにYahoo!カーナビデザイナーは様々な検討をし、安全面に配慮しながら日々UI/UXを磨いています。しかしカーナビは、実際に運転中に利用してみて初めてテストができるアプリです。
Yahoo!カーナビでは、デザイナーも全員定期的に走行テストに出てアプリのUI/UXをチェックしています。
実際にこれまで行った走行テストでも、「走行レーンの矢印のサイズが思っていたより小さいよね」「ルート線の色がトンネル内で見づらいかも」など様々な改善点が見つかり、社内に戻って再検討・修正を行ったことがあります。
走行テストで走るコースは東京都内、名古屋、大阪などさまざまです。私はこの間オフィスのある赤坂から横浜のみなとみらいまで首都高を経由するコースを走りましたが、今回も現状のアプリの課題がたくさん見つけられました。これを活かして次の機能改善を行なっていく予定です。
おわりに
今後もYahoo!カーナビデザイナーは、皆さまに安全で楽しく充実したカーライフをお届けするために、より一層アプリのUI/UXデザインを進化させていきたいと思っています。
普段皆さまからお寄せいただくアプリのご指摘・ご要望フォームから、またInstagram等のSNSのコメントからの貴重なご意見も全て参考にさせていただいております。
Yahoo!カーナビの今後をお楽しみに。
取材依頼等のお問い合わせ
LINEヤフーDesignは随時、取材のご依頼をお待ちしております。公式XのDMにお問い合わせください。
https://twitter.com/lydesign_jp