他來了～ 他來了～ 一個月時間的打磨，不知道熬了多少次通宵了

前沿：

為了輸出這篇競品分析文章，我也是夠拼了，利用周末的休假時間，預約這四家 4S 店進行試駕，并進行對車輛的拍照，和銷售對話的錄音等獲取到一手資料，再去做分析、總結這一次的探索。

大家很好奇我為什么想做一份 HMI 的競品分析呢？ 因為我想做第一個發(fā)表實戰(zhàn)演練的 HMI 競品分析報告，大家可以去搜索一下百度、知乎都沒辦法搜索到直接可用的信息，我在寫每一篇文章的初衷，就是想彌補 HMI 行業(yè)的內(nèi)容，將繁瑣的知識通過我寫的文章，能夠讓我的讀者們通俗易懂，能夠敢于跨入這個行業(yè)中去。

這篇文章的主要的核心就是實戰(zhàn)演練為主，有關于競品分析的基礎認知我這邊就不過多和大家闡述了，競品分析的方法論等等內(nèi)容，我就不一一列舉，我會直接穿插到這篇文章中去，作為實戰(zhàn)演練的一部分。

剛開始我和大家一樣，想要做一份競品分析報告但由于實戰(zhàn)經(jīng)驗不足，就會打開各大網(wǎng)站搜索相關的信息，但關于車載 HMI 的競品分析少之又少，根本毫無頭緒，因此我就立馬轉(zhuǎn)換策略，先從競品分析基礎知識開始學習，再去結合 HMI 的內(nèi)容去實施，輸出報告。

我想很多設計師也有一個這樣的需求，就是想做一份側重點在于設計的競品分析報告，而不是長篇大論什么用戶體驗五要素，戰(zhàn)略層和范圍層這些都是我們沒有話語權去定奪的，只能去參與會議聽取內(nèi)容而已，但不代表它們對于我們設計師不重要，除非你不想當“將軍”。所以這篇文章實戰(zhàn)演練的側重點會偏向于站在設計師的角度去考慮做一份 HMI 競品分析報告，本文將從表現(xiàn)層、框架層、結構層出發(fā)。

我的宗旨就是 → 所謂一份好的競品分析報告能夠達到易讀易懂、簡單直接即可，能說明問題就行。

那就開始吧～ 給我可愛的小讀者們直接上干貨，走 ni～

設計師需要做的任務

我們來看一下設計師是在哪個階段需要參與到競品分析中去，設計師的競品分析和產(chǎn)品經(jīng)理輸出的競品分析側重點會有所不同，除了確定好競品，了解他的商業(yè)背景后，設計師會從用戶路徑拆解和交互維度分析，最后再視覺層分析，就是所謂的 #用戶體驗五要素# 中的表現(xiàn)層、框架層、結構層。

產(chǎn)品研發(fā)過程：一般是項目開始立項后 → 接下來是項目需求輸出（PM） → 再到后來就是產(chǎn)品設計（UX/UI） → 后續(xù)就是研發(fā)開發(fā)上線（程序） → 最后安排期 HMI系統(tǒng)升級迭代（OTA升級）。

競品分析注重點

先打個預防針 一開始做競品分析報告，我們應該更注重的是有針對性和目的性的對比。

在做對比內(nèi)容的時候，就是要帶有強力的目的性的，然后在針對功能和界面進行分析。做競品分析報告切記不能在沒有目的的情況下去做分析，如果這樣去做分析，最后分析的內(nèi)容深度會相對比較欠缺些。

所以分析競爭對手產(chǎn)品的整體定位、產(chǎn)品策略，找到新的切入點，切入點也可以從產(chǎn)品架構、交互設計、視覺表現(xiàn)等方面來進行，讓自己的產(chǎn)品有著合理的規(guī)劃。注意點：既然我們選擇去做了分析，那必然就要去得出結論。不能將競品分析寫成產(chǎn)品分析或者是說明書。

我在后半段競品分析實戰(zhàn)演練中，會加入很多結論和個人的想法

競品的選擇

就是和自己做的產(chǎn)品產(chǎn)生直接競爭關系，在使用場景、產(chǎn)品的功能點和目標用戶群體一致，這次競品分析報告中就著重做介紹，直接競品就是一些車廠比如特斯拉、小鵬、蔚來、理想、比亞迪等頭部的新能源汽車品牌。

1. 間接競品

產(chǎn)品在功能方面與你是一個互補的關系狀態(tài)，市場的目標用戶群高度類似，后續(xù)可能會搶占你的市場份額，所謂敵人的敵人就是朋友，因此在你的項目進行中也可以選擇與他達成合作關系，在 HMI 行業(yè)中有很多就是這樣的一起創(chuàng)辦一個聯(lián)合研發(fā)中心。

舉個例子：

V2X 領域（車用無線通信技術）

這是國內(nèi) TOP → 梧桐車聯(lián)的TINNOVE V2X、東軟集團的VeTalk V2X、中科創(chuàng)達的C-V2X等

V2X 是我第一次提到，那我就簡單的介紹一下，所謂 V2X，vehicle to everything，即車對外界的信息交換。車聯(lián)網(wǎng)通過整合全球定位系統(tǒng)（GPS）導航技術、車對車交流技術、無線通信及遠程感應技術奠定了新的汽車技術發(fā)展方向，實現(xiàn)了手動駕駛和自動駕駛的兼容，通俗易懂來說，搭配了該系統(tǒng)的車型，在自動駕駛模式下，能夠通過對實時交通信息的分析，自動選擇路況最佳的行駛路線，從而大大緩解交通堵塞。除此之外，通過使用車載傳感器和攝像系統(tǒng)，還可以感知周圍環(huán)境，做出迅速調(diào)整，從而實現(xiàn)“零交通事故”。比如：如果行人突然出現(xiàn)，可以自動減速至安全速度或停車。

如何收集車載競品資料

又到了我強項的領域了 “搜商” 車載的競品分析收集的數(shù)據(jù)、行業(yè)資訊與其他的會往往不同，由于他的深度比較廣想要精通一個內(nèi)容，需要搜尋很多資料作為參考依據(jù)，這個我深有體會，假設我想了解輔助駕駛這塊內(nèi)容，搜索出來的信息甚至比我大學讀過的書還多，好了，介紹一下我搜索的信息的好辦法。

1. 預約 4S 門店試駕

想要拿到一手資料，體驗最新 OTA 升級相關內(nèi)容，那么你就跟我一樣去預約 4S 店去試駕，這是最簡單最直接，效果也是最好的，但是需要復盤的內(nèi)容和前期準備工作會比較繁瑣，文章前面也有提到，一定要帶有目的的去做事情，所以在去 4S 店的時候，提前要做好需要體驗的內(nèi)容的記錄，別到店里面毫無頭緒的去體驗。4S 店銷售員也是一個突破口，他們要完全了解汽車才能創(chuàng)造銷售額，因此他們對于銷售的汽車肯定你比還要了解透徹，可以通錄音那道你想到資源（被逮到，別說我教你們的，可別出賣我啊）。4S 店還有拿到資料的地方就是他們的使用手冊。

2. 汽車測評視頻

查看專業(yè)的測評人對于車輛的測試，他們會通過駕駛過程中做出自己的理解，站在用戶角度反饋問題，對于可用性測試也提供很多數(shù)據(jù)參考價值。國內(nèi)想了解更多的測評可以在 B 站進行檢索，甚至連抖音也是一個不錯的選擇。國外相對較為資深的測評 Chris Harris、Grand Tour、TopGea。

3. 下載相關 - APP

這個不難理解，首先把車廠發(fā)布的 app 都下載下來，為啥？因為他們有社區(qū)，本身車廠在推出 OTA 升級或者新品發(fā)布的資訊都會第一時間發(fā)送，還有很多用戶會通過社區(qū)進行交流、碰撞出很多東西，他們也會寫很多關于駕駛的體驗報告，這些都是值得你去拿去做分析報告的。還有第三方的 app，比如：→ #新出行 #蓋世汽車 等。

4. 其他獲取途徑

汽車官網(wǎng)都會將該品牌全系列在售車型內(nèi)容都展示出，從車輛信息參數(shù)、亮點功能介紹、再到設計細節(jié)都有展示，還可以在官網(wǎng)咨詢客服小姐姐，她們也會為你解答一些內(nèi)容，親測有效。最后別忘記給人家五星好評。還可以參加車展，這是能收集到很多素材的重要關鍵點。其次就是就是國內(nèi)做的相對較好的平臺知乎、人人都是產(chǎn)品經(jīng)理、站酷等一系列。最后就是微信公眾號，這邊我推薦幾個不錯的賬號，# HMI 設計 #Apollo 智能駕駛體驗設計中心 #普修科技 #screens 德國 #未來出行實驗室 #智能座艙與自動駕駛 # #King 設計研究所（哈哈哈 這是我的賬號）

從設計師角度做競品分析

進入今天的主題，根據(jù)上述所講內(nèi)容，我們設計師要做的競品分析內(nèi)容已得到明確的方向。

1. 明確競品選擇

我們將選取的四臺車是新能源車領域最有代表性、關注度也最高的特斯拉、蔚來、理想以及小鵬四個品牌各自的代表車型。分別是特斯拉 Model 3、蔚來 ES6、理想 ONE 以及小鵬 P7。

另一方面，目前在座艙車機在屏幕規(guī)格上也分為兩大派，分別是橫屏布局和豎屏布局。這次選擇競品的 4 款車型中。特斯拉、小鵬和理想采用的是橫屏的布局，唯獨蔚來采用的是豎屏的布局。

特斯拉老款的 Model S/Model X 車型、小鵬新款 P5、老款 G3 也均為豎屏，這次分析主要選擇熱門車型來作為競品分析，其余車型的話就不做過多分析啦，接下來我們順便介紹一下熱門車型屏幕的分辨率：

• 特斯拉 Model 3 中控屏：1920x1200
• 蔚來 ES6 中控屏 ：1600x1400 / 儀表盤：1920x720
• 理想 ONE 中控屏：2608x720 / 儀表盤：1920x720 / 副駕駛娛樂屏：1920x720 功能控制屏：1280x720
• 小鵬 P7 中控屏：2400x1200 / 儀表盤：1920x720

車型屏幕種類案例通過 Yes/No 羅列出熱門車型屏幕的分類，儀表盤、中控屏、副駕駛娛樂屏、HUD、后排娛樂屏、功能控制屏（俗稱中控臺屏）

說句題外話，新款的 Model S / Model X 是真好看，他們的屏幕也該為橫屏，還增加后排的娛樂屏... 比 13 還香。

競品交互分析

車機交互體驗這個部分，建議只分析核心功能的交互體驗。如果想要詳盡到各個模塊，應該與交互設計師協(xié)作完成。通過分析，看看競品的在交互設計上有沒有值得我們借鑒的地方，我們是否可以做到更好。我是交互/設計/動效都要做 ，下面我就撿一些比較重要的功能給大家分析一下。

1. 空調(diào)交互方式 VS 大比拼

車輛中空調(diào)是我們最常操作的一個功能，我們把 Model 3、ES6、P7、理想 ONE 這四輛車空調(diào)的操作交互方式拿出來做一下對比，結合中控屏幕中的交互、語音交互、方控操作三個維度來綜合進行分析。

2. 中控交互分析

針對于大屏觸控來說，我們怎么才能把空調(diào)的交互方式做得既安全還便捷呢？ 一定要記住安全是考慮的第一要素。

通過上車操作對比發(fā)現(xiàn)，這四輛新能源汽車在空調(diào)控制設計上面都是相同的想法，就是在首頁都有相對應空調(diào)控制區(qū)域，針對這種交互的設計方式非常的贊同，因為這不需要進入二級菜單就可以直接操作空調(diào)，并對其進行滑動操作調(diào)節(jié)溫度變化。

我們看一下這四輛車空調(diào)的具體的實際情況，Model 3、ES6 的中控都是有固定的空調(diào)快捷操作區(qū)域，理想 ONE 則是放在中控屏幕下方的控制屏上，小鵬的 P7 是做在屏幕的左側，這也是方便駕駛員的一個操作便捷性，也是符合我們一開始所說的便捷。除了小鵬 P7 外 其余三個車還可以直接對其進行前后風擋進行加熱（專業(yè)術語 → 前/后除霜）

接下來再針溫度對中控屏幕交互手勢進行做一個對比

Model 3 和蔚來 ES6 交互方式一致在溫度圖標區(qū)域進行左右滑動，dock 欄的風量就不好直接操控了，需要點擊后再空調(diào)彈窗頁面進行增減調(diào)節(jié)，在中控操作便捷性就不如蔚來 ES6 和理想 ONE 了。

ES6 空調(diào)手勢操作調(diào)節(jié)溫度和調(diào)節(jié)風量都是左右滑動，這邊就有人問了，在同一區(qū)域不會重復手勢操作么？蔚來 ES6 的解決方案是 → 在需要調(diào)節(jié)功能的圖標觸碰區(qū)域不松手對其進行橫向左右滑動，如需要再對風量進行調(diào)節(jié)，就松開手再觸碰風量圖標區(qū)域進行滑動即可。

小鵬 P7 空調(diào)中的溫度調(diào)節(jié)交互方式，是通過長按左側的調(diào)節(jié)溫度的區(qū)域后，出現(xiàn)調(diào)節(jié)溫度滑塊的區(qū)域進行上下拖動，P7 風量調(diào)節(jié)在左側 dock 就沒辦法進行調(diào)節(jié)，只能在方向盤進行控制風量的增減（這個在后面會細致的提到這邊就不做過度解讀）

理想 ONE 的空調(diào)溫度調(diào)節(jié)和風量增減在這四款車型中是我最為喜歡的，為什么這么說呢？因為它可以在任意區(qū)域進行盲操，交互方式也很清晰，上下滑動是溫度調(diào)節(jié)，左右為風量調(diào)節(jié)，并且還有增減時候的聲響，這是觸控給予反饋很好的交互點，所謂的及時反饋感。

針對中控的交互體驗的感覺我給 Model 3、ES6、P7、理想 ONE 做一個排名

• 最佳 NO：1 → 理想ONE （操作區(qū)域大，在安全和便捷性都排名四款車第一）
• 還行 NO：2 → 蔚來ES6（調(diào)節(jié)溫度和風量都可以在dcok 滑動完成，操作區(qū)域可觀）
• 其次 NO：3 → 特斯拉Model 3（調(diào)節(jié)溫度在dcok 滑動完成，操作區(qū)域可觀，風量則需要在其他頁面完成）
• 最后 NO：4 → 小鵬P7 （需要長按再進行操作溫度的滑動，長按的交互方式在車機是一種相對不好的交互方式）

3. 語音交互分析

特斯拉 Model 3 空調(diào)的語音交互，調(diào)節(jié)溫度只能做到調(diào)整到原先設定好的默認值溫度。

缺點：如需想要再次調(diào)節(jié)溫度高低，只能通過對中控屏下方的 dock 欄調(diào)節(jié)溫度區(qū)域進行滑動。

蔚來 ES6 在體驗的過程中，基本的功能都能很好實現(xiàn)，比如加熱座椅、通風座椅，還有就是空調(diào)的控制等等，這些常見的操作都能很好完成。值得一提的是打斷語音播報直接發(fā)出下一步指令以及上下文語義銜接等功能也都是支持的。

缺點：但不支持局部功能的免喚醒操作，每次使用語音控制都得呼喚一遍“Hi，NOMI”

小鵬 P7 全場景語音控制也選擇了與思必馳合作開發(fā)語音識別的部分，語義分析則是小鵬自己的團隊進行研發(fā)的，正確識別率達到 80%。在對于空調(diào)的控制方面也是不錯的，可以精準的說將溫度調(diào)到多少度，如果想繼續(xù)調(diào)整說：“好熱啊、再幫我下降 2 度”它也可以完成此項操作，如果你說將溫度調(diào)整到 35 度，這個已經(jīng)超出了 P7 最高溫度 32 度，就怕語音形象給你來一句：“我怕你是有大病吧 ”

暫時沒啥缺點，就是識別率需要再提高一些，我體驗下來覺得他們的 TTS 反饋還挺豐富的，車聯(lián)網(wǎng)中的名詞，T 一般代表的就是 to 的意思，其中 STT 是語音轉(zhuǎn)文字過程，而 TTS 只是文字轉(zhuǎn)語言過程，簡單來說，你可以去看目前比較成熟的梧桐車聯(lián) TINNOVE，能夠支持 40 多種語言意圖操控，并做出類人類的智能化反應，就是 STT 和 TTS 通力合作的一個結果。

理想 ONE 語音控制溫度我很是喜歡，比如你可以說，前排溫度調(diào)整到 23 度，后排只要跟說我也要就可以同步進行調(diào)溫度，這個就是他 OTA2.2 升級的功能四音區(qū)鎖定，所謂的四音區(qū)鎖定就是理想同學此前已經(jīng)支持車內(nèi)前后左右四個音區(qū)識別控制功能，但這也帶來一個問題：熊孩子在后面亂指揮怎么辦？理想同學支持除主駕之外任意一個音區(qū)的識別關閉。家長只要在前面說「關閉后音區(qū)」、「不要聽左后音區(qū)」就能關閉響應位置的語音識別，避免熊孩子搗亂， 讓你皮。

缺點：對于方言的識別率還有待提高。

4. 總結一下

個人傾向于小鵬 P7 和理想 ONE 的語音控制，他們體驗的感覺很棒，另外從空調(diào)的語音控制來看，特斯拉 Model 3、蔚來 ES6、小鵬 P7、理想 ONE 都是支持語音控制空調(diào)的，但是特斯拉 Model 3 只能設定最常用的溫度和風量，其他三種車都可以設隨意的說設定多少溫度、調(diào)整風向和風量、還可以切換內(nèi)外循環(huán)，識別率成功率都非常不錯，可以不用操作中控屏幕，大大的提高了安全駕駛性。但現(xiàn)在很多人不習慣用語音來操作車機系統(tǒng)，所以單方面從中控的交互設計內(nèi)容，可以偏向于理想 ONE 多參考一下，增大操作區(qū)域，減少交互手勢，對于復雜的手勢操作盡量避免不使用。方控控制空調(diào)這內(nèi)容會連通方控整個模塊一起講，就不單獨這邊再開一小段了。

競品方控分析

1. 特斯拉 Model 3 方控

左側功能為：控制音量 / 切換音樂 / 調(diào)節(jié)后視鏡位置 / 調(diào)節(jié)大燈的角度 / 調(diào)整方向盤的位置

1. 控制音量：直接按下滾輪可以靜音或者取消靜音
2. 切換音樂：向左撥動切換上一首歌曲，向右撥動切換下一首歌曲
3. 調(diào)節(jié)后視鏡：進入車輛控制 → 快速控制 → 后視鏡 ，即可使用左側滾輪調(diào)節(jié)后視鏡
4. 調(diào)整方向盤位置：進入車輛控制 → 快速控制 → 調(diào)整 → 方向盤 ，即可使用左側滾輪調(diào)節(jié)方向盤，上下滾動滾輪來調(diào)整方向的高度 / 傾斜角度，左右滾動滾輪用來拉近或者遠離方向盤
5. 調(diào)整大燈角度：進入車輛控制 → 維護 → 調(diào)整大燈 ，即可使用左側滾輪調(diào)整大燈角度

切記注意點，特斯拉的車子出場時就已經(jīng)將大燈調(diào)整到最佳位置，建議不要隨便的嘗試調(diào)整，讓們安全駕駛，遠離事故。

右側功能就相對減少了：語音指令 / 調(diào)節(jié)設置速度 / 調(diào)節(jié)跟車距離

1. 語音指令：按下右側滾輪，就能啟動語音控制，說出相對于的指令，例如：將溫度調(diào)整為 XX 度（這個溫度的值也是之前設定好的默認值，Model 3 方控無法做到調(diào)節(jié)溫度增減功能，特斯拉的設計理念是做減法，所以他在方控沒有做過多復雜的一些操作）
2. 調(diào)節(jié)設定速度： 主動巡航情況下，上下調(diào)整車速；可以快速調(diào)整單位為 5km/h，慢速度調(diào)整單位為 1km/h
3. 調(diào)整跟車距離：右側滾輪左右調(diào)整時可以選擇設置 1-7 范圍的跟車距離

還有一個隱藏功能，我來悄咪咪的告訴你們：

在駐車狀態(tài)下，長按方向盤兩邊的滾輪按鈕，直到中控屏幕變黑，這樣就完成了一次重新啟動。

2. 蔚來 ES6 方控

蔚來 ES6 方向盤左側的多功能按鍵，主要負責 ACC 自適應巡航功能，它的布局相對另外一款車 ES8 有所簡化按鍵也變得更多，和特斯拉的設計理念也基本吻合，盡量的去做減法，去繁為簡，增加按鍵的操作面積也是為了安全駕駛。

左上角 → 增加巡航車速或恢復自適應巡航 / 左下角 → 減小巡航車速

右上角 → 增加跟車距離 / 右下角 → 減小跟車距離 / 中間 → 激活或退出自適應巡航

蔚來 ES6 方向盤右側的多功能按鍵，主要負責娛樂系統(tǒng)以及語音、電話功能的控制。其中上下按鍵負責音量，左右鍵為切歌。

左上角 → 語音功能鍵 / 左下角 → 方向?qū)Ш芥I

右上角 → 菜單鍵 / 右下角 → 方向?qū)Ш芥I / 中間 → 圓圈為確認鍵、兩邊左右側為切歌

3. 小鵬 P7 方控

小鵬 P7 方向盤左側，上下按鍵為控制車輛空調(diào)溫度增減， 左右是來調(diào)節(jié)空調(diào)的風量大小

左下方為語音喚醒按鍵，按下去之后可以跟小 P 進行對話，右側的小鵬 logo 按鈕則為一個燈語的系統(tǒng)

觸摸左側旋轉(zhuǎn)來可以進行切換儀表盤左側的顯示內(nèi)容，內(nèi)容有車輛信息、音樂、胎壓、行駛里程等。

右側上下按鍵為音量的調(diào)節(jié)大小，左右按鍵為切歌 ， 左邊是返回按鍵，右邊則是靜音按鍵，

觸摸右側旋轉(zhuǎn)來也可以進行切換儀表盤右側的顯示內(nèi)容。

4. 理想 ONE 方控

我這邊所講的是理想 ONE 發(fā)布的最新款的車型

1. 向上短按喚醒語音/結束對話。 向下短按接聽電話、長按掛斷電話
2. 長按進入儀表頁面內(nèi)容， 向上/向下滾動滾輪切換頁面。退出儀表頁面內(nèi)容后，短按靜音/取消靜音；向上/向下滾輪滾輪增加/減少音量
3. 向上/向下短按切換下一首/上一首

1. 自動泊車啟動后，向上短按開始泊車/繼續(xù)泊車 ； 自動泊車未啟動，向上短按開始自動泊車；向下短按激活自定義鍵。
2. 長按進入儀表屏頁面內(nèi)容，向上/向下滑動滾輪切換頁面。退出儀表屏內(nèi)容后，向上/向下滑動滾輪，巡航車速增加/減少 1km/h；短按設置巡航車速為道路限速。
3. 向上短按執(zhí)行 NOA 系統(tǒng)推薦變道，向下短按取消 NOA 系統(tǒng)推薦變道

5. 總結一下

方控作為車內(nèi)交互的重要硬件，現(xiàn)在市場上面還是多數(shù)車型以硬按鍵為主，將常用的功能移植到方向盤上面，比如快速的調(diào)節(jié)音量大小、切歌等功能，也有調(diào)整駕駛模式跟車距離等等。按照現(xiàn)在方向盤的進展沒辦法滿足于智能化和數(shù)字化趨勢的轉(zhuǎn)變，很多車廠也在開始嘗試制作出前瞻性的智能化和數(shù)字化的方向盤，如果將中控可移植到方向盤上功能變的越多，那隨之而來的就會減少駕駛員的注意力分散，從而可以提高安全駕駛的可能性。

PS：有可能在后面對于未來前瞻性的方向盤有文章安排計劃。

競品 UI 界面分析

在熱門車型 UI 界面中挑選對比，在分析完熱門車型頁面設計的內(nèi)容后，我會呈現(xiàn)一些自己的 idea，這些純屬個人想法，并未用到實際項目中。下面我會從單個功能 → 對比體驗，單個界面 → 從界面內(nèi)容、交互操作、信息位置、信息數(shù)量、色彩使用、界面風格，多個界面從 → 功能的邏輯、用色統(tǒng)一、情緒引導出發(fā)闡述。

當有人質(zhì)問你為什么要這么設計的時候，你得有理可循，沒有理論支持的設計如同一盤散沙，一擊就潰，這就是為什么我們設計師需要做很多的分析、調(diào)研等等一系列的準備工作。

1. 主界面分析

特斯拉 Model 3、蔚來 ES6、小鵬 P7 的主界面以地圖方式呈現(xiàn)，而理想 ONE 是有傳統(tǒng)上主界面的。

我們來分析一下特斯拉 Model 3 的首頁，既然取消掉儀表盤，取而代之的是占用中控左側 1/3 區(qū)域作為儀表盤的功能頁 + 右側 2/3 區(qū)域則作為車機系統(tǒng)頁面，將使用頻率較高的導航作為主界面，頂部的狀態(tài)欄基本都可以進行點擊操作。

蔚來 ES6 也沿用將導航作為主界面和 Model 3 不同之處，是增加了兩個卡片，靠近主駕駛是常用的音樂卡片，旁邊則是車輛信息卡片。

小鵬 P7 也是導航作為他們的主界面，和蔚來 ES6 不一樣之處就在于小鵬 P7 的常用卡是放在中控左側欄，卡片的功能有：導航、音樂、電話、消息中心，頂部的狀態(tài)欄都可以進行點擊操作。

理想 ONE 采用的是橫屏布局，它的主界面采用卡片式的功能頁面設計，理想 ONE 中控屏左側顯示的是時間以及 5 大功能鍵，右側是各個常用的功能卡片頁。我們很多項目的主頁也是采用這種卡片式設計。

延展一下小知識點，敲重點了，提高注意力聽一下

對于汽車而言，卡片式設計有兩大好處

1. 把學習成本降至最低；
2. 增加的接觸面積讓駕駛的時候，誤觸率也降到最低，給到用戶帶來最為直觀的體驗就是簡單易用；

總結一下

這邊對照分析的 4 款車型首頁的功能：車輛信息 + 導航（Model 3） / 卡片 + 導航（ES6 +P7） / 卡片（理想 one），卡片樣式的設計，極大了提高對于功能的操作性，原本需要點擊功能進入二級頁面，再對其進行操作，現(xiàn)在首頁可以直接利用（卡片 + 快捷按鈕）樣式便捷性操作該功能。還有多種首頁的樣式比如傳統(tǒng)功能圖標采用的是“陳列式”的設計（代表作：蘋果 carplay）

在用色方面：

車機系統(tǒng)用色方面大家都用了對比度較高的顏色，不會像移動端那樣子，由于駕駛場景的特殊性，駕駛員沒有過多的時間停留在屏幕上，因此如果用了對比較低的，那么會影響到駕駛者的安全駕駛，在我第一篇文章中我也有提到，文本視覺呈現(xiàn)及文本圖像至少要有 7:1 的對比度，針對大號文本以及大文本圖像至少有 4.5:1 的對比度。

自己理解 + 新的 idea

首先要提高屏幕的利用率，不能為了設計而設計，從而浪費屏幕的使用率，要站在用戶角度思考問題，幫助用戶解決問題和痛點，而不是想當然天馬行空的設計，為了好看為出發(fā)點，有這個想法的請給我立馬打回去。有的車廠設計方案為了好看將屏幕的利用率降低，3 張功能卡 + 一個車模 + 車模下方控制車輛的 3 個功能按鈕 + 底部的 dock 欄，輸出的設計效果圖還不錯，但是這是在犧牲了功能為代價的基礎上。

新的 idea，首先要分場景，是輔助駕駛還是全自動駕駛，因為全自動駕駛的話就不需要考慮安全駕駛的因素了，這樣設計方案可以做出很多種，交互方式也因此將改變，安于現(xiàn)在的技術和道路復雜狀況，自動駕駛發(fā)展的道路我覺得很長，對于前瞻性的設計還是要輸出和探索。下面我們就開始說一下，介于現(xiàn)在的設計該如何優(yōu)化首頁，有哪些值得我們?nèi)ヌ剿鞯模?/p>

在首頁中我們可以加入場景化相結合，比如天氣有陰雨天 、晴天、下雪等，都會在中控屏幕中顯示，大家肯定會說這不會影響駕駛員嘛？現(xiàn)在的技術可以做到識別主駕駛眼球，當主駕駛用眼睛掃描屏幕的時候，這些場景化的內(nèi)容會立即消失，而且在設計之初也會考慮到不會影響到駕駛和中控操作等，在不影響安全駕駛的情況下，我們可以將這個功能做到設置中開關切換狀態(tài)。這邊就先提到這一個點，后續(xù)的探索內(nèi)容大家可以持續(xù)關注我。

2. Dock 欄分析

Model 3 最高兩級菜單，所以操作起來非常的方便，底部的 dock 欄包含了車輛設置、音樂、攝像頭、雨刮器、座椅、風量、溫度、前除霜、后除霜、音量。

更多功能 →（通話、日歷、攝像頭、能量、充電、網(wǎng)絡、娛樂、玩具箱子）

這邊就有人有疑問了，為什么 dock 欄圖標下面沒有文字，而折疊后就加文字了呢？

首先下面作為常用的功能，前期通過 4S 店員的講解和查看使用手冊，短期的高頻率使用更容易讓人能夠記住它，所以在設計上只保留了 icon 去除了文字，相對于折疊的功能，它記憶性是呈現(xiàn)逐步遞減的，因此需要添加文字作為說明。

蔚來 ES6 由于是豎屏所以底部的 dock 欄相對 Model 3 減少很多，內(nèi)容→車輛、內(nèi)外循環(huán)、雙區(qū)溫度、風量調(diào)節(jié)、前除霜、后除霜，屏幕中是減少了很多，但中控下面的硬按鍵彌補了中控過少的缺陷，硬按鍵包括主頁按鍵、設置按鍵、車輛駕駛模式設置按鍵以及音量旋鈕?？梢宰層脩舾涌旖莸倪M入到相應的設置頁面。

小鵬 P7 的 dock 欄位置處于屏幕的最左側，做在左邊的優(yōu)點大家肯定不謀而合的都會想到，它靠近左側的駕駛員呀，對的，確實是基于這個體驗做的方案，小鵬 p7 的 dock 欄內(nèi)容 → 應用中心、車輛設置、自動泊車、空調(diào)、音樂、電話等。與 Model 3 一樣，P7 大屏頂部各個圖標也均可打開，比如個人中心、電量管理中心、車輛中心等等，可以快速進入相應的控制頁面。

理想 ONE 中的 dock 欄就和其他三種車型有著很大的區(qū)別，既不是放在最左邊一豎排，也不是放在底部，由于 1920x720 分辨率的原因，不適合設計在底部區(qū)域，如果硬是放在底部的話，會占據(jù)很多可利用的空間，因此這種方案肯定不是最優(yōu)的選擇， 理想 ONE 的選擇區(qū)域就是最左側時間和音樂快捷控件的下方，雖然方式獨特，但也算是適合的方案，dock 欄的內(nèi)容 → “主頁”、“車輛”、“導航”、“音樂”、“360倒車”。

總結一下

關于 Dock 欄的設計，每個車廠都有自己的定義，當中控屏幕為豎屏時，dock 幾乎都設計在底部，因為設計在底部的話可以大大的提高屏幕的利用率，如果做在側邊欄可想而知，將會減少屏幕的利用率，如下圖：給大家展示一下效果。

小鵬 P7 和特斯拉 Model 3 屏幕類型相對比較類似高度相同，長度 P7 比 Model 3 多出 480px，所以我想這是導致他們在設計策略不同的主要原因吧。他們在對于 dock 定義，各有優(yōu)缺點：

優(yōu)點：小鵬 P7 dock 欄在左側便于用戶操作 / 特斯拉 Model 3 dock 欄功能較多還有功能擴展設計

缺點：小鵬 P7 dock 欄功能相對較少，在操作空調(diào)調(diào)溫度體驗很差 / 特斯拉 Model 3 dock 欄距離主駕駛較遠的功能點擊困難，因此他們在對于功能定義排序有著很好的策略，將常用的功能集中于靠近主駕駛左側區(qū)域。

理想 one 做的比較特別，一般車載系統(tǒng)的設計 dock 欄不是放在左側 or 底部 （PS：海外版本有的國家主駕駛是在右側的，那么放在左側的 dock 欄設計要移到右側區(qū)域中）但是理想 one 的 dock 也是放在靠近主駕駛區(qū)域的位置。

3. 自己理解 + 新的 idea

在對于 dock 做設計方案的時候，要考慮幾個要素：

1. 在安全駕駛為前提下便于用戶操作；
2. dock 欄的內(nèi)容要使用頻率較高的功能；
3. dock 欄的交互手勢不要過于復雜，點擊、左右、上下滑動即可長按的操作千萬別有；

新的 idea，根據(jù)用戶習慣可進行對 dock 功能進行編輯，dock 功能分為可編輯為不可編輯，比如返回主頁頁面設定為不可編輯，因為如果改動了這個，全局的交互都會因此改變，再出設計方案就要多出很多內(nèi)容，所以需要可編輯為不可編輯，就像手機自帶的功能沒辦法刪除一個道理。

最后來個總結：

在做競品分析的時候，不建議視覺設計和交互分的太明顯，在一個產(chǎn)品的設計體驗上，他們是互相輔佐的，是一個互補的關系，如果你想要很好的鍛煉你自己一下，就要嘗試一下交互和視覺一起來做分析，還是那句話：站在用戶角度去為用戶考慮設計。

文章中如有不足之處，歡迎補充交流，我們下期見