俗話說：“細(xì)節(jié)決定成敗”，對(duì)于設(shè)計(jì)而言亦是如此，把設(shè)計(jì)做到極致才能在競(jìng)爭(zhēng)中脫穎而出。對(duì)于產(chǎn)品設(shè)計(jì)師來說不僅需要有發(fā)現(xiàn)的眼睛，也要有做到極致的習(xí)慣。通過優(yōu)秀的設(shè)計(jì)案例不斷培養(yǎng)自己的設(shè)計(jì)思維，才能在項(xiàng)目中不斷創(chuàng)新和做到極致。

最近黑馬哥發(fā)現(xiàn)了一些優(yōu)秀的設(shè)計(jì)細(xì)節(jié)，相信這些小小的細(xì)節(jié)必然可以帶來更好的體驗(yàn)，助力產(chǎn)品帶給用戶更好的使用體驗(yàn)。

一、流暢自然的動(dòng)效過度

微動(dòng)效在產(chǎn)品中的運(yùn)用十分普及，特別是在圖標(biāo)設(shè)計(jì)中的運(yùn)用，不僅增強(qiáng)了圖標(biāo)趣味性，也是提升關(guān)注度的關(guān)鍵。

盯潮 App 首頁(yè)圖標(biāo)便完美的結(jié)合動(dòng)效表達(dá)，滑動(dòng)瀏覽內(nèi)容時(shí)，首頁(yè)圖標(biāo)通過動(dòng)效演變?yōu)橹庙攬D標(biāo)。不僅賦予當(dāng)前區(qū)域更多操作屬性，流暢自然的動(dòng)效表達(dá)也使得設(shè)計(jì)更具情感化。

 

二、圖標(biāo)動(dòng)效提升親和力

動(dòng)效相較于靜態(tài)表達(dá)而言，可以更有連貫性和敘述性，一套動(dòng)作的表達(dá)可以帶來更深層次的信息傳遞。

貝殼找房 App “我家”欄目用門形圖標(biāo)表達(dá)，當(dāng)進(jìn)入該欄目時(shí)，圖標(biāo)會(huì)呈現(xiàn)開門的動(dòng)效，然后變成一扇打開的門。有種歡迎回家和進(jìn)入自己家里的體驗(yàn)，變得更有親和力，提升用戶體驗(yàn)度。

 

三、微動(dòng)態(tài)背景提升空間感

通過提高局部區(qū)域的視覺表達(dá)，可以吸引用戶的關(guān)注度，而動(dòng)態(tài)背景的運(yùn)用無疑是最有效的方式之一。

貝殼找房 App 在“我家”欄目的頂部區(qū)域設(shè)計(jì)中，以微動(dòng)態(tài)的方式表達(dá)背景，相較于靜態(tài)而言更有空間感。局部動(dòng)態(tài)的表達(dá)也讓畫面更有趣味性，場(chǎng)景風(fēng)格也很溫馨，讓用戶感受到回家的情感共鳴。

 

四、視圖切換提升瀏覽效率

刷短視頻已經(jīng)改變了很多人的娛樂時(shí)間，不斷優(yōu)化體驗(yàn)也是產(chǎn)品進(jìn)步的關(guān)鍵。

抖音在不斷優(yōu)化體驗(yàn)的過程中，帶給用戶更好的內(nèi)容獲取體驗(yàn)。最近發(fā)現(xiàn)在點(diǎn)擊首頁(yè)刷新時(shí)，可以進(jìn)行視圖切換，方便進(jìn)行更多內(nèi)容的篩選，提高內(nèi)容瀏覽效率。

 

五、降低干擾的收縮式設(shè)計(jì)

營(yíng)銷設(shè)計(jì)在產(chǎn)品中的出現(xiàn)是為了提高變現(xiàn)能力，在用戶體驗(yàn)和營(yíng)銷曝光度的結(jié)合中，需要更多的交互形式進(jìn)行設(shè)計(jì)平衡。

汽車之家 App 在“選車”欄目中，直播間入口懸浮在右下角，人物頭像提高真實(shí)度，吸引用戶進(jìn)入直播間。當(dāng)滑動(dòng)界面時(shí)會(huì)收縮成獨(dú)立頭像展示，降低對(duì)當(dāng)前內(nèi)容的干擾度，讓用戶不會(huì)因?yàn)闋I(yíng)銷表達(dá)而出現(xiàn)體驗(yàn)反感。

 

六、提升簽到參與度

簽到是提升用戶活躍度的一種有效形式之一，通過簽到福利激活用戶的參與度，而設(shè)計(jì)氛圍也是助推參與度的因素。

全民 K 歌每日簽到設(shè)計(jì)表達(dá)很有氛圍感，結(jié)合 IP 形象提升情感化設(shè)計(jì)，同時(shí)每日簽到對(duì)應(yīng)好禮展示，更直觀的讓用戶知道簽到可以帶來的好處。禮物動(dòng)效和氛圍感拉滿的場(chǎng)景，不僅烘托了氛圍感，也提升了用戶參與簽到的意愿度。

 

七、情感互動(dòng)突出工具欄

通過交互形式或者視覺強(qiáng)化可以突出局部功能，也可以配合微動(dòng)效的表達(dá)進(jìn)行強(qiáng)化。

百度網(wǎng)盤 App 為了突出底部工具欄，結(jié)合了 IP 形象進(jìn)行動(dòng)態(tài)互動(dòng)，打招呼的禮貌行為讓設(shè)計(jì)表達(dá)更為情感化。不僅突出了該工具欄的位置，也能讓用戶感受到產(chǎn)品設(shè)計(jì)的溫度。

 

八、小插畫也能更溫馨

插畫元素在產(chǎn)品設(shè)計(jì)中的運(yùn)用也很普及，這也讓設(shè)計(jì)師需要具備一些簡(jiǎn)單的插畫基礎(chǔ)，可以通過插畫增強(qiáng)設(shè)計(jì)的視覺感和情感化等。

安居客 App 的個(gè)人中心設(shè)計(jì)中，頂部區(qū)域通過一個(gè)小插畫填充畫面，使得界面場(chǎng)景顯得更溫馨。讓用戶放松心情，猶如在自家小區(qū)庭院中呼吸新鮮空氣和感受陽(yáng)光的明媚。

 

九、引人注目的彈窗小動(dòng)效

彈窗結(jié)合動(dòng)效設(shè)計(jì)很常見，也是突出內(nèi)容最有效的設(shè)計(jì)表達(dá)，不過在功能性彈窗中如何強(qiáng)化營(yíng)銷內(nèi)容，最近發(fā)現(xiàn)了一個(gè)不錯(cuò)的設(shè)計(jì)案例。

夸克 App 在主頁(yè)點(diǎn)擊功能設(shè)置之后，基于功能彈窗的基礎(chǔ)上融入了營(yíng)銷入口，還不會(huì)顯得格格不入。豐富的色彩和動(dòng)效表達(dá)， 在不改變彈窗主結(jié)構(gòu)的基礎(chǔ)上，突出了新增活動(dòng)表達(dá)的關(guān)注度，是一個(gè)不錯(cuò)的設(shè)計(jì)解決方案。

 

十、UI 新趨勢(shì)呈現(xiàn)年輕化

隨著網(wǎng)民年輕化的趨勢(shì)，產(chǎn)品 UI 風(fēng)格也逐步呈現(xiàn)視覺年輕化，設(shè)計(jì)師都在不斷嘗試煥然一新的風(fēng)格表達(dá)。

百度網(wǎng)盤 App 前段時(shí)間進(jìn)行了風(fēng)格更新，煥然一新的設(shè)計(jì)讓視覺呈現(xiàn)更年輕化。界面背景采用白色和淺灰色，顯得更簡(jiǎn)潔和舒適，圖標(biāo)設(shè)計(jì)和局部卡片等以更具視覺沖擊力的多巴胺配色表達(dá)。新的嘗試無論是否可以滿足用戶感官需求，但是大膽的風(fēng)格突破也能為下一次的蛻變做鋪墊。

 

小結(jié)

通過對(duì)設(shè)計(jì)細(xì)節(jié)的探索，我們發(fā)現(xiàn)了很多優(yōu)秀的設(shè)計(jì)解決方案，這也是積累設(shè)計(jì)靈感的一個(gè)過程。本文描述屬于個(gè)人觀點(diǎn)，如有不足歡迎留言指正，我們互相進(jìn)步。

 

文章來源：優(yōu)設(shè)網(wǎng)    作者： 黑馬青年

分享此文一切功德，皆悉回向給文章原作者及眾讀者.

免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)(www.bouu.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)、B端界面設(shè)計(jì)、桌面端界面設(shè)計(jì)、APP界面設(shè)計(jì)、圖標(biāo)定制、用戶體驗(yàn)設(shè)計(jì)、交互設(shè)計(jì)、UI咨詢、高端網(wǎng)站設(shè)計(jì)、平面設(shè)計(jì)，以及相關(guān)的軟件開發(fā)服務(wù)，咨詢電話：01063334945。

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

銀行金融軟件UI界面設(shè)計(jì)、能源及監(jiān)控軟件UI界面設(shè)計(jì)、氣象行業(yè)UI界面設(shè)計(jì)、軌道交通界面設(shè)計(jì)、地理信息系統(tǒng)GIS UI界面設(shè)計(jì)、航天軍工軟件UI界面設(shè)計(jì)、醫(yī)療行業(yè)軟件UI界面設(shè)計(jì)、教育行業(yè)軟件UI界面設(shè)計(jì)、企業(yè)信息化UI界面設(shè)計(jì)、軟件qt開發(fā)、軟件wpf開發(fā)、軟件vue開發(fā)