產(chǎn)品細(xì)節(jié)的設(shè)計(jì)思考(一)
編輯導(dǎo)語:細(xì)節(jié)決定成敗。產(chǎn)品中的功能能吸引用戶,然而產(chǎn)品中的細(xì)節(jié)才是留住用戶的關(guān)鍵,打動用戶。本篇文章中,作者列舉了六個(gè)產(chǎn)品中的亮眼細(xì)節(jié)與你分享,并且與你分析其中的細(xì)節(jié)的特色。
好的產(chǎn)品會做好功能和細(xì)節(jié),功能能夠吸引用戶關(guān)注,而細(xì)節(jié)則是讓用戶留下來。
好的產(chǎn)品一定是經(jīng)過精敲細(xì)磨打造出來的,能讓用戶留下記憶點(diǎn)的,卻往往是個(gè)不經(jīng)意的小細(xì)節(jié),打動用戶的可能是一個(gè)趣味動畫、一個(gè)貼心功能、或者是一句打動人心的文案。
一個(gè)小的細(xì)節(jié)設(shè)計(jì)能阻止用戶流失,讓人眼前一亮。那么細(xì)節(jié)設(shè)計(jì)背后的邏輯和意義,則更需要我們?nèi)リP(guān)注,下面讓我們一起來看下,細(xì)節(jié)設(shè)計(jì)是如何塑造那些好的產(chǎn)品的。
一、「嗶哩嗶哩」B站下了一場“流星雨彈幕”,承包了整片星空
1. 產(chǎn)品體驗(yàn)
英仙座流星雨,B站專門上線了“流星雨直播間”,并開啟許愿活動。用戶發(fā)送一條許愿彈幕,就會變成一顆彈幕流星劃向星空。
2. 細(xì)節(jié)描述
8月13日凌晨,北半球三大流星雨之一的英仙座流星雨迎來極大值,讓人驚喜的是,B站為此專門在直播間設(shè)置了“流星雨彈幕”。
在等待流星劃過的時(shí)間里,網(wǎng)友們就已經(jīng)先被這場流星雨彈幕觸動,紛紛許下心愿,每個(gè)人發(fā)送的許愿彈幕,都會變成一顆流星劃向星空,并且每條彈幕前都會帶有一顆星星?圖標(biāo),彈幕呈45度斜角方向運(yùn)動,就猶同流星劃過一般。
單從產(chǎn)品上看,其實(shí)僅僅是調(diào)整了彈幕角度,加了星星圖標(biāo),但卻模擬出一場令人難忘的彈幕流星雨,承包了整片星空,給用戶留下深刻印象,創(chuàng)建情感連接。小破站真的很會制造驚喜,太懂浪漫了!
二、「小紅書」好物推薦類視頻 快速精準(zhǔn)錨點(diǎn)定位,不錯(cuò)過一個(gè)好物推薦
1. 產(chǎn)品體驗(yàn)
在小紅書穿搭好物分享類視頻中,進(jìn)度條上會有幾個(gè)白色圓點(diǎn),代表的是每個(gè)好物分享的開始點(diǎn),可滿足快速瀏覽好物介紹,同時(shí)追求效率的用戶。
2. 細(xì)節(jié)描述
不知道大家日常是否會看穿搭或好物推薦類的視頻,你在觀看時(shí)是否有下面的場景困擾:博主一次分享好物數(shù)量多且時(shí)間長,不想錯(cuò)過每個(gè)好物介紹,但又沒有時(shí)間看完全部,即使當(dāng)時(shí)收藏,也避免不了在收藏夾里吃土的情況……
對于有耐心、有時(shí)間的用戶,可能會看完全部視頻;但對于碎片化時(shí)間以及追求效率的用戶來講,如果前面是大段非重點(diǎn)信息,又無法精準(zhǔn)找到每個(gè)好物的分享時(shí)間點(diǎn),那么在此時(shí),關(guān)閉視頻的概率是非常高的。
小紅書前段時(shí)間上線了針對此痛點(diǎn)的功能,在視頻內(nèi)容上可精準(zhǔn)定位每個(gè)好物的錨點(diǎn)功能。
通過手指長按拖拽進(jìn)度條,放大進(jìn)度條區(qū)域,就可以方便快速得拖拽到白色錨點(diǎn)定位,找到你想看的好物分享,功能操作簡單且瀏覽效率還提升了很多,對于常看種草類視頻的用戶來說,可以說是一個(gè)非常實(shí)用的小功能。
(ps:該功能不是所有好物推薦類視頻都有,需博主上傳時(shí)對視頻進(jìn)行章節(jié)編輯后,才會生成章節(jié)錨點(diǎn)。)
三、「QQ」小黃臉表情彈射 解鎖表情新玩法
1. 產(chǎn)品體驗(yàn)
長按QQ官方小黃臉系列表情,即可看到“拖拽至此區(qū)域彈射表情”文字提示,拖拽至此指定區(qū)域,就可開啟多個(gè)表情彈射發(fā)送模式。
2. 細(xì)節(jié)描述
我近期較少用QQ,偶然間發(fā)現(xiàn)了這個(gè)功能,大家平時(shí)社交聊天時(shí),很容易就能發(fā)現(xiàn)自己或身邊小伙伴有喜歡連發(fā)表情的習(xí)慣,對想要強(qiáng)調(diào)的重要事情或情緒會表達(dá)N遍,來向?qū)Ψ奖磉_(dá)自己的情緒。
近期QQ上線了小黃臉表情彈射功能,用戶長按拖拽表情到指定區(qū)域,即可開啟表情彈射模式,長按時(shí)間越舊,發(fā)射表情數(shù)量越多。
并且此功能在iOS系統(tǒng)和Android系統(tǒng)的效果有些許差異,iOS系統(tǒng)每發(fā)送1個(gè)表情就會有對應(yīng)的短震觸感反饋;Android系統(tǒng)則是每發(fā)送1個(gè)表情頁面就會晃動(猜測是因?yàn)闊o法控制安卓機(jī)型震動幅度問題);就于兩端效果,iOS系統(tǒng)的細(xì)節(jié)體驗(yàn)更好,效果更加細(xì)膩。
滿足用戶在發(fā)送表情環(huán)節(jié)時(shí),想發(fā)泄的快感,能為用戶在表達(dá)時(shí)帶來更強(qiáng)的情緒輸送。單就QQ黃臉表情來講,從重新設(shè)計(jì)新的黃臉表情到現(xiàn)在的黃臉彈射表情,不難發(fā)現(xiàn)QQ團(tuán)隊(duì)一直在不斷得提升社交互動體驗(yàn)的趣味性。
四、「QQ小世界」小火箭驚喜連推功能,對喜愛內(nèi)容表達(dá)贊許,助力曝光
1. 產(chǎn)品體驗(yàn)
對于用戶喜歡的內(nèi)容,即可點(diǎn)擊小火箭,對喜歡的內(nèi)容表達(dá)贊許,助力喜歡內(nèi)容的曝光,點(diǎn)擊小火箭會有驚喜動效(最多可連推10次)。
2. 細(xì)節(jié)描述
小世界是一款在QQ,以社交為核心,以興趣為聚合的開放式內(nèi)容社交產(chǎn)品,用戶群體主要介于95-00后。
同上線初期對比,近期產(chǎn)品做了一些調(diào)整,由原來瀑布流形態(tài),變?yōu)槎桃曨l展示形態(tài)(ps:目前還支持發(fā)圖片內(nèi)容),但推火箭作為該產(chǎn)品的核心操作,從初期一直保留到現(xiàn)在,這也是和同類產(chǎn)品拉開差異化的部分。
點(diǎn)擊推火箭即可看到火箭發(fā)射動效,通過火箭不同路徑走向、尾氣以及爆炸效果去做動態(tài)效果,并且當(dāng)?shù)竭_(dá)10連推時(shí),第十個(gè)火箭有緩動放大且視覺沖擊逐漸加強(qiáng)的效果,除動畫效果外還有點(diǎn)擊時(shí)的震感反饋,能從多維度的感官細(xì)節(jié)上,感受到小世界這款產(chǎn)品的品質(zhì)打磨。
五、「躺平」下拉刷新 趣味小動畫
1. 產(chǎn)品體驗(yàn)
當(dāng)用戶下拉頁面刷新信息時(shí),導(dǎo)航下面會出現(xiàn)一個(gè)向下俯沖的「躺平」形象小人趣味動畫。
2. 細(xì)節(jié)描述
「躺平」形象小人不單從動作上,契合了用戶下拉刷新的手勢方向,還兼具了情感化以及趣味性,當(dāng)有關(guān)注內(nèi)容更新時(shí),就會出現(xiàn)一個(gè)「躺平」形象小人半蹲落地后再飛上去動作,就像忍者一樣。
從動畫上完成了前后動畫故事的連貫性、完整性;從操作上完成了從下拉刷新到刷新成功,整個(gè)動畫充滿了二次元的動漫感,給用戶增加好感度,契合了年輕人的喜好,同時(shí)也從細(xì)節(jié)設(shè)計(jì)上強(qiáng)化了用戶對App的品牌印象。
并且「躺平」形象小人除了在這個(gè)場景外,也貫穿了整個(gè)app可以有情感化展現(xiàn)的地方,比如標(biāo)簽、圈子為空時(shí),以及缺省狀態(tài)等其他場景,從全局上考慮了「躺平」形象小人在App上貫穿使用的場景。
六、「快看漫畫」七夕 準(zhǔn)備好吃狗糧了么
1. 產(chǎn)品體驗(yàn)
登錄頁面增加了七夕氛圍的情侶互動漫畫,渲染節(jié)日氛圍,也能拉近產(chǎn)品與用戶的距離。
2. 細(xì)節(jié)描述
快看漫畫七夕期間,在登錄頁面,用戶輸入信息前增加了情侶互動漫畫;在用戶輸入信息后變成了情侶變成了親親畫面,并且畫面還巧妙得結(jié)合了用戶信息公開與私密性的情景。
用戶在使用產(chǎn)品的過程中,增加了樂趣和小驚喜,也拉近了產(chǎn)品與用戶的距離,同時(shí)強(qiáng)化了快看漫畫平臺屬性和形象。其中類似的案例,還有B站登錄頁面,2233娘在用戶輸入密碼時(shí)蒙眼睛的設(shè)計(jì),在用戶初始使用平臺時(shí),都會留下深刻印象。
七、結(jié)語
設(shè)計(jì)師需要養(yǎng)成不斷體驗(yàn)產(chǎn)品的習(xí)慣,保持好奇心,每個(gè)產(chǎn)品都是不斷在打磨優(yōu)化的,階段性會有不同的產(chǎn)品和功能上線。
并且從用戶角度體驗(yàn)完后,再切換產(chǎn)品角度,綜合思考分析,為什么會這樣設(shè)計(jì),多觀察去發(fā)現(xiàn)更多的產(chǎn)品細(xì)節(jié),多主動思考產(chǎn)品設(shè)計(jì)背后的意義,拓寬自己的邊界,將設(shè)計(jì)從表現(xiàn)和執(zhí)行抽離,多往前延展,多主動思考、往前多想幾步,就會有所不同。
本文由 @新浪MDC 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載
題圖來自Unsplash,基于 CC0 協(xié)議
情感化的設(shè)計(jì)很有利于拉近產(chǎn)品和用戶的聯(lián)系。
很有幫助!
的風(fēng)格讓他忽然他今日特價(jià)任天野