用戶體驗好不好?我用案例對比告訴你!
用戶體驗從大框架到小細節都十分重要,往往有一些細節經常被忽視,只有你想不到的,沒有做不好的。今天我舉幾個栗子來對比一下這些細節的用戶體驗。
共享單車摩拜VS共享單車ofo[軟鍵盤]
操作場景
雖然用戶常用的是掃二維碼開鎖,但是輸入號牌開鎖也是不少用戶在用的。共享單車的車牌號解鎖場景要比一般輸入苛刻,因為用戶此時目光需要聚焦到三處:車牌、鍵盤、和輸入框。
問題
- ofo 這樣的鍵盤設計,浪費了7和9下面的空間,這樣鍵盤被劃分成了四列,每個數字鍵都小于食指的寬度。而摩拜單車采用三列,這樣更便于用戶輸入。其實讓用戶不輸錯最好的辦法不是提醒,而是舒適的輸入。
- ofo?的立即用車和確定鍵是同樣的操作,這是最基本的交互設計常識了,同一個頁面同一個操作按鈕不要重復出現。
建議
可以參考摩拜的軟鍵盤設計,把鍵盤分為3列,便于用戶點擊。只保留一個立即用車按鈕。
QQ VS 陌陌[聊天界面返回]
操作場景
我們打開QQ,進入的默認頁面是消息,點擊聯系人找到一個好友,點擊一個好友到好友資料頁面,然后點擊發消息進入聊天頁面。此時點擊返回我們會驚奇的發現返回的是消息頁面,而并非按照流程一步一步返回。但是當我們正常使用的時候卻沒有發現這一類問題的存在。而陌陌卻是按照正常流程一步一步返回。
使用場景
首先我們要知道QQ屬于熟人社交軟件。我們來設想一個qq的使用場景,小高想找小段敘敘舊,已經有好久都沒有聯系了,于是小高打開QQ-通訊錄-找到小段,聊完天之后,此時的小高下一步可能會做什么?看看消息列表有沒有人跟她說話?看看群里都討論了些什么?看看空間都有哪些新動態?這三點的可能性最大,然后1和2都是在消息列表頁。就算通過消息列表頁去看空間操作也很簡單。
所以,使用場景比頁面流程更能提升用戶體驗。返回到消息列表頁更能貼近于用戶下一步想要做的事情。
問題
雖然陌陌是陌生人社交軟件,但是在陌陌里通過通訊錄找好友聊天后,下一個目的可能是看看附近的人,看看有沒有新消息。我們仔細觀察陌陌聊天界面的返回旁邊的紅色圓點數字,是未讀消息的數量,這說明產品設計人員已經考慮到用戶所重視的是未讀消息了,但是返回還是一步一步的進行?
建議
既然陌陌的返回旁邊已經設計了紅色圓點數字,是未讀消息的數量。那么完全可以讓此返回鍵返回到消息頁面。減少用戶一步一步返回的流程。
微軟word?VS?蘋果page[儲存彈出框]
操作場景
當我們儲存一個文檔時,我們首先要知道或操作儲存的位置,然后再點擊儲存按鈕。如果都不知道儲存到哪里這樣會個很多用戶帶來困擾。
問題
蘋果page對話框則問存在哪里,同時提供不儲存的按鈕。而微軟word對話框會問是否儲存,同時提供不儲存按鈕。那么用戶想修改儲存的位置還需要多操作一步?
建議
相比之下page的設計者就聰明多了,將是否儲存帶入到儲存到哪的問題中。word完全可以把儲存和儲存位置放在同一步進行操作。交互設計應從人的行為模式出發,脫離程序思維,這樣用戶就不會覺得產品表現的刻板、愚蠢和失禮 。
蘇寧易購 VS 支付寶[手機充值]
操作場景
手機充值時,蘇寧易購的操作要用戶選擇價格后再按充值按鈕喚起支付,此時是兩步操作。而支付寶點擊價格后直接喚起支付,是一步操作。
問題
支付寶實現了一鍵購買。那么蘇寧易購多話費充值是不是也可以一步完成操作呢?
建議
由于充話費是單選,蘇寧易購的點擊確認操作毫無必要,因此增加了用戶負擔。蘇寧易購完全可以讓用戶點擊完一個金額后就直接喚起支付。好的用戶體驗就是要減少用戶的操作流程,能讓用戶一步完成的操作絕不設計成兩步。
自助飲料購買機VS麥當勞自助點餐機[支付流程]
操作場景
在自助機買飲料。在選擇商品后,屏幕顯示二維碼,用戶掃碼支付,取走飲料。很多人沒有注意到,這中間其實節省了一步選擇支付方式的操作。
麥當勞設計了超級棒的自助點餐系統,但在選擇支付方式這里確搞得復雜了。當用戶生成訂單后必須在支付寶微信和銀聯支付間做選擇。
問題
麥當勞的自助點餐系統是不是可以減少用戶選擇支付方式的一步操作呢?
建議
由于國內已經習慣了微信和支付寶付款,自助機將支付方式默認為支付寶付款(這個二維碼微信支付也有效)。當需要更改時,才需要點擊切換其他方式。所以麥當勞也可以通過默認最多人選項,減少多數人的額外負擔,而對少數人來說也并未增加負擔。
百度VS拉勾[郵箱登錄]
操作場景
百度和拉鉤都是采用郵箱登錄單獨一個頁面,并沒有跟其他登錄方式放在一個頁面。當用戶輸入郵箱的前半部分的時候,更希望可以減少后半部分的輸入。
問題
百度登錄在輸入@之后系統會自動列出所有郵箱后綴,減少用戶的輸入時間,而拉勾在登錄時卻沒有做到這一點,需要用戶自己輸入完整的郵箱。拉鉤明顯增加了用戶的輸入內容,是否可以讓拉勾也減少用戶輸入的內容?
建議
拉鉤可以參考百度登錄,在輸入@之后系統會自動列出所有郵箱后綴。在做交互設計過程中要遵循一個原則:能讓用戶選擇的不要讓用戶輸入。能系統自動生成的,盡量不要讓用戶選擇。
總結
要想做到好的用戶體驗,一定不要忽視細節層面,下面5點是根據上面的案例總結出的交互設計中基本的常識:
- 同一個頁面同一個操作按鈕不要重復出現。任何一個操作區域都要考慮是否方便用戶點擊。
- 交互設計時,按照使用場景設計比按照頁面流程設計更能提升用戶體驗。
- 交互設計應從人的行為模式出發,脫離程序思維。
- 有些選擇可以設計出一種常用的為默認選項,減少大多數用戶的選擇步驟。
- 能讓用戶選擇的不要讓用戶輸入,能程序判斷的不要讓用戶選擇。
大家好!我是一名UX設計師,希望可以與共同喜歡探索用戶體驗的朋友們一起成長!我會不定期地更新一些有關用戶體驗方面的文章。
作者:高杰,微信號公眾號:UX設計師高杰,華點云UX設計師,5年產品交互設計經驗,主導交互設計和用戶體驗工作。
本文由 @高杰 原創發布于人人都是產品經理。未經許可,禁止轉載。
題圖來自 Pexels,基于 CC0 協議
word那個案例不是很認同。word文檔的打開在大多數情況下是用戶點擊應用打開的,那么在保存的時候,用戶是知道在哪的。少部分例外情況是,其他用戶發來的文檔,保存的時候可能忘了保存到哪了,然后在對話框里點擊打開,直接保存下次可能就會找不到地方。
麥當勞那個,其實和外賣一樣,付款時選擇方式,我覺得這是一個可取的方式,因為麥當勞本身并沒有支付功能,一定要喚起其他應用的支付功能才行,雖然說現在大部分人微信支付寶都在用,但是這個默認怎么選擇?如果默認了支付寶但是支付寶沒錢,還要退回重新選擇,反而更麻煩了。而且界面也會有一個問題,就是點好了直接默認支付寶支付,但是如果支付寶沒錢,支付失敗返回的時候還是要跳到支付方式的選擇界面。自動販賣機掃碼的時候用支付寶掃就是支付寶支付,用微信掃就是微信支付,用戶在選擇APP的時候就已經做了決定,這個決定包含了哪個里面有錢,哪個優惠更多等。
還有充值話費的問題,雖然蘇寧的那種方式不是確實麻煩了一點,但是兩次點擊能方便用戶確認和修正。支付寶的話如果點錯了還要返回,所以很難說哪個更好。
僅作為自己的看法,同時希望以后能多交流!
現在已經有一個二維碼同時支持微信、支付寶支付了
自動售賣機并沒有省去付款方式的選擇,這個選擇發生在你拿出手機的時候打開的是哪個APP。麥當勞的那個機器是最后一步選擇付款方式,有三種。如果要設置一種默認的話,需要根據使用率來進行決策,至少有一個付款選項有60%的使用率才可以把它設置為默認。
word 和pages那個案例有問題啊。。。。pages都沒有“保存覆蓋”這個概念,直接關閉就自動存了,word不做自動保存估計考慮到性能問題吧。。。
在生活中體驗
棒棒噠
除了充話費那個,其他的都贊同?。?/p>
1、單手操作這個觀點我贊同,研究發現,大多數用戶都用一只手來使用手機。當他們拿著手機的時候,他們會用右或左拇指與屏幕交互。就像你說的手機越做越大,也就是說拇指很難點擊到最左側一列的鍵盤,也就是1、4、7;你覺得放四列更容易點擊到還是放3列更容易點擊到呢?肯定是3列啊,3列就加寬了左側一列的點擊范圍,因為拇指很難觸碰到手機最左側。還有拇指其實并不容易觸碰到最右下角的位置。其實最容易的位置應該是摩拜鍵盤的數字2和確定鍵的位置。你試一下就知道了,因為拇指觸碰右下角的位置是需要非常彎曲的。彎曲的操作手勢遠遠沒有點擊2和確定鍵直著的手勢舒服。而且人的視覺焦點也不會在右下角。
3、這個沒有絕對的好壞,而是習慣問題,就像你用慣了windows和mac一樣,用慣了mac的人再用windows就會很不習慣,甚至會覺得這個怎么這么難用。其實做產品并不一定要順從用戶的想法,有些時候可以讓用戶適應我們。
4、那個不是流量券,而且充話費跟流量沒有任何關系,就像支付寶一樣下面也會顯示充流量的功能,只不過蘇寧使用tab的形式做的。你說的流量券是上面banner的活動而已,而且活動有單獨的活動頁面。用戶如果需求是充流量,也不會在充話費的頁面停留過長的時間。如果不顯示下面確定按鈕不僅不會影響到充流量的功能,而且會減少充話費的操作步驟。
6、并不只是輸入@之后就顯示后面的后綴,比如你輸入123@1,下面就會顯示123@163.com/123@126.com。而且每個用戶的習慣是不一樣的,有一些用戶就是喜歡直接全部輸入,但是有一些用戶就是懶得輸入。如果加了這個模糊查找的功能,對于懶得用戶而言提升了用戶體驗,而且對于喜歡全部輸入的用戶也并沒有什么不好的影響。用戶體驗絕大多數都沒有做到細節,并不是沒有強烈的需求就不需要優化這些細節的體驗,對于非ux設計崗位的人員來講,這些細節都是可有可無的。但是對于ux設計師來講,就是要貫穿到每一個細節。
1、那你的意思是膜拜沒有ofo考慮的周到?(http://uxmovement.com/mobile/why-mobile-menus-belong-at-the-bottom-of-the-screen/)看一下大屏幕手機和小屏幕手機拇指可觸碰的區域和不可觸碰的區域那張圖吧。你就知道我為什么說1、4不好觸碰到了。ofo的鍵盤,對于小屏幕的手機而言,每個數字鍵都小于食指的寬度。大屏幕的手機而言,很難點擊到1、4點位置。而摩拜單車采用三列,這樣無論是大屏還是小屏更便于用戶點擊。
3、你可以看看我的原文,關注公眾號UX設計師高杰,我原文并沒有寫建議,因為我不會建議誰的產品怎么改,只是對比同樣產品的體驗。因為這個人人社區平臺的要求,必須說出問題解決方案,細化問題。要不然這個稿子不給審核通過。所以才加上建議的,你投稿就知道了,人人的審核現在很嚴格。小編的回復也是非常精細的,明確指示出需要深入問題并給出解決方案,而我并沒有直接寫解決方案,我還是寫了“建議”。就怕有爭執。
4、不選擇金額怎么選流量券?流量券都是滿多少才抵扣多少的。而不是流量券和金額在一起選擇的,應該先選金額后選流量券,我建議你用一下蘇寧的話費充值吧,你都沒試過就來強調這些,蘇寧的是點擊完流量金額后再點擊確認-然后支付的頁面才有選擇優惠券的入口,而并不是在選擇流量金額時就可以選擇流量券,你試試就知道了,如果選擇一個流量金額,沒有確認鍵,直接喚起支付,其實真的少了一步流程。也并沒有影響功能和需求。(請在回復我之前用一下蘇寧的流量充值吧,可別光看我的截圖就自己各種瞎猜,我是真的使用過才發現問題的)
6、是習慣問題,但是確實是有用戶習慣輸入,也有用戶習慣輸入前綴后選擇。其實對于習慣輸入的用戶來講,他的焦點是在鍵盤上或者文本框上,當用戶輸入完了下面哪些其他選擇也就消失了,所以我才說如果加了這個模糊查找的功能,對于懶得用戶而言提升了用戶體驗,而且對于喜歡全部輸入的用戶也并沒有什么不好的影響。
你看看原文去吧 人人這個平臺確實對文章要求很細 都是按照小編給回復的標準寫的 原文并沒有寫建議 因為我最開始寫這個文章的初衷就只是對比 并沒有要建議 都只是在概述對比 原文地址:https://mp.weixin.qq.com/s?__biz=MzA5MTg4MTk5Ng==&mid=100000012&idx=1&sn=9bfe87bc988a904aa05dcb227ffae8b0&chksm=1074d66f27035f79177521c9efdea21eac757cd8f861fc2d5c120e52584521b723dabf7f81dd&mpshare=1&scene=1&srcid=0829a78lzQK8bEZvgyjpf7Vv&key=1be27594fc89b2790cb02dfab1568064c6d066f0a0edbf575a6a7c4745a3b74f394256aa7612b87a2a1ca051ac29100fdae6fee0e9fb4336959cf56830184c6276e3bc7d5f257b0a2cd701f63200e424&ascene=0&uin=MjQ4MDc3NTMyMw%3D%3D&devicetype=iMac+MacBookAir7%2C2+OSX+OSX+10.11.3+build(15D21)&version=12020110&nettype=WIFI&fontScale=100&pass_ticket=obnbPTIUfFmhC287l8H2I3%2Fbyu8SmSdMOoE9OHDlDWdX1Sny%2ByYISPmeLz9rmrEI
還有摩拜確認按鈕的位置 無論是大屏手機還是小屏手機,都是可以用拇指觸碰到的!
心真細?。∈芙塘苏媸?,但是有一點,麥當勞之所以不采取支付寶或微信支付的默認選擇,是不是跟Apple pay和麥當勞有合作關系呢?對麥當勞來說最好的應該是順應跟蘋果的合作,默認顯示Apple pay,而且還有優惠來鼓勵用戶使用。但是為了用戶體驗,或順應市場趨勢,所以才也支持微信和支付寶,而不是默認支付方式的吧?