提升產品體驗及畫好交互圖的4個技巧
在互聯(lián)網(wǎng)產品設計中,提升用戶體驗和繪制高質量的交互圖是確保產品成功的關鍵環(huán)節(jié)。本文將為你提供一些實用的技巧,幫助你更好地優(yōu)化產品體驗,并掌握繪制交互圖的要點。
【如何提升互聯(lián)網(wǎng)產品體驗設計】
1、把用戶假設成一個聰明但是很忙的人,不要指望讓用戶記住任何操作流程,而是隨時提供清晰的指引和盡可能自由的頁面跳轉入口。
2、用戶的高頻操作,應盡量減少操作步驟,而低頻操作,則無需刻意關注步驟數(shù),更應該關注的是每一步的操作難度和界面信息是否易于理解。應盡量降低選擇難度,別讓用戶花時間去理解。
3、一個頁面只突出一個重點,用大小,顏色,形狀來做分類,讓用戶一眼可分辨到重要信息。
4、扁平化和漸進披露相結合,視場景而定,而不是機械地執(zhí)行扁平化。流程扁平化的好處是,可以讓用戶提前感知流程,頁面跳轉的成本也比較低,但是比較考驗對頁面信息的整合處理,漸進披露是預先把次要信息隱藏,當用戶觸發(fā)了對應操作,進入對應流程,才給出相應反饋或指引,好處是讓用戶更專注,減少理解成本。
5、頁面一致性也是這個道理,就我理解,一致性的是為了讓用戶形成習慣,進而減少理解成本。比如,確定操作永遠在右側,選中狀態(tài)永遠高亮,紅色代表嚴重警告等等。當用戶已經形成統(tǒng)一認知,則會大大降低每一次操作的理解成本。但有時候設計師會過于信仰一致性,導致失去個性,我建議在不影響習慣的前提下,可適時打破所謂一致性的束縛,讓設計更加出彩。
6、讓用戶有反悔機會。誤操作后,可恢復,且重要操作需二次確認,并強化感知嚴重性。
7、避免依賴文字說明,多用圖形化的方式讓用戶直接感知,而不是通過理解文字來感知。且文案使用的格式、主語建議統(tǒng)一,這有助于營造整體調性。另外一點,即按鈕文案的使用,建議明確告訴用戶該頁面的目的和功能,同時引導行為,而不是陳述性文案。用動詞+賓語的格式來引導用戶操作,如:“去購買”比“商城”更清楚,“去玩牌”比“游戲”更清楚。
8、需同時考慮多平臺的用戶操作習慣,如ios系統(tǒng)上的應用,頁面需提供返回按鈕,而安卓上的應用,按鈕應避免過于靠近手機底部操作欄,以防誤操作。
【畫好交互圖的4個技巧】
開始說之前,先附上一張筆者原創(chuàng)的交互圖(已脫敏)
一、完整的主干閉環(huán)+可能出現(xiàn)異常反饋
1、確定一個目標,例如:新用戶注冊,從第一步開始,按用戶頁面跳轉順序擺放界面。
2、針對新用戶注冊這個功能,完整的功能交互流程圖,必須包含:新用戶開啟APP,觸發(fā)注冊,注冊流程,完成注冊,進入游戲這幾個關鍵步驟的完整閉環(huán)。
3、在關鍵步驟的主干閉環(huán)之外,需要將所有的異常提示展示出來,如:手機號無效,手機號已注冊,網(wǎng)絡超時等主干流程中可能遇到的異常提示,以及對應處理反饋。
二、按鈕點擊效果+頁面跳轉邏輯
1、主干流程的按鈕,均要描述點擊后的處理,以及可能出現(xiàn)的異常反饋。
2、觸發(fā)頁面跳轉后,需要用箭頭標注跳轉邏輯,兩條流程線之間,盡量不要有十字交疊。
三、標題和注解
1、交互流程圖中,主要包含四類注解:模塊標題、界面標題、界面注解、流程箭頭注解。
2、模塊標題:一般是主干流程的功能名稱,如新用戶注冊流程、充值流程等。
3、界面標題:即每個界面的名稱,如啟動頁、登錄頁等,可展示在每個界面上方,并附帶編號。
4、界面注解:是交互圖中最重要的文字內容,一般展示在對應界面下方,可包含頁面動態(tài)描述,頁面異常情況描述,頁面簡要邏輯描述等。
5、流程箭頭注解:一般是展示在箭頭線上的,對于頁面跳轉的描述,如:點擊注冊跳轉。
四、視覺相關要素
1、視覺焦點:一個界面,盡量只展示一個重點信息,并且使其成為視覺焦點,從面積,放置位置,顏色,字號等元素,都做強化,其他非焦點信息,則弱化。
2、圖像:在交互圖中,每個模塊盡可能用塊狀底色區(qū)分,避免使用過多線框,否則容易使交互圖變得復雜,加重視覺負擔。
3、配色:建議交互圖中,使用一種基準色,如藍色或灰色,疊放層級靠后的模塊,用深藍色,靠前的模塊,用淺藍色。同時,按鈕可單獨使用一種顏色,如綠色。部分需重點突出的元素可用提醒色,如橘色。箭頭可用半透明的黃色等。
4、擺放:所有界面上下對齊,間隔一致,保證工整的視覺效果。
本文由 @Ada冰 原創(chuàng)發(fā)布于人人都是產品經理。未經作者許可,禁止轉載
題圖來自Unsplash,基于CC0協(xié)議
該文觀點僅代表作者本人,人人都是產品經理平臺僅提供信息存儲空間服務
- 目前還沒評論,等你發(fā)揮!