從大廠APP里來看同款功能如何PK

7 評(píng)論 7878 瀏覽 10 收藏 12 分鐘

編輯導(dǎo)語:在互聯(lián)網(wǎng)時(shí)代,各種各樣的APP不斷地推陳出新,系統(tǒng)和功能也在不斷地升級(jí),本篇文章作者通過從大廠APP中同類型的APP進(jìn)行同款功能的PK,分析其中的優(yōu)缺點(diǎn)以及存在的問題,感興趣的一起來看一下吧。

互聯(lián)網(wǎng)信息化時(shí)代,隨著產(chǎn)品越來越多,我們打開手機(jī)仔細(xì)看的話會(huì)發(fā)現(xiàn),頁面布局都是類似的甚至交互方式也很像。

確實(shí),大多數(shù)產(chǎn)品設(shè)計(jì)顯示出一種趨同性,但是趨同性并不是缺點(diǎn)。

降低用戶學(xué)習(xí)成本要求盡可能依據(jù)用戶既有經(jīng)驗(yàn)進(jìn)行任務(wù)和流程設(shè)計(jì)。

雅各布定律認(rèn)為,用戶將大部分時(shí)間花在別人家的產(chǎn)品上,而不是你的。

這意味他們希望你的產(chǎn)品跟別人的有相同的操作方法和使用模式。

但筆者也注意到,一些產(chǎn)品在這樣的趨勢(shì)中仍然保持著難以被模仿的水準(zhǔn),及優(yōu)秀的用戶體驗(yàn)。

筆者列舉了6個(gè)產(chǎn)品中的3個(gè)功能進(jìn)行思考分析:為什么他們能夠脫穎而出?

一、哈啰出行 VS T3出行

1. 對(duì)比分析

在這特定景下二者流程基本是一致的,從截圖可以得知的區(qū)別在于:用戶強(qiáng)制退出后,哈啰出行并沒有調(diào)用取消訂單的下車點(diǎn)數(shù)據(jù)返回到前端顯示在【下車點(diǎn)】供用戶選擇。

  • 在正常流程下:用戶打車取消訂單后,哈啰出行和T3出行都會(huì)有一個(gè)【是否重新叫車】的選項(xiàng),選擇【是】則會(huì)調(diào)取用戶之前已取消訂單的數(shù)據(jù)作為上車點(diǎn)和下車點(diǎn),用戶不需要重新選一遍。
  • 在異常流程下:用戶強(qiáng)制退出后重新叫車,那么哈啰出行的體驗(yàn)就沒有超出用戶預(yù)期,因?yàn)楣鲂嗅槍?duì)異常流程并沒有提供給用戶解決方案。

注:本文所述的是,用戶打車后—取消訂單——強(qiáng)制退出——重新打車,這一特定使用場(chǎng)景。

因此其他(比如是否聯(lián)網(wǎng)、訂單是否付款、預(yù)付車費(fèi)等)這些異常流程沒有體現(xiàn)在流程圖上。

1)哈啰出行

強(qiáng)制退出APP后,用戶重新叫車的下車點(diǎn)和取消訂單的下車點(diǎn)一致,那么就需要重復(fù)操一遍,增加了用戶使用成本,降低了用戶打車效率。

2)T3出行

強(qiáng)制退出APP后,用戶重新叫車,直接選擇將取消訂單的下車點(diǎn),作為本次訂單的下車點(diǎn)。

不需要重新操作一次。

提前偵測(cè)用戶預(yù)期,自動(dòng)把期望的操作結(jié)果呈現(xiàn)出來,而不需要用戶參與。

看似很小的功能,但是結(jié)合特定的使用場(chǎng)景,為用戶多想一步,直達(dá)快捷的操作入口,提供最短的操作路徑完成需求,降低用戶操作的成本與時(shí)間。

3)設(shè)計(jì)思考

如何做出超出用戶預(yù)期的產(chǎn)品體驗(yàn)?

  • 為用戶多想一步,考慮用戶在不同場(chǎng)景下使用過程中會(huì)出現(xiàn)的問題;
  • 在設(shè)計(jì)中非常有必要考慮防錯(cuò)機(jī)制,尤其是用戶的操作具有毀滅性效果的功能時(shí)。

在偵測(cè)用戶預(yù)期上:T3出行做的比哈啰出行更出色。

二、微信朋友圈 VS QQ空間說說

微信朋友圈發(fā)動(dòng)態(tài)和QQ空間發(fā)說說,業(yè)務(wù)流程基本一致,甚至界面布局也比較相似。

區(qū)別在于用戶編輯文字內(nèi)容超出最大字?jǐn)?shù)限制后,二者的交互細(xì)節(jié)。

1. QQ空間寫說說

觸發(fā):用戶編輯文字時(shí),內(nèi)容超出最大字?jǐn)?shù)限制(10000字)。

行為:右上角的【發(fā)表】按鈕置灰,右下角提示當(dāng)前內(nèi)容超出的字符數(shù),用戶可以編輯但不能發(fā)布。內(nèi)容在最大字符數(shù)內(nèi),【發(fā)表】按鈕恢復(fù)。

2. 朋友圈發(fā)布動(dòng)態(tài)

觸發(fā):用戶編輯的內(nèi)容超出最大字?jǐn)?shù)限制(2000字),點(diǎn)擊【發(fā)表】。

行為:單確認(rèn)按鈕提示彈窗頁面居中出現(xiàn),出現(xiàn)后點(diǎn)擊【我知道了】按鈕,彈窗消失。

1)對(duì)比分析

  • 用戶在微信朋友圈發(fā)動(dòng)態(tài),在編輯內(nèi)容時(shí)如果超出最大字?jǐn)?shù)限制(2000)系統(tǒng)不會(huì)提示用戶,用戶只有點(diǎn)擊【發(fā)表】才知道,原來自己的內(nèi)容超出限制了不能發(fā)表。
  • 這種反饋相對(duì)來說是非常遲鈍了,雖然不會(huì)影響主流程的提交,但是會(huì)導(dǎo)致用戶不能及時(shí)發(fā)現(xiàn)錯(cuò)誤,需要重新回過頭再編輯、再提交、再報(bào)錯(cuò),這樣會(huì)嚴(yán)重影響使用效率。
  • 用戶在QQ空間寫說說,當(dāng)編輯內(nèi)容超出最大字符限制后,即被告知用戶字符超出限制,而不是等用戶全部編輯完內(nèi)容點(diǎn)擊【發(fā)表】后才提示,實(shí)時(shí)狀態(tài)將錯(cuò)誤扼殺在搖籃中。QQ空間有效的在用戶出錯(cuò)之前就盡量避免錯(cuò)誤的發(fā)生。

2)設(shè)計(jì)思考

微信如此國(guó)民級(jí)產(chǎn)品會(huì)犯這種低級(jí)錯(cuò)誤嗎?

“微信朋友圈不鼓勵(lì)發(fā)文字,是因?yàn)樾畔鞑ビ械燃?jí),圖片門檻低”。——張小龍

  • 朋友圈功能存在意義在于:促進(jìn)用戶朋友之間的關(guān)系,使其更加親近、相互了解。用圖片、視頻、文字等功能…可以更詳細(xì)、更形象地描述用戶的生活。讓朋友間的生活、思想有更進(jìn)一步的了解。
  • 試想,朋友間相隔兩地用照片或者視頻再加上用戶內(nèi)心感受的文字描述,來闡述事情所發(fā)生的過程,才能達(dá)到即使朋友不在現(xiàn)場(chǎng)也可以感受到現(xiàn)場(chǎng)氣氛的水平。
  • 另外,朋友圈非張貼復(fù)制的文字內(nèi)容如果超過100字就會(huì)在顯示的時(shí)候被折疊。更何況用戶文字編輯2000字以上的內(nèi)容發(fā)朋友圈概率是很小的。

所以微信在極限字?jǐn)?shù)的處理從實(shí)際使用場(chǎng)景上看:并不能算做bug。

從程序角度看:QQ空間在內(nèi)容錄入字?jǐn)?shù)極限值的交互細(xì)節(jié)上比微信朋友圈體驗(yàn)更細(xì)致。

三、美團(tuán)截屏分享 VS 百度網(wǎng)盤截屏分享

1. 百度網(wǎng)盤

觸發(fā):截屏觸發(fā)分享控件,浮層由下之上滑出,頁面其余部分顯示為半透明遮罩。

行為:點(diǎn)擊遮罩處或右上方浮層關(guān)閉按鈕,浮層向下收起,半透明遮罩消失。

2. 美團(tuán)

觸發(fā):截屏后生成當(dāng)前頁面縮略圖且居中出現(xiàn),其余部分為半透明遮罩。觸發(fā)分享控件,浮層由下之上滑出。

行為:點(diǎn)擊遮罩處或底部取消按鈕,浮層向下收起,頁面縮略圖及半透明遮罩消失。

1)對(duì)比分析

如果單看美團(tuán)截屏的第一張圖——都會(huì)認(rèn)為左邊屏幕留白太多 空著一大塊,視覺上極不協(xié)調(diào)。

甚至?xí)朊缊F(tuán)也會(huì)犯這種低級(jí)錯(cuò)誤?相信大部分人對(duì)于這種“分享控件”需求會(huì)這樣設(shè)計(jì):

【左右對(duì)齊、水平分布排列3個(gè)分享圖標(biāo)】,因?yàn)榘俣染W(wǎng)盤確實(shí)就是這么干的。

  • 在百度網(wǎng)盤截屏分享時(shí):ios用戶(沒有關(guān)閉編輯截屏功能的)截屏后左邊分享到微信好友的按鈕,被系統(tǒng)的“編輯截屏窗口 ”遮擋了一半,導(dǎo)致用戶難以準(zhǔn)確點(diǎn)擊。
  • 因?yàn)閕os用戶?截屏后左下角都會(huì)出現(xiàn)編輯截屏窗口,只有左滑才會(huì)消失,否則編輯窗口會(huì)停留5秒鐘。如錄屏所示:用戶很容易點(diǎn)到截圖編輯,再返回需要退出2次,操作路徑很繁瑣。
  • 因此美團(tuán)左邊的留白其實(shí)是為ios用戶截屏后“編輯截屏窗口”特意預(yù)留的位置。用戶在美團(tuán)截屏后分享到微信好友點(diǎn)擊就不會(huì)受到影響。
  • 美團(tuán)考慮到了當(dāng)前產(chǎn)品的交互方式和系統(tǒng)“沖突”時(shí),根據(jù)系統(tǒng)的特性做出調(diào)整。美團(tuán)靜態(tài)圖上看似不協(xié)調(diào)的布局方式實(shí)際是考慮到了不同的用戶在實(shí)際使用中的真實(shí)場(chǎng)景。

2)設(shè)計(jì)思考

為什么眾多大廠產(chǎn)品都中意這種底部浮層的截屏分享交互方式?

缺點(diǎn):分享圖標(biāo)容易與ios系統(tǒng)截屏編輯窗口沖突。

優(yōu)點(diǎn):

  • 方便用戶點(diǎn)擊,也是費(fèi)次定律運(yùn)用的體現(xiàn)。并且據(jù)研究表明,人們?cè)谑褂檬謾C(jī)的時(shí)候,75%的交互操作都是由拇指驅(qū)動(dòng)的,而拇指默認(rèn)懸停的位置恰好在屏幕下方,用戶操作成本小。
  • 對(duì)用戶干擾程度低,浮層在底部屏幕展示的內(nèi)容多,對(duì)用戶瀏覽其他內(nèi)容影響較小。比較符合用戶預(yù)期。
  • 拓展性強(qiáng),如果在版本迭代中遇到增加或者修改的需求,改動(dòng)很方便基本上不影響界面布局,前端調(diào)整起來很快。
  • 用戶習(xí)慣,不僅局限于分享,很多功能都采用這種底部浮層的交互方式,遵循培養(yǎng)出來的用戶習(xí)慣操作。

當(dāng)產(chǎn)品交互方式與系統(tǒng)“沖突”時(shí)美團(tuán)注意到了這一點(diǎn),并且做出了解決方案應(yīng)對(duì)。

四、結(jié)語

盡管有越來越多的產(chǎn)品趨同,但是在用戶體驗(yàn)、交互設(shè)計(jì)的每一個(gè)流程,我們依然能體會(huì)到差異。

誰能夠更好地把握用戶的情感訴求、站在用戶角度考慮設(shè)計(jì)交互的每一個(gè)細(xì)節(jié)、超出他們的預(yù)期、給到功能以外的驚喜。

就能夠在當(dāng)今日益激烈的競(jìng)爭(zhēng)中贏得一席之地。

 

本文由 @ Kronol 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載。

題圖來自 Unsplash,基于 CC0 協(xié)議。

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 對(duì)于QQ那個(gè)發(fā)表變灰,有時(shí)候還需要楞一下思考思考為什會(huì)變灰,不能點(diǎn)擊發(fā)表

    回復(fù)
  2. 美團(tuán)截屏那個(gè)是2021年發(fā)現(xiàn)的,所以沒有錄屏?,F(xiàn)在這個(gè)功能版本迭代已經(jīng)不在了。。。表達(dá)那個(gè)意思就行

    來自云南 回復(fù)
  3. 卷起來吧,同款功能競(jìng)爭(zhēng)起來,這樣才能帶給用戶越來越多方便好用的設(shè)計(jì)

    來自河北 回復(fù)
  4. 其實(shí)我覺得各類設(shè)計(jì)都還是要以便利為主,流程太復(fù)雜體驗(yàn)感不行,就是要簡(jiǎn)而精

    來自中國(guó) 回復(fù)
  5. 盡管有越來越多的產(chǎn)品趨同,但是在用戶體驗(yàn)、交互設(shè)計(jì)的每一個(gè)流程,我們依然能體會(huì)到差異

    來自中國(guó) 回復(fù)
  6. 1.哈嘍vs T3,調(diào)用上個(gè)訂單時(shí)做好有邏輯判斷,沒有數(shù)據(jù)先敲一個(gè),if強(qiáng)制退出后2分鐘內(nèi)再打開界面,then填充上個(gè)訂單的目的地作為目的地,目前所在地為出發(fā)地;

    回復(fù)
    1. ??

      回復(fù)