目錄

一、馬蜂窩 — 人性化設(shè)計(jì)識(shí)別文章地點(diǎn)

二、微博 — 社區(qū)游戲化設(shè)計(jì)提升互動(dòng)率

三、QQ — 通過(guò)手勢(shì)消除未讀消息

四、最右 — 情感化設(shè)計(jì)保護(hù)用戶隱私

五、抖音 — 深夜提醒貼心的功能

六、網(wǎng)易音樂(lè) — 把分享游戲化

七、QQ音樂(lè) — 歌詞沉浸式體驗(yàn)

八、盯潮 — 趣味性banner輪播，增加用戶點(diǎn)擊

一、馬蜂窩—人性化設(shè)計(jì)識(shí)別文章地點(diǎn)

產(chǎn)品體驗(yàn)

在馬蜂窩任意文章中，如果出現(xiàn)地區(qū)則可以通過(guò)當(dāng)前頁(yè)面對(duì)地區(qū)進(jìn)行提取

目標(biāo)

減少用戶操作路徑，降低產(chǎn)品使用成本

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

日常在各個(gè)平臺(tái)瀏覽文章時(shí)大家都會(huì)遇到在文章內(nèi)會(huì)出現(xiàn)一些如地名、人名、物品等相關(guān)名詞，此時(shí)如果對(duì)名詞感興趣則需要切換場(chǎng)景去進(jìn)行搜索，而馬蜂窩在這方面深入洞察到用戶痛點(diǎn)，基于旅游社交產(chǎn)品背景下在添加地點(diǎn)直達(dá)（包含多個(gè)地點(diǎn)）功能，解決了對(duì)景點(diǎn)感興趣的用戶使用體驗(yàn)。

延伸設(shè)計(jì)

根據(jù)馬蜂窩這個(gè)人性化功能，是否可以在不同的產(chǎn)品內(nèi)進(jìn)行應(yīng)用，如在一些游戲社區(qū)中所提到的虛擬裝備、道具等物品添加彈窗簡(jiǎn)要說(shuō)明，幫助新手玩家快速理解玩法、功用等

二、微博—社區(qū)游戲化設(shè)計(jì)提升互動(dòng)率

產(chǎn)品體驗(yàn)

在微博動(dòng)態(tài)詳情中進(jìn)行長(zhǎng)按點(diǎn)贊觸發(fā)動(dòng)畫(huà)

目標(biāo)

通過(guò)游戲化點(diǎn)贊玩法激勵(lì)用戶進(jìn)行互動(dòng)，提升互動(dòng)率

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

打破傳統(tǒng)點(diǎn)贊動(dòng)畫(huà)，微博設(shè)計(jì)動(dòng)效采用大膽創(chuàng)新的全屏動(dòng)畫(huà)并搭配上散發(fā)的微表情，在長(zhǎng)按與連點(diǎn)兩種手勢(shì)下動(dòng)效規(guī)律不同，消除用戶枯燥感，微博作為國(guó)內(nèi)最大社交平臺(tái)，頁(yè)面展示上已經(jīng)形成用戶深刻認(rèn)知，在不影響基本風(fēng)格上進(jìn)行彩蛋設(shè)計(jì)有效的提成用戶互動(dòng)率

三、QQ—通過(guò)手勢(shì)消除未讀消息

產(chǎn)品體驗(yàn)

在qq聊天頁(yè)面中對(duì)底部消息氣泡進(jìn)行拖動(dòng)，消除所有未讀消息

目標(biāo)

提升用戶操作效率和使用體驗(yàn)

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

qq作為社交工具，每位用戶都會(huì)添加大量人、群以及關(guān)注各種推送，在這種場(chǎng)景下用戶每條消息都去操作需要花費(fèi)大量時(shí)間，QQ把傳統(tǒng)的消息已讀以一種簡(jiǎn)單的交互手勢(shì)作為代替，相對(duì)全部已讀在操作上更佳便捷

延伸設(shè)計(jì)

通過(guò)qq的這個(gè)交互細(xì)節(jié)，在其他產(chǎn)品場(chǎng)景中同樣適用，如一些音樂(lè)、電臺(tái)相關(guān)的產(chǎn)品在離開(kāi)播放頁(yè)面后播放狀態(tài)會(huì)懸浮在頁(yè)面之上，如果關(guān)閉的話則需要點(diǎn)擊暫停或者進(jìn)入詳情后關(guān)閉，也可以考慮使用拖動(dòng)手勢(shì)進(jìn)行關(guān)閉

四、最右—情感化設(shè)計(jì)保護(hù)用戶隱私

產(chǎn)品體驗(yàn)

在最右登錄頁(yè)面輸入密碼時(shí)ip形象會(huì)出現(xiàn)捂眼睛動(dòng)作

目標(biāo)

強(qiáng)化用戶隱私和心理信任感

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

日常在使用一些敏感性操作時(shí)我們都會(huì)注重隱私，如一些表單的填寫(xiě)、密碼輸入等相關(guān)操作，最右在登錄頁(yè)面使用到了ip形象的動(dòng)作去向用戶傳遞心理上的暗示，這種手法很好的把品牌曝光與體驗(yàn)相結(jié)合

五、抖音—深夜提醒貼心的功能

產(chǎn)品體驗(yàn)

長(zhǎng)時(shí)間刷抖音時(shí)會(huì)系統(tǒng)會(huì)提示，在深夜使用時(shí)會(huì)支持設(shè)置提醒時(shí)間

目標(biāo)

防止用戶疲勞使用產(chǎn)品，定時(shí)緩解注意力

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

在使用抖音時(shí)大家可能會(huì)經(jīng)常深陷其中無(wú)法自拔，往往忽略了時(shí)間影響身體健康，提醒機(jī)制則在深夜不同時(shí)間段進(jìn)行間接提示，雖然在用戶體驗(yàn)中不提倡打擾用戶，但在短視頻這個(gè)場(chǎng)景下如果過(guò)渡沉浸便會(huì)造成反向影響

六、網(wǎng)易音樂(lè)—把分享游戲化

產(chǎn)品體驗(yàn)

在網(wǎng)易音樂(lè)對(duì)某首音樂(lè)進(jìn)行分享時(shí)可以對(duì)音樂(lè)進(jìn)行個(gè)性化定制，對(duì)歌曲進(jìn)行編輯添加文字、圖片、語(yǔ)音等以視頻方式呈現(xiàn)

目標(biāo)

把分享以一種偏游戲化的形式呈現(xiàn)，提升用戶分享率

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

傳統(tǒng)分享基本是直接讓用戶分享到第三方平臺(tái)，而網(wǎng)易音樂(lè)這個(gè)設(shè)計(jì)把分享場(chǎng)景進(jìn)行多元化處理，以定制音樂(lè)罐子為切入點(diǎn)，用戶自由編輯個(gè)性化處理裝進(jìn)罐子進(jìn)行分享，是一種視頻剪輯融合音樂(lè)的一種新玩法，破圈傳統(tǒng)枯燥的分享場(chǎng)景，提升用戶分享率

七、QQ音樂(lè)—歌詞沉浸式體驗(yàn)

產(chǎn)品體驗(yàn)

在音樂(lè)歌詞頁(yè)面中可以支持設(shè)置歌詞主題

目標(biāo)

新穎的呈現(xiàn)手段，強(qiáng)化用戶沉浸式聽(tīng)歌

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

傳統(tǒng)的音樂(lè)產(chǎn)品在詳情頁(yè)面展示了一屏歌曲歌詞，面對(duì)大量的文字用戶在尋找某段歌詞時(shí)效率不是很高，對(duì)大量的字段也極為枯燥，而qq音樂(lè)使用了創(chuàng)新的展現(xiàn)形式，把手機(jī)主題概念融入歌詞中達(dá)到新的視覺(jué)體驗(yàn)，根據(jù)不同的主題對(duì)應(yīng)的動(dòng)畫(huà)也不同，大大的提高了用戶的視聽(tīng)體驗(yàn)

八、盯潮—趣味性banner輪播，增加用戶點(diǎn)擊

產(chǎn)品體驗(yàn)

在盯潮首頁(yè)banner處對(duì)其進(jìn)行拖動(dòng)甩出

目標(biāo)

通過(guò)交互玩法提升用戶對(duì)banner的點(diǎn)擊

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

banner在頁(yè)面通常點(diǎn)擊率較低，用戶會(huì)默認(rèn)為廣告，在盯潮內(nèi)滑動(dòng)banner時(shí)會(huì)發(fā)現(xiàn)banner可以進(jìn)行拖動(dòng)，并且松開(kāi)時(shí)會(huì)自由掉多，把傳統(tǒng)的banner切換做出了可玩性更高的效果，同時(shí)這個(gè)設(shè)計(jì)手段也能吸引用戶注意力引導(dǎo)用戶對(duì)banner進(jìn)行點(diǎn)擊

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長(zhǎng)學(xué)習(xí)，請(qǐng)掃碼藍(lán)小助，報(bào)下信息，藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請(qǐng)與我們聯(lián)系。

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( www.bouu.cn )是一家專(zhuān)注而深入的界面設(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ù)、

UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司