十萬(wàn)個(gè)產(chǎn)品細(xì)節(jié)推導(dǎo)(六)
編輯導(dǎo)語(yǔ):產(chǎn)品設(shè)計(jì)最終是服務(wù)于用戶的,而交互體驗(yàn)的優(yōu)化可以讓用戶更加輕松便利地使用產(chǎn)品、獲得所需信息,進(jìn)而推動(dòng)產(chǎn)品的用戶留存。本篇文章里,作者對(duì)一些產(chǎn)品設(shè)計(jì)細(xì)節(jié)中的交互方案進(jìn)行了總結(jié)和優(yōu)化思考,一起來(lái)看一下吧。
一、?【即刻】-有趣的頭像拖拽設(shè)計(jì)
1. ?【使用場(chǎng)景】
使用「即刻」時(shí),在界面中增加趣味性的設(shè)計(jì)細(xì)節(jié),可提升用戶對(duì)產(chǎn)品的好感。
2. ?【設(shè)計(jì)思考】
設(shè)計(jì)目標(biāo):解決界面中缺乏互動(dòng)趣味性的問(wèn)題;新增有趣好玩的設(shè)計(jì)細(xì)節(jié)。
設(shè)計(jì)方案:在「?jìng)€(gè)人中心」界面,長(zhǎng)按頭像后可以在屏幕中隨意的拖動(dòng)旋轉(zhuǎn)。雖然用處不大,不過(guò)這樣的彩蛋設(shè)計(jì)很好的體現(xiàn)了產(chǎn)品的好玩、有趣。
二、?【夸克】-超好使的光標(biāo)定位形式
1. ?【使用場(chǎng)景】
用戶在編輯網(wǎng)址或者文案時(shí),想要把光標(biāo)定位在指定的文字旁非常不便,經(jīng)常操作失誤。
2. ?【設(shè)計(jì)思考】
設(shè)計(jì)目標(biāo):解決光標(biāo)定位不精確的問(wèn)題;優(yōu)化光標(biāo)定位的交互形式,提升用戶效率。
設(shè)計(jì)方案:在夸克瀏覽器定位光標(biāo)時(shí),長(zhǎng)按輸入框下方的滑動(dòng)定位條時(shí)會(huì)直接鋪開(kāi),方便用戶左右滑動(dòng)進(jìn)行精確定位,避免了操作的失誤,很好提高了效率。
三、?【微信讀書】-貼心的定位目錄內(nèi)容
1. ?【使用場(chǎng)景】
用戶在瀏覽目錄時(shí),經(jīng)常會(huì)手動(dòng)去滑到頂部/滑到底部,既浪費(fèi)時(shí)間也增加用戶的操作成本。
2. ?【設(shè)計(jì)思考】
設(shè)計(jì)目標(biāo):解決瀏覽目錄時(shí)沒(méi)有定位的問(wèn)題;新增瀏覽目錄的快捷操作,提升用戶效率。
設(shè)計(jì)方案:在微信讀書中,用戶只需點(diǎn)擊「去當(dāng)前」自動(dòng)定位到當(dāng)前閱讀的目錄上;點(diǎn)擊「去底部」自動(dòng)定位到目錄的底部;點(diǎn)擊「去頂部」自動(dòng)定位到目錄的頂部。操作起來(lái)很便捷高效。
四、?【格志日記】-響應(yīng)式的格子布局
1. ?【使用場(chǎng)景】
用戶每天寫日記時(shí),只有一篇時(shí)不能很好的利用屏幕空間,當(dāng)篇幅較多時(shí),無(wú)法全部呈現(xiàn)在首屏。
2. ?【設(shè)計(jì)思考】
設(shè)計(jì)目標(biāo):解決日記的顯示問(wèn)題;優(yōu)化不同篇幅時(shí)日記的顯示樣式。
設(shè)計(jì)方案:在格志日記中,會(huì)根據(jù)日記的篇幅自動(dòng)調(diào)整日記的顯示樣式,比如2篇時(shí)顯示一列;4篇、8篇……時(shí)顯示兩列。合理利用屏幕空間,讓內(nèi)容全部在首屏顯示。
五、?【iphone相冊(cè)】-如此講究的圖片刪除順序
1. ?【使用場(chǎng)景】
當(dāng)用戶瀏覽相冊(cè)準(zhǔn)備刪除圖片時(shí),刪除后顯示的圖片往往不是自己想要的那張,需要重新選擇再操作。
2. ?【設(shè)計(jì)思考】
設(shè)計(jì)目標(biāo):解決圖片刪除后顯示哪張的問(wèn)題;優(yōu)化圖片的刪除順序。
設(shè)計(jì)方案:圖片的刪除順序根據(jù)用戶瀏覽時(shí)滑動(dòng)的順序來(lái)確定,比如從右往左滑時(shí),刪除后顯示右側(cè)的下一張,反之則相反。很好的符合用戶的操作預(yù)期。
六、?【優(yōu)酷】-進(jìn)度條拖動(dòng)的設(shè)計(jì)細(xì)節(jié)
1. ?【使用場(chǎng)景】
當(dāng)用戶拖動(dòng)視頻進(jìn)度條到自己沒(méi)看過(guò)的內(nèi)容時(shí),經(jīng)常會(huì)出現(xiàn)拖動(dòng)過(guò)頭或者忘記自己看到了哪里。
2. ?【設(shè)計(jì)思考】
設(shè)計(jì)目標(biāo):解決拖動(dòng)進(jìn)度條提示不明顯的問(wèn)題;新增拖動(dòng)時(shí)的視頻內(nèi)容提示。
設(shè)計(jì)方案:在優(yōu)酷中,拖動(dòng)進(jìn)度條時(shí)屏幕中間會(huì)顯示當(dāng)前的播放時(shí)長(zhǎng)以及播放內(nèi)容的縮略圖提示,幫助用戶回憶視頻內(nèi)容,快速定位到自己想看的部分。
七、?【西瓜視頻】-自動(dòng)播放當(dāng)前視頻
1. ?【使用場(chǎng)景】
用戶瀏覽視頻時(shí),每次都要點(diǎn)擊才能開(kāi)始播放視頻,操作重復(fù)不夠便捷。
2. ?【設(shè)計(jì)思考】
設(shè)計(jì)目標(biāo):解決播放時(shí)重復(fù)操作的問(wèn)題;優(yōu)化視頻播放的交互形式。
設(shè)計(jì)方案:在西瓜視頻中,用戶瀏覽到某個(gè)視頻時(shí)都會(huì)自動(dòng)播放該視頻內(nèi)容,減少了用戶的操作,極大方便了用戶瀏覽。
八、?【UV Index】-每日最曬時(shí)刻提醒
1. ?【使用場(chǎng)景】
夏天用戶出門時(shí),比較關(guān)心一天中什么時(shí)候太陽(yáng)最不曬,都希望都能避免該時(shí)刻出門。
2. ?【設(shè)計(jì)思考】
設(shè)計(jì)目標(biāo):提醒用戶最曬時(shí)刻在哪,提高用戶對(duì)產(chǎn)品的使用率。
設(shè)計(jì)方案:在UV Index中,用戶可直觀的看到當(dāng)前的紫外線指數(shù),同時(shí)長(zhǎng)按表盤顯示今日最高的紫外線指數(shù)以及時(shí)間點(diǎn),幫助用戶去選擇出門時(shí)間以及提前做好防護(hù)。
九、結(jié)語(yǔ)
在設(shè)計(jì)的生涯中,如何說(shuō)服別人會(huì)伴隨著我們從頭到尾。我們?cè)谟涗浐玫脑O(shè)計(jì)細(xì)節(jié)時(shí),也要不斷提升自己的輸出表達(dá)能力。做到既能讓別人聽(tīng)得舒服,也能讓自己減少改稿率。
本期的體驗(yàn)細(xì)節(jié)推導(dǎo)分享結(jié)束,我們下期再見(jiàn)!
本文由 @薩瓦迪卡 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載
題圖來(lái)自Unsplash,基于CC0協(xié)議
- 目前還沒(méi)評(píng)論,等你發(fā)揮!