譯文|GoodUI設計技巧(二)

本系列譯自GoodUI.org,文章索引


16. 不要放太多鏈接

為了滿足不同用戶的需要,我們可能會在頁面上增加一個又一個鏈接。但如果你的目的是想讓用戶點擊頁面下方那個重要按鈕,每增加一個鏈接,都會降低他點擊按鈕的概率。所以請注意網頁上鏈接的數量,盡可能平衡鏈接和按鈕間的關系。刪除多余的鏈接可以增加用戶點擊按鈕的概率。


idea016

17. 顯示元素狀態

在頁面直接顯示元素狀態。比如郵件分已讀、未讀,電子賬單有已支付和未支付狀態等等。告訴用戶這些狀態很有必要,它們還可以幫助用戶了解自己過去的操作是否已經成功,接下來應該采取什么行動。


idea017

18. 把好處寫在按鈕標題上

想象頁面上有兩個簡單的按鈕。一個按鈕告訴你點擊它「獲取折扣」,另一個則是「注冊」。我打賭大部分人會選擇前者,因為點擊第二個看起來沒有任何價值,相反,還會聯想到冗長的表單。也就是說,讓用戶感受到好處的按鈕更有可能被點擊。另外,不一定要把這些信息作為按鈕標題,也可以把它們放在按鈕旁邊。


idea018

19. 直接在元素上操作

直接在元素上操作最直觀明了。以數據列表為例,我們通常把對條目的操作直接放在條目上,而不是放在列表外。另外,單擊某個條目可以直接進入編輯狀態。這種方式比選中條目再點擊按鈕的方式要簡便。當然,對于沒有上下文的通用操作(比如添加按鈕)則不必如此。


idea019

20. 在產品引導頁直接提供注冊表單

在傳遞產品價值的引導頁中,直接提供注冊表單比點擊按鈕再彈出表單要好很多。首先,減少了額外的步驟,流程變得簡潔,節省了用戶時間。其次,在一開始就顯示注冊表單,可以讓用戶直觀的感受到要填寫的內容沒多少,不會花時間。當然,這種情況只適合在表單非常簡單的情況。


idea020

21. 使用平滑的過場動畫

已測試!我們對自己的網站進行A/B測試,總共進行了6次實驗,其中有1次提高了31%的注冊轉化率。

用戶操作時,頁面元素會經常顯示、隱藏、移動、放大縮小等。為這些元素增加淡入淡出等過渡動畫,能讓用戶更容易理解剛才的操作帶來了什么變化,并且給予用戶足夠的時間來觀察變化的大小和位置。要注意的是,過場動畫不宜過長,盡量控制在0.5秒以內,否則部分用戶會不耐煩。


idea021

22. 循序漸進地引導,不要直接讓用戶注冊

Datastories Issue #9測試,提高了232%的注冊轉化率。

與其讓用戶倉促注冊,不如讓用戶先進行一些體驗式的操作,通過這些操作向用戶證明產品的價值。這樣的初始互動可以向用戶展示產品功能,一旦用戶看到它們,會更樂意注冊。這種循序漸進的引導盡量推遲用戶注冊的時間,并允許用戶在沒有注冊的情況下進行一些個性化設置。


idea022

23. 不要使用太多邊框

注意力是寶貴的資源,我們在特定時間內擁有的注意力有限。邊框可以定義一個非常清楚和準確的空間,但是它們也會吸引和分散用戶的注意力。為了不過多吸引用戶注意力,在排版時我們可以通過縮小組內元素邊距、增加組和組之間邊距、使用不同背景色、將文字對齊等方法來劃分區域。當使用UI設計工具時,我們很容易在頁面上拖拽出許多區域,這些區域多了就會雜亂無章,所以我們又會使用線條來分隔它們,從而導致問題。但使用上面說的那些方式,能讓頁面更簡潔清晰。


idea023

24. 展示產品帶給用戶的好處

用戶往往關心產品能給他們帶來什么好處,而不是產品有什么特性。知道產品帶來的好處,能讓他們更清楚地評估產品的價值。Chris Guillebeau 在《The $100 Startup》中寫到,人們期望能擁有更多的:愛、金錢、認同感和自由支配的時間,同時有更少的:壓力、沖突、煩心事和不確定性。所以我相信,在展示產品時,告訴他們能獲得什么好處很有必要。


idea024

25. 設計零數據頁面

頁面上經常需要使用不同方式來呈現不同數量的數據,從0,1,10,100到10000+等。最常見的問題是在程序第一次使用還沒有任何數據時,頁面該如何呈現。我們經常忘記設計這種初始狀態。當程序初始沒有任何數據時,用戶看到的就是一片空白,此時用戶可能不知道該進行哪些操作。利用這個頁面可以讓用戶學習和熟悉如何使用程序,讓用戶跨越最初的障礙。


idea025

26. 默認幫用戶選中服務

默認幫用戶選中服務,意味著用戶如果要使用服務,不需要做額外的操作。與此相反的做法是默認不選中服務,用戶需要時再打開。前者有兩個好處。首先,它緩解了行動的阻力,因為用戶不需要做任何事。其次,這也是某種形式的推薦,它暗示用戶「其他人都這么做,你也可以這樣做」。當然,這種方式也存在爭議,有強迫用戶的感覺。有一些不道德的公司,會刻意降低文本的可讀性,或使用雙重否定等混亂的文本來迷惑用戶,讓用戶不知道打開了什么服務。因此若選擇這種方法,文本務必清晰易懂,好讓用戶知道開啟的是什么服務。


idea026

27. 頁面設計盡量保持一致

頁面設計時盡量保持一致可能是唐納德·諾曼最有名的原則,它可以減少用戶的學習成本。當我們按下按鈕,或移動滑塊,我們期望這些元素的行為和以往見到的一致。如果不一致,我們將被迫重新學習。要做到一致性,得在很多方面下功夫,包括:顏色、方向、行為、位置、大小、形狀、標簽和語言等。但要注意,在一些特定場景下打破一致性的做法仍然有價值。不一致的元素或行為會讓用戶下意識的關注——如果想讓用戶注意,可以嘗試這么做。


idea027

28. 使用恰當的默認值

Datastories Issue #11測試(這次測試還包括許多其它變化),提高了34%的購買率。

表單字段提供恰當的默認值能大大減少用戶工作,為他們節省時間。一個糟糕的設計會反復要求用戶提供數據,哪怕他們已經在過去重復提供多次。對用戶來說,工作越少越好。


idea028

29. 遵循用戶習慣

如果我們在設計上保存一致,用戶就不用反復學習。另一方面,如果我們遵循用戶的使用習慣,也能減少用戶的學習成本。遵循習慣,用戶不用思考就知道在屏幕右上角關閉窗口,或者知道點擊設置按鈕后會發生什么。當然,習慣有可能會過時,隨著時間推移,同樣的操作可能會被賦予新的含義。要注意,只有給用戶帶來的好處大于弊端時,才能打破用戶習慣。


idea029

30. 告訴用戶產品能幫他避免損失

我們喜歡成功,厭惡失敗。心理學研究表明,我們更傾向于避免損失而不是獲取收益。這一結論也可應用在產品設計和推廣中。試圖說明產品會幫助客戶維護現有的利益、財富或社會地位,可能好過告訴用戶這個產品能給他們帶來哪些新利益。比如保險公司,是強調產品能幫助用戶避免失去財產好,還是強調出事后能夠得到大筆賠償好呢?

idea030

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,786評論 1 92
  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,814評論 25 708
  • 無意中發現一篇很全面的分析App用戶增長方法的文章,文中的大牛Asatryan是一款我非常喜歡且欣賞的app - ...
    薛斯塔閱讀 3,528評論 7 110
  • 今天兒子和我說:“媽媽,我們托輔的黃老師快生小寶寶了?!蔽译S口回應了聲,也沒多想,兒子又走到我跟前說:“媽媽...
    董勝杰麻麻閱讀 180評論 0 1
  • 直到公司發了月餅,才意識到還有兩天就中秋了。 不知從何時起,隨著年歲的增長,中秋在心里已是平平淡淡了?,F...
    吳昌露閱讀 159評論 1 1