2025-3-5 天宇 設(shè)計(jì)思維
對(duì)于設(shè)計(jì)師來(lái)說(shuō),遇到設(shè)計(jì)瓶頸期很正常,入行一段時(shí)間后所具備的能力就會(huì)達(dá)到峰值,無(wú)法突破峰值就會(huì)遇到瓶頸。主要在設(shè)計(jì)思維和設(shè)計(jì)技法層面受限,打開(kāi)設(shè)計(jì)思維才能突破瓶頸期,通過(guò)積累優(yōu)秀的案例并進(jìn)行總結(jié)分析,可以更快的打破思維限制。
分享目錄
一、趣味性的登錄設(shè)計(jì)
二、瓷片區(qū)的趣味性手勢(shì)交互
三、營(yíng)造懷舊感的溫馨體驗(yàn)
四、趣味性的進(jìn)度提示設(shè)計(jì)
五、場(chǎng)景感的點(diǎn)擊操作
六、動(dòng)效引導(dǎo)用戶(hù)發(fā)帖
七、卡通形象強(qiáng)化瓷片區(qū)視覺(jué)感
八、不改變布局的曝光強(qiáng)化
九、可以晃動(dòng)的 Banner 圖
十、場(chǎng)景感的底部標(biāo)簽欄設(shè)計(jì)
一、趣味性的登錄設(shè)計(jì)
登錄是進(jìn)入產(chǎn)品的第一道防線,也容易讓用戶(hù)產(chǎn)生排斥感,降低用戶(hù)的防備心理才能提高登錄的意愿度。
盯潮 App 在登錄界面中,以潮流元素和商品等內(nèi)容進(jìn)行設(shè)計(jì),使得頁(yè)面視覺(jué)感豐富?;蝿?dòng)手機(jī)時(shí)元素也會(huì)移動(dòng),在掉落或者碰撞手機(jī)邊緣時(shí)配合震動(dòng)感,讓體驗(yàn)變得非常有趣。趣味性的設(shè)計(jì)降低了用戶(hù)的排斥感,提升了登錄的意愿度和體驗(yàn)感。
二、瓷片區(qū)的趣味性手勢(shì)交互
瓷片區(qū)、Banner、金剛區(qū)是產(chǎn)品中的三大運(yùn)營(yíng)模塊,起到提高曝光度達(dá)到引流的目的。瓷片區(qū)在頁(yè)面中的布局比較靈活,設(shè)計(jì)表現(xiàn)也非常豐富。
盯潮 App 在首頁(yè)瓷片區(qū)設(shè)計(jì)中,以柵格式布局進(jìn)行區(qū)塊劃分,占比較大的模塊類(lèi)似于 Banner 式表現(xiàn)。通過(guò)手勢(shì)可以任意拖動(dòng)實(shí)現(xiàn)切換,趣味性和互動(dòng)性相結(jié)合,提高了用戶(hù)的使用樂(lè)趣。
三、營(yíng)造懷舊感的溫馨體驗(yàn)
童年的記憶是我們逝去的青春,每每看到小時(shí)候的畫(huà)面,總能勾起我們童年的回憶。最近發(fā)現(xiàn)一款結(jié)合懷舊感營(yíng)造設(shè)計(jì)風(fēng)格的產(chǎn)品,名字叫“軟眠眠”。
這是一款拯救失眠者的治愈系睡眠 App,以一幅小時(shí)候生活的環(huán)境插畫(huà)填充界面背景,圖標(biāo)設(shè)計(jì)也是提取小時(shí)候的玩物或者生活用品,視覺(jué)風(fēng)格營(yíng)造極強(qiáng)的懷舊感。無(wú)論是畫(huà)風(fēng)還是配色、配樂(lè)等,都勾起了我們滿(mǎn)滿(mǎn)的回憶,帶給用戶(hù)溫馨的體驗(yàn)。
四、趣味性的進(jìn)度提示設(shè)計(jì)
在完成步驟化和消耗數(shù)據(jù)等內(nèi)容表達(dá)層面會(huì)選擇進(jìn)度條,通過(guò)可視化的表達(dá)提高用戶(hù)的理解,減輕信息認(rèn)知負(fù)擔(dān)。
軟眠眠 App 在定制睡眠計(jì)劃的過(guò)程中,完成選項(xiàng)時(shí)的進(jìn)度條設(shè)計(jì)非常有意思,是一個(gè)小孩通過(guò)拉動(dòng)繩子移動(dòng)。拉動(dòng)過(guò)程中結(jié)合動(dòng)態(tài)表達(dá),配合手繪風(fēng)的表現(xiàn)讓人感覺(jué)輕松愉快,趣味性的設(shè)計(jì)也提高了完成選項(xiàng)任務(wù)的意愿度。
五、場(chǎng)景感的點(diǎn)擊操作
在保障底層操作體驗(yàn)的基礎(chǔ)上,設(shè)計(jì)會(huì)越來(lái)越講究細(xì)節(jié)的體驗(yàn),逐步強(qiáng)化情感化的融入和場(chǎng)景感的體驗(yàn)。
最近在體驗(yàn)小雞上工 App 時(shí),在找工作的列表設(shè)計(jì)中加入了“搶”按鈕,在點(diǎn)擊列表時(shí)按鈕會(huì)有按壓的動(dòng)效過(guò)程。模擬搶拍按鈕獲得機(jī)會(huì)的體驗(yàn),營(yíng)造場(chǎng)景氛圍感,提高了設(shè)計(jì)表達(dá)的趣味性。
六、動(dòng)效引導(dǎo)用戶(hù)發(fā)帖
微動(dòng)效可以提高功能的吸引力,也能讓互動(dòng)體驗(yàn)變得更有趣,可以通過(guò)動(dòng)效引導(dǎo)功能操作和提高關(guān)注度。
騰訊動(dòng)漫 App 在圈子欄目中,以 IP 形象結(jié)合動(dòng)效強(qiáng)化發(fā)帖按鈕,以此引導(dǎo)用戶(hù)參與發(fā)帖。動(dòng)效不僅突出了發(fā)帖的關(guān)注度,也讓發(fā)帖按鈕設(shè)計(jì)更有親和力,進(jìn)而提升用戶(hù)的點(diǎn)擊欲。
七、卡通形象強(qiáng)化瓷片區(qū)視覺(jué)感
瓷片區(qū)起到強(qiáng)化曝光達(dá)到流量引導(dǎo)的作用,提高該模塊的吸引力至關(guān)重要,視覺(jué)感的突出也尤為重要。
會(huì)玩 App 在首頁(yè)“一起玩”的瓷片區(qū)設(shè)計(jì)中,以卡通形象結(jié)合豐富的色彩進(jìn)行表現(xiàn),各種裝扮的形象豐富視覺(jué)感。卡通形象設(shè)計(jì)風(fēng)格統(tǒng)一,卡片色彩豐富且協(xié)調(diào),整體瓷片區(qū)視覺(jué)沖擊力十足。
八、不改變布局的曝光強(qiáng)化
在當(dāng)前產(chǎn)品結(jié)構(gòu)不變的基礎(chǔ)上,如何提高局部?jī)?nèi)容或者主推內(nèi)容的曝光度,是產(chǎn)品設(shè)計(jì)師不斷探索的方向。
愛(ài)奇藝 App 首頁(yè)推薦欄目 Banner 圖下方,默認(rèn)情況下以宮格布局推薦影片。前段時(shí)間在打開(kāi)時(shí)發(fā)現(xiàn)了一個(gè)臨時(shí)設(shè)計(jì)表達(dá),保持當(dāng)前結(jié)構(gòu)布局不變,放大了圖片填充和推薦影片,整張畫(huà)面填充宮格,視覺(jué)張力十足。該設(shè)計(jì)表達(dá)既不會(huì)干擾當(dāng)前布局,也能強(qiáng)化推薦影片的曝光度,解決方案值得探索。
九、可以晃動(dòng)的 Banner 圖
Banner 可以在創(chuàng)意、造型、互動(dòng)形式等方面進(jìn)行設(shè)計(jì)發(fā)揮,也呈現(xiàn)了許多優(yōu)秀的方案,產(chǎn)品設(shè)計(jì)師也在不斷嘗試更多的可能性。
最近在體驗(yàn)盯潮 App 時(shí),發(fā)售欄目頂部 Banner 圖設(shè)計(jì)引人關(guān)注。當(dāng)用戶(hù)左右晃動(dòng)手機(jī)時(shí),Banner 圖背景層不動(dòng),而文案和產(chǎn)品等元素層會(huì)跟著晃動(dòng)的頻率左右移動(dòng)??梢曰蝿?dòng)的 Banner 圖非常有意思,成功地吸引了用戶(hù)的關(guān)注度和點(diǎn)擊欲。
十、場(chǎng)景感的底部標(biāo)簽欄設(shè)計(jì)
底部標(biāo)簽欄設(shè)計(jì)可以在背景、造型、圖標(biāo)等元素中發(fā)揮,其中圖標(biāo)設(shè)計(jì)中的發(fā)揮相對(duì)更多一些,在背景和造型層面的案例較少,不過(guò)最近也發(fā)現(xiàn)了一個(gè)解決方案。
在體驗(yàn)云游萬(wàn)里長(zhǎng)城小程序時(shí),進(jìn)入之后的小程序底部標(biāo)簽欄設(shè)計(jì)結(jié)合了長(zhǎng)城墻面和結(jié)構(gòu),非常有場(chǎng)景代入感。設(shè)計(jì)了深色版和淺色版,圖標(biāo)造型設(shè)計(jì)也融入了長(zhǎng)城元素,不失為一種優(yōu)秀的差異化設(shè)計(jì)探索。
小結(jié)
希望本期的分享可以開(kāi)啟大家更多設(shè)計(jì)思維,從優(yōu)秀的設(shè)計(jì)方案中發(fā)現(xiàn)設(shè)計(jì)的軌跡,復(fù)用到后期的項(xiàng)目設(shè)計(jì)中。本文描述屬于個(gè)人理解和總結(jié),不足之處歡迎大家留言補(bǔ)充,我們互相進(jìn)步。
蘭亭妙微(www.b186.net )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)、B端界面設(shè)計(jì)、桌面端界面設(shè)計(jì)、APP界面設(shè)計(jì)、圖標(biāo)定制、用戶(hù)體驗(yàn)設(shè)計(jì)、交互設(shè)計(jì)、UI咨詢(xún)、高端網(wǎng)站設(shè)計(jì)、平面設(shè)計(jì),以及相關(guān)的軟件開(kāi)發(fā)服務(wù),咨詢(xún)電話:01063334945。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢(xún)及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan。
藍(lán)藍(lán)設(shè)計(jì)的小編 http://www.b186.net