一般來說，我們需要通過人物、地點(diǎn)、時(shí)間、動(dòng)機(jī)、行為等要素分析用戶，來辨別需求真?zhèn)?，深刻理解產(chǎn)品需求。而“人機(jī)交互系統(tǒng)模型”主要是對(duì)于“行為”的梳理，以較小的顆粒度，梳理出用戶使用流程及心理活動(dòng)。本文作者對(duì)人機(jī)交互系統(tǒng)模型進(jìn)行了分析，一起來看一下吧。

一、背景

我們在談?dòng)脩粜枨蟮臅r(shí)候往往帶出來一句，你有沒有考慮用戶場景？那什么是用戶場景呢？

用戶場景是由人物、地點(diǎn)、時(shí)間、動(dòng)機(jī)、行為五大要素構(gòu)成的。我們通過這些要素分析用戶，來辨別需求真?zhèn)?，深刻理解產(chǎn)品需求，幫助理清強(qiáng)弱場景。

“人機(jī)交互系統(tǒng)模型”主要用于對(duì)“行為”的梳理。舉一個(gè)例子來理解“行動(dòng)”元素：A打開賓館房門，屋內(nèi)一片黑暗。他走進(jìn)去打開了電燈。通常我們會(huì)這么理解其中“行為”：“打開房門”、“走進(jìn)去”、“打開電燈”。

但是實(shí)際的情況要復(fù)雜得多。比如“打開電燈”這個(gè)行為，實(shí)際情況可能是：

1. A首先要知道電燈在什么地方；
2. A想了想之前的經(jīng)驗(yàn)，燈的開關(guān)一般放置在入口兩邊的墻上；
3. A先伸手往左邊墻上摸了摸；
4. 運(yùn)氣真好，一下子就摸到了；
5. 那這個(gè)燈應(yīng)該怎么開呢，之前的燈一般是按下去就行了；
6. 按下去沒有反應(yīng)，應(yīng)該說根本按不下去；
7. 然后嘗試左右滑動(dòng)，結(jié)果能向右滑動(dòng)；
8. 燈亮了起來。

可以看出一般我們對(duì)行為的理解比較粗略，沒有以小顆粒度的視角理解人的行為?！叭藱C(jī)交互系統(tǒng)模型”是著眼于以較小的顆粒度，梳理出用戶使用流程及心理活動(dòng)再進(jìn)行分析的工具。

二、什么是人機(jī)交互系統(tǒng)模型

人機(jī)交互系統(tǒng)中，一般的工作循環(huán)過程可由下圖所示。人在操作過程中，機(jī)器通過輸入設(shè)備（如顯示器、喇叭等）將信息傳遞給人的感知系統(tǒng)（如視覺、聽覺等），經(jīng)中樞神經(jīng)信息的感知處理對(duì)信息進(jìn)行傳遞，思維處理器對(duì)信息進(jìn)行處理和儲(chǔ)存后，再經(jīng)反應(yīng)處理器指揮人的反應(yīng)系統(tǒng)（如手指、嘴等）操縱機(jī)器的輸入設(shè)備，控制機(jī)器的信息處理，然后循環(huán)往復(fù)，直到完成目標(biāo)任務(wù)。

核心：以較小的顆粒度，梳理出用戶使用流程及心理活動(dòng)。

尼爾森·諾曼在《設(shè)計(jì)心理學(xué)》中提出了行動(dòng)的七個(gè)階段：目標(biāo)、計(jì)劃、確認(rèn)、執(zhí)行、感知、詮釋、對(duì)比。而《GB/T 29836-2013 系統(tǒng)與軟件易用性》中人機(jī)交互系統(tǒng)模型是參考了“行動(dòng)的七個(gè)階段”。并對(duì)它進(jìn)行了簡化，以更好地應(yīng)用在實(shí)際項(xiàng)目中。

三、模型實(shí)踐應(yīng)用

1. 問題背景

映兔app中原本應(yīng)該出現(xiàn)商家后臺(tái)上傳的圖片文字介紹部分內(nèi)容，但實(shí)際顯示“上傳中”，某個(gè)地方出現(xiàn)了問題。

2. 確定問題范圍

借助測試的幫助判斷這是前端問題，后端問題還是設(shè)計(jì)問題。測試反饋，因?yàn)橛脩粼谑褂谩熬W(wǎng)絡(luò)圖片”上傳圖片的時(shí)候，使用了錯(cuò)誤的地址，導(dǎo)致無法正常得顯示圖片。這屬于設(shè)計(jì)需要解決的問題。

四、解決方案

1. 人機(jī)交互系統(tǒng)模型應(yīng)用

從人機(jī)交互系統(tǒng)模型中，我們可以把這一連續(xù)的過程分為“感知”、“認(rèn)知”、“反應(yīng)”、“反饋”四個(gè)方面。下面就從這四個(gè)方面，來分析用戶在輸入“網(wǎng)絡(luò)圖片”信息前后的使用流程及心理活動(dòng)。

步驟一：眼睛瀏覽到“上傳圖片”、“網(wǎng)絡(luò)圖片”和“插入代碼”三個(gè)上傳方式（感知）

步驟二：在三個(gè)方案中比較哪一個(gè)更好（認(rèn)知）

步驟三：判斷“網(wǎng)絡(luò)圖片”在三個(gè)里面最方便（認(rèn)知）

步驟四：把鼠標(biāo)移動(dòng)到“網(wǎng)絡(luò)圖片”按鈕（反應(yīng)）

步驟五：跳出Popover（反饋）

步驟六：看見出現(xiàn)的Popover彈窗，看見一個(gè)input和“插入”按鈕（感知）

步驟七：理解input要的內(nèi)容，理解“插入”按鈕（認(rèn)知）

步驟八：往input中輸入內(nèi)容（反應(yīng)）

步驟九：輸入完后，點(diǎn)擊“插入”按鈕（反應(yīng)）

步驟十：下方出現(xiàn)圖片內(nèi)容（反饋）

步驟十一：看到下面的網(wǎng)絡(luò)圖片內(nèi)容（感知）

步驟十二：認(rèn)知下面的網(wǎng)絡(luò)圖片內(nèi)容是否符合需求（認(rèn)知）

步驟十三：完成確認(rèn)后，點(diǎn)擊“提交”按鈕（反應(yīng)）

步驟十四：顯示創(chuàng)建成功（反饋）

2. 問題分析

用戶可能在什么地方出了問題，導(dǎo)致輸入了“非圖片地址”？從“感知”、“認(rèn)知”、“反應(yīng)”三個(gè)元素分析。只需要考慮步驟五到步驟十四，因?yàn)橛脩艏热皇褂昧恕熬W(wǎng)絡(luò)圖片”上傳，一定已經(jīng)進(jìn)行到步驟五了。

3. 感知

1）看見出現(xiàn)的Popover彈窗，看見一個(gè)輸入框和“插入”按鈕（感知）

看法：能明顯看見，即使看不見也不會(huì)導(dǎo)致輸入錯(cuò)誤圖片地址情況。非相關(guān)。

2）看到下面的網(wǎng)絡(luò)圖片內(nèi)容（感知）

看法：出錯(cuò)的情況下，可能不容易看見“非正?！钡膱D標(biāo)。弱相關(guān)，可以進(jìn)一步分析。

4. 認(rèn)知

1）理解input要的內(nèi)容，理解“插入”按鈕（認(rèn)知）

看法：用戶可能不理解要輸入的內(nèi)容。強(qiáng)相關(guān)，可以進(jìn)一步分析。

2）認(rèn)知下面的網(wǎng)絡(luò)圖片內(nèi)容是否符合需求（認(rèn)知）

看法：用戶對(duì)現(xiàn)有圖片的“非正?！狈答?，認(rèn)為是正確的。需要更明確告知用戶，現(xiàn)在是錯(cuò)誤的。強(qiáng)相關(guān)，可以進(jìn)一步分析。

5. 反應(yīng)

1）輸入完后，點(diǎn)擊“插入”按鈕（反應(yīng)）

看法：點(diǎn)擊錯(cuò)誤可能造成效率上的問題，和填寫錯(cuò)誤的鏈接無關(guān)。非相關(guān)。

2）完成確認(rèn)后，點(diǎn)擊“提交”按鈕（反應(yīng)）

看法：同上。

6. 再分析

1）針對(duì)認(rèn)知1，要讓用戶理解輸入的內(nèi)容是什么。

2）針對(duì)認(rèn)知2，當(dāng)出現(xiàn)錯(cuò)誤的時(shí)候，要更明確告訴用戶上傳出錯(cuò)。

3）針對(duì)感知2，可以把非正常上傳的圖標(biāo)明顯化。

五、方案提供

從易用性的角度理解，認(rèn)知對(duì)應(yīng)的是“易理解性”，感知對(duì)應(yīng)的是“易發(fā)現(xiàn)性”。我們可以用對(duì)應(yīng)的方式來增強(qiáng)易理解性和易發(fā)現(xiàn)性來解決問題。以下方案僅從易用性的角度考慮，不考慮視覺效果以及開發(fā)實(shí)現(xiàn)。

針對(duì)認(rèn)知1

方案一：

給出更多的提示內(nèi)容。下面是在“商品詳情”下使用了線索說明，提醒用戶網(wǎng)絡(luò)圖片的錯(cuò)誤情況。

方案二：

給出更多的提示內(nèi)容。下面是在“網(wǎng)絡(luò)圖片”下使用了線索說明。相比于方案一，與上傳“網(wǎng)絡(luò)圖片”的操作區(qū)域更加靠近。

針對(duì)認(rèn)知2

方案三：

從“頁面實(shí)際瀏覽效果”的文案來提醒用戶，現(xiàn)在的是非正常上傳。并且信息所在的尺寸更像手機(jī)上瀏覽的效果，進(jìn)一步強(qiáng)化這種感覺。

方案四：

從技術(shù)上判斷所填寫的圖片鏈接是不是“可用的”。如果檢測到不可用，就使用message/error提醒用戶上傳鏈接錯(cuò)誤。

針對(duì)感知2

方案五：

也可以強(qiáng)調(diào)非正常上傳的圖標(biāo)，甚至到一個(gè)離奇的尺寸。用戶不得不看到它，然后意識(shí)到現(xiàn)在上傳的狀況不對(duì)。哈哈。

六、總結(jié)

人機(jī)交互系統(tǒng)模型作為思考問題的模型，能夠幫助我們從認(rèn)知心理學(xué)的角度對(duì)問題進(jìn)行細(xì)致地拆解。在使用的過程中，我們會(huì)獲得許多細(xì)節(jié)。而這些細(xì)節(jié)的地方就會(huì)有對(duì)應(yīng)解決方案，再從這些方案中進(jìn)行篩選，最終得出優(yōu)秀的方案。

值得注意的是，當(dāng)我把它運(yùn)用在實(shí)際的工作中，因?yàn)樗w粒度過小，所以在使用的時(shí)候會(huì)耗費(fèi)大量時(shí)間。因此人機(jī)交互系統(tǒng)模型要用在核心的問題上，次要的問題可能并不適用。