前言

好的產(chǎn)品總會(huì)關(guān)注細(xì)節(jié),將細(xì)節(jié)做到最好,這篇文章分析了十個(gè)產(chǎn)品的使用場(chǎng)景和產(chǎn)品的設(shè)計(jì)思考,最后總結(jié)產(chǎn)品成功的原因,一起學(xué)習(xí)一下吧。

「夸克」

輪播視頻 – 降低切換流失率,提升視頻穿透性

1. 使用場(chǎng)景

搜索相關(guān)內(nèi)容時(shí),瀑布頁(yè)會(huì)出現(xiàn)相關(guān)視頻,給予用戶(hù)多元多類(lèi)型內(nèi)容呈現(xiàn)。

10個(gè)產(chǎn)品細(xì)節(jié)剖析,看看大廠是如何做設(shè)計(jì)的!

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

設(shè)計(jì)目標(biāo):提高視頻穿透性,從而帶來(lái)視頻播放轉(zhuǎn)化率的提升。

設(shè)計(jì)方案:當(dāng)用戶(hù)搜索關(guān)鍵詞后,首屏?xí)霈F(xiàn)相關(guān)視頻,當(dāng)用戶(hù)停留在視頻區(qū) 1 秒時(shí),四宮格視頻會(huì)自動(dòng)播放 2-3 秒視頻中的精彩瞬間,給予用戶(hù)判斷是否感興趣,精準(zhǔn)打開(kāi)感興趣視頻,降低頻繁跳頁(yè)面,給用戶(hù)帶來(lái)的繁瑣流程。同時(shí)提高視頻曝光率。是一個(gè)對(duì)用戶(hù)友好體驗(yàn)的設(shè)計(jì)點(diǎn)。

「微信」

合成表情 – 自定義文案,體驗(yàn)表情包雙層快樂(lè)

1. 使用場(chǎng)景

聊天時(shí),找一個(gè)貼合當(dāng)下場(chǎng)景使用的表情包太難了。

10個(gè)產(chǎn)品細(xì)節(jié)剖析,看看大廠是如何做設(shè)計(jì)的!

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

設(shè)計(jì)目標(biāo):提升聊天場(chǎng)景表情包文字呈現(xiàn)的貼合性,凸出表情包文字定制化體驗(yàn)

設(shè)計(jì)方案:在聊天界面,通過(guò)向表情搜索頁(yè)輸入具體名字+動(dòng)詞或其他,可生成帶有文案專(zhuān)屬的表情包,相比收集別人表情包發(fā)送,這種 DIY 表情更能打動(dòng)對(duì)方。參考:(ps:快給過(guò)生日的朋友發(fā)送“你的名字+祝生日快樂(lè))

「嗶哩嗶哩」

一鍵三連 – 交互發(fā)揮到極致,就形成品牌效應(yīng)

1. 使用場(chǎng)景

看 B 站視頻和直播經(jīng)常會(huì)和粉絲進(jìn)行互動(dòng),家人們給我一鍵三連支持一下。

10個(gè)產(chǎn)品細(xì)節(jié)剖析,看看大廠是如何做設(shè)計(jì)的!

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

設(shè)計(jì)目標(biāo):提高交互易用性,減少交互流程,縮短觸達(dá)時(shí)間

設(shè)計(jì)方案:想點(diǎn)贊+收藏+投幣視頻,常規(guī)挨個(gè)點(diǎn)擊,需要點(diǎn)擊三次。更好的三連方式:長(zhǎng)按點(diǎn)贊圖標(biāo),激活投幣收藏圖標(biāo)聯(lián)動(dòng),當(dāng)環(huán)形進(jìn)度表走完一圈你會(huì)看到三連反饋,便捷操作同時(shí),帶來(lái)的是驚喜和爽的體驗(yàn)。當(dāng)我發(fā)現(xiàn)這個(gè)操作后,投幣的習(xí)慣就自然形成。你會(huì)發(fā)現(xiàn)一個(gè)小的交互為產(chǎn)品提供價(jià)值不可估量,當(dāng)然,這個(gè)交互是否貼合產(chǎn)品本身這就是需要考慮的了。

「人民日?qǐng)?bào)」

報(bào)紙情懷 – 習(xí)慣永流傳,交互更自然

1. 使用場(chǎng)景

人民日?qǐng)?bào) 1948 年創(chuàng)刊至今傳統(tǒng)報(bào)紙已深入人心,也是具有情懷感的。

10個(gè)產(chǎn)品細(xì)節(jié)剖析,看看大廠是如何做設(shè)計(jì)的!

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

設(shè)計(jì)目標(biāo):提升人民日?qǐng)?bào)報(bào)紙感知,從線(xiàn)下瀏覽到線(xiàn)上查看,無(wú)縫隙轉(zhuǎn)移,留住用戶(hù)情懷訴求,提升產(chǎn)品內(nèi)在調(diào)性,提高用戶(hù)忠誠(chéng)度。

設(shè)計(jì)方案:在首頁(yè),點(diǎn)擊左上角「人民日?qǐng)?bào)」文案,可進(jìn)入日?qǐng)?bào)模式,用戶(hù)可點(diǎn)擊模塊內(nèi)容進(jìn)入對(duì)應(yīng)信息中,且會(huì)有點(diǎn)擊反饋感知,增加用戶(hù)理解。針對(duì)不同用戶(hù),還可進(jìn)行 tab 切換形式,一個(gè)是報(bào)紙排版,一個(gè)是瀑布式文字描述,滿(mǎn)足多場(chǎng)景用戶(hù)需求。

「微信」

剛剛看過(guò) – 視頻看完,想要接著繼續(xù)看,快速定位

1. 使用場(chǎng)景

在刷視頻號(hào)時(shí),看到一個(gè)具有連續(xù)性的視頻時(shí),需要進(jìn)入作者主頁(yè)查找對(duì)應(yīng)視頻。

10個(gè)產(chǎn)品細(xì)節(jié)剖析,看看大廠是如何做設(shè)計(jì)的!

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

設(shè)計(jì)目標(biāo):提高瀏覽視頻的易用性體驗(yàn),增加關(guān)聯(lián)屬性視頻曝光,提高用戶(hù)活躍。

設(shè)計(jì)方案:采用和抖音一樣的交互形式,當(dāng)在視頻流看完內(nèi)容后,進(jìn)入作者主頁(yè),右下角會(huì)出現(xiàn)「剛剛看過(guò)」點(diǎn)擊按鈕,點(diǎn)擊后,自動(dòng)定位到已看過(guò)的視頻位置,讓用戶(hù)剛好的進(jìn)行順序?yàn)g覽,提高用戶(hù)看連續(xù)視頻的體驗(yàn)。

「iPhone 錢(qián)包」

地鐵充值 – 提前做出選擇,減少用戶(hù)行為路徑

1. 使用場(chǎng)景

充值金額時(shí),常規(guī)的輸入已經(jīng)是很簡(jiǎn)單的了 還能做到更易用嘛。

10個(gè)產(chǎn)品細(xì)節(jié)剖析,看看大廠是如何做設(shè)計(jì)的!

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

設(shè)計(jì)目標(biāo):提升產(chǎn)品易用性體驗(yàn),預(yù)判用戶(hù)的預(yù)判。

設(shè)計(jì)方案:當(dāng)用戶(hù)進(jìn)入充值頁(yè)面時(shí),數(shù)字鍵盤(pán)上放會(huì)常駐提供三個(gè)充值額度,當(dāng)用戶(hù)輸入其他金額第一個(gè)數(shù)字時(shí),常駐位置會(huì)提前預(yù)判用戶(hù)充值金額進(jìn)行展示,以提供充值方便。如果你發(fā)現(xiàn),這個(gè)操作怎么樣都要點(diǎn)兩次!那恭喜你,開(kāi)始思考了。在鍵盤(pán)上方提供快速按鈕,此位置是離大拇指最易近的操作區(qū),最下方 0 同樣也是,但需要考慮女性留美甲的情況,按 0 鍵,大多是手指內(nèi)側(cè)或者頂部點(diǎn)擊,長(zhǎng)指甲用戶(hù)操作不便,相反,鍵盤(pán)上方易操作區(qū)都是通過(guò)指腹來(lái)操作,相比更高效。

「閑魚(yú)」

圖片模糊提醒 – 二手交易更在意商品圖片信息,讓閑置快速流通

1. 使用場(chǎng)景

發(fā)布二手商品后,有的商品曝光展示高,很快賣(mài)出去,有的則無(wú)曝光基本置灰。排除物品本身流通性,那還有什么原因呢.

10個(gè)產(chǎn)品細(xì)節(jié)剖析,看看大廠是如何做設(shè)計(jì)的!

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

設(shè)計(jì)目標(biāo):提升賣(mài)家發(fā)布商品圖的清晰度,減少因照片模糊不清導(dǎo)致賣(mài)出概率低,提高優(yōu)質(zhì)詳情曝光。

設(shè)計(jì)方案:用戶(hù)上傳商品圖片,當(dāng)圖片質(zhì)量較低時(shí),通過(guò)縮略圖形式給予用戶(hù)溫馨提示文案“圖片模糊,建議重拍”告知用戶(hù)模糊圖片具體位置,建議用戶(hù)重新上傳,提高商品曝光提高成交率。

「懂車(chē)帝」

Tab 標(biāo)題 – 登錄登出,狀態(tài)一目了之

1. 使用場(chǎng)景

使用產(chǎn)品時(shí),想看是否已登錄賬號(hào)、需要點(diǎn)擊個(gè)人中心查看。

10個(gè)產(chǎn)品細(xì)節(jié)剖析,看看大廠是如何做設(shè)計(jì)的!

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

設(shè)計(jì)目標(biāo):縮短交互鏈路,提升登錄狀態(tài)多維度顯示體驗(yàn)。

設(shè)計(jì)方案:常規(guī)個(gè)人中心,在未登錄或已登錄都叫“我的”“個(gè)人”等,用戶(hù)僅通過(guò)固定文字很難獲取是否登錄,需要點(diǎn)擊跳轉(zhuǎn)頁(yè)面查看登錄狀態(tài)。「懂車(chē)帝」在未登錄時(shí),底部 Tab 顯示“未登錄”字符,已登錄顯示“我的”字符,雖然只是簡(jiǎn)單的文案替換,但就能為部分用戶(hù)帶來(lái)直觀了解。就拿我說(shuō),當(dāng)我發(fā)現(xiàn)后,「懂車(chē)帝」品牌就會(huì)強(qiáng)化我的心智,當(dāng)你看到去使用,你也將把這個(gè)細(xì)節(jié)點(diǎn)記住,并且持續(xù)一段時(shí)間。

「iPhone 備忘錄」

防錯(cuò)彈窗 – 放下手機(jī)行走,撤銷(xiāo)彈窗出來(lái)

1. 使用場(chǎng)景

在通勤時(shí)間經(jīng)常使用備忘錄記錄文字,時(shí)常會(huì)有不小心刪除了一段話(huà)的情況。

10個(gè)產(chǎn)品細(xì)節(jié)剖析,看看大廠是如何做設(shè)計(jì)的!

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

設(shè)計(jì)目標(biāo):通過(guò)彈窗降低誤操作,防錯(cuò)機(jī)制來(lái)給用戶(hù)安全保障。

設(shè)計(jì)方案:備忘錄搖一搖撤銷(xiāo),之前覺(jué)得此設(shè)計(jì)多余。在坐地鐵時(shí),發(fā)現(xiàn)這個(gè)設(shè)計(jì)很有必要。當(dāng)你在編輯文本期間,要轉(zhuǎn)乘、出站、行走時(shí)、不關(guān)屏幕的前提下,手指、衣物等都可能會(huì)對(duì)屏幕造成全局操作行為,此時(shí)搖一搖撤銷(xiāo)彈窗發(fā)揮到作用,彈窗中僅有的兩個(gè)按鈕,很好的避免了全局可操作帶來(lái)的風(fēng)險(xiǎn),通過(guò)交互熱區(qū)的縮小來(lái)避免誤操作的風(fēng)險(xiǎn),是一個(gè)很好的設(shè)計(jì)洞察點(diǎn)。

「QQ」

趣味 Tab – 變換的表情,讓你忍不住拖拖拖

1. 使用場(chǎng)景

QQ 億級(jí)用戶(hù),人群覆蓋面廣,相比微信,用戶(hù)群體更年輕,喜歡嘗試新鮮事物。

10個(gè)產(chǎn)品細(xì)節(jié)剖析,看看大廠是如何做設(shè)計(jì)的!

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

設(shè)計(jì)目標(biāo):通過(guò)趣味化表情,Tab 的變式玩法,給用戶(hù)提供趣味性體驗(yàn),提升用戶(hù)心智,增加品牌傳播

設(shè)計(jì)方案:雙擊消息 Tab 刷新頁(yè)面,在用戶(hù)等待期間變換 tab 圖標(biāo),吸引用戶(hù)注意,從而降低等待焦慮。用戶(hù)也可長(zhǎng)按拖拽釋放 tab 消息圖標(biāo)來(lái)變換 Tab 圖標(biāo),趣味、惡搞、古怪,總有一個(gè)能戳中你,快來(lái)試試看吧。

結(jié)語(yǔ)

設(shè)計(jì)師要有發(fā)現(xiàn)美的眼睛。美不僅是視覺(jué),還有好的體驗(yàn)流程。不要讓用戶(hù)思考,這是每個(gè)設(shè)計(jì)師所追求的。認(rèn)真記錄產(chǎn)品細(xì)節(jié),了解背后的思考,也是不斷提升自己邏輯思維和表達(dá)能力的一種方式。

本期產(chǎn)品細(xì)節(jié)分析結(jié)束,我們下期再見(jiàn)!

歡迎關(guān)注作者微信公眾號(hào):草蓉三石

10個(gè)產(chǎn)品細(xì)節(jié)剖析,看看大廠是如何做設(shè)計(jì)的!

收藏 53
點(diǎn)贊 36

復(fù)制本文鏈接 文章為作者獨(dú)立觀點(diǎn)不代表優(yōu)設(shè)網(wǎng)立場(chǎng),未經(jīng)允許不得轉(zhuǎn)載。