提升產(chǎn)品易用性

案例分享

Design Tips

設(shè)計(jì)錦囊：

產(chǎn)品無(wú)言，細(xì)節(jié)有聲，項(xiàng)目管理部不定期為大家分享產(chǎn)品設(shè)計(jì)中的優(yōu)秀案例及解讀，從微小之處學(xué)習(xí)產(chǎn)品的設(shè)計(jì)之道，通過(guò)學(xué)習(xí)沉淀將知識(shí)其轉(zhuǎn)為工作所用，逐步搭建廣院設(shè)計(jì)知識(shí)庫(kù)。

0

1

① Airbnb減少不必要的輸入成本

「手機(jī)動(dòng)態(tài)密碼登錄」方式切換為「使用賬號(hào)密碼登錄」時(shí)，輸入的手機(jī)號(hào)碼自動(dòng)帶到「使用賬號(hào)密碼登錄」，減少了11次不必要的點(diǎn)擊輸入。清除按鈕保持顯示，一鍵清除，以便用戶輸入郵箱地址。

②Airbnb信息遮擋／提示不恰當(dāng)

1、鍵盤彈起時(shí)，用戶必須勾選的條約信息被遮擋，iOS用戶需點(diǎn)擊鍵盤「完成」按鈕／Android用戶需點(diǎn)擊右上角下滑鍵盤的按鈕，才能勾選條約完成登錄操作。

??優(yōu)化方案：條約采用跟隨鍵盤移動(dòng)的交互形式，方便用戶勾選，完成注冊(cè)登錄動(dòng)作。

2、錯(cuò)誤信息跟隨鍵盤和“登錄信息失效，請(qǐng)重試”信息提示，并不能明確指示哪項(xiàng)填寫出錯(cuò)。

??優(yōu)化方案：錯(cuò)誤提示信息采用“行內(nèi)提示”的交互方式，提高信息指示性。

Design Tips

0

2

支付寶通過(guò)鍵盤設(shè)計(jì)降低輸入成本

支付寶「停車?yán)U費(fèi)」功能，在鍵盤輸入的體驗(yàn)上做了實(shí)用的小創(chuàng)新：當(dāng)進(jìn)行輸入汽車歸屬地的操作時(shí)，會(huì)彈出信息顯示為各省、直轄市簡(jiǎn)稱的特殊鍵盤，實(shí)現(xiàn)快速點(diǎn)擊輸入，巧妙地利用低成本的細(xì)節(jié)修改降低了用戶的輸入成本。但鍵盤位置與主頁(yè)顯示器沒(méi)留出安全距離，在iPhone X會(huì)造成誤觸手勢(shì)鍵。

??二輪思考：每個(gè)人對(duì)自己的車牌是很熟悉的，打出省份簡(jiǎn)稱只需1-2秒，從這37個(gè)簡(jiǎn)稱里選有可能需要3-5秒，所以該方案是否合理需要數(shù)據(jù)沉淀后才能做出判斷。

Design Tips

0

3

抖音在觸發(fā)點(diǎn)最近的地方顯示彈窗

多數(shù)產(chǎn)品在設(shè)計(jì)模態(tài)彈窗引導(dǎo)用戶進(jìn)行操作行為時(shí)，都會(huì)將操作控件放在固定的頁(yè)面位置(一般居中或者處于頁(yè)面底部)。iOS版抖音會(huì)檢測(cè)用戶進(jìn)行操作時(shí)手指與屏幕的接觸位置，并將模態(tài)彈窗的操控按鈕顯示在離觸發(fā)手指最近的地方(android版只有居中觸發(fā))隨用戶手部活動(dòng)區(qū)域變化而靈活變更位置的模態(tài)彈窗設(shè)計(jì)，使用戶在進(jìn)行手勢(shì)交互的過(guò)程中操作動(dòng)作能始終在手部的舒適區(qū)域內(nèi)進(jìn)行，是應(yīng)對(duì)大屏?xí)r代十分友好的體驗(yàn)設(shè)計(jì)。

?學(xué)習(xí)要點(diǎn)：縮短操作路徑、合理利用點(diǎn)擊熱區(qū)，是提高使用效率和反饋體驗(yàn)的方法之一。

Design Tips

0

4

微博自動(dòng)彈出評(píng)論入口，降低用戶互動(dòng)成本

看微博時(shí)我們常常會(huì)被大量碎片的信息沖擊，無(wú)關(guān)的動(dòng)態(tài)我們習(xí)慣一刷而過(guò)，感興趣的則可能多看幾眼，手動(dòng)評(píng)論互動(dòng)的成本變得越來(lái)越高。「微博」刷關(guān)注欄內(nèi)容，如果在一條動(dòng)態(tài)上停留時(shí)間超過(guò)7秒會(huì)自動(dòng)彈出評(píng)論的快捷入口，以降低用戶互動(dòng)的成本，提高用戶互動(dòng)的積極性。(此方式借鑒ins的設(shè)計(jì)邏輯，很好地提高用戶活躍度與互動(dòng)行為)。這樣鼓勵(lì)評(píng)論的小細(xì)節(jié)設(shè)計(jì)，會(huì)讓你忍不住留下自己的碎碎念嗎？

Design Tips

0

5

QQ查看文檔的同時(shí)，點(diǎn)右上角頭像就能進(jìn)行溝通

QQ為了方便用戶邊看文檔邊溝通，在查看文檔時(shí)，界面右上角顯示聊天對(duì)象的頭像，點(diǎn)擊頭像可以快速調(diào)出對(duì)話框進(jìn)行及時(shí)溝通，發(fā)完消息退出彈窗繼續(xù)閱覽文件。

愛(ài)奇藝看視頻時(shí)，回復(fù)微信消息也是采用在當(dāng)前界面調(diào)出對(duì)話小窗口，有效降低跳出率。提供一個(gè)對(duì)話小窗口，讓溝通更加的及時(shí)和便捷。

Design Tips

0

6

左劃，讓QQ群回復(fù)更簡(jiǎn)單

回復(fù)功能的出現(xiàn)大大降低了我們?cè)赒Q群溝通的成本，長(zhǎng)按內(nèi)容點(diǎn)選「回復(fù)」即可直接標(biāo)明是在應(yīng)答誰(shuí)的話。但能不能有更簡(jiǎn)單的操作？當(dāng)然可以！左劃手勢(shì)直接把操作步驟從兩步簡(jiǎn)化為一步，只需要在想回復(fù)的內(nèi)容上往左劃拉一下，就可以直接觸發(fā)「回復(fù)」功能。這個(gè)手勢(shì)功能不僅讓回復(fù)更加快捷，同時(shí)還大大方便了單手操作的人群。

Design Tips

~END~

文案&圖片 | 項(xiàng)目管理部 徐曉芝 李宜楠

編輯 | 項(xiàng)目管理部 王怡茗

審核 | 辦公室 沙曉磊

總結(jié)

以上是生活随笔為你收集整理的提升的控件 paint()事件被遮挡_设计锦囊 | 提升产品易用性案例分享的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。