交互設(shè)計(jì)五層模型

網(wǎng)上有很多文章,也有很多書(shū),都在講五層模型。這五層模型是交互的基礎(chǔ),是怎么來(lái)的?目的是什么?要輸出什么文檔證明經(jīng)過(guò)了五層的思考分析呢?

五層模型包括戰(zhàn)略層、范圍層、結(jié)構(gòu)層、框架層、表現(xiàn)層。是從概念到成品,抽象到具體的過(guò)程。美其名曰科學(xué)的產(chǎn)品開(kāi)發(fā)流程。

每個(gè)層級(jí)里有每個(gè)層級(jí)要實(shí)現(xiàn)的目標(biāo),也就是任務(wù)導(dǎo)向,跟玩游戲一樣,這個(gè)層級(jí)通關(guān)了就開(kāi)始下一個(gè)層級(jí),配上圖,自己看~

Jesse James Garrett的《用戶(hù)體驗(yàn)要素:以用戶(hù)為中心的產(chǎn)品設(shè)計(jì)》

弄明白五層的定義和邏輯之后就開(kāi)始逐步的講解啦~敲黑板,注意注意。主要講每個(gè)層級(jí)要實(shí)現(xiàn)的目標(biāo)以及可以通過(guò)什么方法來(lái)實(shí)現(xiàn)。從邏輯上來(lái)講,完成一個(gè)事情可以拆分為目標(biāo),方法和輸出。用戶(hù)的目標(biāo)是什么,為了這個(gè)目標(biāo)采取了什么樣的方法論(方式,行為),得到了什么樣的結(jié)果(產(chǎn)出物,輸出物),這個(gè)結(jié)果是否可行(可用性)。

一、戰(zhàn)略層:全局與定位?

1.目標(biāo):企業(yè)需求和用戶(hù)需求

企業(yè)需求包括公司需要什么,規(guī)模?品牌?盈利?比如通過(guò)滿(mǎn)足用戶(hù)的需求來(lái)盈利。淘寶滿(mǎn)足用戶(hù)的網(wǎng)上購(gòu)物需求,同時(shí)也有廣告和商家的擁金。百度提供搜索服務(wù)的同時(shí)也可以通過(guò)關(guān)鍵詞和推送來(lái)盈利。

用戶(hù)需求包括用戶(hù)需要什么?給用戶(hù)提供什么樣的服務(wù)?比如滴滴便捷共享的出行服務(wù),乘客出行更方便快捷,司機(jī)獲得利潤(rùn),平臺(tái)獲得傭金。

2.方法:市場(chǎng)分析和用戶(hù)研究

市場(chǎng)分析會(huì)用到常用商業(yè)畫(huà)布,SWTO四象限,競(jìng)品分析;而用戶(hù)研究會(huì)用到用戶(hù)訪談,用戶(hù)畫(huà)像,同理心圖,卡片分類(lèi)。這些都是方法論,這里就不細(xì)說(shuō)了。

3.輸出:用戶(hù)需求白皮書(shū)和競(jìng)品分析報(bào)告

用戶(hù)需求白皮書(shū)包括數(shù)據(jù)需求,功能需求,業(yè)務(wù)需求,品牌需求,技術(shù)需求。競(jìng)品分析要尋找有標(biāo)志性的產(chǎn)品,比如教育有K12,有成人教育,還有早教等。競(jìng)品分析包括交互分析和視覺(jué)分析,各自的優(yōu)劣性等。


二、范圍層:功能范圍和需求優(yōu)先級(jí)

1.目標(biāo):功能列表和優(yōu)先級(jí)?

先建立業(yè)務(wù)模型(BO模型),是B to C,B to B, 還是C to C。梳理清用戶(hù),公司之間的關(guān)系。比如淘寶BO模型包括消費(fèi)者,平臺(tái)和商家,商家發(fā)布商品,消費(fèi)者下單購(gòu)買(mǎi),平臺(tái)提供信息閱覽和信譽(yù)。所以需要發(fā)布、評(píng)價(jià)、推薦、購(gòu)物車(chē)、支付等等功能

2.方法:列舉功能和優(yōu)先排序

怎樣列舉功能呢?通過(guò)用戶(hù)建模,進(jìn)行用戶(hù)分類(lèi),比如蘋(píng)果是5,香蕉是7;大白菜是10,胡蘿卜是12。設(shè)定相差小于等于2的是一類(lèi)。包括首要用戶(hù)、次要用戶(hù)、補(bǔ)充用戶(hù)、負(fù)面用戶(hù)。比如blibli上有二次元的、學(xué)習(xí)的、玩游戲的~明星有顏粉、路人粉、女友粉等。

優(yōu)先排序根據(jù)場(chǎng)景來(lái),KANO模型排列出重要且緊急的,緊急但不重要,重要但不緊急,不緊急也不重要的。KANO模型就不細(xì)說(shuō)了。

3.輸出:功能文檔和需求里程碑

就是平時(shí)干活要看的文檔和交付時(shí)間,人員分配。


三、結(jié)構(gòu)層:信息結(jié)構(gòu)和交互方式

1.目標(biāo):建立信息結(jié)構(gòu)圖(IA)和交互模式圖(DPL

信息結(jié)構(gòu)就是分類(lèi)和內(nèi)容,比如網(wǎng)頁(yè)的分類(lèi)導(dǎo)航,網(wǎng)頁(yè)上的文字。有種工具叫業(yè)務(wù)字段表,列出了字符串的值和變化的范圍。

DPL包括視覺(jué)庫(kù)和交互庫(kù),比如對(duì)于手機(jī),交互是輸入,輸入人的指令;視覺(jué)是輸出,告訴人現(xiàn)在的狀態(tài)。交互方式包括點(diǎn)擊、長(zhǎng)按、上下滑動(dòng)、拖動(dòng)、手勢(shì)等,也就是動(dòng)作+狀態(tài),采取了一個(gè)行動(dòng),這個(gè)行動(dòng)導(dǎo)致了界面的一個(gè)狀態(tài),比如按鈕的狀態(tài)有未點(diǎn)擊,正在點(diǎn)擊,已點(diǎn)擊,不可用,此外還有沉浸式和下載中的狀態(tài)。

2.方法:卡片分類(lèi)法,用戶(hù)體驗(yàn)地圖,原型設(shè)計(jì)

卡片分類(lèi)法包括封閉,開(kāi)放,和半開(kāi)放。開(kāi)放型的是用戶(hù)可以自主地對(duì)卡片進(jìn)行分類(lèi),區(qū)別于封閉型的分類(lèi)

用戶(hù)體驗(yàn)地圖是場(chǎng)景的連續(xù),一個(gè)APP下載,注冊(cè)登錄,瀏覽使用,會(huì)員,直到厭惡離開(kāi)不再使用。也可以說(shuō)是流程圖當(dāng)中著每個(gè)階段的體驗(yàn)。

3.輸出:信息結(jié)構(gòu)圖,低保真原型


四、框架層:導(dǎo)航,模式,組件

1.目標(biāo):導(dǎo)航,模式,組件

卡片分類(lèi)決定了導(dǎo)航,比如閱讀的APP里有小說(shuō),雜志,和成功學(xué)。模式指的是要解決的問(wèn)題,也就是任務(wù),比如文章列表頁(yè),表單頁(yè),登錄注冊(cè)頁(yè),發(fā)送郵件頁(yè),上傳圖片頁(yè),拍照頁(yè),掃二維碼頁(yè)等等。固定的功能解決固定的問(wèn)題。

2.方法

主要是確定頁(yè)面和每個(gè)頁(yè)面里的功能,畫(huà)高保真原型

3.輸出:線框圖,原型圖,高保真原型


五、表現(xiàn)層:版式,顏色,運(yùn)動(dòng)

到這里視覺(jué)規(guī)范和交互規(guī)范要確定,讓設(shè)計(jì)師們效果圖的風(fēng)格保持一致。交互動(dòng)畫(huà),顏色,字體,極限場(chǎng)景里的界面展示(無(wú)網(wǎng)絡(luò)、加載中、加載失敗、無(wú)內(nèi)容)。就是界面展示的視覺(jué)設(shè)計(jì)部分,也就是傳統(tǒng)的設(shè)計(jì)學(xué)要派上用場(chǎng)了。


總結(jié):

戰(zhàn)略層通過(guò)市場(chǎng)分析和用戶(hù)研究得到需求白皮書(shū);范圍層通過(guò)列舉功能和功能排序得到需求優(yōu)先級(jí);結(jié)構(gòu)層通過(guò)卡片分類(lèi)和用戶(hù)體驗(yàn)地圖得到信息結(jié)構(gòu)圖;框架層根據(jù)行業(yè)規(guī)范繪制高保真原型;最后到表現(xiàn)層的視覺(jué)設(shè)計(jì)。理論是理論,實(shí)際是實(shí)際,工作當(dāng)中往往有諸多不同。比如敏捷設(shè)計(jì)(design sprint),這又是另外一種方式了。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容