超碰av在线|无码精品一区二区三区在线|伊人色色日韩一级片内射视频群批_欧美丰满少妇人妻HD高清在线_亚洲一区二区中文_亚洲无码动漫专区

首頁

用好關(guān)鍵詞,用AI繪畫輕松做出多巴胺配色設(shè)計(jì)?。{(lán)藍(lán)UI設(shè)計(jì)公司

資深UI設(shè)計(jì)者

用好關(guān)鍵詞,用AI繪畫輕松做出多巴胺配色設(shè)計(jì)?。{(lán)藍(lán)UI設(shè)計(jì)公司

多巴胺配色設(shè)計(jì)是一種引起快樂和滿足感的色彩方案,對(duì)于畫作、設(shè)計(jì)和廣告等領(lǐng)域具有重要的影響力。本文將介紹如何利用關(guān)鍵詞優(yōu)化,并借助AI繪畫技術(shù),輕松實(shí)現(xiàn)多巴胺配色設(shè)計(jì)。讀者將了解如何選擇適當(dāng)?shù)年P(guān)鍵詞,如何使用AI工具進(jìn)行繪畫,以及如何運(yùn)用色彩心理學(xué)原理創(chuàng)作出令人愉悅的配色方案。

來百度APP暢享高清圖片
引言:

色彩對(duì)于視覺體驗(yàn)的重要性不言而喻,而多巴胺配色設(shè)計(jì)則可以進(jìn)一步增強(qiáng)人們的愉悅感和滿足感。然而,尋找和實(shí)現(xiàn)恰到好處的多巴胺配色并不容易。本文將介紹一種運(yùn)用關(guān)鍵詞優(yōu)化和AI繪畫技術(shù)的方法,幫助讀者輕松創(chuàng)作出多巴胺配色設(shè)計(jì),激發(fā)觀者的積極情緒和情感共鳴。

一、選擇適當(dāng)?shù)年P(guān)鍵詞

關(guān)鍵詞的選擇是多巴胺配色設(shè)計(jì)的第一步。關(guān)鍵詞應(yīng)該與目標(biāo)情感和主題相關(guān),例如“快樂”、“活力”、“溫暖”、“激情”等。通過仔細(xì)思考和做市場(chǎng)調(diào)研,可以收集到一系列適合的關(guān)鍵詞。關(guān)鍵詞的質(zhì)量和廣度將直接影響后續(xù)的配色設(shè)計(jì)。

二、利用AI繪畫工具

借助先進(jìn)的AI繪畫工具,如GAN(生成對(duì)抗網(wǎng)絡(luò))和圖像生成模型,可以輕松實(shí)現(xiàn)從關(guān)鍵詞到色彩方案的轉(zhuǎn)化。輸入所選關(guān)鍵詞,AI模型將通過學(xué)習(xí)和分析大量的圖像數(shù)據(jù),生成與關(guān)鍵詞情感相匹配的色彩方案。這些工具不僅可以加快設(shè)計(jì)過程,還能提供更多元化和創(chuàng)新的配色選擇。

三、運(yùn)用色彩心理學(xué)原理

色彩心理學(xué)是研究色彩對(duì)人類心理和情緒產(chǎn)生的影響的學(xué)科。在多巴胺配色設(shè)計(jì)中,運(yùn)用色彩心理學(xué)原理將使配色更具感染力和吸引力。例如,橙色可傳達(dá)熱情和活力,黃色可帶來快樂和活躍感,紅色可以激發(fā)激情和興奮等。理解這些原理,并將其應(yīng)用于配色方案中,能夠有效地創(chuàng)造出令人愉悅的視覺效果。

四、試驗(yàn)和調(diào)整

在使用AI工具生成初步的配色方案后,通過對(duì)比、試驗(yàn)和調(diào)整,不斷優(yōu)化和完善色彩組合。與觀眾進(jìn)行反饋交流,了解他們的感受和喜好,并進(jìn)行相應(yīng)的調(diào)整。這個(gè)過程需要靈活性和創(chuàng)造力,以確保最終達(dá)到用戶的滿意度和情感共鳴。

結(jié)論:

多巴胺配色設(shè)計(jì)是通過優(yōu)化關(guān)鍵詞和使用AI繪畫技術(shù)來實(shí)現(xiàn)的一項(xiàng)創(chuàng)造性工作。通過選擇適當(dāng)?shù)年P(guān)鍵詞、利用AI繪畫工具、運(yùn)用色彩心理學(xué)原理以及試驗(yàn)和調(diào)整,可以輕松實(shí)現(xiàn)多巴胺配色設(shè)計(jì),提升畫作、設(shè)計(jì)和廣告等領(lǐng)域。

藍(lán)藍(lán)未來將會(huì)持續(xù)在平臺(tái)上分享關(guān)于設(shè)計(jì)行業(yè)的文章。此外藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),添加vx藍(lán)小助ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。同時(shí)添加藍(lán)小助我們將會(huì)為您提供優(yōu)秀的設(shè)計(jì)案例和設(shè)計(jì)素材等,歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系。

藍(lán)藍(lán)設(shè)計(jì)( m.miumiuwan.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ì)公司

除了繪畫,盤點(diǎn) AI 未來會(huì)大放異彩的6個(gè)領(lǐng)域

資深UI設(shè)計(jì)者

AI作為一種前沿技術(shù),正在不斷拓展其應(yīng)用領(lǐng)域。以下是AI未來可能大放異彩的六個(gè)領(lǐng)域:

  1. 醫(yī)療保?。篈I有巨大的潛力在醫(yī)療保健領(lǐng)域發(fā)揮作用。它可以用于醫(yī)學(xué)影像分析、診斷支持系統(tǒng)、個(gè)性化治療方案等,提高醫(yī)療保健的效率和準(zhǔn)確性。

  2. 自動(dòng)駕駛:自動(dòng)駕駛汽車是AI技術(shù)的一個(gè)重要應(yīng)用。AI可以通過感知、決策和控制系統(tǒng)來驅(qū)動(dòng)車輛,提高交通安全性并改善交通流量。

  3. 金融服務(wù):AI在金融服務(wù)中有廣泛的應(yīng)用,如信用風(fēng)險(xiǎn)評(píng)估、反欺詐檢測(cè)、投資策略和客戶服務(wù)等。AI可以通過大數(shù)據(jù)和機(jī)器學(xué)習(xí)算法來優(yōu)化金融決策和服務(wù)。

  4. 教育領(lǐng)域:AI可以為教育提供更加個(gè)性化和自適應(yīng)的學(xué)習(xí)體驗(yàn)。它可以根據(jù)學(xué)生的興趣、能力和學(xué)習(xí)風(fēng)格來定制教學(xué)內(nèi)容和方法,提高學(xué)習(xí)效果。

  5. 城市規(guī)劃:AI可以在城市規(guī)劃中發(fā)揮重要作用。它可以分析大量的城市數(shù)據(jù),優(yōu)化交通流動(dòng)、資源分配和環(huán)境保護(hù),幫助建設(shè)更智能、可持續(xù)的城市。

  6. 藝術(shù)與創(chuàng)意產(chǎn)業(yè):AI已經(jīng)在藝術(shù)和創(chuàng)意產(chǎn)業(yè)取得了一些突破,如音樂創(chuàng)作、圖像生成和電影特效等。AI可以模仿人類的藝術(shù)表達(dá),并創(chuàng)造出全新的藝術(shù)形式。

需要指出的是,AI的發(fā)展仍處于快速變化的階段,未來還有更多領(lǐng)域可能會(huì)出現(xiàn)新的應(yīng)用。因此,對(duì)于AI的應(yīng)用潛力需要持續(xù)觀察和研究。

今日分享這篇文章是藍(lán)藍(lán)設(shè)計(jì)的原創(chuàng)文章,未來將會(huì)持續(xù)在平臺(tái)上分享關(guān)于設(shè)計(jì)行業(yè)的文章。此外藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),添加vx藍(lán)小助ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。同時(shí)添加藍(lán)小助我們將會(huì)為您提供優(yōu)秀的設(shè)計(jì)案例和設(shè)計(jì)素材等,歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系。

藍(lán)藍(lán)設(shè)計(jì)( m.miumiuwan.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ì)公司

HMI車載系統(tǒng)設(shè)計(jì)趨勢(shì)

博博

3.png4.png

作者:藍(lán)藍(lán)設(shè)計(jì)   圖片來源:花瓣網(wǎng)



藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),請(qǐng)加微信ban_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~

希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。 



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



藍(lán)藍(lán)設(shè)計(jì)m.miumiuwan.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ì)公司

HMI車載系統(tǒng)設(shè)計(jì)原則

博博

1.png2.png

作者:藍(lán)藍(lán)設(shè)計(jì)   圖片來源:花瓣網(wǎng)



藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),請(qǐng)加微信ban_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~

希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。 



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



藍(lán)藍(lán)設(shè)計(jì)m.miumiuwan.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ì)公司

瑟瑟發(fā)抖,UI設(shè)計(jì)也要被AI支配了么?

博博

最近 AI 繪畫越來越成熟,能做的事情也越來越多,很多同學(xué)經(jīng)常在群里或私信中問我關(guān)于對(duì) AI 繪畫的觀點(diǎn)和看法,以及 AI 繪畫對(duì) UI 設(shè)計(jì)師有什么影響,所以今天獨(dú)立寫一篇內(nèi)容,來具體討論下這個(gè)話題。
首先輸出一個(gè)太長不看版的結(jié)論:


AI 繪圖可以協(xié)作 UI 設(shè)計(jì)師更快地完成一些邊角料工作,但無法取代 UI 設(shè)計(jì)師的核心價(jià)值,不會(huì)對(duì) UI 崗位造成大范圍沖擊……


那下面就來具體討論吧!



相信大家都有這種感覺,2022年開始,AI 繪畫突然就毫無征兆地火起來了,用火遍大街小巷來形容一點(diǎn)也不過分,當(dāng)我走在地鐵和機(jī)場(chǎng)等公共場(chǎng)所都能隨處可見 AI 繪畫作品的展示。




其實(shí)AI繪畫這個(gè)技術(shù)一直都有,比如 OpenAi 的 Dall·E,但真正產(chǎn)生質(zhì)變的時(shí)候是從 2022 年2月 Disco Diffusion 發(fā)布以后,讓 AI 繪畫的能力得到了質(zhì)的飛躍。


隨后一些使用它創(chuàng)作的作品開始流通,且在美國的某數(shù)碼繪畫比賽中由 AI 作品獲得冠軍,徹底吸引了公眾的視線。隨后,一系列新的 AI 繪畫工具開始開發(fā)和上線,包括目前為大家所熟知的 Stable Diffusion 和 Midjourney、NovelAI。



從上線到現(xiàn)在不到1年的時(shí)間里,這些軟件都完成了多次的大版本更新和迭代,讓 AI 繪圖的能力越來越強(qiáng),準(zhǔn)確性越來越高,我們甚至很難想象再過五年以后會(huì)發(fā)展到什么可怕的地步。



除了目前已經(jīng)正式發(fā)布的繪圖工具外,還有很多新的產(chǎn)品正在熱火朝天的開發(fā)階段,如巨頭 Adobe 的 Firefly ,Stability 的新產(chǎn)品 REimagine 等。


產(chǎn)品的多樣性,差異化,以及本身的進(jìn)化,為視覺設(shè)計(jì)和藝術(shù)創(chuàng)作提供了全方位的支持和可能性,也對(duì)相關(guān)行業(yè)產(chǎn)生了巨大的沖擊。


我們不得不面臨一個(gè)很現(xiàn)實(shí)的問題,AI 是不是會(huì)取代大多數(shù)插畫、設(shè)計(jì)師?


這是很有可能的,不管是從網(wǎng)上,還是認(rèn)識(shí)的朋友學(xué)員那邊獲得的反饋,高度依賴插畫、場(chǎng)景建模的行業(yè),都在受到 AI 的劇烈沖擊,有的將接入 AI 制定成 KPI 要求全團(tuán)隊(duì) ALL IN,有的在跑通AI工作流以后直接啟動(dòng)裁員進(jìn)程或關(guān)閉外包渠道。


AI 的出現(xiàn)對(duì)于美術(shù)行業(yè),就像燃油車出現(xiàn)對(duì)馬車的革命,照相機(jī)的出現(xiàn)對(duì)手繪的沖擊,是非常值得思考的,因?yàn)槲覀兓蚨嗷蛏僖采碓谄渲小?/span>


因?yàn)樵诋a(chǎn)品方向,Midjourney 已經(jīng)可以通過指令生成用戶界面了,試用 ChatGPT-4 已經(jīng)可以用指令10秒創(chuàng)建一個(gè)可以操作和訪問的網(wǎng)頁,看起來未來已經(jīng)提前朝我們走來。


所以 UI 設(shè)計(jì)師是不是很快也要被取代直至消亡?



相信有長期看我們公眾號(hào)分享和公開課的同學(xué),應(yīng)該知道我一直在強(qiáng)調(diào),界面對(duì)于 UI 設(shè)計(jì)師的工作只是必要但占比并不高的部分,如果認(rèn)為我們的工作價(jià)值僅僅是最后產(chǎn)出的視覺界面,那淘汰多數(shù) UI 設(shè)計(jì)師的方式根本輪不到 AI 來動(dòng)手,按目前市面流通的前端框架和組件庫就夠了。


之所以有大量的現(xiàn)成素材、模版、組件庫,還不能淘汰 UI 設(shè)計(jì)師,原因就是整個(gè)項(xiàng)目設(shè)計(jì)過程中所需的變通、靈活性、抽象思維要求,是它們完全無法覆蓋的。


一個(gè)稍微成熟點(diǎn)的項(xiàng)目設(shè)計(jì)圖產(chǎn)出和交付,是需要經(jīng)過下面這個(gè)流程的:


從這個(gè)簡化的流程模型里,大家要明白專業(yè)的設(shè)計(jì)稿輸出是有 “黑箱” 加工步驟的,要在這階段,對(duì)工作的需求進(jìn)行大量的研究、分析,并做出決策確定出設(shè)計(jì)目標(biāo)或者方案。


在現(xiàn)代設(shè)計(jì)團(tuán)隊(duì)中,直接拿到需求就做設(shè)計(jì)稿的模式是很難產(chǎn)出高質(zhì)量設(shè)計(jì)的,或者應(yīng)對(duì)更專業(yè)嚴(yán)格的要求。設(shè)計(jì)師需要在這個(gè)階段投入大量精力,盡可能提升設(shè)計(jì)產(chǎn)生的價(jià)值,減少出現(xiàn)不良影響的風(fēng)險(xiǎn),以及 —— 說服團(tuán)隊(duì)接受當(dāng)前的設(shè)計(jì)思路。


而這是 AI 繪圖完全無法實(shí)現(xiàn)的東西,我們使用 AI 繪畫僅僅是輸入做好的決策,讓它生成結(jié)果,但沒辦法通過輸入業(yè)務(wù)、需求的疑問,讓它給出一個(gè)有詳盡理由和邏輯的設(shè)計(jì)成果。


可能有同學(xué)會(huì)下意識(shí)的想到,那我們用 ChatGPT 這樣的工具,提出問題,讓它自己給出解答并直接給出繪圖指令操作繪圖工具生成界面,順帶再自己開發(fā)號(hào)產(chǎn)品,不就行了,一個(gè)人就是一個(gè)團(tuán)隊(duì),人人都是產(chǎn)品經(jīng)理終于實(shí)現(xiàn)……


這個(gè)業(yè)務(wù)模型非常合理,看起來似乎完全可以實(shí)現(xiàn)。但真的有項(xiàng)目經(jīng)驗(yàn)的自己去思考一下,就會(huì)發(fā)現(xiàn)中間存在的問題無窮無盡。


第一點(diǎn),“黑箱” 是給出問題答案的分析處理過程,ChatGPT 再怎么神通廣大,也需要我們?nèi)ソo到有效的問題和需求,它才能給你有用的答案。那么問題來了,你怎么和它描述具體的業(yè)務(wù)需求、產(chǎn)品需求、體驗(yàn)問題和各類用戶痛點(diǎn)?


以上一篇分享為例,我們優(yōu)化 Stable Diffusion 的輸入框,光和 AI 說優(yōu)化輸入框約等于廢話,你得告訴它怎么優(yōu)化,那怎么優(yōu)化這件事不就是得去找出原產(chǎn)品問題的缺陷嘛?如果我自己去找完缺陷了,那最后畫那點(diǎn)圖例的工作量有什么了不起的呢?


更何況一些復(fù)雜的業(yè)務(wù),尤其是B端行業(yè),完全無法用簡單的幾句話描述清楚,要搭配各種框架圖和流程圖,光開一個(gè)業(yè)務(wù)評(píng)審和培訓(xùn)的會(huì)議,可能就要花非常長的時(shí)間。




所以該用什么形式去和 AI 描述這些抽象的信息內(nèi)容?


第二點(diǎn),還是以上面案例為例,在這個(gè)輸入框中,包含很多交互的小細(xì)節(jié),輸入框內(nèi)光標(biāo)的操作,鍵盤的操作邊界在哪里,輸入文字后提示關(guān)聯(lián)的邏輯,不同輸入指令類型要區(qū)分怎么和 AI 描述,全都成為問題。


所以光生成一個(gè)界面是沒有意義的,這個(gè)界面做的再好看再美觀,也不代表它有真實(shí)落地的可能,只是完成了設(shè)計(jì)工作的一小部分而已。所以看到這里是不是感覺很熟悉?和我們?cè)谧凡ㄉ峡吹降母黝愶w機(jī)稿案例沒有太大的區(qū)別。


第三點(diǎn),上面的模型只是一個(gè)非常簡化的流程,有過真實(shí)的項(xiàng)目經(jīng)驗(yàn)就應(yīng)該知道流程中會(huì)有反復(fù)拉鋸的事件,需求的變動(dòng),設(shè)計(jì)稿的修改,方案的調(diào)整,這些零碎的工作去和 AI 提,你會(huì)發(fā)現(xiàn)有輸入問題的時(shí)間,可能設(shè)計(jì)早就修改完了。


尤其在最終的標(biāo)注和切圖環(huán)節(jié),涉及到設(shè)計(jì)時(shí)對(duì)設(shè)計(jì)稿的制定,標(biāo)注和切圖實(shí)際上有很多主觀性和經(jīng)驗(yàn)化、場(chǎng)景化的輸出要求,它需要設(shè)計(jì)師在經(jīng)歷整個(gè)項(xiàng)目流程后自行判斷。


除了以上三點(diǎn),還有很多其它的問題難以解決,而這些問題的總和,決定了沒有出現(xiàn)真正的人工智能之前,使用 AI 來輸出 UI 界面是一件不靠譜的事情。


只有視覺領(lǐng)域沒有前期那么多條條框框,也沒有后續(xù)一系列交付和維護(hù)需求的場(chǎng)景,才是 AI 真正產(chǎn)生價(jià)值和影響的方向。


用 AI 做 UI 設(shè)計(jì)不靠譜,但是不代表對(duì)UI設(shè)計(jì)師沒價(jià)值。這話聽著可能挺拗口的,但事實(shí)如此,因?yàn)樵趪鴥?nèi)的UI設(shè)計(jì)環(huán)境中,UI 設(shè)計(jì)師的工作內(nèi)容往往不局限于產(chǎn)品設(shè)計(jì)一個(gè)領(lǐng)域內(nèi)。

還包含下面這些操作:


我相信大多數(shù) UI 設(shè)計(jì)師做平面和運(yùn)營設(shè)計(jì)的感受就和上墳的狀態(tài)是一樣的,上墳起碼是懷有對(duì)先人獻(xiàn)花,做平面和運(yùn)營設(shè)計(jì)只會(huì)產(chǎn)生對(duì)自己深深的唾棄……


所以 AI 的出現(xiàn)可以很好的處理這部分的需求,比如一些雖然用處不大,但就是甲方還是老板就是想用的 3D 風(fēng)格圖標(biāo)。


或者,在登陸頁用的比較濫俗的 3D 場(chǎng)景背景,為了這樣的東西花很長的時(shí)間去建模和渲染,投入和收益是完全不成正比的。所幸使用 AI 也可以幫助我們非常短的時(shí)間內(nèi)獲取想要的效果。


還有就是各類運(yùn)營設(shè)計(jì)圖,互聯(lián)網(wǎng)運(yùn)營設(shè)計(jì)和一般的品牌廣告視覺比較起來,就是對(duì)創(chuàng)意性的忽視,畫面并不需要埋伏大量的隱喻、內(nèi)涵或故事,就是單純的應(yīng)景和吸引用戶注意力,這恰恰也是 AI 最適合輸出的東西。


包括廣告 Banner、H5、啟動(dòng)頁等,都可以通過 AI 快速生成一些高質(zhì)量的插畫,來替代我們自己從頭開始繪制的苦惱。


所以你看,對(duì)于我們職業(yè)價(jià)值不高的這些雜活,AI 都可以很好的去完成,而且可以肯定未來可以完成得越來越好,我們就可以節(jié)省更多的時(shí)間,不管是投入精力給體驗(yàn)和交互,還是準(zhǔn)點(diǎn)下班,都符合我們自身的利益。


所以,UI 設(shè)計(jì)師對(duì) AI 的態(tài)度并不是敵視和悲觀,而是要把它當(dāng)作救星和幫手,把我們從運(yùn)營設(shè)計(jì)的水火中拯救出來……


不僅是觀念上的調(diào)整,掌握一定的 AI 繪制技巧也是必要的,將他們?nèi)谌氲侥阏降墓ぷ髁鞒讨?,所需投入的精力也遠(yuǎn)遠(yuǎn)小于你從頭開始學(xué)插畫和 3D 渲染。


相信不久的將來,UI 設(shè)計(jì)師的招聘中部分要求手繪和建模的 JD,會(huì)替換成熟練使用 AI 繪圖。




作者:酸梅干超人    來源:站酷網(wǎng)



藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),請(qǐng)加微信ban_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~

希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。 



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



藍(lán)藍(lán)設(shè)計(jì)m.miumiuwan.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ì)公司

大廠設(shè)計(jì)師的細(xì)節(jié)真不是蓋的

博博

設(shè)計(jì)做到極致注重的就是對(duì)于細(xì)節(jié)的把控力,大廠的設(shè)計(jì)師之所以比較優(yōu)秀,就是他們具備很好的細(xì)節(jié)把控力。想要提高產(chǎn)品設(shè)計(jì)的能力,發(fā)現(xiàn)設(shè)計(jì)細(xì)節(jié)和思考設(shè)計(jì)深入的能力至關(guān)重要。


最近在體驗(yàn)產(chǎn)品的時(shí)候,發(fā)現(xiàn)了一些設(shè)計(jì)細(xì)節(jié)做得比較好的優(yōu)秀案例,分享給大家學(xué)習(xí)一下。




分享目錄


一、Banner 輪播轉(zhuǎn)場(chǎng)的品牌化

二、情感化的彈窗設(shè)計(jì)

三、最小化顯示提高空間利用率

四、動(dòng)態(tài)化的設(shè)置引導(dǎo)

五、沉浸式的活動(dòng)氛圍設(shè)計(jì)

六、人性化的提示設(shè)置

七、動(dòng)態(tài)感知的溫度設(shè)計(jì)

八、無處不在的廣告位開發(fā)

九、主題化的圖標(biāo)設(shè)計(jì)

十、新穎的卡片式設(shè)計(jì)




一、Banner 輪播轉(zhuǎn)場(chǎng)的品牌化


立足于品牌做設(shè)計(jì),才能強(qiáng)化自身產(chǎn)品的差異化。如何在更多設(shè)計(jì)場(chǎng)景中融入品牌基因,是設(shè)計(jì)師需要深入思考的關(guān)鍵。


最近在使用騰訊視頻 APP 時(shí),發(fā)現(xiàn)首頁 Banner 圖在輪播的轉(zhuǎn)場(chǎng)過程中,以品牌 LOGO 造型作為轉(zhuǎn)場(chǎng)過度。一個(gè)小小的細(xì)節(jié)強(qiáng)化了用戶對(duì)于品牌的記憶度,也體現(xiàn)出專屬的設(shè)計(jì)差異。




二、情感化的彈窗設(shè)計(jì)


通過彈窗設(shè)計(jì)可以提高用戶操作效率,也是傳播信息(活動(dòng)/廣告)最直觀的形式。但是體驗(yàn)多了用戶便會(huì)開始排斥,提高彈窗的情感化設(shè)計(jì)變得尤為重要,降低用戶的排斥感才能提高彈窗的作用。


很多娛樂影視等 APP 都會(huì)有“青少年模式”彈窗提示,抖音將彈窗視覺表達(dá)融入了精美的國風(fēng)插畫。也通過針對(duì)性的內(nèi)容作為設(shè)置的引導(dǎo),提高了用戶對(duì)“青少年模式”的深入理解,增強(qiáng)了體驗(yàn)的積極性。


插畫的形式在彈窗設(shè)計(jì)中表現(xiàn)比較突出,比如嘀嗒出行 APP 將“推送通知”的彈窗設(shè)計(jì)運(yùn)用插畫增強(qiáng)情感化表達(dá)。相較于生硬的表達(dá)方式用戶更能接受,通過營銷的文案引導(dǎo)用戶授權(quán),提高了產(chǎn)品的感官體驗(yàn)。




三、最小化顯示提高空間利用率


對(duì)于工具型產(chǎn)品不同用戶的操作焦點(diǎn)不同,更多定制化的體驗(yàn)才能提高用戶的操作效率。


釘釘 APP 在協(xié)作欄目中,默認(rèn)展示的各類工具可以進(jìn)行收起,實(shí)現(xiàn)最小化顯示。用戶可以根據(jù)使用習(xí)慣和操作方式選擇收起/展開,提高了當(dāng)前空間的利用率,自定義的功能設(shè)計(jì)可以提高用戶的操作體驗(yàn)。




四、動(dòng)態(tài)化的設(shè)置引導(dǎo)


為了提高用戶隱私權(quán)益,手機(jī)系統(tǒng)針對(duì)產(chǎn)品調(diào)用權(quán)限進(jìn)行了阻力設(shè)計(jì),需要用戶的授權(quán)操作。提高用戶的各類功能授權(quán)就需要設(shè)計(jì)師探索,降低用戶的排斥感和提高授權(quán)的利好政策才能獲得授權(quán)。


抖音在引導(dǎo)用戶開啟通知權(quán)限的設(shè)計(jì)中,采用了動(dòng)態(tài)畫面的表達(dá)來強(qiáng)調(diào)開啟通知的利好政策,以此來攻破用戶的心理防備。相較于生硬的彈窗提示,動(dòng)態(tài)的表達(dá)和引導(dǎo)性的文案更能拉近與用戶的距離感。




五、沉浸式的活動(dòng)氛圍設(shè)計(jì)


沉浸式的體驗(yàn)可以帶給用戶更好的場(chǎng)景感,提高用戶的參與度。在活動(dòng)的設(shè)計(jì)中,不斷向游戲化和沉浸式方向加強(qiáng)體驗(yàn),提高活動(dòng)的趣味性和強(qiáng)化用戶參與的積極性。


騰訊視頻在情人節(jié)的互動(dòng)活動(dòng)設(shè)計(jì)中,就將搶紅包的活動(dòng)融入到當(dāng)前的界面中,紅包雨鋪滿整個(gè)屏幕,以趣味性的形式滿足用戶心理。不隔斷與界面之間的聯(lián)系,降低活動(dòng)對(duì)用戶的干擾,進(jìn)而提高活動(dòng)氛圍感和參與度。




六、人性化的提示設(shè)置


短視頻近些年改變了大家的生活方式和娛樂形式,也有用戶容易過度依賴進(jìn)而影響休息質(zhì)量。


抖音作為短視頻領(lǐng)域的頭部產(chǎn)品之一,在增強(qiáng)用戶體驗(yàn)的同時(shí)也要起到良性的引導(dǎo)作用。當(dāng)用戶刷短視頻一定時(shí)間后會(huì)彈窗提示休息,而提示時(shí)間用戶可以根據(jù)自己的實(shí)際情況進(jìn)行設(shè)置,靈活的設(shè)置可以讓用戶合理分配時(shí)間。健康使用的引導(dǎo)可以讓用戶感受到產(chǎn)品的溫度,提高用戶體驗(yàn)的認(rèn)可度。




七、動(dòng)態(tài)感知的溫度設(shè)計(jì)


天氣預(yù)報(bào)是用戶關(guān)注度較高的信息,對(duì)于溫度的感知可以讓我們出行更容易把控。在產(chǎn)品中顯示天氣情況也是一種情感化的升級(jí),可以帶給用戶更有溫度的體驗(yàn)。


利用餓了么 APP 點(diǎn)餐之后,首頁會(huì)顯示配送情況和當(dāng)前的天氣溫度,背景以動(dòng)態(tài)的天氣畫面增強(qiáng)視覺感知。也希望用戶可以根據(jù)天氣情況對(duì)外賣員多一份理解,加強(qiáng)人與人之間的寬容心,帶給用戶更強(qiáng)的情感化體驗(yàn)。


最近在使用愛奇藝 APP 時(shí),發(fā)現(xiàn)左上角的品牌位置也結(jié)合了天氣情況,結(jié)合頂部視覺區(qū)域的流體漸變,新增的天氣預(yù)報(bào)和品牌 LOGO 完美的通過動(dòng)效過度。整個(gè)設(shè)計(jì)表達(dá)流暢自然,感官體驗(yàn)也是非常值得學(xué)習(xí)的。




八、無處不在的廣告位開發(fā)


廣告是眾多產(chǎn)品實(shí)現(xiàn)流量變現(xiàn)的方式之一,廣告位的開發(fā)也是見縫插針,如何在僅有的空間增加更多廣告位,產(chǎn)品設(shè)計(jì)師也在不斷探索。


最近在使用騰訊視頻 APP 時(shí),進(jìn)入到個(gè)人中心時(shí)會(huì)默認(rèn)有個(gè)下拉廣告。這個(gè)見縫插針的廣告位新增,對(duì)于設(shè)計(jì)師來說讓我感受到了廣告的無處不在,不過對(duì)于用戶來說是否會(huì)心生排斥感得通過數(shù)據(jù)去驗(yàn)證。但是作為產(chǎn)品設(shè)計(jì)師這也是一個(gè)啟發(fā),將有限的空間進(jìn)行深度開發(fā),還不會(huì)影響已有的結(jié)構(gòu)布局,這也是一個(gè)啟發(fā)性的案例。




九、主題化的圖標(biāo)設(shè)計(jì)


圖標(biāo)是產(chǎn)品中不可或缺的存在,圖標(biāo)設(shè)計(jì)的研究也是設(shè)計(jì)師需要重點(diǎn)對(duì)待的技能范圍。精美的圖標(biāo)不僅可以提高產(chǎn)品的感官體驗(yàn),也能吸引用戶的關(guān)注度,進(jìn)而提高業(yè)務(wù)模塊的點(diǎn)擊欲。


最近在使用順豐速運(yùn)小程序時(shí),寄快遞欄目的各業(yè)務(wù)入口圖標(biāo)設(shè)計(jì)非常引人注目,結(jié)合主題化的圖標(biāo)設(shè)計(jì)突出了活動(dòng)傳播力度。對(duì)于工具型產(chǎn)品而言,強(qiáng)化氛圍感可以打破用戶原有的認(rèn)知,不僅可以突出活動(dòng)主題,也能強(qiáng)化用戶對(duì)產(chǎn)品的視覺感知。




十、新穎的卡片式設(shè)計(jì)


卡片式設(shè)計(jì)已經(jīng)流行好幾年了,目前依然是非常普及的 UI 設(shè)計(jì)趨勢(shì)之一。如何進(jìn)一步強(qiáng)化卡片式設(shè)計(jì)的創(chuàng)新度,我們需要不斷的嘗試和總結(jié)。


嘩哩嘩哩 APP 的創(chuàng)作中心設(shè)計(jì)也許是一個(gè)不錯(cuò)的啟發(fā),卡片內(nèi)部右上角的視覺強(qiáng)化使得原本普通的表達(dá)變得更有視覺感。突出的設(shè)計(jì)也成功的吸引了 UP 主的注意力,強(qiáng)化了該入口的點(diǎn)擊欲。這樣的設(shè)計(jì)表達(dá)在保留卡片式設(shè)計(jì)的基礎(chǔ)上,也是一種新穎的視覺表現(xiàn),可以作為突出業(yè)務(wù)入口的表現(xiàn)方式進(jìn)行探索。



作者:黑馬青年    來源:站酷網(wǎng)



藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),請(qǐng)加微信ban_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~

希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。 



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



藍(lán)藍(lán)設(shè)計(jì)m.miumiuwan.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ì)公司。

2022追波設(shè)計(jì)流行趨勢(shì)

博博


追波年度最佳作品

追波年度最佳作品來自大家最熟悉的UI8團(tuán)隊(duì)中的Tran Mau Tri Tam ?,作者來自越南西貢,最佳作品截止目前355K瀏覽量,2933個(gè)贊。


為什么看似平平無奇的作品卻能獲得追波年度最佳作品呢?既不是C端也不是純B端的作品,更像一個(gè)網(wǎng)頁與平面的結(jié)合體。如果去掉搜索圖標(biāo)、分類圖標(biāo)和按鈕,你可以理解它就是一個(gè)平面作品,一個(gè)字體加幾何形體構(gòu)建的作品,為了豐富畫面的層次,讓畫面更加的活潑采用了多彩加幾何色塊,讓標(biāo)題閱讀有停頓感和呼吸感。faster底部的橫線讓它從標(biāo)題文字中脫穎而出,這種使用線條突出重要信息的設(shè)計(jì)也是今年追波設(shè)計(jì)流行趨勢(shì)之一。


MetroUI是Windows8的界面設(shè)計(jì)語言,在2010年至2013年間曾經(jīng)風(fēng)靡一時(shí),那也是移動(dòng)互聯(lián)網(wǎng)的發(fā)展元年,現(xiàn)在國家推行實(shí)體經(jīng)濟(jì)、數(shù)字化帶動(dòng)To B 、To G 的發(fā)展元年,通過幾何色塊(MetroUI)實(shí)現(xiàn)B端產(chǎn)品與C端設(shè)計(jì)風(fēng)格的傳承與銜接,你會(huì)發(fā)現(xiàn)歷史總是驚人的相似。最后背景結(jié)合今年最流行的微軟風(fēng),毛玻璃的多彩高斯模糊漸變風(fēng),年度作品當(dāng)之無愧。


最后來看下按鈕的設(shè)計(jì),正常的按鈕要么文字加色塊,要么左圖標(biāo)加右文字,它設(shè)計(jì)成左文本加右圖標(biāo),更加注重信息的可讀性和易讀性,也體現(xiàn)B端設(shè)計(jì)重功能和交互體驗(yàn),視覺點(diǎn)到為止的設(shè)計(jì)理念。


下面我們來欣賞年度最佳作品里面的流行趨勢(shì)吧。


易讀性(停頓感)

字體三原則:可讀性、易識(shí)性、易讀性。當(dāng)你同時(shí)讀一篇文言文和一篇設(shè)計(jì)文章,肯定設(shè)計(jì)文章的內(nèi)容可讀性更好。易識(shí)性是用在字體設(shè)計(jì)上,不能過于浮夸的改變字體骨架、形體而不易識(shí)別。易讀性和每個(gè)位設(shè)計(jì)師都息息相關(guān),因?yàn)槲覀兌夹枰幣盼谋尽.?dāng)我們小時(shí)候?qū)懽魑臅r(shí),不會(huì)寫的文字可以用拼音代替。這時(shí)候讀者讀到拼音時(shí)會(huì)有停頓感,更加適合用戶閱讀。


通過給用戶制作停頓感來增加用戶的易讀性??梢栽谙嚓P(guān)聯(lián)文本后面添加圖片、表情、圖標(biāo)來更好的理解文本內(nèi)容,豐富文本內(nèi)涵。比如情侶間表達(dá)愛意時(shí)會(huì)輸入文本,“我愛你”、“我Love你”、“我ai你”、“我??你”,哪個(gè)更加會(huì)有情感共鳴呢?不言而喻,相信你心中已經(jīng)有答案了。



曲線

在標(biāo)題文字上添加曲線來突出重要文案是2021追波最流行的趨勢(shì)之一,第一個(gè)設(shè)計(jì)目的就是突顯文字,其次就是想表現(xiàn)鉛筆真實(shí)書寫的感覺。之前很多帶有簽名的設(shè)計(jì)中,簽字的文本都是手寫體的感覺,手寫體對(duì)比電腦的機(jī)械字體會(huì)帶有一種人文氣息,也會(huì)讓兩者之間產(chǎn)生一種對(duì)比、矛盾。


除了突顯文本外,曲線還有視覺引導(dǎo)的作用。通過視覺引導(dǎo)讓用戶按照設(shè)計(jì)師編排的順序進(jìn)行瀏覽界面。當(dāng)然還有比這更科學(xué)的工具就是眼動(dòng)儀測(cè)試,通過真實(shí)用戶眼睛瀏覽界面顯示對(duì)應(yīng)的熱點(diǎn)圖。



多彩高斯?jié)u變風(fēng)

多彩高斯?jié)u變風(fēng)是從色彩的角度來傳達(dá)和豐富畫面的,多彩高斯?jié)u變風(fēng)其實(shí)是從制造矛盾到平衡矛盾的過程,多彩漸變多為冷暖對(duì)比來制造畫面的沖突,需要控制冷暖畫面的大小來實(shí)現(xiàn)平衡。主流的還是以暖色突顯為主。多彩漸變主要起到活躍氣氛、吸引目光、平衡畫面的作用。


多彩高斯?jié)u變還可以結(jié)合輕擬物、幾何圖形、三維等新的組合方式去創(chuàng)新,給用戶呈現(xiàn)一種更加新穎的視覺表現(xiàn)形式。最后我們還是要回歸到內(nèi)容上,為了更好的傳達(dá)信息需要去設(shè)計(jì)與內(nèi)容相匹配的視覺風(fēng)格。




B端界面設(shè)計(jì)


側(cè)邊欄Sidebar

B端設(shè)計(jì)的火爆帶動(dòng)了B端相關(guān)模塊設(shè)計(jì),更多的人也愿意嘗試B端相關(guān)模塊設(shè)計(jì),側(cè)邊欄作為產(chǎn)品架構(gòu)中重要的導(dǎo)航系統(tǒng),好的側(cè)邊欄設(shè)計(jì)能為用戶帶來更好的效率。主流側(cè)邊欄都做了展開、收起、拖拽等交互效果,也是受限于PC屏幕為展示更多數(shù)據(jù)而騰空間。側(cè)邊欄主要承擔(dān)的功能有導(dǎo)航、分類、自定義篩選、共享、新增等。追波的B端產(chǎn)品設(shè)計(jì)已經(jīng)不再是假大空概念設(shè)計(jì),而是一套實(shí)用美觀可落地的設(shè)計(jì)。



儀表盤設(shè)計(jì)

儀表盤設(shè)計(jì)是一個(gè)很好的隱喻,想象一下開摩托車或汽車主駕駛前面的屏幕,汽車儀表有燃油表、車速表、里程表、水溫表、轉(zhuǎn)速表、故障指示燈等。B端類產(chǎn)品后臺(tái)界面的儀表盤設(shè)計(jì)也需要展示一些重要的數(shù)據(jù)和各種狀態(tài),大體分為側(cè)標(biāo)欄、導(dǎo)航欄、待辦任務(wù)、個(gè)人信息、報(bào)表數(shù)據(jù)、消息中心、快捷入口等。當(dāng)然最重要的就是報(bào)表數(shù)據(jù),團(tuán)隊(duì)收益、任務(wù)進(jìn)度、轉(zhuǎn)化比例、新增、存量、團(tuán)隊(duì)工作時(shí)長等都是老板或領(lǐng)導(dǎo)關(guān)心的內(nèi)容。每個(gè)公司業(yè)務(wù)不同、每個(gè)人員權(quán)限不同,自定義的儀表盤也各有差異。重要的是突顯數(shù)據(jù)和業(yè)務(wù)狀態(tài),需要分層級(jí)系統(tǒng)性去思考和設(shè)計(jì)。



流程設(shè)計(jì)

復(fù)雜的事情簡單化,簡單的事情標(biāo)準(zhǔn)化,標(biāo)準(zhǔn)的事情流程化,流程的事情自動(dòng)化。流程設(shè)計(jì)是每一個(gè)企業(yè)核心功能和業(yè)務(wù),可自定義的管理流程系統(tǒng)搭建也是B端產(chǎn)品設(shè)計(jì)的難點(diǎn),需要對(duì)業(yè)務(wù)高度抽象,讓每一個(gè)業(yè)務(wù)人員可自定義的流程才是好的流程設(shè)計(jì)。



B端C化

B端C化是B端產(chǎn)品設(shè)計(jì)的視覺表現(xiàn)力慢慢往C端產(chǎn)品設(shè)計(jì)的視覺靠齊,國內(nèi)B端產(chǎn)品界面設(shè)計(jì)視覺水平還有很大的提高空間。除了視覺上的提升外,由于業(yè)務(wù)的發(fā)展,B端產(chǎn)品也開始移動(dòng)化、智能化,國內(nèi)主流還是通過小程序、H5來現(xiàn)實(shí)B端產(chǎn)品C端化。



輕代碼化

輕代碼化是一種低代碼賦能無代碼的方式,彌補(bǔ)無代碼拓展性差、覆蓋場(chǎng)景少的問題。在保有無代碼靈活、易用、快捷的同時(shí),又能覆蓋低代碼使用場(chǎng)景。簡單理解就是無需代碼開發(fā)即可如搭積木般快速、靈活地創(chuàng)造屬于你的個(gè)性化管理系統(tǒng),輕松實(shí)現(xiàn)多元業(yè)務(wù)場(chǎng)景的數(shù)字化管理。


輕代碼化將功能進(jìn)行打包,升級(jí)成全局可以用的配置,技術(shù)人員配置好后,業(yè)務(wù)人員在應(yīng)用編輯時(shí)直接選擇使用模版,綁定對(duì)應(yīng)的變量即可使用。




界面設(shè)計(jì)技巧


人文氣息

為什么人加色塊的組合方式能流行起來?還是B端行業(yè)流行帶動(dòng)的。B端講的更多的是企業(yè)對(duì)企業(yè)。企業(yè)對(duì)企業(yè)除了講行業(yè)解決方案外,還需要傳達(dá)公司的價(jià)值觀、使命、愿景。人加色塊的組合方式非常適合體現(xiàn)公司的企業(yè)文化。對(duì)于一家全球化的公司不同膚色的人物組合在一起,這種人文氣息和價(jià)值觀已經(jīng)就不言而喻了。


當(dāng)然企業(yè)也需要進(jìn)行營銷,抓人眼球。幾千年來的遺傳證明了,人的大腦對(duì)食物、性、動(dòng)的東西、人臉和眼睛、危險(xiǎn)的動(dòng)物很敏感。人加色塊的組合方式也具有抓人眼球營銷的功能。真可謂一舉兩得。


這種風(fēng)格更適合大公司,國內(nèi)的一些手機(jī)廠商OPPO、VIVO等也會(huì)通過手機(jī)+背景+人物來體現(xiàn)科技與人文的結(jié)合,而對(duì)于中小型公司產(chǎn)品差異化和行業(yè)解決方案展現(xiàn)應(yīng)該還是重中之重。



毛玻璃效果

毛玻璃效果加大了模糊程度,透明效果更加扁平,很好的順應(yīng)當(dāng)下UI扁平化的設(shè)計(jì)趨勢(shì)。蘋果Mac OS Big Sur系統(tǒng)的圖標(biāo)、界面中運(yùn)用了大量毛玻璃和半透明元素,界面更扁平。至于C4D三維彩色玻璃的視頻教程可以在B站搜索“透光藝術(shù)-C4D創(chuàng)建彩色玻璃的4個(gè)技法”,完全能滿足UI設(shè)計(jì)師。當(dāng)然還有一個(gè)好消息就是Mac用戶可以享有OC一年免費(fèi)的使用權(quán),具體安裝購買方法可以上“某寶”就可以輕松搞定,真香。




輕擬物

輕擬物這幾年一直流行,在UI設(shè)計(jì)中趨于穩(wěn)定的位置。從寫實(shí)到扁平再到輕擬物,其實(shí)是設(shè)計(jì)師們一路不斷探索的結(jié)果。本質(zhì)就是光影對(duì)形體產(chǎn)生的視覺感受。在色彩中對(duì)高光、亮面、明暗交界線、暗面、反光(環(huán)境光)五個(gè)部分的處理。寫實(shí)三維的圖標(biāo)等設(shè)計(jì)更適用于簡潔的畫面中,扁平等設(shè)計(jì)更適用于復(fù)雜一點(diǎn)的界面中,比如B端產(chǎn)品界面中的功能圖標(biāo)。輕擬物可使用的范圍更廣,效果更佳。Sketch、Figma軟件對(duì)于漸變、高光、投影、高斯模糊處理已經(jīng)非常簡單且出彩。




簡潔設(shè)計(jì)

簡潔設(shè)計(jì)遵從了密斯·凡德羅的“少即是多”的設(shè)計(jì)原則,在B端產(chǎn)品界面中更加需要簡潔設(shè)計(jì),我們最熟悉的Sketch軟件界面已經(jīng)是相當(dāng)?shù)暮啙嵙?。回到現(xiàn)實(shí)當(dāng)需求功能不斷增加,產(chǎn)品界面的編排如何取舍,如何保證界面的簡潔是設(shè)計(jì)師需要深度思考的問題?如何與上級(jí)溝通?該功能是否可做可不做?是否需要埋點(diǎn)用數(shù)據(jù)說話?如果只是一味競(jìng)品有我們就需要有,功能不斷累加只會(huì)讓界面越來越重。



幾何圖形

幾何圖形和幾何插畫有異曲同工之妙,幾何圖形多為產(chǎn)品界面和宣傳內(nèi)容的抽象,產(chǎn)品界面的幾何圖形多為占位符形式,加上色彩和幾何色塊讓其成為一個(gè)整體。B端產(chǎn)品視覺設(shè)計(jì)C端化的進(jìn)程中,幾何圖形、幾何色彩不失為最好的突破口,相信今年追波B端產(chǎn)品的視覺設(shè)計(jì)一定會(huì)更上一個(gè)臺(tái)階。



幾何圖形另一個(gè)場(chǎng)景化的地方就是品牌,作為一名UI設(shè)計(jì)師一定會(huì)經(jīng)歷從圖標(biāo)到幾何圖形到品牌設(shè)計(jì)的過程,品牌設(shè)計(jì)的技巧基本還是以幾何圖形為主,至于品牌的內(nèi)涵需要更深層次的解讀。掌握主流品牌設(shè)計(jì)的技巧對(duì)產(chǎn)品定位、品牌宣傳打下扎實(shí)的基礎(chǔ)。



暗黑設(shè)計(jì)

暗黑模式的設(shè)計(jì)是解決在微弱環(huán)境下內(nèi)容也可以有更高的可讀性。隨著用戶夜晚及深夜使用電子設(shè)備時(shí)長增大,如何在夜晚這個(gè)特定場(chǎng)景下使用更加舒適。合理使用暗黑模式可以減輕眼睛疲勞,提高在夜間使用的可讀性。


在設(shè)計(jì)暗黑主題時(shí),不能為了突顯視覺上的逼格,而去使用高飽和度鮮艷的色彩來突顯界面的品質(zhì)感。而應(yīng)該把舒適度、可讀性作為設(shè)計(jì)的衡量指標(biāo)。Material Design給出了暗黑主題的設(shè)計(jì)準(zhǔn)則,即正文和背景之間的對(duì)比度應(yīng)至少為15.8:1。按照此標(biāo)準(zhǔn)設(shè)計(jì),可讀性都還不錯(cuò)。這里介紹一個(gè)插件“Stark”(Figma、Sketch、XD、Chrome插件)用來測(cè)試界面的對(duì)比度。



模塊化(組件化)

為什么叫模塊化,而不叫組件化,組件化更多的利用原子系統(tǒng)從原子、分子、組織、模版、頁面來快速的搭建界面,但在B端產(chǎn)品設(shè)計(jì)中基礎(chǔ)組件和業(yè)務(wù)組件的搭建是以提高工作效率為前提,是否有從0到1搭建B端產(chǎn)品組件的經(jīng)歷是設(shè)計(jì)師一生中最寶貴的經(jīng)驗(yàn)之一,它能提高設(shè)計(jì)師的系統(tǒng)化思維、邏輯思維和抽象思維能力


產(chǎn)品模塊化設(shè)計(jì)就是將產(chǎn)品分成幾個(gè)部分,也就是幾個(gè)模塊,每一部分都是具有獨(dú)立功能,具有一致的連接接口和一致的輸入、輸出接口的單元,相同種類的模塊在產(chǎn)品族中可以重用和互換,相關(guān)模塊的排列組合就可以形成最終的產(chǎn)品。通過模塊的組合配置,就可以創(chuàng)建不同需求的產(chǎn)品,滿足客戶的定制需求 。




插畫

插畫作為設(shè)計(jì)的一大品類,不同的插畫師都有自己擅長的風(fēng)格,本質(zhì)是都有自己的個(gè)性,但是在產(chǎn)品設(shè)計(jì)中更多是需要共情、共性來講故事,表達(dá)產(chǎn)品理念和價(jià)值觀。這就需要插畫師去嘗試并探尋出適合互聯(lián)網(wǎng)產(chǎn)品設(shè)計(jì)類的插畫風(fēng)格。設(shè)計(jì)的本質(zhì)是舊元素的重新組合,插畫不會(huì)過時(shí),而是需要結(jié)合當(dāng)下和產(chǎn)品找到最匹配的設(shè)計(jì)風(fēng)格。



幾何插畫

幾何插畫算是插畫簡化的一種表現(xiàn)形式,人和物的形態(tài)不再寫實(shí),而是抽象成幾何圖形拼湊的感覺,同時(shí)保留人物形態(tài)的神韻。加上幾何色塊與人物交互形態(tài)的表現(xiàn),傳達(dá)出簡潔、科技的現(xiàn)代感。難點(diǎn)還是在人物形態(tài)的表現(xiàn)上,平時(shí)多練習(xí)練習(xí)速寫還是很有必要的。



線面插畫

線面插畫最近一兩年非常流行,準(zhǔn)確的說是非常適合。首先線面插畫主要是由線條和塊面組合而成,用塊面表現(xiàn)人物形態(tài)時(shí)某些結(jié)構(gòu)會(huì)表現(xiàn)不出來,這時(shí)候用線條簡單勾勒后,結(jié)構(gòu)就會(huì)清晰明了。其次當(dāng)線面插畫運(yùn)用在界面上時(shí),可以打破界面純文字或組件化的機(jī)械和沉悶感。線面插畫的風(fēng)格提升畫面熱鬧感的同時(shí),還能保持界面的干凈整潔。




動(dòng)效


微交互

界面微交互動(dòng)效會(huì)讓用戶的體驗(yàn)更加精致到位。想要打造優(yōu)秀的產(chǎn)品設(shè)計(jì),微交互和動(dòng)效設(shè)計(jì)是繞不開的,UI界面設(shè)計(jì)通過微交互反饋告知用戶當(dāng)前正在發(fā)生的事情,所處的狀態(tài)。細(xì)微的動(dòng)效更能調(diào)動(dòng)用戶情緒,取悅用戶。C端產(chǎn)品微交互和動(dòng)效已經(jīng)很成熟了,一部分功勞來自iOS系統(tǒng)原生自帶的效果。B端產(chǎn)品的微交互和動(dòng)效更多還是在學(xué)習(xí)海外產(chǎn)品,還需要給前端工程師灌輸微交互和動(dòng)效的設(shè)計(jì)價(jià)值,共同打造產(chǎn)品體驗(yàn)細(xì)節(jié)。



Mg動(dòng)畫

Mg動(dòng)畫需要很好的節(jié)奏感、韻律,每一個(gè)場(chǎng)景動(dòng)畫都需要其中的元素進(jìn)行連接變化,讓轉(zhuǎn)場(chǎng)動(dòng)畫更加自然,MG人物動(dòng)畫通過點(diǎn)線面的動(dòng)效變化讓畫面更加有趣、自然,通過粒子效果讓特定場(chǎng)景無限循環(huán)會(huì)讓人更加印象深刻。




三維


三維圖標(biāo)

MacOS Big Sur系統(tǒng)圖標(biāo)的更新帶動(dòng)了三維圖標(biāo)的流行,三維圖標(biāo)的應(yīng)該場(chǎng)景還是需要有較大留白空間的界面,因?yàn)槿S圖標(biāo)太小后就看不到更多細(xì)節(jié)。三維圖標(biāo)感覺又回到了擬物化和扁平化哪個(gè)更好的問題上?設(shè)計(jì)師應(yīng)該保持開放多元的視角。設(shè)計(jì)本身也在不斷的演化融合,存在即合理。合適最重要,它們都會(huì)有適合自己的場(chǎng)景和設(shè)計(jì)價(jià)值。



輕三維

為什么輕三維在界面設(shè)計(jì)中占有一席之位?一個(gè)是設(shè)計(jì)師不斷追求差異化的產(chǎn)物。另一個(gè)是更好的表現(xiàn)內(nèi)容,并與用戶產(chǎn)生共鳴。輕三維的基礎(chǔ)模型都是來自手機(jī)界面中的各種元素,比如組件、開關(guān)、按鈕、占位符、圖表、幾何圖形、圖標(biāo)、進(jìn)度條等,這些都是用戶日常使用系統(tǒng)軟件常見的元素,通過簡單的幾何形體建?!驘艄狻硬馁|(zhì)—渲染—PS調(diào)色。難度系數(shù)不大但效果很出彩。第一個(gè)出彩點(diǎn)是模型帶有厚度的倒角,結(jié)合燈光渲染的光澤是二維軟件不能比擬的。第二個(gè)出彩點(diǎn)就是材質(zhì)自由添加,特別是當(dāng)下流行的毛玻璃效果,玻璃材質(zhì)渲染效果更佳。第三個(gè)出彩點(diǎn)就是可以加局部燈光,局部的漸變色或環(huán)境光更佳出彩



P4D(PS+C4D)

P4D是PS加C4D的設(shè)計(jì)表現(xiàn)技法,也是視覺設(shè)計(jì)的最后一個(gè)環(huán)節(jié),通過PS對(duì)C4D的渲染圖片進(jìn)行調(diào)色,利用PS的調(diào)色技巧可以很好的解決C4D打燈光的瑕疵,還可以利用PS強(qiáng)大的合成功能,將渲染圖片與圖片素材進(jìn)行合成,來表現(xiàn)畫面的視覺度,當(dāng)然三維軟件比較難實(shí)現(xiàn)的水、粒子、煙花等效果,也可以通過PS的后期合成來實(shí)現(xiàn),這也是P4D的強(qiáng)大之處。



卡通IP

卡通IP設(shè)計(jì)最近三四年技術(shù)的迭代已經(jīng)慢慢的走上成熟,卡通IP也從傳統(tǒng)的純PS手繪技法,轉(zhuǎn)到C4D建?!巧壎ā狹D衣服制作—OC渲染—PS(靜態(tài))/AE(動(dòng)態(tài))調(diào)色。


卡通IP火的本質(zhì)更適合做營銷,相比于品牌或Slogan,卡通IP具有親和力和畫面感。隨著各種手辦行業(yè)大熱,受互聯(lián)網(wǎng)大廠影響下,卡通IP已經(jīng)是互聯(lián)網(wǎng)B輪以上公司的標(biāo)配了。如果團(tuán)隊(duì)中沒有這樣能力的人,也可以通過繪制好二維,一套三維可以選擇外包完成。


對(duì)于UI設(shè)計(jì)師來說學(xué)習(xí)是有成本的,暫時(shí)并不是必備技能,如果喜歡完全可以學(xué)習(xí),從設(shè)計(jì)差異化的角度來看三維視覺確實(shí)有一定的競(jìng)爭力。



三維動(dòng)畫

C4D三維場(chǎng)景動(dòng)畫通過構(gòu)建實(shí)物和場(chǎng)景模擬生活中的現(xiàn)實(shí)場(chǎng)景,會(huì)讓用戶體驗(yàn)真實(shí)感,三維軟件制作動(dòng)效的最大優(yōu)勢(shì)是通過動(dòng)力學(xué)和表達(dá)式來模擬真實(shí)感,未來在AR/VR領(lǐng)域會(huì)有更好的發(fā)展。相對(duì)于界面動(dòng)效學(xué)習(xí)成本難度也相對(duì)較大。在三維動(dòng)畫中C4D軟件對(duì)于域、動(dòng)力學(xué)還是有一定的優(yōu)勢(shì)。

作者:水手哥。    來源:站酷網(wǎng)

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

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

藍(lán)藍(lán)設(shè)計(jì)m.miumiuwan.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ì)公司。

分析2022年大廠新孵化的App,一起發(fā)現(xiàn)它們?cè)O(shè)計(jì)的獨(dú)特之處

資深UI設(shè)計(jì)者

以下是碳水Sir在App Store發(fā)現(xiàn)的幾款“寶貝”,之所以稱為“寶貝”是因?yàn)楫a(chǎn)品中可學(xué)到的東西太多了,每個(gè)產(chǎn)品視覺UI以及動(dòng)效都有其獨(dú)特風(fēng)格(當(dāng)然網(wǎng)上也有別人總結(jié)過的產(chǎn)品,我這里就不拿出來重復(fù)說了)我僅針對(duì)未總結(jié)的大廠產(chǎn)品,進(jìn)行設(shè)計(jì)細(xì)節(jié)拆解,看看優(yōu)秀的產(chǎn)品設(shè)計(jì)到底好在哪里,請(qǐng)君細(xì)細(xì)品味。





(淘寶 - 屋顏 - 一站式潮流家居平臺(tái))
(字節(jié) - 抖音盒子 - 潮流時(shí)尚電商平臺(tái))
(騰訊 - doX多克斯 - 生活碎片視頻社交)
(淘寶 - 吃貨筆記 - 記錄美食好生活)
(得物旗下 - 95分 - 奢潮二手平臺(tái))
(騰訊 - PODO漫畫 - 獨(dú)特交互體驗(yàn)漫畫閱讀平臺(tái))
(荔枝 - 皮玩 - 語音社交平臺(tái))
(陌陌 - 咔咔 - 實(shí)拍互動(dòng)交友平臺(tái))

排名不分先后,從以上幾款產(chǎn)品logo中不難看出,圖形設(shè)計(jì)都偏向于具像化,傳遞出正向的情緒,顏色方面使用熒光黃、青綠、漸變粉等凸顯年輕、大膽,富有朝氣。


1.屋顏


第一眼看到這個(gè)名就有被驚艷。首先屋顏是屋檐的斜譯,檐變成顏,中華文字博大精深,讀起來也不違和,同時(shí)也直觀呈現(xiàn)出產(chǎn)品定位屬性。logo采用字體設(shè)計(jì)手法,“屋”字經(jīng)過設(shè)計(jì)手法使線條呈現(xiàn)出立體空間感,也間接體現(xiàn)出產(chǎn)品是和房屋軟裝相關(guān),同時(shí)為屋內(nèi)添置“顏色”(軟裝)相關(guān)的產(chǎn)品。一個(gè)logo兩層含義,通過字體設(shè)計(jì)以及諧音表現(xiàn),巧妙的融入其中。

·




直觀來看,頁面大量留白,圖片質(zhì)量高級(jí)且風(fēng)格統(tǒng)一,均采用素底作為產(chǎn)品首圖,很好的提升產(chǎn)品整體調(diào)性。
圖形方面均采用直角元素,配圖、banner、按鈕、icon無一例外;細(xì)線風(fēng)格設(shè)計(jì)使產(chǎn)品極具品質(zhì)感,有種無印良品的現(xiàn)代極簡主義風(fēng)潮。也叫MUJI風(fēng)。
瓷片區(qū)的配圖采用線性+2.5D風(fēng)格,使畫面富有空間層次,能撐住頁面頭部重要位置,且再次突出產(chǎn)品極簡主義風(fēng)格。當(dāng)然還有空狀態(tài)、無網(wǎng)絡(luò)環(huán)境下的配圖等等都很統(tǒng)一。




動(dòng)效方面最值得關(guān)注的是下拉刷新,使用吊燈作為下拉效果,當(dāng)向下滑動(dòng)時(shí)電線被拉扯長,但斷不了,給人以安全可靠的產(chǎn)品透?jìng)?,也算是通過創(chuàng)意設(shè)計(jì)助力產(chǎn)品體驗(yàn)的手段之一。釋放刷新時(shí),輪播不同的家居icon圖標(biāo),再次強(qiáng)化定位產(chǎn)品屬性,且刷新時(shí)不至于乏味。
加載狀態(tài)采用+號(hào)線條旋轉(zhuǎn)表現(xiàn),同時(shí)在結(jié)尾變成一個(gè)方形,這么極簡的設(shè)計(jì)之前其他產(chǎn)品從未出現(xiàn)過,同時(shí)它也符合屋顏的產(chǎn)品調(diào)性(新家軟裝要做加法,僅個(gè)人理解)也算是一個(gè)設(shè)計(jì)亮點(diǎn)。




最新穎的是產(chǎn)品特有的【3D實(shí)景逛店】功能,進(jìn)一步強(qiáng)化家具與室內(nèi)的強(qiáng)相關(guān)性,為什么這么說,單從買家具上,線上買前只能靠照片來間接聯(lián)想買后填入家中的情況,并不能按照自己習(xí)慣多角度查看家具。又或者因?yàn)槊?,沒時(shí)間去線下家具館,或者怕白去一趟,通過【3D實(shí)景逛店】快速解決這部分用戶需求。同時(shí),也給線下家具館增加了更多曝光度的可能性。




至此,屋顏的設(shè)計(jì)細(xì)節(jié)講解就結(jié)束了,希望產(chǎn)品體驗(yàn)越做越好。


2.抖音盒子


抖音旗下的電商平臺(tái),整體風(fēng)格清爽直觀,綠色與紫色搭配也是一種時(shí)尚風(fēng)。相比其他電商產(chǎn)品,抖音盒子沒有金剛區(qū)圖標(biāo)設(shè)計(jì)以及營銷類的占位圖,相反金剛區(qū)僅展示奢侈品實(shí)物圖,產(chǎn)品圖大小做了統(tǒng)一,視覺呈現(xiàn)很高級(jí),同時(shí)下列瀑布流商品中首圖沒有活動(dòng)促銷等信息干擾,只展示商品圖,突出其時(shí)尚潮牌好物的特性,同時(shí)也與當(dāng)前清爽、高級(jí)的設(shè)計(jì)風(fēng)格相一致。




幾處設(shè)計(jì)細(xì)節(jié)值得參考,首先是底部Tab欄點(diǎn)擊動(dòng)效,承載抖音logo的故障風(fēng)效果,黑色+紫色故障效果一來告知與抖音具有相關(guān)聯(lián)性,是旗下電商產(chǎn)品;二來黑色Tab圖標(biāo)能很好的壓住“紫綠主色調(diào)”的跳躍感,不至于太過俏皮脫離電商屬性。
并且圖標(biāo)的整體性與統(tǒng)一性都做得很好,“小紅點(diǎn)”的設(shè)計(jì)采用品牌色“小紫點(diǎn)”呈現(xiàn)(小小的顏色改變),更加強(qiáng)化了產(chǎn)品風(fēng)格與調(diào)性的統(tǒng)一,(小紅點(diǎn)并不是只能用紅色)這點(diǎn)值得學(xué)習(xí)。




最后想告訴大家,產(chǎn)品在每個(gè)階段設(shè)計(jì)形式都會(huì)發(fā)生改變,比如1.0.1-1.0.2可能是輕微調(diào)整,1.0.0-2.0.0就是大的視覺升級(jí)??赡芤?yàn)楫a(chǎn)品發(fā)展或用戶變化,使得產(chǎn)品設(shè)計(jì)風(fēng)格發(fā)生改變, 但要知道每個(gè)上線版本一定是當(dāng)前方案的最優(yōu)解。就如你看到的“抖音盒子”現(xiàn)在是1.9.0版本號(hào),或許在不久的將來就會(huì)全新升級(jí)。這就不得而知了。


3.doX多克斯


是一款短視頻社交平臺(tái),與其他社交產(chǎn)品不同,doX主打短視頻內(nèi)容社交,用戶通過拍攝上傳有趣的短視頻內(nèi)容,來認(rèn)識(shí)志同道合的朋友。雖然與抖音同為短視頻平臺(tái),但抖音更側(cè)重視頻分發(fā),而doX側(cè)重于通過視頻與用戶建立聯(lián)系,一個(gè)視頻下可以跟拍多條,有點(diǎn)像qq以前的漂流瓶,只是換種呈現(xiàn)方式。這種陌生人視頻交友有一絲“探探”的味道。




設(shè)計(jì)上面單看logo以為會(huì)沿用手繪線稿類似的風(fēng)格。整體使用下來,僅在我的頁面頂部背景中用到,其余均采用斷線像素風(fēng)icon設(shè)計(jì),綠+白的設(shè)計(jì)風(fēng)格,可能也是為了營造出一種陌生人交友的科幻感覺吧。
發(fā)起拍攝頁,背景會(huì)有噪點(diǎn)動(dòng)效,也是營造一種拍攝前無鏡頭的感覺,引導(dǎo)用戶隨手記錄。




最后產(chǎn)品的切入方向很新穎,但是否能在短視頻風(fēng)口分出一杯羹就不知道了,但目前來說整體設(shè)計(jì)風(fēng)格框架已搭建起來,剩下的就是不斷填補(bǔ)及完善設(shè)計(jì),使其更加統(tǒng)一,希望doX越來越好。


4.吃貨筆記


第一次接觸“吃貨筆記”就被頁面整體設(shè)計(jì)風(fēng)格吸引。粗線圖標(biāo)+擬物圖標(biāo)形式空前新潮,給人眼前一亮的感覺。它類似于“大眾點(diǎn)評(píng)”,是個(gè)寶藏探店美食分享的平臺(tái)。通過線上探店選擇報(bào)名-自行到店-發(fā)表動(dòng)態(tài)-上傳票據(jù)-提取飯票,來獲得優(yōu)惠消費(fèi)的同時(shí)提高平臺(tái)UGC內(nèi)容的產(chǎn)出??上У氖悄壳皟H支持【廣州】店鋪(可能是先做小范圍本土化嘗試然后再逐漸擴(kuò)大地域),外地用戶只能看看界面并不能真實(shí)使用,這點(diǎn)很遺憾。
動(dòng)態(tài)布局也很有創(chuàng)意,第一張大圖,其他小圖呈現(xiàn),五宮格的樣式使布局統(tǒng)一,且更好突出第一張圖的主視覺層級(jí)。




如今本地餐飲服務(wù)平臺(tái)已經(jīng)做得很好了,“吃貨筆記”在嘗試從優(yōu)化福利流程、視覺表現(xiàn)、設(shè)計(jì)手法等多維度探索新的操作形式,這種身先士卒的精神值得尊敬,單說設(shè)計(jì)表現(xiàn)的細(xì)致,就以超過了大部分產(chǎn)品。當(dāng)然,每一款好的產(chǎn)品離不開設(shè)計(jì),更離不開產(chǎn)品功能是否真實(shí)滿足用戶需求,讓用戶使用輕松、解決需求后是否帶來爽點(diǎn)。




圖標(biāo)用色很鮮明,均采用3D質(zhì)感表現(xiàn)形式,能看出設(shè)計(jì)上面下了很多功夫。底部Tab欄選中圖標(biāo)也采用3D質(zhì)感表現(xiàn),與金剛區(qū)和空狀態(tài)圖標(biāo)形成呼應(yīng),增強(qiáng)產(chǎn)品風(fēng)格記憶點(diǎn)。產(chǎn)品目前的評(píng)論和下載量都不像沒推過一樣,可能產(chǎn)品分享度不高導(dǎo)致很多一部分人不知道,所以增加徽章模塊評(píng)價(jià)打卡獲得獎(jiǎng)勵(lì),并以此成就來滿足用戶心里預(yù)期,從而增加使用黏性和傳播分享。




最后這款產(chǎn)品設(shè)計(jì)表現(xiàn)都特別出眾,通過空狀態(tài)文案等內(nèi)容也能看出產(chǎn)品的個(gè)性特征。例如:“蝦米都沒有,快看看其他的”,還有很多小的設(shè)計(jì)細(xì)節(jié),這里就不一一說了,大伙兒自行下載體驗(yàn)一下吧。


5.95分


95分是得物旗下的分離出來的全新App,主打潮流閑置交易平臺(tái),而得物定位是新一代潮流網(wǎng)購電商,兩者還是有所區(qū)別。但從UI設(shè)計(jì)角度,還是能看到得物的影子,潮流前線,并且整體風(fēng)格時(shí)尚統(tǒng)一,很多細(xì)節(jié)值得在這里展開說說。




整個(gè)設(shè)計(jì)清爽直觀、沒有多余裝飾元素,這就要求圖標(biāo)必須做到極致,才能撐住整個(gè)頁面。我羅列了一下可能出現(xiàn)的圖標(biāo),輕質(zhì)感毛玻璃效果,結(jié)合統(tǒng)一的漸變?cè)厥沟妹總€(gè)圖標(biāo)都精致耐看,值得研究。線性圖標(biāo)也是一樣,整體配套,這套圖標(biāo)應(yīng)該下了不少功夫。




在二手平臺(tái)存量競(jìng)爭的時(shí)代,能有一款產(chǎn)品嘗試新的設(shè)計(jì)風(fēng)格,并且把近幾年火起來的毛玻璃風(fēng)格相融合,這種走在設(shè)計(jì)前線的作風(fēng)與95分產(chǎn)品潮流前線的調(diào)性一致,單說設(shè)計(jì)嘗試這種做法就已經(jīng)超越了大多數(shù)產(chǎn)品了。


6.PODO漫畫


毫不夸張,這款產(chǎn)品打開了我對(duì)交互表現(xiàn)與實(shí)現(xiàn)的新認(rèn)知。我看了一下最早發(fā)布是去年9月27日,到目前為止短短8個(gè)月時(shí)間,就能讓PODO這款產(chǎn)品的交互設(shè)計(jì)做到如此優(yōu)秀,背后依靠騰訊,也有游戲元素的影子,這就不足為奇了。




使用下來基本沒有太多圖標(biāo)元素,更多是把屏幕空間分給了動(dòng)漫封面,一行三個(gè)動(dòng)漫排列,背景與主體人物分開,滑動(dòng)時(shí)二者在空間層進(jìn)行錯(cuò)位,營造一種錯(cuò)層的空間感,使原本扁平的圖像瞬間立體了許多很是新奇。




點(diǎn)開動(dòng)漫詳情,圖文信息依次從上到下展開,引導(dǎo)用戶視覺享受,并且頭圖中的動(dòng)漫人物也做了動(dòng)效設(shè)計(jì),全覽下來很是細(xì)致。除此之外,還有三個(gè)明顯的交互細(xì)節(jié),分別是:設(shè)置頁展開交互、閱讀頁底部導(dǎo)航交互以及目錄頁的交互樣式,都以新的表現(xiàn)形式呈現(xiàn)出來,作為設(shè)計(jì)師的我們現(xiàn)在不能再說:“設(shè)計(jì)已經(jīng)玩不出新的花樣”這樣的說法了。




太多的交互動(dòng)效就不一一列舉了,趕緊收入囊中吧!


7.皮玩


通過了解得知“皮玩”是荔枝App旗下控股產(chǎn)品,同樣也在入局陌生人社交領(lǐng)域。但值得注意的是該產(chǎn)品上線1個(gè)月,內(nèi)部框架及UI界面已相對(duì)完整,卡片、插圖、動(dòng)效、圖標(biāo)、以及一些趣味設(shè)計(jì)都已上線,應(yīng)該是一個(gè)成熟團(tuán)隊(duì)孵化的項(xiàng)目,上線前的測(cè)試應(yīng)該沒少下功夫,才能在產(chǎn)品初期做的如此完善。logo采用漸變黃底+吐舌頭表情相結(jié)合,搞怪趣味要用嘴說話這樣的印象。定位:更好玩的語音社交算說得過去 。




初次體驗(yàn),第一感受就是采用貼紙風(fēng)的設(shè)計(jì)元素,icon與元素都具有較強(qiáng)的設(shè)計(jì)感,飽和度較低的配色加上白色描邊,就如產(chǎn)品說的“玩一下、皮一下”相呼應(yīng),產(chǎn)品的整體顏色采用漸變黃和漸變綠,配色很大膽,同時(shí)體現(xiàn)出該產(chǎn)品用戶所代表的具有興趣多元化、喜歡嘗鮮這樣一個(gè)群體。同時(shí)產(chǎn)品也是想通過這種設(shè)計(jì)吸引用戶使用。




產(chǎn)品中處處都能看到微動(dòng)效,使靜態(tài)的畫面變得活潑許多,這種做法也是為了給用戶營造一種活躍的氛圍,增加平臺(tái)活躍度。


8.咔咔


咔咔是陌陌孵化的一款社交產(chǎn)品,最近發(fā)現(xiàn)一些大廠旗下產(chǎn)品都在獨(dú)立運(yùn)營,目的也是為了和主產(chǎn)品脫離關(guān)系,防止激烈競(jìng)爭導(dǎo)致產(chǎn)品停止運(yùn)營。年前很火的“啫喱”想必就是吃虧在這方面。回歸正題,首頁是以視頻為主圖片為輔的瀑布流形式呈現(xiàn),停到某一位置則直接循環(huán)播放該視頻,排版方式極具新穎,當(dāng)體驗(yàn)下來眼球左右移動(dòng)總是會(huì)打斷我信息的獲取,有點(diǎn)強(qiáng)制引導(dǎo)用戶看大圖視頻內(nèi)容的感受。點(diǎn)開則可以與對(duì)方進(jìn)行互動(dòng)點(diǎn)贊評(píng)論。




看看模塊,采用類似“探探”卡片交互左滑不喜歡右滑喜歡來讓用戶進(jìn)行操作,但與“探探”不同的是此互動(dòng)是開放的,用戶選擇滿意的動(dòng)態(tài)內(nèi)容添加到卡片后,陌生人可看到展示內(nèi)容,并且她被多少人喜歡都會(huì)展示出來,相當(dāng)于是個(gè)人名片,有種抖音+探探的味道。并不具有一對(duì)一的個(gè)人隱私性,這是與探探最直接的區(qū)別。




看看模塊中,“打招呼”是與對(duì)方建立私聊的唯一方式,如果該用戶已關(guān)注但未打招呼,把卡片劃走,那再也不能與對(duì)方建立私聊,除非對(duì)方通過“看看”模塊與你打招呼。這個(gè)產(chǎn)品細(xì)節(jié)很容易因?yàn)橛脩舨焕斫饣蛘呤只蜔o法與上個(gè)用戶進(jìn)行“打招呼”私信,且私信功能僅在觸發(fā)“打招呼”后才能交流,入口少、且不易理解,不知道是產(chǎn)品經(jīng)理的有意為之還是被遺漏掉的地方。




消息頁的添加入口,用折疊手法展示,降低頻繁跳頁的割裂感,同時(shí)縮起時(shí)也不會(huì)占用消息列表。
消息列表是通過“打招呼”保存下的私密消息,聊天形式極具特色,黑色背景加上紅紫漸變列表有種夜店嗨皮的即視感觀,這里就不過多評(píng)價(jià),大家領(lǐng)悟吧。




設(shè)計(jì)中還值得關(guān)注一點(diǎn),就是個(gè)人主頁中的個(gè)性標(biāo)簽,我羅列出22個(gè),當(dāng)用戶發(fā)表三個(gè)同類動(dòng)態(tài)即可點(diǎn)亮一個(gè)標(biāo)簽,此標(biāo)簽也會(huì)代替文字描述承載動(dòng)態(tài)內(nèi)容的作用,用戶選擇已點(diǎn)亮 的icon即展示對(duì)應(yīng)標(biāo)簽內(nèi)容了,相當(dāng)于動(dòng)態(tài)中的標(biāo)簽分類,但前提發(fā)表動(dòng)態(tài)時(shí)選擇對(duì)應(yīng)你標(biāo)簽,不然發(fā)表后的動(dòng)態(tài)不能二次修改。這種通過標(biāo)簽點(diǎn)亮的功能也是為了讓用戶UGC內(nèi)容更加多元化,同時(shí)也想通過標(biāo)簽來吸引用戶多多發(fā)動(dòng)態(tài)的。創(chuàng)意點(diǎn)是好的,但是否能達(dá)到好的效果,還是要拭目以待。




相比其他產(chǎn)品,咔咔是我一直關(guān)注的產(chǎn)品,同時(shí)也是特別喜歡的產(chǎn)品之一,所以我分享給你們。


9.結(jié)語


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

本期產(chǎn)品細(xì)節(jié)分析結(jié)束,點(diǎn)擊原文鏈接查看更多,我們下期再見!

作者:碳水Sir;公眾號(hào):草蓉三石



作者:碳水sir

鏈接:https://www.zcool.com.cn/article/ZMTQwMzM4OA==.html

來源:站酷

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


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


藍(lán)藍(lán)設(shè)計(jì)m.miumiuwan.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ì)公司


                         

淺析:設(shè)計(jì)趨勢(shì)之開源設(shè)計(jì)

ui設(shè)計(jì)分享達(dá)人

什么是開源設(shè)計(jì)(Open Source Design)

在講開源設(shè)計(jì)前,我們或許可以先講講開源一詞是指什么。

開源全稱開放源代碼,開源軟件最大的特點(diǎn)是開放,也就是任何人都可以得到軟件的源代碼,加以修改學(xué)習(xí),甚至重新發(fā)放,當(dāng)然是在版權(quán)限制范圍之內(nèi)。雖然開源一詞最初是為軟件開發(fā)而創(chuàng)造的,但現(xiàn)如今開源所涉及的領(lǐng)域也極其廣闊,并不只是包括軟件領(lǐng)域,如醫(yī)藥領(lǐng)域的藥物開發(fā)開源、文化領(lǐng)域的書籍到期開源等等所以開源設(shè)計(jì)已包含了更廣泛的含義,它包括了由任何人或者團(tuán)隊(duì)自由共享、協(xié)作的設(shè)計(jì)方案、項(xiàng)目、產(chǎn)品。

我們來看幾個(gè)大型開源的設(shè)計(jì)了解一下~

開源設(shè)計(jì)資源舉例

Ant Design

阿里的開源系統(tǒng)后臺(tái)組件庫

https://ant.design

ECharts

百度推出的開源圖表

https://echarts.apache.org/

Unsplash 

全球知名圖片開源平臺(tái) 

https://unsplash.com

所以我們不難發(fā)現(xiàn)開源設(shè)計(jì)都有以下特點(diǎn): 

免費(fèi)(大部分是):開源設(shè)計(jì)的一個(gè)關(guān)鍵要素是它們通常(但不總是?。┟赓M(fèi)。這是一個(gè)重要因素,因?yàn)殚]源設(shè)計(jì)通常需要花費(fèi)不菲的價(jià)格或者冒著侵犯版權(quán)的風(fēng)險(xiǎn)去使用。 

思想碰撞:更多的設(shè)計(jì)師或者創(chuàng)意愛好者共同為一個(gè)創(chuàng)意提出自己的見解和再設(shè)計(jì)。


設(shè)計(jì)開源領(lǐng)域廣闊:設(shè)計(jì)開源領(lǐng)域也幾乎涵蓋了所有的設(shè)計(jì)和創(chuàng)意領(lǐng)域如平面設(shè)計(jì)、三維設(shè)計(jì)、用戶體驗(yàn)設(shè)計(jì)、環(huán)境設(shè)計(jì)、建筑設(shè)計(jì)、服裝設(shè)計(jì)、插畫、動(dòng)畫設(shè)計(jì)等等 

但是許多人可能會(huì)有一個(gè)疑問,開源設(shè)計(jì)和以往的素材網(wǎng)站或者源文件售賣網(wǎng)站有什么區(qū)別呢? 

在我看來,開源網(wǎng)站與傳統(tǒng)售賣設(shè)計(jì)資源的網(wǎng)站最大的區(qū)別是開放與共建,以figma的社區(qū)為例,作者發(fā)布作品后,任何人都可以對(duì)其作品進(jìn)行redesign甚至remix,這極大的提高了設(shè)計(jì)師的興趣,每個(gè)人都希望自己的作品能被他人看到,也希望自己的創(chuàng)意能與他人的創(chuàng)意進(jìn)行更好的結(jié)合,這是一個(gè)多么美好的場(chǎng)景。而傳統(tǒng)網(wǎng)站只是冷冰冰的展示文件售賣資源,缺少了設(shè)計(jì)中的靈魂。 

那說了這么多,開源設(shè)計(jì)到底有哪些優(yōu)勢(shì)呢?

開源設(shè)計(jì)的優(yōu)勢(shì) 

提升設(shè)計(jì)效率:設(shè)計(jì)師不應(yīng)花費(fèi)時(shí)間去解決別人已經(jīng)解決的問題,比如當(dāng)我設(shè)計(jì)一個(gè)新項(xiàng)目時(shí),無需從零開始設(shè)計(jì)系統(tǒng)組件,可以直接使用Ant Design、Ant Mobile Design等現(xiàn)有組件庫。


增加學(xué)習(xí)機(jī)會(huì):通過開源社區(qū),設(shè)計(jì)人員可以從其他人所做的項(xiàng)目中學(xué)習(xí),并與專業(yè)人員交流經(jīng)驗(yàn)。 

提高設(shè)計(jì)質(zhì)量:設(shè)計(jì)師自己看本人作品時(shí),往往是身在其中不知如何下手,而將作品發(fā)布到更廣泛的社區(qū)有助于設(shè)計(jì)師獲得有價(jià)值的反饋以改進(jìn)他們的作品。 

提升品牌價(jià)值:對(duì)設(shè)計(jì)開源后,公司品牌能在某些領(lǐng)域內(nèi)獲得傳播,提升品牌價(jià)值。并且在招募人才時(shí)也能成為有吸引力的一項(xiàng)條件。 

提升個(gè)人價(jià)值:一個(gè)設(shè)計(jì)師想要提升個(gè)人價(jià)值和影響力,可以用開源作品來在行業(yè)內(nèi)獲得一定口碑,甚至直接將用戶流量轉(zhuǎn)化為訂單,或許是更簡單且容易的事情。 

從這些優(yōu)勢(shì)中不難發(fā)現(xiàn),在開源生態(tài)中,我們的作品不再是一座孤島,通過互聯(lián)網(wǎng),我們的作品可以和任何人進(jìn)行鏈接并且產(chǎn)生共鳴,提升品牌和個(gè)人的價(jià)值,所以每個(gè)人都值得感受開源的美好。 

但開源的同時(shí)不可避免的會(huì)帶來許多新的問題和挑戰(zhàn),讓我們一起來看一下。

開源設(shè)計(jì)帶來了哪些挑戰(zhàn) 

知識(shí)產(chǎn)權(quán)問題:在開源社區(qū)中,設(shè)計(jì)師可能不清楚其創(chuàng)作的知識(shí)產(chǎn)權(quán)。因此,他們可能會(huì)不自知地侵犯其他設(shè)計(jì)師的知識(shí)產(chǎn)權(quán)。 

設(shè)計(jì)門檻問題:設(shè)計(jì)開源意味著設(shè)計(jì)師的門檻變低,任何人都可以隨意使用開源的設(shè)計(jì)項(xiàng)目,導(dǎo)致設(shè)計(jì)師不再愿意花心血?jiǎng)?chuàng)作。 

設(shè)計(jì)師競(jìng)爭力下降:開源設(shè)計(jì)意味著普通的設(shè)計(jì)內(nèi)容已不需要單獨(dú)的設(shè)計(jì)師來完成,頂尖設(shè)計(jì)師的機(jī)會(huì)會(huì)更多,而普通設(shè)計(jì)師的競(jìng)爭力會(huì)明顯下降。 

隨著這些挑戰(zhàn)的來臨,如何更好的面對(duì)設(shè)計(jì)領(lǐng)域的開源是值得深思的問題,既要保護(hù)設(shè)計(jì)師的自身利益,也要讓設(shè)計(jì)行業(yè)在開放、共享的環(huán)境下?lián)肀ё兏?,所以在未來的道路上,我們每個(gè)人都可以嘗試用自身的方法去探索未來,讓每個(gè)人都能成為時(shí)代浪潮中的一朵浪花。


作者:芝麻侃設(shè)計(jì)
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

作者:芝麻侃設(shè)計(jì)     來源:站酷

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

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

藍(lán)藍(lán)設(shè)計(jì)m.miumiuwan.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ì)公司

3600字拆解微信鍵盤丨地主家的小兒子真是又帥又有才

資深UI設(shè)計(jì)者

微信鍵盤發(fā)布啦!擁有12億用戶的移動(dòng)端巨無霸微信發(fā)布微信鍵盤了!就在本周一,預(yù)熱近兩年的微信鍵盤終于發(fā)布,這款微信之父張小龍口中的——不搜集任何隱私的輸入法工具,總算揭開了他的神秘面紗。廖爾摩斯第一時(shí)間全面體驗(yàn)了微信鍵盤,通過三天的使用,我也成了微信鍵盤的腦殘粉,這篇接近3600字的拆解,將會(huì)告訴你,這個(gè)地主家的小兒子,為什么又帥有才!


一、產(chǎn)品拆解


作為一款工具類產(chǎn)品,需要更注重產(chǎn)品的用戶使用體驗(yàn),所以此次產(chǎn)品拆解主要基于尼爾森十大可用性原則和常見的設(shè)計(jì)基礎(chǔ)理論,比如格式塔原則、費(fèi)茨定律等。我將會(huì)分為基礎(chǔ)功能、個(gè)性化功能和個(gè)人隱私三個(gè)部分進(jìn)行拆解。


1. 基礎(chǔ)功能
1.1 鍵盤管理
鍵盤是輸入法最基礎(chǔ)的功能,根據(jù)每個(gè)用戶不同的操作習(xí)慣,微信鍵盤為用戶提供六種類型的鍵盤,分別是九宮格、全鍵盤、筆畫鍵盤、手寫鍵盤、五筆鍵盤和雙拼鍵盤。在五筆鍵盤和雙拼鍵盤中,還為用戶提供了多種偏好設(shè)置,比如86五筆方案、98五筆方案等。


設(shè)計(jì)思考
相比行業(yè)頭部老大哥搜狗輸入法,微信鍵盤的類型相對(duì)還比較單薄,比如像搜狗輸入法還支持生僻字鍵盤、拍照轉(zhuǎn)文字等特色功能,不過作為一個(gè)V1.0.0版本,這也遵循了如今產(chǎn)品設(shè)計(jì)的主流設(shè)計(jì)模式,小步快跑,快速迭代。
1.2 鍵盤輸入框
「輸入框」是用戶實(shí)際操作和使用的功能,這是最基礎(chǔ)、最重要的功能。微信鍵盤的輸入框界面風(fēng)格非常簡潔,和IOS默認(rèn)鍵盤風(fēng)格相近,目前僅有一款默認(rèn)皮膚。


1.2.1 長按技巧
長按「拼音鍵」,可選擇更多相關(guān)字符,比如數(shù)字、大小寫等。其中長按「JKL」拼音鍵,可切換至「單手模式」;長按「中英文」鍵,可切換至「手寫模式」,非常方便。


1.2.2 智能刪除復(fù)原
這個(gè)小技巧使用起來特別方便,在我們刪除一段文字的時(shí)候,經(jīng)常會(huì)出現(xiàn)誤刪的情況,微信鍵盤設(shè)計(jì)了一個(gè)非常巧妙的功能,按住「刪除鍵」左拉可以刪除文字,往右則可以把刪除的文字復(fù)原,提高了產(chǎn)品體驗(yàn)的容錯(cuò)性。


1.2.3 上滑輸入數(shù)字符號(hào)
這個(gè)功能需要在系統(tǒng)設(shè)置開啟,在鍵盤輸入的時(shí)候,只需要上滑「拼音鍵」,就能直接把拼音鍵對(duì)應(yīng)的數(shù)字拖到輸入框,節(jié)省切換數(shù)字鍵盤的操作步驟。


1.2.4 特殊符號(hào)
「特殊符號(hào)」不僅包含了常見的10種類型,橫排26鍵的設(shè)計(jì)更能讓用戶直觀地找到自己需要的字符,使用起來體驗(yàn)非常友好。相比搜狗輸入法超過20種的符號(hào)類型,微信鍵盤簡潔的設(shè)計(jì)為用戶提供了更高效的選擇,帶來了更友好的體驗(yàn)。


設(shè)計(jì)思考
少即是多。相比搜狗輸入法的大而全,在特殊符號(hào)這個(gè)細(xì)節(jié)的設(shè)計(jì),微信鍵盤讓我愛不釋手。首先應(yīng)用了7±2效應(yīng),在用戶的短期記憶里,降低記憶負(fù)荷。其次也應(yīng)用了席克定律,減少用戶的選擇,降低消耗的時(shí)間成本,從而提升用戶體驗(yàn)。
1.3 偏好設(shè)置
1.3.1 語音轉(zhuǎn)文字
從識(shí)別語言觀看,微信鍵盤支持普通話、粵語、英語、四川話和上海話,筆者親自體驗(yàn)一番,發(fā)現(xiàn)識(shí)別準(zhǔn)確率還挺高的(貴陽話,和四川話接近,超過80%準(zhǔn)確率)。


1.3.2 聲音和觸感
「聲音和觸感」指的是用戶使用鍵盤按鍵的聲音和觸感。這里有一個(gè)非常貼心的設(shè)計(jì),當(dāng)用戶手機(jī)靜音的時(shí)候,打開聲音開關(guān)按鈕會(huì)提醒用戶當(dāng)前處于靜音模式,無法聽到按鍵聲音。這就是尼爾森十大原則的防錯(cuò)原則,在用戶出現(xiàn)操作錯(cuò)誤之前,通過設(shè)計(jì)提示提前避免,你可以想象如果沒有這樣的提示語,如果你的手機(jī)不小心靜音了,你就會(huì)懊惱為啥鍵盤沒有聲音,這個(gè)軟件是不是出問題了(筆者親身經(jīng)歷)。


1.3.3 顯示設(shè)置
微信鍵盤支持用戶可設(shè)置鍵盤候選字的大小,這里也有一個(gè)非常貼心的設(shè)計(jì),當(dāng)用戶調(diào)整字體大小以后,如果想要恢復(fù)默認(rèn)大小,只需要把滑動(dòng)組件拖動(dòng)到已經(jīng)標(biāo)記的默認(rèn)起點(diǎn)就可以了,這應(yīng)用了尼爾森十大原則的易取原則,用戶無需記住默認(rèn)大小設(shè)置,如果想恢復(fù),拖動(dòng)標(biāo)記的起點(diǎn)即可。


1.3.4 模糊拼音及其他
「模糊拼音」主要針對(duì)拼音基礎(chǔ)欠缺的用戶,提供模糊的拼音設(shè)置,從而提高輸入效率。其次微信鍵盤還提供「首字母自動(dòng)大小寫」、「雙擊空格輸入句號(hào)」和「智能添加空格」等偏好設(shè)置,用戶可根據(jù)自己的操作習(xí)慣進(jìn)行設(shè)置,獲取更便捷的體驗(yàn)。


2. 個(gè)性化功能
個(gè)性化功能主要指微信鍵盤最特色的「拼寫Plus」功能,這也是微信鍵盤發(fā)布以后給用戶最大的驚喜。
2.1 智能推薦
「智能推薦」是微信結(jié)合自己強(qiáng)大的生態(tài)設(shè)計(jì)的一個(gè)功能,在用戶輸入文字的時(shí)候,系統(tǒng)會(huì)自動(dòng)判斷文字的類型,比如輸入一本書的名字,系統(tǒng)就會(huì)提示是否需要向好友發(fā)送這本書籍。從內(nèi)容類型看,包含了音樂、視頻、讀書、小程序、視頻號(hào)和公眾號(hào)。這個(gè)功能在用戶的聊天場(chǎng)景中,實(shí)在太方便了,比如作者過去要給好友分享自己的公眾號(hào),還需要去公眾號(hào)搜索、轉(zhuǎn)發(fā),如今只需要輸入「設(shè)計(jì)大偵探」的名字,就可以向好友直接發(fā)送,減少了數(shù)步操作路徑,極大提升了溝通效率。


2.2 表情推薦
表情是微信聊天場(chǎng)景中必不可少的一個(gè)元素,甚至有很多用戶特別喜歡收藏表情,它可以用于各種聊天場(chǎng)景,活躍聊天的氛圍。微信鍵盤的表情推薦,通過用戶輸入的詞語,可以自動(dòng)識(shí)別可能需要發(fā)送的表情,無需用戶收藏,就可以為用戶自動(dòng)生成。這個(gè)功能非常贊,特別像筆者這樣從不收藏表情的用戶,當(dāng)突然需要輸入一個(gè)表情活躍一下氣氛的時(shí)候,我只需要輸入一個(gè)「大家好」,微信鍵盤就能為我提供數(shù)十種表情,滿足我的需求。


2.3 智能拼寫
「智能拼寫」是指當(dāng)用戶輸入某個(gè)詞語時(shí)候,系統(tǒng)為用戶精準(zhǔn)匹配候選詞,提高輸入效率。筆者嘗試了輸入「梅西」,幾乎可以根據(jù)智能匹配輸入一段完整的文字。而微信生態(tài)更為恐怖的是,它會(huì)自動(dòng)結(jié)合當(dāng)前的話題標(biāo)簽,用戶可直接跳轉(zhuǎn)至話題的視頻號(hào)動(dòng)態(tài),一鍵查看更多信息,讓用戶徹徹底底對(duì)微信生態(tài)的服務(wù)上癮。


2.4 拼寫檢查
「拼寫檢查」是指系統(tǒng)會(huì)根據(jù)用戶在輸入文字的時(shí)候及時(shí)發(fā)現(xiàn)錯(cuò)別字,一鍵精準(zhǔn)改錯(cuò)。這個(gè)功能設(shè)計(jì)得非常貼心,能讓用戶及時(shí)看到書寫錯(cuò)誤,降低因錯(cuò)別字帶來的煩惱。


2.5 常用語
過去在微信聊天的時(shí)候,為了提高輸入效率,我會(huì)把很多反復(fù)發(fā)送的文字復(fù)制到備忘錄或微信收藏,這能提升我一定的溝通效率。但相比微信鍵盤的常用語功能,我以后就會(huì)直接放棄之前的兩個(gè)形式了。這個(gè)功能實(shí)在太方便了,比如每一次粉絲添加我的時(shí)候,我都會(huì)需要介紹一下我們公眾號(hào)的內(nèi)容,現(xiàn)在我只需要輸入前3個(gè)字,這段話就可以直接出來了,極大提升我的溝通效率。


2.6 單手模式
「單手模式」是指用戶可根據(jù)自己的慣用手或場(chǎng)景設(shè)置輸入模式,前面我有提到過,長按「JKL」拼音鍵,可切換至單手模式。


2.7 手寫找字
「手寫找字」是一個(gè)支持同時(shí)手寫多字的輸入模式,這個(gè)功能對(duì)于我們父輩一代的用戶特別適用,他們多數(shù)人還未習(xí)慣用拼音拼寫,更喜歡用手寫的形式去輸入,而支持寫多字的模式可以極大提升拼寫效率。


2.8 小結(jié)
什么是以場(chǎng)景為中心的設(shè)計(jì),微信鍵盤的設(shè)計(jì)團(tuán)隊(duì)告訴我們,這就是以場(chǎng)景為中心的設(shè)計(jì)。過去設(shè)計(jì)者總是在思考如何去定義人們使用的系統(tǒng)和應(yīng)用程序,而“以場(chǎng)景為中心”的概念,則強(qiáng)調(diào)要以人的需求為中心,系統(tǒng)和應(yīng)用程序要去幫助人們滿足他們的需求。看看微信鍵盤設(shè)計(jì)團(tuán)隊(duì)結(jié)合如此多真實(shí)場(chǎng)景的設(shè)計(jì),可見設(shè)計(jì)師真的需要具備場(chǎng)景思維,才能設(shè)計(jì)出讓用戶尖叫的體驗(yàn)。
3. 個(gè)人隱私
3.1 清空個(gè)人詞典
微信鍵盤提供了「清空個(gè)人詞典」的功能,這有點(diǎn)不可思議。不過微信鍵盤的創(chuàng)立之初,微信之父張小龍就說過,微信將上線屬于自己的專屬輸入法,其目的并不是為了搶奪輸入法市場(chǎng),而是為了更好的保護(hù)用戶的隱私。不過該功能大家要謹(jǐn)慎使用,一旦清空,你所累積的個(gè)人詞匯就會(huì)清空,將會(huì)影響你的輸入體驗(yàn)。


3.2 幫助反饋
針對(duì)微信鍵盤使用的技巧和常見問題,微信鍵盤也設(shè)計(jì)了幫助反饋文檔,為用戶解決使用過程中的困惑。很多產(chǎn)品設(shè)計(jì)師或許覺得這樣的模塊可有可無,但這其實(shí)這就是尼爾森十大原則的人性化幫助原則,通過幫助文檔為用戶解決軟件使用困惑。


3.3 隱私與權(quán)限
“我們非常重視你的隱私安全。我們謹(jǐn)遵最小、必要原則,僅依《微信鍵盤隱私政策》獲取你使用微信鍵盤的功能所需的你的信息,不會(huì)額外獲得你的其他信息”。這是隱私與權(quán)限頁面的一句話,足以見得微信鍵盤的定位如上文所言,只做一款單純的輸入法軟件,不侵犯用戶的隱私。


二、設(shè)計(jì)總結(jié)


作為一個(gè)才上線發(fā)布V1.0.0版本的輸入法產(chǎn)品,微信鍵盤真的給了我太大的驚喜。
從產(chǎn)品的易用性來看,無論是交互,還是界面,都嚴(yán)格遵循了尼爾森十大原則的標(biāo)準(zhǔn)。這個(gè)產(chǎn)品設(shè)計(jì)中最基礎(chǔ)的設(shè)計(jì)理論模型,事實(shí)上,太多的工具類產(chǎn)品都沒有遵循它的設(shè)計(jì)原則,我們常常說一款工具難用、不好用、設(shè)計(jì)不好,就是這些操作細(xì)節(jié)沒有考慮進(jìn)去。而微信鍵盤,在我目前的使用操作過程中,暫時(shí)沒有,易用性非常高。
從產(chǎn)品的創(chuàng)新性來看,微信鍵盤不僅滿足了一個(gè)鍵盤輸入工具的基礎(chǔ)功能,而且結(jié)合了自身強(qiáng)大的生態(tài)環(huán)境設(shè)計(jì)了「拼寫Plus」這樣非常創(chuàng)新的功能。它幫助我實(shí)實(shí)在在地提升溝通效率,比如一鍵推送我的公眾號(hào)、和粉絲溝通的常用語等等,甚至破天荒的可以直接在聊天輸入框分享我喜歡的歌曲、書籍、電影、視頻號(hào)等,換做以前真的不敢想象原來這些功能可以通過一個(gè)輸入法軟件實(shí)現(xiàn)。
我已經(jīng)徹底成為微信鍵盤的腦殘粉了,即便某狗的輸入法顯示我已累計(jì)輸入超過4百萬字,但微信鍵盤給我使用的尖叫感,真的讓我不可思議,就像那洶涌的潮水,一波又一波襲來,讓我尖叫!


作者:設(shè)計(jì)大偵探作者:設(shè)計(jì)大偵探
 來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

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


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


藍(lán)藍(lán)設(shè)計(jì)m.miumiuwan.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ì)公司

著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。                           

日歷

鏈接

個(gè)人資料

存檔