起點課堂會員權益
職業(yè)體系課特權
線下行業(yè)大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業(yè)技能直播
會員專屬社群
榮耀標識設計要知道：HMI設計六大交互視覺設計原則
編輯導語：汽車HMI設計不同于傳統(tǒng)互聯(lián)網(wǎng)的設計規(guī)范，在注重安全性的同時，汽車HMI也有適配的UI、UX設計規(guī)則，提升用戶的視覺交互體驗。本篇文章里，作者就總結(jié)了HMI的六大交互視覺設計原則，一起來看一下。
上篇講到《HMI設計必看！車載HMI的設計入門》開發(fā)流程，我們接下來的文章將深入拆分HMI的設計流程。HMI體驗設計是整車體驗的一部分，也變得越來越重要。
剛開始進入車載行業(yè)的同學都會存在一個誤區(qū)，會拿互聯(lián)網(wǎng)那一套設計規(guī)范套路汽車HMI設計，但其實汽車HMI有自己的設計原則和設計規(guī)范，以及美學理念。
汽車行業(yè)本身是一個有著強烈美學理念和設計規(guī)范的行業(yè)，其實準確地說應該是汽車HMI中控設計是基于自身傳統(tǒng)規(guī)范，結(jié)合互聯(lián)網(wǎng)移動端和Web端的基礎上，慢慢形成了一種新的設計規(guī)范。加上龐大的行業(yè)從業(yè)者的外溢，互聯(lián)網(wǎng)的美學理念和設計規(guī)范，已經(jīng)在入侵進來形成HMI設計新興的細分領域。
一、HMI的設計六大交互原則
說到HMI設計，雖然所有人都很容易理解，HMI設計要考慮注重安全，需要在設計上適應車載的使用場景。但是UI設計原則和UX設計原則很少有人系統(tǒng)性地回答過。對比原有的交互六大原則，適配到車載的場景下，提煉出六大交互設計原則。
1. 安全性原則
HMI涉及到的載體都是汽車零部件中的安全件，HMI設計首先考慮的必須是以安全為第一導向， 所有顯示信息都應該按照人機工程學進行合理排布，按照駕駛者的行為習慣進行設計。
與移動端的視覺顯示不同，HMI設計師需要注意除了基礎的視覺顯示規(guī)范外，還需格外注意與安全相關信息的展示、視覺警告、文字易讀性和顯示眩光等顯示問題。
2. 及時反饋原則
人的大腦每天通過五種感官接受外部信息的比例分別為：味覺1%；觸覺1.5%；嗅覺3.5%；聽覺11%；視覺83%。
時刻保障關鍵信息是最高優(yōu)先級的，保證在各種環(huán)境場景下具有良好的可見性和易讀性，無需駕駛員費力尋找和識別。
隨著大屏、多屏化的發(fā)展趨勢，除了依賴視覺反饋，以及減少或避免觸摸屏的誤觸功能，聽覺和觸覺也可以輔助視覺反饋。
1）不同場景下的提示
除以上正常駕駛場景外，還有部分對特殊場景的提示，如油耗、故障、雨雪天、超速、疲勞等。
車載系統(tǒng)需要有能力面對復雜的應用場景，處理需要更加智能，（比如復雜路況+不良天氣的提示），以及車內(nèi)的環(huán)境控制（如聲音、氣溫）需要更加敏感。
車載系統(tǒng)的設計相比于移動端有著更明顯的約束，不論是從空間（使用環(huán)境）、時間（三秒原則）、行為（交互方式）、心智（心理訴求），都有著明顯獨特的場景和特點，要做好車載系統(tǒng)設計，我們需要有豐富的同理心以及親身體驗并反復驗證設計。
2）信息獲取效率
同樣，現(xiàn)在的智能汽車，信息呈現(xiàn)的方式，主要也還是視覺為主，聽覺為輔。在還沒有完全實現(xiàn)自動駕駛前，信息呈現(xiàn)層級保持不變。
在汽車行駛的過程中當中最高優(yōu)先級是視覺，時刻要觀察道路，查看導航。聽覺輔助也是很有必要考慮的場景，通過語音反饋司機需要獲取的信息，能讓司機盡量保持視覺焦點在路況上。多場景的融合考慮信息獲取的效率，能減少在開車過程中的安全隱患。
3. 完整性原則
將頁面信息根據(jù)某些關聯(lián)性，分區(qū)塊進行顯示，這將有助于用戶更容易的建立信息位置記憶，用極少量的時間查看車輛狀態(tài)，減少搜索信息帶來的注意力分散，保障駕駛安全。
4. 簡單學習原則
面對C端用戶，設計師要考慮盡最大可能使用符合用戶習慣交互方式，減少學習和適應，讓駕駛員更有安全感和便捷的操作。
如果交互界面改變了，用戶極有可能必須從頭開始學習一些基本操作。在市場競爭壓力這么大的情況下，用戶很容易就轉(zhuǎn)向自己接受程度高的產(chǎn)品。
隨著屏幕越做越大，需要駕駛員操作的功能也越來越多，所以駕駛員會因為復雜操作，面臨交通路況擁擠的情況下的額外壓力。
5. 信息可視化原則
盡可能地采用圖像化/擬物化風格，避免或減少使用復雜的、過于專業(yè)的、技術性的圖標和術語。
6. 情感化原則
馬斯洛需求指出，人們需要動力實現(xiàn)某些需求，有些需求優(yōu)先于其他需求，我們當下在滿足基礎需求后需要更高階的需求。
情感化設計是用戶體驗和需求金字塔的最高層級，情感化需求也是必然的需求。在移動端，情感化的體現(xiàn)主要還是視覺層面，比如加載過程中的動效、缺省頁的插畫、異常狀態(tài)的提示等，還有就是和品牌的結(jié)合，增加用戶對品牌的認知。
而對于汽車而言，它是一個空間，就靠屏幕里的視覺元素是遠遠不夠的，應該從整車的角度去分析，通過五感（視、聽、觸、嗅、知）創(chuàng)造更豐富的全局體驗，比如可以根據(jù)自己的駕駛需求和個人行為習慣，自定義氛圍燈、香氛、語音等。
汽車IP
汽車IP用虛擬的人物語音來扮演管家的角色，功能包括了記錄車主的駕駛習慣，不斷優(yōu)化程序來契合車主習慣，讓車主有更好的駕駛體驗。
二、HMI視覺設計五大元素
1. 顏色
車載的美學他們大多是深色的，金屬質(zhì)感，邊框和陰影。早期的車載用戶界面都是硬性的感覺。但是現(xiàn)在行業(yè)已經(jīng)成熟到一個包羅萬象的、男女皆宜的當代審美。所以現(xiàn)在的視覺可以在以往的傳統(tǒng)上，使汽車界面更新潮更科技。
1）關于背景
主流的背景以深色為主，那是因為深色的背景更不容易分散司機注意力，減少了眩光的問題?，F(xiàn)在一些新能源車可以切換白天黑夜模式，也會出現(xiàn)淺色的背景，淺色模式的整體色調(diào)不好把控，處理不好會使屏幕一直處于高亮狀態(tài)，會讓駕駛員產(chǎn)生一定視覺疲勞。
隨著車輛越來越智能化，會出現(xiàn)更多的沉浸式體驗場景，這時候就需要更多的配色、更多的主題來滿足車主的需求。
2）關于色彩
深色背景下不宜過多使用高飽和的顏色。
不建議選擇單色，建議增加輔助色，可以更好地幫助我們分組，提高信息的獲取能力。
文本與底圖對比度建議大于7：1（至少4.5：1）。背景推薦使用深色，避免大面積使用純白色，過度吸引用戶注意。
過高的對比度導致視覺疲勞和閱讀效率的降低。深色模式下背景與文本或圖形的對比度建議不大于18：1。
下圖來自https://color.review/?？稍诖随溄硬殚喩蕦Ρ榷汝P系。
由于駕駛環(huán)境的變化，車載系統(tǒng)的視覺整體色彩需要跟隨場景智能調(diào)整，當進入夜晚模式時，長時間駕駛本身精神與視覺會更加需要集中注意力在前方，此時車內(nèi)環(huán)境中，不宜有過于強烈明顯的色彩干擾視線。
可試想你在電影院中看電影時，身邊的人的手機亮度最高，此時會嚴重影響視覺的余光，難以聚焦在前方畫面上。
因此視覺設計的整體色彩體系應當適當?shù)慕档惋柡投?，同樣的，車載系統(tǒng)視覺的設計也應避免使用同一色系的方案，這樣無法在1秒的安全時間以內(nèi)讓用戶有效果地判斷識別信息。
2. 字體
文字內(nèi)容應當通過字號字重來區(qū)分主次關系，用戶在掃一眼的過程中即可準確地看到重點信息。應當遵循可讀性和易讀性。
中控與駕駛員的距離處在70cm-85cm之間，設計稿一定要在實車上感受，是否足夠清晰，是否能快速識別。中控屏搭載的更多是各種應用，顯示的文字相對會多一點，除了文字需要保證在可視區(qū)間里，文字的信息層級也要排列清晰，保證易讀性。
因為通常搭配的是安卓系統(tǒng)，所以都是用思源字體。
3. ICON
ICON的設計形式，可更多結(jié)合應用的內(nèi)容，應注意在內(nèi)容與形式結(jié)合時，視線上要保持一致性，可有助于在一秒的安全時間內(nèi)讓用戶快速瀏覽并判斷信息。
4. 內(nèi)容排版
車載以駕駛員的操作為主，功能布局盡量設計在離手最近的位置，縮短操作距離，盡可能將熱區(qū)放大，展示信息放在右側(cè)。
層次和數(shù)量
所有的信息按照使用場景、功能，分組展示，確保信息按照優(yōu)先級進行交付。在任何場景下展示盡可能少的信息。避免過多信息的干擾，必須做到界面顯示輕量化。數(shù)量盡量不超過3-4個。
5. 品牌
用戶對傳統(tǒng)汽車的品牌感認知，還是停留在車標、車造型等硬件外觀，而智能汽車，搭載了一個智能系統(tǒng)，除了駕駛需求，人和車的交互更多地會停留在HMI。所以，對于HMI融入品牌元素也相當重要，品牌化是智能座艙視覺設計重要的發(fā)展趨勢之一。
隨著車聯(lián)網(wǎng)和自動化駕駛技術日趨成熟，視覺上也需要考慮用戶從安全訴求為主、轉(zhuǎn)變到娛樂及其他訴求為主的可能性，這樣也為挖掘新的視覺展現(xiàn)形式提供了很大的空間。
相關閱讀：
參考來源：
https://www.zhihu.com/question/24571674/answer/547687723
http://zhangjingwei.cn/ucd/1015530.html
注：圖片來源于網(wǎng)絡，侵刪。
#專欄作家#
郝小七，微信公眾號：七醬設計筆記，人人都是產(chǎn)品經(jīng)理專欄作家。蜻蜓FM高級UI設計師，5年工作經(jīng)驗。專注于體驗設計，歡迎各位同學一起交流。
本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)作者許可，禁止轉(zhuǎn)載
題圖來自Unsplash，基于 CC0 協(xié)議
- 目前還沒評論，等你發(fā)揮！
