上周我們講解了流程設(shè)計公式中的“發(fā)現(xiàn)”步驟,主要介紹了功能入口的顯著程度要與其重要性和定位相符,同時介紹了新手引導(dǎo)的幾種類型。需要注意的是,新手引導(dǎo)作為提示入口的手段,對用戶的使用過程會有打擾。如何將打擾的程度降到最低,甚至是“自然出現(xiàn)(不打擾)”的狀態(tài),就需要思考場景,在合適的場景中引入新手引導(dǎo)。
本周我們繼續(xù)介紹流程設(shè)計公式中剩下的三個步驟,即了解、操作和跟進(jìn)。
了解
對于“了解”這一步,我們重要的任務(wù)是使用戶能迅速get到“界面是什么”以及“界面中的元素所傳達(dá)的功能”。為了做到這一點,這里有4個我總結(jié)的經(jīng)驗,跟大家分享。
1. 運用接近性原則。接近性原則,就是人們傾向于將彼此在位置上接近的物體歸位一類。我們會認(rèn)為下面的左圖是兩列,左右各一組元素。而在右圖中,接近性原則讓我們將元素理解為兩行。在你的設(shè)計中利用留白加強分組的關(guān)聯(lián)性,與其他元素區(qū)分開。

一般這個原則用在設(shè)置這樣的頁面比較多,例如小米的設(shè)置頁面。

另外,歸類是化頁面雜亂為清晰的一大妙招。比如小米的短信應(yīng)用,會自動識別短信內(nèi)容,將騷擾短信自動收入“攔截短信“組,將銀行等通知信息收入“通知類消息”分組,極大地方便了用戶管理短信。

2. 保證文案表意準(zhǔn)確/清晰。文案是你的應(yīng)用跟用戶溝通的一個非常重要的方面。這一點很多設(shè)計師會忽略,覺得“不就是文案嘛,這不是設(shè)計師的活兒”。殊不知,在一個界面中,除了圖形元素,文字其實也是重要的“視覺元素”,因為用戶會通過識別圖形元素/閱讀文字來理解你的界面。一個表意不清的界面很容易會使用戶陷入困惑。
比如下面這個頁面。這是滴滴買紅包的頁面,該頁面的文案相當(dāng)隨意,讓人摸不著頭腦:“請輸入用戶昵稱”,沒有寫明是送紅包的人的昵稱,還是收紅包的人的昵稱;“添加更多信息”的備注文案,寫的是“如地址,30字,可選”,會讓用戶誤以為這個紅包是實體的紅包,會真的郵寄到這個地址(但是又是可選啊喲喂,郵寄地址是可選?I beg your pardon?)

這兩項關(guān)鍵信息的表意不明,就讓整個頁面陷入了尷尬。作為中了文案的毒的我,就填寫了收紅包人的昵稱,還填寫了他的地址。但實際上,這在填寫完付款后,是后面的流程是我買了紅包,然后發(fā)給我的朋友們,他們會看到“XX昵稱送你XX元紅包”,然后還附帶有填寫的地址。真是迷之尷尬。
3. 主次分明。這一條比較簡單,就是保證重要的信息在視覺上更明顯,一般加大尺寸/加粗/使用更顯眼的顏色就可以做到。
4. 保證元素的功能可見性。功能可見性(affordance),是Donald Norman 在《Design of Everyday Things》這本書中提出的(中文版名為《設(shè)計心理學(xué)》);并且由于這本書的流行,這個概念隨之也被更多人接觸到。它的意思,就是用戶看到一件物品,或者一個界面,不用學(xué)習(xí),就知道如何使用。比如深澤直人的代表作,壁掛式CD播放器。他是著名日本設(shè)計師,也是無印良品的設(shè)計師,他的設(shè)計作品被認(rèn)為是樸素、不須思考就能使用的,他本人稱之為“without thought“。

知識運用
請思考以下兩個問題,這將幫你更好地理解本周的內(nèi)容。
1. 現(xiàn)有如下需求:某咨詢應(yīng)用(問答類)的產(chǎn)品經(jīng)理發(fā)現(xiàn)登錄、注冊流程的轉(zhuǎn)化率不高,很多用戶即使觸發(fā)了登錄、注冊頁面,也沒有完成操作。請根據(jù)本周內(nèi)容,設(shè)計登錄、注冊頁面的交互原型。
2. 你在日常使用APP的過程中,還見過哪些做的比較好、或者做的不太好的了解、操作、跟進(jìn)的設(shè)計?請舉例分析為什么做得好或者不好。
本文為小密圈“交互小殿堂”本周主題“場景思維”的節(jié)選內(nèi)容。文章后半部分將介紹流程的完整性。感興趣的朋友可加入小密圈“交互小殿堂”查看原文。
關(guān)于小密圈“交互小殿堂”
交互小殿堂設(shè)置了6個主題,幫助你系統(tǒng)學(xué)習(xí)交互:
- 場景思維(2周)
- 心理模型(1周)
- 流程設(shè)計(5周)
- 正確使用控件(15周)
- 測試方案(3周)
- 用研(3周)
以上這些專題,將每周固定發(fā)布在我的小密圈“交互小殿堂”。
同時,為了讓大家更好地掌握每周的專題,安排每周的計劃如下:
- 周一在小密圈“交互小殿堂”獨家發(fā)布一篇主文,介紹本周主題;
- 周二至周五解答圈友們關(guān)于本周主題的問題;
- 周六分享優(yōu)秀交互設(shè)計案例,并帶領(lǐng)大家解析設(shè)計亮點;
- 周日總結(jié)本周所學(xué)。
6個專題結(jié)束后,會為大家提供7個需求,供大家實戰(zhàn),鍛煉之前學(xué)到的技能。
具體的安排如下:
第一周,給出需求說明和重點提示;
第一周剩下的幾天以及第二周,大家根據(jù)需求進(jìn)行交互方案設(shè)計;
第三周集中點評大家的方案,給出建議。
歡迎加入,和大家一起系統(tǒng)學(xué)習(xí)交互。
加入小密圈方法
方法一:可保存下面的二維碼到相冊,然后使用微信“掃一掃”→“從相冊選取二維碼”。注:長按識別二維碼會出bug,導(dǎo)致無法支付(攤手)。
方法二:點擊鏈接加入http://t.xiaomiquan.com/MBiq7qV
現(xiàn)在圈子剛剛建立,實行短暫優(yōu)惠:
兩人一起報名,享8折優(yōu)惠;
三人一起報名,享7折優(yōu)惠;
四人一起報名,享6折優(yōu)惠;
五人及五人以上一起報名,享5折優(yōu)惠;