編輯導(dǎo)語：伴隨著研發(fā)技術(shù)的進(jìn)步，人車交互也變得越來越高效。這篇文章講述了車內(nèi)常用的幾種交互模式，以及交互中的內(nèi)容排版和信息呈現(xiàn)，多任務(wù)處理、車載交互層級(jí)、選項(xiàng)數(shù)目和反饋的定義等內(nèi)容。一起來看看吧！

一、高效的交互方式

再講到HMI高效的交互方式之前，我們還需要了解一下多模態(tài)交互。

1. 多模態(tài)交互

“多模態(tài)交互”包括了視覺、聽覺、嗅覺、觸覺以及味覺等方面的感官交互，也就是通過眼睛、耳朵、鼻子、嘴巴以及皮膚觸摸實(shí)現(xiàn)，其技術(shù)應(yīng)用在實(shí)際生活中也是圍繞這些感官進(jìn)行設(shè)計(jì)，將多個(gè)感官的交互技術(shù)融合在一起，形成一種多模態(tài)的交互形式。

在車內(nèi)所用到的交互，通過語音、觸覺、觸控、嗅覺、視覺、手勢、體感等多種交互，以更接近人和人之間交互的一種方式，使人車交互變得更加自然和輕松。

2. 拋出一個(gè)問題??????

什么交互方式才是算是高效的交互方式？什么樣子的交互才是王道？每個(gè)人都有每人的定義方法，我和很多設(shè)計(jì)師都談過這樣的話題，在這個(gè)話題最后我會(huì)給大家一個(gè)結(jié)論。

3. 常用的交互方式

先介紹一下現(xiàn)在市場上車機(jī)中含有的交互方式，硬按鍵 ?/ ?觸控??/ ?語音 / 手勢。

（1）硬按鍵交互方式

最初的原始車機(jī)，基本上都是通過硬按鍵來解決，都是成千上萬次的肌肉型記憶，才得已做起來那么的順暢。這個(gè)也有他的優(yōu)點(diǎn)所在，下面展示一下硬按鍵的車內(nèi) ???

（2）觸控交互方式

當(dāng)液晶大屏出現(xiàn)，其交互方式也隨之改變，下面展示一下大屏幕車內(nèi) ???

我們在駕駛車的過程中，點(diǎn)擊是最有效的交互方式。長按、滑動(dòng)、雙擊、單/雙手指拖拽等交互方式都會(huì)超過2秒的安全時(shí)間范圍，這樣極大的增加了操作難度系數(shù)和駕駛中的風(fēng)險(xiǎn)，其余操作方式可以用在非駕駛狀態(tài)中。如果有的功能無法通過觸控實(shí)現(xiàn)，那么下面即將提到語音交互。

講完上述的交互方式，我們應(yīng)該討論一些實(shí)質(zhì)性的事情了，這些交互方式，該用在什么模塊，哪些場景里面較為穩(wěn)妥合適？趕緊坐上我的小火車? 要加速了 du~ du ~ du~ ?…

點(diǎn)擊交互方式：按鈕、復(fù)選框的勾選、tab欄目切換、icon的點(diǎn)擊、搜索欄、控件類型等

滑動(dòng)交互方式：負(fù)一屏、首頁功能卡片、所有包含進(jìn)度條（音樂、視屏、在線電臺(tái)、音量、顯示亮度、空調(diào)風(fēng)量、溫度等）、列表類型、空調(diào)風(fēng)向、車模轉(zhuǎn)動(dòng)等

長按交互方式：選中編輯 、輸入法中的部分按鍵

雙擊交互方式：導(dǎo)航地圖、圖片放大

單/雙手指拖拽：單 ?? 可編輯狀態(tài)觸發(fā)后改變位置， 雙 ?? 圖片的縮放、導(dǎo)航地圖的縮放

（3）語音交互方式

語音交互是我最喜歡的交互之一，它可以盡量減少用戶的分心，可以安全駕駛。

在車載語音交互中最為常用的非導(dǎo)航莫屬了，那就以導(dǎo)航為例。

第一步：語音輸入所需要去的目的地信息，如果不知道具體地址信息的話可以模糊導(dǎo)航。

用戶：“導(dǎo)航到最近的停車場?！?/p>

第二步：根據(jù)用戶所給的語音輸入導(dǎo)航需求，系統(tǒng)匹配導(dǎo)航目的地，讓用戶進(jìn)行選擇所需要的目的地。

語音助手：“選擇第幾個(gè)呢？”

（先吐槽一下：有的產(chǎn)品經(jīng)理就會(huì)在語音助手對(duì)話下功夫，搞得很復(fù)雜，添加語音助手昵稱或者多說一下語氣助詞）以上面這個(gè)例子添加內(nèi)容：“siri為您已經(jīng)找到多個(gè)停車場，需要選擇第幾個(gè)呢？”這邊只是舉一個(gè)個(gè)例，只希望大家能夠簡化內(nèi)容。

其他場景：音樂、電話、空調(diào)模塊

音樂：“我要聽XXXXX”、“上一首”、 “下一首”、 “音量大一點(diǎn)” “音量小一點(diǎn)”

電話：“打電話給XXX”、“打開聯(lián)系人”、“打開通訊錄”、“查找XXX”

空調(diào)：“關(guān)閉、開啟空調(diào)”、“溫度高一點(diǎn)”、“溫度低一點(diǎn)”、“打開內(nèi)/外循環(huán)”、“風(fēng)量大一點(diǎn)”、“風(fēng)量小一點(diǎn)”等

上述語音內(nèi)容講完，肯定會(huì)有人說想要精確調(diào)到某個(gè)溫度，是不是還要說很多遍“溫度低一點(diǎn)”。我想說的是，現(xiàn)在已經(jīng)有研發(fā)技術(shù)可以直接編寫代碼，讓語音可以控制車內(nèi)空調(diào)，達(dá)到精確溫度了。這就是程序員的魅力所在，反正我是被吸引了。

（4）手勢交互方式

手勢交互，目前來說運(yùn)用在汽車?yán)?，最大的?yōu)勢在于動(dòng)作是相對(duì)的，無需精準(zhǔn)操作（精準(zhǔn)操作不僅要用手，還要靠眼睛尋找，很危險(xiǎn)的），但是手勢最大的弊端就是操作會(huì)比較少（操作太多可能需要回憶操作方式，大腦開小差也很危險(xiǎn)）所以在上述中有說到，我偏向于語音控制的選擇，我也比較看好這個(gè)。

利用車載手勢控制系統(tǒng)，通過不同的手勢組合，可以讓車主更加快捷地實(shí)現(xiàn)各種操作，例如切換歌曲、接掛電話、調(diào)節(jié)音量大小、翻動(dòng)列表頁、縮放地圖等。這些手勢有的是從觸控手勢提煉出來的，有的是結(jié)合生活習(xí)慣，比如閉嘴狀態(tài)可以用在掛斷電話，那手勢就可以用握拳樣式。

4. 最后總結(jié)

駕駛之外的車內(nèi)任務(wù)會(huì)不同程度地分散駕駛員的注意力，為保障行車安全，功能的操作設(shè)計(jì)需要考慮觸控、語音、圖像等多模交互相結(jié)合，并根據(jù)不同使用場景靈活組合輸入形式，也適當(dāng)保留一些物理按鍵（硬按鍵）為用戶提供最自然的使用體驗(yàn)。

還有一點(diǎn)我想說的是，如果我們設(shè)計(jì)師能夠參與到對(duì)于整車的交互設(shè)計(jì)定義的話，就擁有更多話語權(quán)了，對(duì)于從雛形到落地都可以去定義這款車。不然等車已經(jīng)定型，對(duì)于交互定義的內(nèi)容就有了很多限制。

二、交互中的內(nèi)容排版和信息呈現(xiàn)

1. 交互中內(nèi)容排版

在駕駛過程中，用戶大部分精力用在于聚焦駕駛行為上，用戶只能抽取僅5%左右的精力與時(shí)間來操控車載。因此也就決定了車載系統(tǒng)的信息布局，都必須在極短的時(shí)間內(nèi)以最好的方式呈現(xiàn)。

而如果用戶沒有在時(shí)間內(nèi)完成操作任務(wù)，要么用戶選擇放棄、重新再來，要么用戶花費(fèi)更多時(shí)間和精力，但這樣駕駛的危險(xiǎn)系數(shù)會(huì)成倍增長。

2. 提高操作的效率

功能的信息布局設(shè)計(jì)要充分考慮駕駛環(huán)境的特點(diǎn)，并結(jié)合具體場景，對(duì)界面信息進(jìn)行合理布局。駕駛員在駕駛位置，和屏幕、按鍵等之間的相對(duì)位置是比較固定的，所以要考慮到駕駛員容易看到，最容易觸及的區(qū)域，把最重要的信息放在這個(gè)區(qū)域內(nèi)。

按照車載的操作熱區(qū)，在功能與入口的布局上盡可能地根據(jù)熱區(qū)分布來設(shè)計(jì)。功能布局盡量設(shè)計(jì)在離手最近的位置，縮短操作距離，將信息展示區(qū)放置在右側(cè)。

3. 通用的信息布局

在不同的駕駛場景下，同一功能的信息布局應(yīng)始終保持一致，避免因布局的變動(dòng)對(duì)駕駛者造成困擾。相同或相似功能之間，頁面布局應(yīng)具備通用性，幫助駕駛者通過位置聯(lián)想，減少記憶成本。

根據(jù)上述三秒原則中的視覺掃視，頁面內(nèi)信息要聚集，做到集中查看，確保頁面內(nèi)容可準(zhǔn)確傳遞出當(dāng)前進(jìn)行中任務(wù)的相關(guān)內(nèi)容信息，讓用戶能在1-2秒內(nèi)完成對(duì)信息的掌握，并快速回到正常的駕駛狀態(tài)。

4. 交互中文案

對(duì)于交互文案的定義一定要短，簡明易懂，保持信息的最新狀態(tài)和可瀏覽性。

（1）傳達(dá)信息明確清晰

對(duì)于交互文案不要含糊不清，不要有歧義。

比如：在車機(jī)中掃碼登錄酷我音樂，如果登錄失敗

方案1：彈窗信息內(nèi)容為“登錄失敗”

方案2：彈窗信息內(nèi)容為“登錄失敗”，并附加是什么原因才導(dǎo)致失敗的

（2）文案簡潔明了

身處用戶的角度，你會(huì)發(fā)現(xiàn)很多用戶是不看彈窗內(nèi)容的，看到彈窗上有按鈕就馬上點(diǎn)擊按鈕，所以彈窗中的文案，越簡潔越OK?。

舉個(gè)例子：這兩個(gè)彈窗表達(dá)的意思相同，一個(gè)簡短直接說現(xiàn)狀和行動(dòng)點(diǎn)，用戶能抓住重點(diǎn)，另外一個(gè)文案過長用戶不喜歡看，而且抓不住重點(diǎn)。

（3）一致性

要確保產(chǎn)品的一致性，相似的文案，表達(dá)方式要一致。

比如：導(dǎo)航中的按鈕“開始導(dǎo)航” “修改默認(rèn)”動(dòng)詞+名詞，就不能變成 名詞+動(dòng)詞

（4）主次分明

每段文字都要主次分明，若能做出區(qū)分，將更好地幫助用戶理解文案內(nèi)容。

在電話模塊通話記錄，我們一般需要打電話給某人，肯定第一時(shí)間是去找“XXX”然后才會(huì)再去核對(duì)手機(jī)號(hào)碼，所以在這信息要做好主次的區(qū)分。

（5）形成閉環(huán)

若文案不可避免會(huì)很長，有沒有讓用戶快捷操作的途徑呢？

實(shí)現(xiàn)方案：我們交互方案的定義下面就是“知道了”

我期待的：如果是我定義按鈕功能會(huì)將按鈕變成“去設(shè)置“（我會(huì)在下個(gè)版本更新的時(shí)候我會(huì)提出我的方案）

三、多任務(wù)處理

高效的任務(wù)流程功能設(shè)計(jì)，應(yīng)以提高任務(wù)完成成功率為目標(biāo)，減少認(rèn)知和操作的成本，避免設(shè)計(jì)過于復(fù)雜的信息架構(gòu)和功能流程路徑，且所有功能需有固定且完整的進(jìn)入和退出路徑。

在什么場景下才會(huì)出現(xiàn)多任務(wù)處理，我們試想一下，在導(dǎo)航中播放著車載應(yīng)用中的音樂、電臺(tái)，還有導(dǎo)航中來電話，得接聽，后續(xù)我們還增加了導(dǎo)航中組隊(duì)出行功能；音樂、電臺(tái)、電話、組隊(duì)在展開分屏后，可以進(jìn)行切換，我們開發(fā)暫時(shí)還不能做出隨意拖拽的（項(xiàng)目時(shí)間緊張）所以在體驗(yàn)這一塊就打了折扣。

我為什么要講隨意拖拽這個(gè)功能點(diǎn)？

按照現(xiàn)階段版本功能點(diǎn)，只有在導(dǎo)航模塊中才會(huì)出現(xiàn)多任務(wù)處理狀態(tài)，上述已經(jīng)講過幾個(gè)功能的切換，但是我們分屏方案還是2年前，從未修改，展示一下之前的交互內(nèi)容（和斑馬以前分屏差不多）。

由于多了這個(gè)內(nèi)容，右邊占據(jù)的空間，縮小了左邊導(dǎo)航的內(nèi)容，一旦導(dǎo)航出現(xiàn)路標(biāo)、路況、導(dǎo)航線路圖、縮放地圖按鈕等等，導(dǎo)航頁面需要承載的內(nèi)容偏多。

按照這個(gè)方案可能會(huì)干擾駕駛?cè)蝿?wù)，后續(xù)我們設(shè)計(jì)師內(nèi)部出了一個(gè)方案，叫做小控件，可以隨意拖動(dòng)，而且暫用控件比之前方案小很多，下面我就給大家展示一下這個(gè)方案的 UE雛形。

最終這個(gè)方案得到了領(lǐng)導(dǎo)的認(rèn)可，但由于開發(fā)成本過高，如果編寫的話，需要將這個(gè)新的方案編入下一個(gè)IOT升級(jí)包里面。

結(jié)論：不管在什么場景下，最高優(yōu)先級(jí)都是駕駛?cè)蝿?wù)，任何多任務(wù)處理都要考慮對(duì)駕駛的影響。

四、車載交互層級(jí)

避免在駕駛過程中常使用到的功能藏的很深，一定不能多于3個(gè)層級(jí)，否則對(duì)于駕駛安全會(huì)有很大的威脅。

1. 車機(jī)使用功能的頻率

在車機(jī)中有哪些功能是駕駛過程中使用頻率較高、重要等級(jí)較高的，我們來看一下

使用頻率較低：系統(tǒng)設(shè)置、第三方APP

使用頻率較高：音樂、電臺(tái)、空調(diào)、電話、倒車影像、導(dǎo)航

下面就拿電話舉例子：

2. 電話模塊

傳統(tǒng)車機(jī)沒有語音的狀態(tài)，需要給 “周杰倫” 打電話 。

第一步，打開電話功能。

第二步，點(diǎn)擊聯(lián)系人列表。

第三步，滑動(dòng)列表找到“Z”開頭的，進(jìn)行撥打。

這么看來傳統(tǒng)的車機(jī)也就2層，就可以到達(dá)聯(lián)系人并可以撥打

如果是帶語音搜索聯(lián)系人：

第一步，直接說：“打電話給周杰倫”。

PS：如果可以直接說全名并且沒有重復(fù)，就直接進(jìn)入通話模式，一步即達(dá)。

如果聯(lián)系人中同名同姓or沒說全稱只是說了姓、名 、備注的名稱，則需要進(jìn)行第二步。

第二步，選擇搜索后的結(jié)果 ?再進(jìn)行通話。

五、選項(xiàng)數(shù)目

盡可能的減少選項(xiàng)數(shù)目，在駕駛過程中進(jìn)行翻頁操作是很危險(xiǎn)的。

舉一個(gè)導(dǎo)航的案例：

在導(dǎo)航的時(shí)候，語音輸入需要到達(dá)的目的地，最后顯示出來的信息該展示多少為合適 ？

再來一個(gè)實(shí)戰(zhàn)例子：

在做項(xiàng)目的時(shí)候，因?yàn)榭嵛乙魳帆@取到的資源很多，因?yàn)榈谌蕉鴮?dǎo)致需要滑頁的情況是不可避免的，在橫屏設(shè)計(jì)上就會(huì)有很多的限制。由于高度有限，所以在滑動(dòng)的時(shí)候最多就只能展示兩行音樂內(nèi)容。

但在做豎屏方案的時(shí)候，情況就會(huì)好很多，給大家展示一下豎屏中的交互稿。

六、反饋的定義

從反饋輸出來看，以視覺、語音、觸控為主。為了安全，車機(jī)反饋一定要夠讓用戶清晰地理解任務(wù)的重要等級(jí)，而且要告訴用戶下一步應(yīng)該怎么做。

1. 視覺反饋

比如汽車在倒車，當(dāng)快要碰到后面墻壁的時(shí)候，就會(huì)發(fā)出警告聲音，并且在顯示屏上面也有會(huì)紅色警告標(biāo)記，就是告訴駕駛者需要立刻響應(yīng)。

2. 觸控反饋

汽車操控界面的觸覺反饋機(jī)制，實(shí)質(zhì)上是人與操控界面進(jìn)行信息交換。

用戶通過手指點(diǎn)觸摸屏進(jìn)行輸入操作，操控界面系統(tǒng)對(duì)輸入信息進(jìn)行處理和存儲(chǔ)，憑借顯示屏呈現(xiàn)給用戶。而信息的傳遞是借助圖形信息這個(gè)媒介，經(jīng)由人的視覺感知系統(tǒng)完成對(duì)視覺信息的識(shí)別和再加工，并對(duì)信息進(jìn)行分類處理，如空間、時(shí)間、顏色、形狀等。

而視覺大腦皮層對(duì)相匹配的視覺信息加工，會(huì)在人的腦海里形成短期和長期記憶，最終對(duì)人的操作形成觸覺反饋機(jī)制。上述的整個(gè)信息處理過程就是人機(jī)交互過程，它是人行為對(duì)大腦里的視覺和觸覺信息的反饋過程。

3. 語音反饋

語音交互是一個(gè)相對(duì)重要的一種交互方式，除了能夠讓用戶能夠體驗(yàn)到語音操控功能，還能讓用戶輕松、自然地接受車機(jī)的反饋信息，下面根據(jù)置信度不同劃分反饋的類型和應(yīng)用場景。

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

作者：設(shè)計(jì)界的影帝

本文由@設(shè)計(jì)界的影帝 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)作者許可，禁止轉(zhuǎn)載。

題圖來自Unsplash，基于CC0協(xié)議嗎