2018-8-28 資深UI設(shè)計(jì)者
如果您想訂閱本博客內(nèi)容,每天自動(dòng)發(fā)到您的郵箱中, 請(qǐng)點(diǎn)這里
閱讀之前,溫馨提示下,文中提到的 UI設(shè)計(jì)方式不一定有對(duì)錯(cuò),如果使用得當(dāng),它們都有很大的可能性。
也許你會(huì)知道這種感覺(jué),當(dāng)你打開(kāi)一個(gè)新的網(wǎng)頁(yè),閱讀到一半時(shí),突然被一個(gè)巨大的浮層打斷,要求填寫電子郵箱。大多數(shù)人第一反應(yīng)是關(guān)閉彈窗或關(guān)閉整個(gè)網(wǎng)頁(yè)。
這么多網(wǎng)站都會(huì)使用這種方式,其用意顯而易見(jiàn)。然而,這種方式對(duì)用戶產(chǎn)生了非常負(fù)面的影響——中斷了用戶正在做的事(對(duì)用戶來(lái)說(shuō)重要的事)并將注意力集中在另一件事情上(對(duì)網(wǎng)站來(lái)說(shuō)重要的事)。在你試圖要求獲取用戶信息之前,最好等用戶完成當(dāng)前的事情(例如,閱讀并熟悉內(nèi)容)。讓他們有機(jī)會(huì)選擇是否做某件事情,而不是強(qiáng)迫他們?nèi)プ觥?
無(wú)限滾動(dòng)是指用戶可以通過(guò)無(wú)限地向下滾動(dòng)瀏覽頁(yè)面大量?jī)?nèi)容。當(dāng)您向下滾動(dòng)頁(yè)面時(shí),它可以一直刷出新的內(nèi)容。雖然聽(tīng)起來(lái)很好,但這種方式并不適用于所有網(wǎng)站,也不是 APP 的通用解決方案。
△ 圖片來(lái)源:Geo Law
這種方式的缺點(diǎn)也是它的優(yōu)勢(shì)——它是沒(méi)有終點(diǎn)的。用戶訪問(wèn)到網(wǎng)頁(yè)的某一個(gè)位置,他們無(wú)法記錄當(dāng)前瀏覽位置以便于稍后回到同一位置。當(dāng)用戶離開(kāi)了網(wǎng)站,他們將失去之前訪問(wèn)的所有進(jìn)度,不得不再次向下滾動(dòng)頁(yè)面返回到同一位置。這種方式無(wú)法確定用戶的滾動(dòng)位置,不僅會(huì)對(duì)用戶造成煩擾或混淆,而且還會(huì)使整體用戶體驗(yàn)變差。
2012年,Etsy 花了很多時(shí)間實(shí)現(xiàn)電商網(wǎng)站的無(wú)限滾動(dòng)界面,但是卻發(fā)現(xiàn)新界面的體驗(yàn)不如翻頁(yè)。雖然購(gòu)買數(shù)量沒(méi)有什么變化,但用戶參與度卻下降了(人們有目的地使用搜索的次數(shù)下降)。
正如 Dmitry Fadeyev 指出:
設(shè)計(jì)師在設(shè)計(jì)中加入無(wú)限滾動(dòng)之前,應(yīng)該權(quán)衡它的優(yōu)缺點(diǎn)。選擇取決于場(chǎng)景以及內(nèi)容的傳遞方式。一般來(lái)說(shuō),無(wú)限滾動(dòng)適用于像 Twitter、Instagram 這樣的產(chǎn)品,用戶在消耗無(wú)窮無(wú)盡的數(shù)據(jù)流時(shí)不會(huì)特別尋找特定的內(nèi)容。
譯者注:作者在《UX: Infinite Scrolling vs. Pagination》中提到無(wú)限滾動(dòng)的優(yōu)缺點(diǎn):
1. 無(wú)限滾動(dòng)的優(yōu)點(diǎn)
用戶停留的時(shí)間更長(zhǎng),提升用戶參與度。當(dāng)用戶沒(méi)有特定尋找的內(nèi)容時(shí),可以通過(guò)瀏覽海量信息找到自己喜歡的內(nèi)容(如Pinterest、Facebook)。
滾動(dòng)比點(diǎn)擊操作更快更容易,分頁(yè)展示每次內(nèi)容更新都需要額外點(diǎn)擊等待加載。無(wú)限滾動(dòng)對(duì)于移動(dòng)設(shè)備很友好,移動(dòng)設(shè)備的手勢(shì)控制讓滾動(dòng)更自然。
2. 無(wú)限滾動(dòng)的缺點(diǎn)
影響頁(yè)面性能,加載速度慢,用戶無(wú)限的向下滾動(dòng),加載更多的內(nèi)容,頁(yè)面的性能會(huì)越來(lái)越低。
無(wú)法定位到上一次瀏覽的位置,需要重新不斷下拉回到同一位置。
網(wǎng)站右側(cè)的滾動(dòng)條變得無(wú)關(guān)緊要,反映不出數(shù)據(jù)量,當(dāng)你以為快要接近底部,引誘你繼續(xù)向下滾動(dòng),結(jié)果更多的內(nèi)容又呈現(xiàn)出來(lái)。
缺少頁(yè)腳,用戶有時(shí)候需要查看某些信息,去頁(yè)腳查看發(fā)現(xiàn)沒(méi)有。這些信息可以展示在別的地方,或者加上「加載更多」的按鈕來(lái)響應(yīng)用戶對(duì)更多內(nèi)容的需求。
結(jié)論:無(wú)限滾動(dòng)適用于用戶沒(méi)有特定目的的原創(chuàng)內(nèi)容網(wǎng)站(Twitter,F(xiàn)acebook)或者視覺(jué)(Pinterest,Instagram)的網(wǎng)站和 app,分頁(yè)則適用于用戶在尋找特定信息的搜索結(jié)果列表,以及用戶瀏覽位置重要的地方。谷歌的圖片用了無(wú)限滾動(dòng),相對(duì)于文本搜索,用戶可以更快地瀏覽和操作圖片,文本搜索則需要花費(fèi)更長(zhǎng)的時(shí)間。
3. 使用無(wú)限滾動(dòng)的建議
您是否注意過(guò)每天從各種應(yīng)用收到的通知和提醒消息的數(shù)量?其中您真正關(guān)心的通知有多少?
每天用戶都會(huì)被沒(méi)用的推送轟炸,分散日常活動(dòng)的注意力,并感到惱火。
惱人的推送通知是人們卸載移動(dòng)應(yīng)用程序的首要原因(根據(jù)調(diào)查受訪者的比例為71%)。
當(dāng)用戶開(kāi)始使用 APP 時(shí),如果推送內(nèi)容足以讓用戶「愿意被打斷」,他們就不會(huì)那么在意收到推送消息,換句話說(shuō),這意味著推送消息必須讓用戶覺(jué)得足夠有用和有趣。因此,為用戶推送有感染力并使之愉悅的定制化內(nèi)容才是關(guān)鍵。
推送通知是一項(xiàng)特權(quán),因?yàn)橛脩粜湃文?,才允許你直接向他們發(fā)送消息,你不能濫用這個(gè)特權(quán)。
為用戶設(shè)計(jì)有用,相關(guān)和及時(shí)的通知非常重要。推送通知可以成為企業(yè)直接與用戶溝通的強(qiáng)大工具,并在適當(dāng)?shù)臅r(shí)間和地點(diǎn)傳遞正確的信息,以促進(jìn)互動(dòng)。
譯者注:作者在《Mobile UX Design: What Makes a Good Notification?》、《How to create effective push notifications》中提到推送通知需要注意幾點(diǎn):
適當(dāng)?shù)臅r(shí)間。尊重當(dāng)?shù)氐臅r(shí)間,不要在用戶睡眠的時(shí)候發(fā)送通知,比如國(guó)際化的 APP 針對(duì)不同的地區(qū)調(diào)整推送時(shí)間。Andrew Chen 收集了一些數(shù)據(jù)顯示推送打開(kāi)率在下午6點(diǎn)后更高,當(dāng)用戶參與度最高的時(shí)候,在下午6-8點(diǎn)時(shí)發(fā)送推送通知。
△ 圖片來(lái)源:Andrew Chen和 Leanplum
限制次數(shù)。設(shè)置一個(gè)合理的推送次數(shù),一些 APP 只要觸發(fā)了與你相關(guān)的信息就會(huì)提醒你,過(guò)多的推送可能會(huì)引起用戶的不適。
個(gè)性化定制不同的推送內(nèi)容給不同的用戶,推送對(duì)用戶有價(jià)值的內(nèi)容。比如根據(jù)用戶的瀏覽歷史做相關(guān)用戶感興趣的推送。
發(fā)送消息之前應(yīng)該確定好目標(biāo),跟蹤數(shù)據(jù),確認(rèn)推送是否達(dá)到了效果。
藍(lán)藍(lán)設(shè)計(jì)( m.sillybuy.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)。
藍(lán)藍(lán)設(shè)計(jì)的小編 http://m.sillybuy.com