【UIトレース】Yahoo乗換案内編
UIトレース第8弾。
鉄道・バスなどの交通案内サービスのYahoo乗換案内をトレース。
UIトレース
トップ画面のルート検索画面。
経由地はすぐ消しやすいように取り消しアイコンがついている。
フォームをタップすると専用の入力画面に遷移。履歴や地図上で選ぶことも可能。
なお鉄道駅のみならず施設名などでも検索可能。
リストで表示されるルート検索結果画面。
Tabの左から”速・楽・安”の観点で並び替えされる。アイコンは候補にも表示され3つを満たしていると早く、楽で、安い手段となる。
出発時間の前後の列車も選択できるのはなかなかに便利。
アイコンのフォントも変えているのが面白い。
候補ルートをタップすると時系列に沿ってルートが表示される。料金、所要時間、ラインカラー、サインシステム、発着番線なども表示され一通りの情報が網羅されている。
（今気がついたが、「乗り換え案内」なのに”乗り換えなし”で行けるルートを選んでしまった…）
上部のアクション一覧は、「この画面の情報」を保存したり共有する内部的なもの。
下部のアクション一覧は、アラートや迂回ルートの検索など「この画面外」に対するもの。性質が違うので場所が違う。
フォントサイズ・カラー・余白など
少し種類が多い印象。一番大きいのは候補ルートの番号で、
グリーンを主とした配色。黒の色は純粋な黒（#000000）。
振り返り
よく使うサービスだが、本当に使いやすいと常々感じている。
特に早い・楽・安いの３つの観点でルートを提示しているのは、検索時の状況によって最適なルートを選択できるので助かる。
OOUIを学んでから、オブジェクトに表示させる情報の取捨選択を考えるようになった。今回は特に過不足なく表示しているように思ったが、現在の列車の運行状況（〜分遅れ、あと〜分で到着…など）を追加してもいいかもしれないと思った。
と…思っていたら執筆中にアップデートがありこれが見事に追加されていた。てぇしたもんだ！😄
この記事が気に入ったらサポートをしてみませんか？