實名點贊高德地圖的UI設計

天下 10-02

今天心血來潮，說一下車載導航的設計。

接近2年來，都是在用蘋果自帶的車載導航，雖然知道內核是高德的，但是UI還是蘋果的，由於幾乎沒有什麼競品，所以看到一些小問題，也忍忍就過了，畢竟車自帶的地圖更加難用。

車裡自帶的導航是這樣。

這個鬼樣子，基本上沒法看。

不過任何車的自帶導航都是狗屎，這個沒辦法，只能吐槽一下。

而前幾天忘了是聽廣播還是什麼文章裡面提及到，高德地圖新版支持了蘋果的carplay，我迫不及待地試試。

不廢話，直接看圖。

蘋果的，開啟地圖，未導航。

高德的，開啟地圖，未導航。

貌似沒啥區別，除了一個是按照當前路線為上展示，一個是按照東南西北的垂直展示。

蘋果的，在導航中。

高德的，導航中。

看不清楚，看這張。

高德地圖的。

對比起蘋果自帶的，信息層次清晰了非常多，除了當前路線，其它信息在可視下都最大程度弱化。

沒有對比沒有傷害。

看看蘋果的

第一點, 無關主航道的道路視覺表現過於強烈，甚至造成無法高效閱讀重要信息。

第二點,無關主航道的路名表現過於強烈，並非駕駛人核心關注信息，會造成信息干擾。

第三點,這個區塊的3個信息，視覺強度過於均等，不知道應該看10米還是看從深南科技立交橋出發，有一定的信息層次曖昧。

高德地圖版本

第一點，非導航主幹道的道路全部弱化，讓司機0.1秒就可以瞄到自己最想看到的信息。

第二點，周邊的路名，大廈名等信息，弱化，如果真需要查看，是可以認真看得到，但那時司機一眼不應該去看清這些，反而干擾駕駛。

第三點，289米強化，道路名稱弱化，這樣這個信息板塊的主次就可以更好的區分出來，而不是第一眼不知道應該看什麼信息才是最重要。

當有堵車的時候，除了導航路線出現紅色，而提示信息也變紅橙色，得到較好的重要信息傳達層次。

其實說白了，高德的UI比蘋果地圖UI 優勝的地方就是站在駕駛人的角度去重新思考信息傳達的層級，這個必須是資深UI+資深交互+資深的車載地圖的使用者才可能挖掘到這些細微優化點。

關於高德

其實我一直都沒有下載，我是前些天再重慶，和在湛江的時候，打車都會和司機聊很多，其中就聊到使用什麼地圖，我以為會是百度，單沒想到都是說用高德，作為天天以來地圖的人來說，他們的選擇應該是比較不錯的選擇，恰逢高德新版支持carplay，我才下載了一個，的確如口碑說的那樣。

關於設計車載UI

前幾年，我看到站酷一個大神設計了一套非常有科技感和質感的UI界面，甚至每一個圖標都是藝術品，然後我們一個老油條設計師群一致意見認為是垃圾，很簡單，因為裡面的字體小到看起來都吃力，按鈕也小，交互有問題，圖標裡面的示意圖形也是精美得無法辨認是什麼，對於視覺表現力來說，接近滿分，對於這個導航設計來說，不及格。

今年也看到一些車載導航設計的比賽，獲獎作品基本上都是沒用過車載導航的人，一看就是不知道車載導航最重要的是高效準確的信息傳達，而不是風格炫酷，不是圖形寫實精美，不是特效滿分。

當懂的UI設計拼特效質感，而是提高用戶體驗，那你就真的會做UI設計了。

雖然蘋果的地圖我是diss了，但是蘋果的carpaly是真心最好用的車載系統，和蘋果手機一樣，第一次用的人都可以輕輕鬆鬆掌握，而且視覺和交互都非常優秀。