伊人久久大香线蕉综合影视_日韩精品少妇无码受不了_71pao成人国产永久免费视频_国产伦片中文免费观看_国产高清无码麻豆精品_九色综合伊人久久富二代_日韩黄色精品_日韩A∨精品日韩精品无码

首頁(yè)

情緒價(jià)值在體驗(yàn)設(shè)計(jì)中的應(yīng)用

ui設(shè)計(jì)分享達(dá)人 交互設(shè)計(jì)及用戶體驗(yàn)

近兩年“情緒價(jià)值”這個(gè)詞,相信每個(gè)人應(yīng)該或多或少都有過接觸,從商業(yè)空間的營(yíng)銷場(chǎng)景到后來滲透到每個(gè)領(lǐng)域、每個(gè)行業(yè)?!?/span>
 
先說下這個(gè)詞的概念,它源于心理學(xué)和社會(huì)學(xué), 本意為:“它指的是一個(gè)人或事物對(duì)他人情感狀態(tài)所產(chǎn)生的積極影響和價(jià)值。這種價(jià)值不僅僅體現(xiàn)在短暫的愉悅感受上,更包括長(zhǎng)期的情緒穩(wěn)定、心理滿足和精神支持。” 
無論是在網(wǎng)紅還是在新型電商行業(yè)中,許多品牌強(qiáng)調(diào)的已經(jīng)不是單一的產(chǎn)品功能價(jià)值,而是增加了強(qiáng)調(diào)在消費(fèi)體驗(yàn)中為消費(fèi)者帶來的快樂、滿足、歸屬感等等一些積極的情緒。這足以說明,無論是品牌、產(chǎn)品還是服務(wù)越來越注重為消費(fèi)者提供情緒價(jià)值?!?/span>
 
而用戶體驗(yàn)設(shè)計(jì)的本質(zhì)其實(shí)就是讓人在使用產(chǎn)品的過程中有非常愉悅的感覺,這一點(diǎn)與“情緒價(jià)值”這個(gè)詞的核心也有點(diǎn)不謀而合。 
 
情緒價(jià)值在體驗(yàn)設(shè)計(jì)中的應(yīng)用
 
 
相信我們都有這樣的疑問:情緒價(jià)值在體驗(yàn)設(shè)計(jì)中重要嗎,有什么具體的關(guān)系?在設(shè)計(jì)工作中的情緒價(jià)值到底重要嗎?情緒價(jià)值對(duì)產(chǎn)品使用的提升有哪些,具體要怎么做?相信看完下面的內(nèi)容,你應(yīng)該會(huì)對(duì)上面的問題有答案的?!?/span>
 
一、情緒價(jià)值對(duì)用戶體驗(yàn)的影響
首先我們可能需要了解情緒價(jià)值能給用戶帶來什么?申晨老師在一次分享會(huì)上有提到過情緒價(jià)值的三個(gè)方向:愉悅感、保障感、專享感。三者由淺入深影響著用戶在使用產(chǎn)品時(shí)的情緒變化,對(duì)應(yīng)到體驗(yàn)設(shè)計(jì)中是這樣的: 
  •  
    愉悅感→影響用戶的滿意度
  •  
    保障感→影響用戶的容忍度
  •  
    專享感→影響用戶的忠誠(chéng)度
 
提升用戶滿意度
積極情緒的誘導(dǎo)
 
當(dāng)產(chǎn)品或服務(wù)能夠提供情緒價(jià)值時(shí),會(huì)引發(fā)用戶的積極情緒。如下圖,三種UI會(huì)給用戶不同的情緒反饋,積極的情緒(右圖)往往會(huì)讓用戶駐足停留的更長(zhǎng)一些,即便沒有需求,也會(huì)更愿意去花費(fèi)一些時(shí)間去深入了解,進(jìn)而帶來一些拉新、瀏覽轉(zhuǎn)化等等數(shù)據(jù)的提升 
情緒價(jià)值在體驗(yàn)設(shè)計(jì)中的應(yīng)用
 
 
滿足情感需求
 
許多產(chǎn)品和服務(wù)通過滿足用戶的情感需求來提供情緒價(jià)值。用戶在使用這些產(chǎn)品時(shí),會(huì)因?yàn)楫a(chǎn)品所承載的情感因素而感到滿足,進(jìn)而提升對(duì)產(chǎn)品體驗(yàn)的滿意度。例如: 
  •  
    社交媒體的分享被贊,是一種被關(guān)注、被認(rèn)可的情感需求;
  •  
    直播平臺(tái)app的互動(dòng)效果,也是一種渴望互動(dòng)的情感需求,以此刺激觀看者送出禮物。
改善用戶對(duì)負(fù)面體驗(yàn)的容忍度
情緒緩沖作用
 
當(dāng)產(chǎn)品或服務(wù)出現(xiàn)一些小問題時(shí),之前積累的情緒價(jià)值可以起到緩沖作用。例如: 
  •  
    在使用某工具產(chǎn)品時(shí),友好的客服系統(tǒng)會(huì)給用戶比較積極的情緒積累,從而選擇包容一些比較小的錯(cuò)誤;
  •  
    還有很多錯(cuò)誤頁(yè)面的情感化設(shè)計(jì),目的亦是如此。
引導(dǎo)解決問題的積極態(tài)度
 
如果用戶對(duì)產(chǎn)品或服務(wù)有情感上的依賴,當(dāng)遇到問題時(shí),他們會(huì)更積極地尋找解決辦法,而不是抱怨和放棄。例如: 
  •  
    當(dāng)產(chǎn)品或服務(wù)偶爾出現(xiàn)卡頓現(xiàn)象時(shí),其用戶社區(qū)氛圍很好,用戶之間可以互相交流使用經(jīng)驗(yàn)和解決方案,并且軟件開發(fā)者也會(huì)積極回應(yīng)用戶的問題。這種情緒價(jià)值會(huì)讓用戶愿意配合開發(fā)者解決軟件卡頓問題,而不是直接卸載軟件。
 
情緒價(jià)值在體驗(yàn)設(shè)計(jì)中的應(yīng)用
 
 
增強(qiáng)用戶的忠誠(chéng)度
能夠在用戶和產(chǎn)品 / 服務(wù)之間建立起情感紐帶
 
  •  
    以蘋果產(chǎn)品為例,蘋果公司通過簡(jiǎn)潔、易用的設(shè)計(jì),以及高效的客戶服務(wù),為用戶提供了良好的情緒體驗(yàn)。用戶在使用蘋果產(chǎn)品的過程中,會(huì)逐漸對(duì)品牌產(chǎn)生信任和喜愛。這種情感紐帶使得用戶在下次購(gòu)買電子產(chǎn)品時(shí),更有可能繼續(xù)選擇蘋果產(chǎn)品,忠誠(chéng)度較高。
  •  
    一些會(huì)員制度也注重通過情緒價(jià)值來增強(qiáng)用戶忠誠(chéng)度。例如,酒店的會(huì)員計(jì)劃會(huì)為會(huì)員提供優(yōu)先入住、免費(fèi)升級(jí)房間、生日驚喜等服務(wù)。這些措施讓會(huì)員感受到特殊待遇,產(chǎn)生一種被重視的情緒,從而增強(qiáng)了用戶對(duì)酒店品牌的忠誠(chéng)度。
推動(dòng)口碑傳播
 
當(dāng)用戶從產(chǎn)品或服務(wù)中獲得了高情緒價(jià)值,他們更愿意向他人推薦。例如: 
  •  
    用戶在一家餐廳用餐,餐廳的服務(wù)人員熱情周到,菜品的呈現(xiàn)方式也很有創(chuàng)意,讓用戶在享受美食的同時(shí)獲得了愉悅的情緒體驗(yàn)。這種用戶很可能會(huì)將這家餐廳推薦給朋友、家人,通過口碑傳播為餐廳帶來新的顧客。
  •  
    在線游戲如果能為玩家提供豐富的社交互動(dòng)功能,讓玩家在游戲中結(jié)交朋友、組隊(duì)作戰(zhàn),獲得團(tuán)隊(duì)合作的快樂和成就感等情緒價(jià)值,玩家就會(huì)積極向周圍的人宣傳這款游戲,擴(kuò)大游戲的用戶群體。
 
 
二、什么產(chǎn)品適合通過創(chuàng)造情緒價(jià)值提升使用體驗(yàn)
 
C端產(chǎn)品:在創(chuàng)造情緒價(jià)值的應(yīng)用策略下,更容易獲得顯著成果
情緒價(jià)值在體驗(yàn)設(shè)計(jì)中的應(yīng)用
 
 
 
創(chuàng)造情緒價(jià)值這種有效的策略,尤其在面向個(gè)人用戶產(chǎn)品時(shí),可以更顯著提升其使用體驗(yàn)。例如: 
  •  
    社交類產(chǎn)品
    如微信、微博等,通過提供社交互動(dòng)和情感連接,增強(qiáng)用戶的歸屬感和幸福感 
  •  
    內(nèi)容類產(chǎn)品
    如視頻平臺(tái)、音樂應(yīng)用等,通過提供豐富多樣的內(nèi)容,滿足用戶的情感和娛樂需求 
  •  
    娛樂類產(chǎn)品
    如游戲、盲盒等,通過游戲性和不確定性,激發(fā)用戶的興趣和情感投入 
  •  
    交易類產(chǎn)品
    如電商平臺(tái)、在線購(gòu)物等,通過營(yíng)造購(gòu)物氛圍和提供個(gè)性化推薦,增加用戶的購(gòu)物愉悅感 
  •  
    工具類產(chǎn)品
    如效率工具、健康管理應(yīng)用等,通過提供情感化的設(shè)計(jì)和反饋,提升用戶的使用體驗(yàn)和滿意度 
 
那么 B 端產(chǎn)品是否同樣適用呢?答案無疑是肯定的。隨著企業(yè)數(shù)字化轉(zhuǎn)型的迅速推進(jìn),B 端產(chǎn)品在各個(gè)行業(yè)領(lǐng)域當(dāng)中得到了廣泛的應(yīng)用,用戶體驗(yàn)的重要性越發(fā)顯著?!?/span>
 
 
B端產(chǎn)品:創(chuàng)造情緒價(jià)值更有利于提高忠誠(chéng)度
 
情緒價(jià)值在體驗(yàn)設(shè)計(jì)中的應(yīng)用
 
 
創(chuàng)造情緒價(jià)值的方式
 
  •  
    情感設(shè)計(jì):通過設(shè)計(jì)元素和交互方式激發(fā)用戶的情感共鳴,增強(qiáng)用戶對(duì)產(chǎn)品的認(rèn)同感和忠誠(chéng)度。例如,通過微動(dòng)畫、個(gè)性化推薦和人性化提示,設(shè)計(jì)師可以為用戶創(chuàng)造愉悅的使用體驗(yàn)
  •  
    個(gè)性化服務(wù)與定制化解決方案:了解客戶的獨(dú)特需求和痛點(diǎn),提供個(gè)性化的建議和支持,幫助客戶解決實(shí)際問題,帶來更多情感上的滿足感
  •  
    優(yōu)化用戶體驗(yàn):注重產(chǎn)品設(shè)計(jì)和交互體驗(yàn)優(yōu)化,提供良好的客戶服務(wù)和多種使用方式,不斷優(yōu)化產(chǎn)品功能,以提升用戶的整體使用體驗(yàn)
 
 
創(chuàng)造情緒價(jià)值的重要性
 
  •  
    提升用戶滿意度和忠誠(chéng)度:通過創(chuàng)造情緒價(jià)值,產(chǎn)品可以顯著提升用戶的滿意度和忠誠(chéng)度,從而促進(jìn)續(xù)費(fèi)和口碑傳播
  •  
    增強(qiáng)產(chǎn)品的市場(chǎng)競(jìng)爭(zhēng)力:在功能相似的產(chǎn)品中,提供卓越的用戶體驗(yàn)可以成為SaaS產(chǎn)品的核心競(jìng)爭(zhēng)力,幫助企業(yè)在市場(chǎng)中脫穎而出
 
 
三、體驗(yàn)設(shè)計(jì)師如何提升產(chǎn)品的“情緒價(jià)值”
我們可以從設(shè)計(jì)核心的三大階段(用戶研究階段、設(shè)計(jì)階段、測(cè)試與優(yōu)化階段)入手,來創(chuàng)造與提升產(chǎn)品的情緒價(jià)值 
 
用戶研究階段
情緒價(jià)值在體驗(yàn)設(shè)計(jì)中的應(yīng)用
 
 
 
深入了解用戶情感需求
開展定性研究
:通過用戶訪談、焦點(diǎn)小組等方式,挖掘用戶在使用產(chǎn)品時(shí)的情感期望。例如,在設(shè)計(jì)一款健身APP時(shí),與健身愛好者進(jìn)行深入訪談,了解他們?cè)诮∩磉^程中的情緒變化??赡軙?huì)發(fā)現(xiàn),用戶在完成一次具有挑戰(zhàn)性的訓(xùn)練后,希望得到即時(shí)的鼓勵(lì)和成就感,這就為產(chǎn)品設(shè)計(jì)提供了情感方向。
 
進(jìn)行定量研究
:利用問卷調(diào)查等手段,收集用戶對(duì)現(xiàn)有產(chǎn)品情緒體驗(yàn)的數(shù)據(jù)。比如,詢問用戶在使用某電商平臺(tái)時(shí),購(gòu)物流程是否讓他們感到焦慮或愉悅,以及在哪些環(huán)節(jié)有這種情緒。通過數(shù)據(jù)分析,找出用戶情緒的痛點(diǎn)和興奮點(diǎn)。
 
構(gòu)建用戶畫像與情緒場(chǎng)景
 
創(chuàng)建用戶畫像
根據(jù)用戶研究的結(jié)果,構(gòu)建詳細(xì)的用戶畫像,包括用戶的性格、生活方式、價(jià)值觀等因素,并且添加情緒維度。以一款旅行APP為例,其中一個(gè)用戶畫像可能是“年輕的探險(xiǎn)愛好者,性格樂觀,追求刺激,在旅行前會(huì)充滿期待和興奮”。這樣的畫像有助于設(shè)計(jì)師站在用戶的角度思考情緒體驗(yàn)。
描繪情緒場(chǎng)景
:針對(duì)不同的用戶畫像,描繪他們使用產(chǎn)品的情緒場(chǎng)景。比如,對(duì)于上述旅行APP的用戶,在規(guī)劃行程時(shí),他可能會(huì)在APP上查找小眾景點(diǎn),此時(shí)的情緒是好奇和興奮;在旅途中使用導(dǎo)航功能時(shí),希望得到精準(zhǔn)的指引,情緒是焦慮或安心,取決于導(dǎo)航的準(zhǔn)確性。這些情緒場(chǎng)景為后續(xù)設(shè)計(jì)提供了具體的目標(biāo)。
 
 
設(shè)計(jì)階段
情緒價(jià)值在體驗(yàn)設(shè)計(jì)中的應(yīng)用
 
 
視覺設(shè)計(jì)方面
色彩運(yùn)用
:色彩對(duì)情緒有著強(qiáng)烈的影響。例如,暖色調(diào)如紅色和橙色通常傳達(dá)活力、熱情的情緒,適合用于激發(fā)用戶興趣的界面元素,如促銷活動(dòng)頁(yè)面;冷色調(diào)如藍(lán)色和綠色則給人冷靜、可靠的感覺,可用于數(shù)據(jù)展示或需要用戶集中注意力的區(qū)域。在設(shè)計(jì)金融產(chǎn)品界面時(shí),使用藍(lán)色為主色調(diào)可以讓用戶感到安全和信任。
圖形設(shè)計(jì)
:簡(jiǎn)潔、易懂的圖形能夠快速傳達(dá)信息并引發(fā)積極情緒。在圖標(biāo)設(shè)計(jì)上,要符合用戶的認(rèn)知習(xí)慣。例如,在社交產(chǎn)品中,使用微笑的表情圖標(biāo)表示點(diǎn)贊或喜歡,用戶很容易理解并產(chǎn)生愉悅的情緒。同時(shí),利用有趣的插畫或動(dòng)畫可以增加產(chǎn)品的趣味性。如在兒童教育產(chǎn)品中,用生動(dòng)的動(dòng)畫來講解知識(shí),能夠吸引孩子的注意力并讓他們感到快樂。
排版布局
:合理的排版可以提升用戶的閱讀體驗(yàn)和情緒。清晰的標(biāo)題和正文層次,適當(dāng)?shù)奈淖珠g距和行高,能讓用戶感到舒適。在新聞?lì)惍a(chǎn)品中,采用模塊化的排版,將不同的新聞內(nèi)容清晰劃分,使用戶在瀏覽時(shí)不會(huì)感到混亂,從而減少煩躁情緒。
 
交互設(shè)計(jì)方面
反饋機(jī)制設(shè)計(jì)
:為用戶的操作提供及時(shí)、明確的反饋可以提升情緒價(jià)值。例如,當(dāng)用戶點(diǎn)擊一個(gè)按鈕時(shí),按鈕會(huì)有短暫的變色或動(dòng)畫效果,讓用戶知道操作已被接收。在加載頁(yè)面時(shí),使用有趣的加載動(dòng)畫代替單調(diào)的進(jìn)度條,如旋轉(zhuǎn)的小圖標(biāo)或者跳動(dòng)的小球,能夠緩解用戶等待的焦慮情緒。
操作流程優(yōu)化
:簡(jiǎn)化復(fù)雜的操作流程,減少用戶的認(rèn)知負(fù)擔(dān)和操作失誤。在移動(dòng)支付產(chǎn)品中,盡量減少支付步驟,讓用戶能夠快速完成支付,避免因流程繁瑣而產(chǎn)生煩躁情緒。同時(shí),可以增加一些引導(dǎo)性的交互,如新手引導(dǎo)教程,幫助用戶輕松上手產(chǎn)品,提升用戶的自信心和滿意度。
個(gè)性化與定制化設(shè)計(jì)
:根據(jù)用戶的喜好和行為習(xí)慣,提供個(gè)性化的交互體驗(yàn)。例如,音樂產(chǎn)品可以根據(jù)用戶的收聽歷史推薦相似風(fēng)格的歌曲,用戶會(huì)因?yàn)楫a(chǎn)品的貼心而感到愉悅。并且允許用戶對(duì)界面布局、主題等進(jìn)行定制,讓用戶有更多的掌控感,滿足他們的自我表達(dá)需求。
 
內(nèi)容設(shè)計(jì)方面
文案撰寫
:使用友好、易懂的文案可以拉近與用戶的距離。在產(chǎn)品提示信息中,避免使用生硬的專業(yè)術(shù)語,而采用親切的語氣。例如,在一款智能家居產(chǎn)品中,當(dāng)設(shè)備連接成功時(shí),顯示“哇,您已經(jīng)成功連接啦,現(xiàn)在就可以享受智能生活啦”,這樣的文案會(huì)讓用戶感到輕松和愉快。同時(shí),文案的風(fēng)格要與產(chǎn)品的定位和目標(biāo)用戶相匹配。
內(nèi)容策略
:提供有價(jià)值、有趣的內(nèi)容可以提升情緒價(jià)值。在知識(shí)付費(fèi)產(chǎn)品中,確保課程內(nèi)容不僅有深度,而且講解方式生動(dòng)有趣。對(duì)于內(nèi)容社區(qū)產(chǎn)品,鼓勵(lì)用戶分享積極向上的內(nèi)容,如生活中的小美好、勵(lì)志故事等,營(yíng)造一個(gè)充滿正能量的社區(qū)氛圍,讓用戶在瀏覽內(nèi)容時(shí)感到愉悅和鼓舞。
 
 
測(cè)試與優(yōu)化階段
情緒價(jià)值在體驗(yàn)設(shè)計(jì)中的應(yīng)用
 
 
可用性測(cè)試與情緒評(píng)估
進(jìn)行可用性測(cè)試
:在產(chǎn)品原型階段,邀請(qǐng)用戶進(jìn)行可用性測(cè)試,觀察用戶的操作行為和情緒反應(yīng)。例如,在測(cè)試一款辦公軟件的新功能時(shí),注意用戶是否能夠順利使用,以及在使用過程中是否出現(xiàn)困惑、煩躁等情緒??梢酝ㄟ^用戶的面部表情、言語反饋等方式收集情緒信息。
情緒評(píng)估工具
:利用情緒評(píng)估工具,如情感化可用性量表(UEQ)等,對(duì)用戶的情緒體驗(yàn)進(jìn)行量化評(píng)估。UEQ可以測(cè)量用戶對(duì)產(chǎn)品的吸引力、易用性、可靠性等維度的情緒感受,通過數(shù)據(jù)分析,找出需要優(yōu)化的情緒體驗(yàn)點(diǎn)。
 
根據(jù)反饋優(yōu)化設(shè)計(jì)
迭代設(shè)計(jì)
:根據(jù)用戶測(cè)試的反饋,對(duì)產(chǎn)品的視覺、交互和內(nèi)容設(shè)計(jì)進(jìn)行迭代優(yōu)化。例如,如果用戶在測(cè)試中表示某個(gè)界面元素的顏色讓人感到刺眼,設(shè)計(jì)師可以調(diào)整顏色方案。如果用戶對(duì)某個(gè)操作流程不理解,就優(yōu)化操作引導(dǎo)。
持續(xù)關(guān)注情緒反饋
:產(chǎn)品上線后,持續(xù)收集用戶反饋,關(guān)注用戶情緒價(jià)值的變化。隨著用戶需求的變化和市場(chǎng)環(huán)境的改變,不斷調(diào)整產(chǎn)品設(shè)計(jì),以保持和提升產(chǎn)品的情緒價(jià)值。例如,在節(jié)日期間,對(duì)產(chǎn)品界面進(jìn)行節(jié)日主題的裝飾,為用戶提供新鮮感和節(jié)日氛圍帶來的愉悅情緒。
 
四、情緒價(jià)值是否具備量化條件
可以通過以下方法對(duì)其進(jìn)行量化計(jì)算
 
情感化可用性量表
情緒價(jià)值在體驗(yàn)設(shè)計(jì)中的應(yīng)用
 
 
原理:UEQ是一種廣泛用于量化用戶對(duì)產(chǎn)品情緒體驗(yàn)的工具。它通過一系列的問卷題目來測(cè)量用戶對(duì)于產(chǎn)品的吸引力、易用性、效率、可靠性和刺激度等多個(gè)維度的感受。例如,在吸引力維度上,會(huì)詢問用戶對(duì)于產(chǎn)品外觀、風(fēng)格是否感到喜歡;在易用性維度,會(huì)涉及用戶操作產(chǎn)品時(shí)是否感到輕松、方便等問題?!?/span>
 
應(yīng)用:在一款產(chǎn)品/功能的用戶體驗(yàn)測(cè)試中,使用UEQ可以收集用戶對(duì)該應(yīng)用在不同維度的情緒評(píng)價(jià)。通過對(duì)大量用戶反饋的數(shù)據(jù)統(tǒng)計(jì),得出該應(yīng)用在各個(gè)維度的量化得分,比如吸引力維度得分較高,說明產(chǎn)品在視覺等方面能引發(fā)用戶積極情緒,而如果易用性維度得分較低,則可能表示產(chǎn)品的操作流程等會(huì)讓用戶產(chǎn)生負(fù)面情緒?!?/span>
 
 
凈推薦值(NPS)與情緒關(guān)聯(lián)量化
 
情緒價(jià)值在體驗(yàn)設(shè)計(jì)中的應(yīng)用
 
 
 
原理:凈推薦值是通過詢問用戶“您是否愿意將這個(gè)產(chǎn)品推薦給其他人”來衡量用戶忠誠(chéng)度。雖然NPS本身不是直接對(duì)情緒價(jià)值的量化,但它與用戶的情緒體驗(yàn)密切相關(guān)。當(dāng)用戶體驗(yàn)到較高的情緒價(jià)值,如愉悅、滿足等,他們更有可能成為推薦者,NPS得分就會(huì)升高?!?/span>
 
應(yīng)用:通過定期收集用戶的NPS數(shù)據(jù),并且結(jié)合用戶對(duì)功能使用體驗(yàn)的詳細(xì)反饋(包括對(duì)產(chǎn)品、服務(wù)、售后等環(huán)節(jié)的情緒感受),可以間接量化情緒價(jià)值對(duì)用戶忠誠(chéng)度的影響。例如,如果發(fā)現(xiàn)NPS得分高的用戶在評(píng)價(jià)中經(jīng)常提及購(gòu)物過程中的快樂情緒和優(yōu)質(zhì)服務(wù)體驗(yàn),就可以推斷出情緒價(jià)值在提升用戶忠誠(chéng)度方面起到了積極作用?!?/span>
 
 
 
  1.  
    生理指標(biāo)測(cè)量
 
情緒價(jià)值在體驗(yàn)設(shè)計(jì)中的應(yīng)用
 
 
原理:情緒會(huì)引發(fā)身體的生理反應(yīng),如心率、皮膚電導(dǎo)率、瞳孔大小等變化。通過專業(yè)的設(shè)備可以測(cè)量這些生理指標(biāo),以此來推斷用戶的情緒狀態(tài)。例如,當(dāng)用戶感到興奮或緊張時(shí),心率會(huì)加快;當(dāng)他們感到好奇或?qū)Wr(shí),瞳孔可能會(huì)放大。 
應(yīng)用:在用戶體驗(yàn)實(shí)驗(yàn)室中,測(cè)試用戶在使用虛擬現(xiàn)實(shí)(VR)游戲的情緒體驗(yàn)。通過佩戴可以監(jiān)測(cè)心率和皮膚電導(dǎo)率的設(shè)備,觀察用戶在游戲不同場(chǎng)景下的生理指標(biāo)變化。如果在某個(gè)刺激的戰(zhàn)斗場(chǎng)景中,用戶的心率明顯上升,皮膚電導(dǎo)率也增加,就可以推斷用戶處于興奮或者緊張的情緒狀態(tài),從而量化游戲場(chǎng)景對(duì)用戶情緒的激發(fā)程度?!?/span>
 
雖然有量化方法,但也只有部分可被量化,完全精準(zhǔn)量化還存在一定的挑戰(zhàn) 
 
 
難以完全量化的原因
情緒的復(fù)雜性和主觀性
個(gè)體差異:不同用戶對(duì)同一產(chǎn)品或體驗(yàn)的情緒反應(yīng)存在很大差異。例如,對(duì)于一款具有挑戰(zhàn)性的游戲關(guān)卡,一些玩家可能會(huì)因?yàn)榭朔щy而感到興奮和滿足,而另一些玩家可能會(huì)因?yàn)橛X得太難而產(chǎn)生沮喪情緒。這種個(gè)體差異使得很難用統(tǒng)一的標(biāo)準(zhǔn)來量化情緒價(jià)值。
文化背景影響:文化因素也會(huì)對(duì)情緒價(jià)值的感受產(chǎn)生影響。在某些文化中,含蓄的情感表達(dá)是常態(tài),而在另一些文化中,人們可能更傾向于直接的情感反應(yīng)。比如,在日本文化中,用戶可能對(duì)產(chǎn)品的精致、細(xì)膩的設(shè)計(jì)有更深刻的情感共鳴,而西方文化中的用戶可能更看重產(chǎn)品的創(chuàng)新性和個(gè)性化帶來的情緒體驗(yàn)。
 
情緒與情境的動(dòng)態(tài)變化
使用場(chǎng)景的多樣性:用戶在不同的使用場(chǎng)景下對(duì)產(chǎn)品的情緒價(jià)值感受不同。例如,一個(gè)音樂播放軟件,用戶在運(yùn)動(dòng)場(chǎng)景下可能更關(guān)注節(jié)奏強(qiáng)烈的音樂帶來的激勵(lì)情緒,而在睡前場(chǎng)景下則更看重舒緩音樂營(yíng)造的放松情緒。這種隨場(chǎng)景變化的情緒體驗(yàn)難以用固定的量化指標(biāo)來衡量。
 
時(shí)間因素:用戶對(duì)產(chǎn)品的情緒體驗(yàn)也會(huì)隨著時(shí)間而變化。最初接觸產(chǎn)品時(shí)的新鮮感可能會(huì)帶來積極情緒,但隨著時(shí)間推移,如果產(chǎn)品缺乏更新或出現(xiàn)問題,情緒可能會(huì)轉(zhuǎn)變?yōu)橄麡O。而且情緒的產(chǎn)生和消退過程很難精確量化,例如很難確定用戶從感到滿意到產(chǎn)生厭煩的具體時(shí)間節(jié)點(diǎn)。
雖然難以量化,但情緒價(jià)值在實(shí)際應(yīng)用中發(fā)揮的作用還是很大的?!?/span>
 
 
結(jié)束語
在體驗(yàn)設(shè)計(jì)的廣闊領(lǐng)域中,情緒價(jià)值猶如一股無形的力量,悄然影響著用戶與產(chǎn)品之間的每一次互動(dòng)。它不僅僅是愉悅感、保障感和專享感的簡(jiǎn)單疊加,更是用戶在深層情感層面與品牌建立起的穩(wěn)固紐帶。通過精心設(shè)計(jì)的用戶體驗(yàn),我們能夠觸動(dòng)用戶的情感,激發(fā)他們的共鳴,從而在用戶心中留下深刻而持久的印記。


作者:群核科技MCUX
鏈接:https://www.zcool.com.cn/article/ZMTY0OTIxNg==.html
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

蘭亭妙微(cqzjtgb.com )是一家專注而深入的界面設(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。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan

以用戶為中心的交互設(shè)計(jì)思維

ui設(shè)計(jì)分享達(dá)人 交互設(shè)計(jì)及用戶體驗(yàn)

聊聊關(guān)于設(shè)計(jì)思維的內(nèi)容,會(huì)從產(chǎn)品設(shè)計(jì)、體驗(yàn)設(shè)計(jì)、交互設(shè)計(jì)三個(gè)方面入手。
目前是第三篇,關(guān)于交互設(shè)計(jì)思維的內(nèi)容。到這里設(shè)計(jì)思維的內(nèi)容全部結(jié)束了。
感謝
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維


作者:DesignLink
鏈接:https://www.zcool.com.cn/article/ZMTY0OTg1Mg==.html
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

蘭亭妙微(cqzjtgb.com )是一家專注而深入的界面設(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。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan

產(chǎn)品設(shè)計(jì)如何利用心理學(xué)

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

產(chǎn)品設(shè)計(jì)的成功除了依賴設(shè)計(jì)方案和技術(shù)實(shí)現(xiàn),還與用戶的心理密切相關(guān)。用戶心里決定了我們用怎樣的設(shè)計(jì)策略解決問題。我們常認(rèn)為人們做決策時(shí)是理性的,但其實(shí)用戶行為經(jīng)常是非理性,會(huì)受到情緒、習(xí)慣和社交環(huán)境的影響。了解這些心理學(xué)規(guī)律能幫助我們更好地的預(yù)測(cè)和引導(dǎo)用戶行為,優(yōu)化產(chǎn)品體驗(yàn),提高用戶的粘性、留存率和轉(zhuǎn)化率,從而產(chǎn)品商業(yè)價(jià)值最大化。
產(chǎn)品設(shè)計(jì)如何利用心理學(xué)
 
 
產(chǎn)品設(shè)計(jì)如何利用心理學(xué)
 
 
產(chǎn)品設(shè)計(jì)如何利用心理學(xué)
 
 
產(chǎn)品設(shè)計(jì)如何利用心理學(xué)
 
 
產(chǎn)品設(shè)計(jì)如何利用心理學(xué)
 
 
產(chǎn)品設(shè)計(jì)如何利用心理學(xué)
 
 
產(chǎn)品設(shè)計(jì)如何利用心理學(xué)
 
 
產(chǎn)品設(shè)計(jì)如何利用心理學(xué)
 
 
產(chǎn)品設(shè)計(jì)如何利用心理學(xué)
 
 
產(chǎn)品設(shè)計(jì)如何利用心理學(xué)
 
 
產(chǎn)品設(shè)計(jì)如何利用心理學(xué)
 
 
產(chǎn)品設(shè)計(jì)如何利用心理學(xué)
 
 
產(chǎn)品設(shè)計(jì)如何利用心理學(xué)


作者:DesignLink
鏈接:https://www.zcool.com.cn/article/ZMTY1MDk0MA==.html
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

蘭亭妙微(cqzjtgb.com )是一家專注而深入的界面設(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。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan

“好的設(shè)計(jì)組件”在搜索設(shè)計(jì)場(chǎng)景中的定義

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

 
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
從網(wǎng)上搜索設(shè)計(jì)組件,我們能找到各種對(duì)外公開的設(shè)計(jì)組件庫(kù),同樣還有不少或概括或詳細(xì)的文章,手把手教你“如何搭建一個(gè)好的設(shè)計(jì)組件庫(kù)”,但這些方法論很少探討面對(duì)C端組件頻繁增改、設(shè)計(jì)規(guī)范動(dòng)態(tài)調(diào)整,如何高效賦能業(yè)務(wù)設(shè)計(jì)交付的相關(guān)內(nèi)容,但這恰恰是搜索業(yè)務(wù)面臨的關(guān)鍵問題。
 
搜索是一個(gè)“牽一發(fā)而動(dòng)全身”的業(yè)務(wù),每一個(gè)微小的設(shè)計(jì)細(xì)節(jié)都有可能影響各個(gè)業(yè)務(wù)的數(shù)據(jù)指標(biāo),一個(gè)“好的設(shè)計(jì)組件庫(kù)”需要以一種潛移默化的方式讓設(shè)計(jì)師掌握設(shè)計(jì)規(guī)范,完成合規(guī)的設(shè)計(jì),從這個(gè)角度而言它應(yīng)該比較
「好懂」
。
 
而作為服務(wù)于整個(gè)設(shè)計(jì)團(tuán)隊(duì)的公用設(shè)計(jì)組件庫(kù),面對(duì)每月數(shù)以萬計(jì)的調(diào)用次數(shù),它必須保障最基本的易用性,應(yīng)該非常
「好用」
 
同時(shí),面對(duì)頻繁迭代,“好的設(shè)計(jì)組件”還需要保持最快的更新速度,為各個(gè)橫向團(tuán)隊(duì)提供正確的樣式,從這個(gè)角度來說它還要
「好維護(hù)」
。
 
因此,
「好懂、好用、好維護(hù)」
是搜索設(shè)計(jì)語境下,對(duì)一個(gè)“好的設(shè)計(jì)組件”的定義。
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
接下來,我們將從這三個(gè)「好」入手,分享搜索設(shè)計(jì)組件庫(kù)在升級(jí)過程中的一些思考,希望能和大家共同探討。
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
“萬丈高樓平地起”,我們先來說說如何從零開始構(gòu)建一個(gè)既符合設(shè)計(jì)規(guī)范又易于理解的設(shè)計(jì)組件。
 
首先,在搭建組件時(shí),我們可以考慮采用
多層嵌套
的方式,即組件(Component)內(nèi)部嵌套變體(Instance)。這種方式不僅能省去組件搭建和修改過程中的重復(fù)操作,甚至還能在解綁組件時(shí),通過選中內(nèi)部的子組件圖層進(jìn)行解綁,大大簡(jiǎn)化了搭建和使用雙方的操作流程。
 
在多層嵌套的思路下,我們可以進(jìn)一步用
“底層靈活、上層收斂”
來指導(dǎo)組件的搭建。這意味著底層變體的形式足夠多樣,能夠支持大部分的狀態(tài)切換,而在上層組件搭建的過程中顯性地加強(qiáng)規(guī)范的指引(如規(guī)范中不允許使用的樣式不對(duì)外展示),以降低超出規(guī)范設(shè)計(jì)的可能。
 
具體的搭建流程可以大致分為三步:
場(chǎng)景收集和分析、搭建基本變體組、拓展高階變體組
。
 
我們將通過視頻組件搭建的生動(dòng)案例,具體介紹如何依據(jù)“底層靈活、上層收斂”原則來搭建組件庫(kù),使得組件本身既足夠靈活,又能起到足夠的約束作用。
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
在著手搭建某類組件時(shí),我們首先通過規(guī)范確認(rèn)和場(chǎng)景遍歷,廣泛收集各類變體。隨后,從我們能想到的所有維度出發(fā),對(duì)這些變體進(jìn)行細(xì)致定義。這樣,我們就能得到一張?jiān)敱M描述組件變體性質(zhì)的表格。表格的第一列依次列出變體1、變體2、變體3等,而第一行則羅列出各種維度,如寬度、比例等。通過這種方法,我們可以將原本零散、雜亂的組件變體描述,系統(tǒng)地歸納整理成一張清晰明了的表格。
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
表格通過不同維度來唯一確定一個(gè)變體,這些維度可大致分為兩個(gè)特性和一個(gè)共性。共性指的是所有變體在這一維度上均保持一致,常見特性則涵蓋了最常見的分類性質(zhì),如寬度、高度、數(shù)量和優(yōu)先級(jí)等,而業(yè)務(wù)特性則與具體業(yè)務(wù)緊密相關(guān)。
 
在搭建組件時(shí),我們可以遵循
「共性-常見特性-業(yè)務(wù)特性」
順序,這樣的順序有助于降低理解成本,因?yàn)樽罘闲闹堑姆诸惐恢糜谕鈱?,同時(shí)底層的組件又保持了足夠的靈活性,便于切換各種變量。對(duì)于業(yè)務(wù)特性,我們可以根據(jù)實(shí)際情況靈活處理,既可以將其作為基本組件的延展,也可以不將其納入組件范疇。
 
以視頻組件為例,我們從表格中獲取的信息如下:
 
  •  
    視頻尺寸及其組合是最符合用戶心智的變體選擇;
  •  
    播放狀態(tài)是所有變體的共有性質(zhì);
  •  
    自動(dòng)播放情況與業(yè)務(wù)相關(guān),但不一定需要在組件庫(kù)中呈現(xiàn);
  •  
    高階組件僅涉及少部分尺寸的組件,應(yīng)在完成基本組件搭建后再進(jìn)行。
 
據(jù)此,我們可以輕松梳理出視頻組件搭建流程的優(yōu)先級(jí):
 
  1.  
    播放狀態(tài)作為共性,應(yīng)首先搭建;
  2.  
    基本組件尺寸和組合是最符合用戶心智的變體選擇,應(yīng)緊隨其后;
  3.  
    高階組件在完成基本組件搭建后再進(jìn)行。
 
值得注意的是,“封面槽位”是“播放狀態(tài)”中的一個(gè)圖層。根據(jù)“底層靈活、上層收斂”的原則,我們將其插入到搭建播放狀態(tài)之前。因此,視頻組件的最終搭建流程為:
 
  1.  
    封面槽位;
  2.  
    播放狀態(tài);
  3.  
    基本組件尺寸和組合;
  4.  
    高階組件。
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
完成對(duì)視頻組件搭建的分析,我們就可以有條不紊地開始搭建組件了。先搭建基本組件視頻組件,再用基本組件搭建高階組件。這一步驟雖然為大家所熟知,但仍需格外注意,如配置項(xiàng)的設(shè)置要力求合理,也可以融入設(shè)計(jì)規(guī)范和使用規(guī)范,同時(shí)還應(yīng)將一些搭建過程中的零散組件集中收納避免被調(diào)用。關(guān)于這些具體的注意事項(xiàng),我們將在后續(xù)部分進(jìn)行詳細(xì)闡述。
 
至此我們完成了組件搭建的基本流程,一個(gè)達(dá)到及格線的視頻組件就誕生了。據(jù)統(tǒng)計(jì),優(yōu)化后每次調(diào)用視頻組件將節(jié)省至少10步的點(diǎn)擊操作!
 
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
完成了一個(gè)基本組件的搭建后,我們可以轉(zhuǎn)換視角,從使用的角度來審視并檢查這個(gè)組件。
 
我們期望,從插入組件變體、切換組件配置,再到最后的解綁組件,整個(gè)流程都能縱享絲滑且穩(wěn)定可靠,確保業(yè)務(wù)設(shè)計(jì)師在使用過程中獲得最佳體驗(yàn)。
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
我們可以一步步來審視組件的使用過程。首先是插入組件,據(jù)觀察,通常有三種方式,①在左側(cè)的資產(chǎn)面板(Assets)中直接找到對(duì)應(yīng)組件并插入;②通過查閱設(shè)計(jì)規(guī)范,鎖定所需的變體后復(fù)制粘貼;③選中一個(gè)不需要的組件,通過右側(cè)的“切換變體”面板(Swap instance)切換成所需的變體。很明顯,在這個(gè)過程中依賴的是組件的精準(zhǔn)搜索和快速定位。
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
為了提升搜索精度,我們可以從組件命名入手,采用中、英、數(shù)字結(jié)合的方式,實(shí)現(xiàn)模糊匹配;也可以在發(fā)布時(shí)隱藏不希望被調(diào)用的組件,以減少無用的搜索結(jié)果。如果組件是采用前文提到的“多層嵌套”方式搭建的,我們可以添加“Preferred”子組件,這樣在切換時(shí)會(huì)優(yōu)先展示這些子組件,這個(gè)功能在切換圖標(biāo)時(shí)尤為實(shí)用。
 
對(duì)于習(xí)慣邊查閱設(shè)計(jì)規(guī)范邊使用組件的設(shè)計(jì)師,我們?cè)黾恿烁鄬?shí)際使用的正誤案例,這些案例直觀展示了組件變體的正確選擇和使用方式,進(jìn)一步降低了規(guī)范的理解成本,有效輔助設(shè)計(jì)決策。同時(shí),我們專門維護(hù)了一個(gè)固定區(qū)域,用于平鋪展示所有組件變體。為了確保能夠輕松點(diǎn)選,我們將變體放在最外層展示(即不在任何Frame、Group或Section中)。這樣能讓設(shè)計(jì)師一目了然地看到所有變體,從而快速選擇所需的組件。
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
在組件配置階段,有三項(xiàng)注意點(diǎn)能讓組件更加易用,即“重視組件的可視化效果、設(shè)置高效易用的配置項(xiàng)、貼心地保存修改”。
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
考慮到C端組件的多樣性和用戶的使用習(xí)慣,我們應(yīng)避免使用過于復(fù)雜的分組方式。相反,應(yīng)更注重組件的樣式展示,并盡量簡(jiǎn)化組件的層級(jí)結(jié)構(gòu)。這樣,設(shè)計(jì)師在使用時(shí)能夠更直觀地看到組件的外觀,而無需深入復(fù)雜的層級(jí)去查找。
 
另外值得注意的是,F(xiàn)igma會(huì)默認(rèn)用組件集合中最左上角的組件生成預(yù)覽樣式,因此應(yīng)當(dāng)把視覺上最有代表性的變體放在左上角,這個(gè)效果在切換變體(Swap instance)時(shí)很重要,因?yàn)槟壳霸谠撁姘逯袥]法查看組件細(xì)節(jié),只能靠縮略圖和名稱來推測(cè)是哪個(gè)組件。
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
其次對(duì)于配置項(xiàng)的設(shè)置也大有講究,業(yè)界有組件庫(kù)為了實(shí)現(xiàn)C2D2C,從源頭上將設(shè)計(jì)組件和前端組件的配置項(xiàng)打平,這是不錯(cuò)的思路,但有可能會(huì)提升設(shè)計(jì)側(cè)的理解成本。針對(duì)搜索業(yè)務(wù)的特殊語境,我們還是選擇了從「規(guī)范理解」角度去設(shè)置組件的配置項(xiàng),將所有允許自定義的配置盡可能外露,并清晰地說明修改限制,如字?jǐn)?shù)限定、選項(xiàng)個(gè)數(shù)等,這樣能夠在使用的過程中強(qiáng)化業(yè)務(wù)設(shè)計(jì)師對(duì)規(guī)范的掌握。
 
另一個(gè)常常被忽視的關(guān)鍵點(diǎn)是選項(xiàng)和配置的排序問題。為了提高瀏覽和選擇的效率,建議對(duì)選項(xiàng)和選項(xiàng)之間,以及外層的不同配置項(xiàng),都按照一定的邏輯順序進(jìn)行排序。
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
最后一點(diǎn),我們稱之為
“貼心地保存修改”
機(jī)制,這個(gè)針對(duì)的是文字修改的場(chǎng)景。
 
在實(shí)際操作中,使用一個(gè)組件可能需要對(duì)多個(gè)配置項(xiàng)進(jìn)行修改。有時(shí)在修改完文字內(nèi)容后再去調(diào)整其他配置時(shí),已修改的文字會(huì)被重置。這時(shí)文本屬性(text property)的設(shè)置就顯得尤為重要,它能夠記憶并保存修改過的文字內(nèi)容,從而免于重復(fù)輸入。
 
還有一些情況是,某個(gè)組件變體實(shí)際上并沒有與某個(gè)值相對(duì)應(yīng)的組件(盡管Figma機(jī)制允許選擇該值),用戶切換后就會(huì)發(fā)現(xiàn)組件完全變了,只能撤回。為了避免這類情況,建議使用另外的標(biāo)記來表明組件某個(gè)設(shè)置項(xiàng)是不可切換的。
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
完成了組件的搭建和檢查,接下來讓我們聚焦于組件的日常維護(hù)。
 
這一環(huán)節(jié)可以從兩個(gè)維度展開,一是依托中臺(tái)的日常數(shù)據(jù)監(jiān)控進(jìn)行維護(hù),二是通過團(tuán)隊(duì)內(nèi)部的緊密協(xié)同機(jī)制來保障。后者更多側(cè)重協(xié)作流程和機(jī)制上的建設(shè),在本文中我們不做更多展開,重點(diǎn)討論前者。
 
數(shù)據(jù)監(jiān)控的方式主要依托Figma中的組件數(shù)據(jù)看板(查看路徑:View libraries-Analytics),看板中展示了各個(gè)組件的調(diào)用數(shù)和解綁數(shù)數(shù)據(jù),這些數(shù)據(jù)不直接反映組件的優(yōu)劣,但如果我們觀測(cè)到某個(gè)組件解綁率偏高,我們會(huì)考慮直接把它
作為模板
而不是創(chuàng)建成組件。
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
 
總結(jié)
 
以上是百度搜索設(shè)計(jì)團(tuán)隊(duì)在設(shè)計(jì)組件庫(kù)升級(jí)過程中的心得分享,包括搜索業(yè)務(wù)對(duì)于“好的設(shè)計(jì)組件”的訴求,以及一些搭建和優(yōu)化組件的實(shí)用思路,核心是探討如何從組件庫(kù)建設(shè)的角度入手,成功助力團(tuán)隊(duì)提升設(shè)計(jì)資產(chǎn)消費(fèi)效率。
 
關(guān)于設(shè)計(jì)組件庫(kù),我們有一些新思考
 
 
 
當(dāng)前我們已經(jīng)完成設(shè)計(jì)資產(chǎn)工程化的前序環(huán)節(jié),我們對(duì)設(shè)計(jì)資產(chǎn)的升級(jí)和探索并沒有結(jié)束,未來我們將持續(xù)探索設(shè)計(jì)系統(tǒng)工具化的形態(tài)、與AI大模型結(jié)合的機(jī)會(huì),通過豐富消費(fèi)途徑,實(shí)現(xiàn)在業(yè)務(wù)交付的不同階段下全方位提效。這部分內(nèi)容后續(xù)有機(jī)會(huì)也將會(huì)和大家見面,請(qǐng)大家期待!
 
感謝閱讀,以上內(nèi)容均由百度MEUX團(tuán)隊(duì)原創(chuàng)設(shè)計(jì),以及百度MEUX版權(quán)所有,轉(zhuǎn)載請(qǐng)注明出處,違者必究,謝謝您的合作。申請(qǐng)轉(zhuǎn)載授權(quán)后臺(tái)回復(fù)【轉(zhuǎn)載】。


作者:百度MEUX
鏈接:https://www.zcool.com.cn/article/ZMTY1MTYwOA==.html
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

蘭亭妙微(cqzjtgb.com )是一家專注而深入的界面設(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。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan

 

B端基礎(chǔ) | 彈窗設(shè)計(jì)基礎(chǔ)知識(shí)

天宇 B端ui設(shè)計(jì)文章及欣賞

建筑設(shè)計(jì)師尤哈尼·帕拉斯瑪說、簡(jiǎn)約并非簡(jiǎn)單,它是通過深思熟慮后對(duì)事物本質(zhì)的準(zhǔn)確把握。知其然、知其所以然。這次文章會(huì)盡量簡(jiǎn)潔一點(diǎn)。
 
奔跑的日子、總是希望優(yōu)秀的你和我一起同行。讓我們一起在藝術(shù)的環(huán)境里生菌、知識(shí)的海洋里狗刨~
 
B端基礎(chǔ) | 彈窗設(shè)計(jì)基礎(chǔ)知識(shí)
 
 
第一部分 | 彈窗基礎(chǔ)知識(shí)
如果你只是想了解一下彈窗的基礎(chǔ)知識(shí),那么看這部分就夠了。只需3分鐘無痛、來去自如不影響上班哦。
彈窗定義;彈窗來歷;彈窗拆分;彈窗分類;彈窗尺寸;
B端基礎(chǔ) | 彈窗設(shè)計(jì)基礎(chǔ)知識(shí)
 
 
1、彈窗定義
彈窗是用戶和系統(tǒng)交互信息的容器
。(在網(wǎng)上搜了一些文章看,他們的彈窗定義寫的基本都是各寫各的)我的這個(gè)定義絕對(duì)靠譜。站的維度高,從人機(jī)交互工程出發(fā)。這定義沒錯(cuò)的妥妥的。說出去基本不會(huì)有人反駁你(如果有人敢反駁你把我的名字告訴他,反正我他也不認(rèn)識(shí)我哈哈哈)
 
2、彈窗來歷
彈窗最早的起源可以追溯至上世紀(jì)90年代。當(dāng)時(shí),互聯(lián)網(wǎng)廣告的投放形式主要是將廣告嵌入在頁(yè)面內(nèi)容中,但這種方式存在一些問題。廣告商擔(dān)心消費(fèi)者在瀏覽負(fù)面內(nèi)容時(shí),會(huì)將廣告與負(fù)面信息聯(lián)系在一起,從而對(duì)品牌造成不利影響。因此,網(wǎng)頁(yè)托管網(wǎng)站trippod.com利用網(wǎng)頁(yè)腳本程序,發(fā)明了一種在新開窗口發(fā)布廣告的方法,這就是網(wǎng)絡(luò)彈窗的起源。
B端基礎(chǔ) | 彈窗設(shè)計(jì)基礎(chǔ)知識(shí)
 
 
3、彈窗拆分
整體的去分析、在大部分的彈窗類型里都會(huì)包括
關(guān)閉、內(nèi)容區(qū)、模態(tài)層
(非模態(tài)類別的沒有個(gè)元素)
B端基礎(chǔ) | 彈窗設(shè)計(jì)基礎(chǔ)知識(shí)
 
 
3.1、模態(tài)層
模態(tài)層通常是擱在原頁(yè)面和彈窗之間的半透明黑色。其主要的作用是1、降低用戶在操作中被強(qiáng)打斷的不適和跳出當(dāng)前頁(yè)面的恐慌感。讓我們的用戶更加的聚焦彈窗內(nèi)容。
B端基礎(chǔ) | 彈窗設(shè)計(jì)基礎(chǔ)知識(shí)
 
 
我個(gè)人在設(shè)計(jì)時(shí)模態(tài)層基本都是50%的純黑,但并不是一定要用50%的純黑,要結(jié)合自己的平臺(tái)業(yè)務(wù)、設(shè)計(jì)風(fēng)格等方面去制定。偷偷的告訴你這個(gè)模態(tài)層加入一點(diǎn)微微的色彩傾向在視覺上往往會(huì)更好一點(diǎn)。
3.2、關(guān)閉
彈窗的關(guān)閉是用戶退彈窗的重要途徑、一般都會(huì)在彈窗內(nèi)容右上角。彈窗關(guān)閉按鈕也有在彈窗范圍外的。我們要保證彈窗關(guān)閉的清晰明確,來方便用戶操作。
在彈窗中、關(guān)閉彈窗的途徑除了叉掉。還可能有其他的。如取消按鈕。
3.3、內(nèi)容區(qū)
內(nèi)容區(qū)的內(nèi)容是根據(jù)彈窗類型的不同,內(nèi)容就會(huì)有所不同。什么都可能有、圖標(biāo)、確認(rèn)信息、選擇框、輸入框。只要是頁(yè)面上能出現(xiàn)的都可能會(huì)出現(xiàn)在彈窗的內(nèi)容區(qū)域。
B端基礎(chǔ) | 彈窗設(shè)計(jì)基礎(chǔ)知識(shí)
 
 
4、彈窗分類
彈窗的分類從交互形式差的差異。我們可以將其分為
模態(tài)類和非模態(tài)類
。這兩個(gè)大類就比較好區(qū)分,看看有沒有那層模就行了。常見彈窗類型表單彈窗、抽屜、警告提示、全局提示、通知提示、氣泡確認(rèn)等。
B端基礎(chǔ) | 彈窗設(shè)計(jì)基礎(chǔ)知識(shí)
 
 
4.1、模態(tài)類
模態(tài)是目前我們比較常見的類型、模態(tài)類彈窗打斷用戶的操作行為,用戶必須對(duì)其進(jìn)行操作才能解散彈窗,否則不能進(jìn)行其他操作。模態(tài)類最常見的就是、
表單彈窗、確認(rèn)彈窗
。當(dāng)然還有其他的文件選擇、信息展示、等等。
B端基礎(chǔ) | 彈窗設(shè)計(jì)基礎(chǔ)知識(shí)
 
 
4.1.1、表單彈窗
這彈窗在B端設(shè)計(jì)里是最最最常見的一種彈窗。雖然我們現(xiàn)在的系統(tǒng)大部分是很智能的。但是復(fù)雜的業(yè)務(wù)就意味著你會(huì)和系統(tǒng)產(chǎn)生大量的交互信息的交換。所以這表單可太常見了哪哪都是他。(煩死個(gè)人)不過在你制定好一套規(guī)使用規(guī)范后?;具@樣的彈窗是不太需要設(shè)計(jì)介入的,產(chǎn)品和FE兩人一對(duì)使用模版就上了。
4.1.2、確認(rèn)彈窗
這種彈窗就比較好理解了。承載較為緊急的信息,讓用戶快速處理;如:用戶未保存,就點(diǎn)擊離開當(dāng)前頁(yè)面,通過對(duì)話框讓用戶做出選擇。在執(zhí)行一個(gè)重要信息的刪除時(shí),通過二次詢問引起用戶的注意,讓用戶再次做判斷;這類彈窗;
4.1.3、優(yōu)點(diǎn)/缺點(diǎn)
優(yōu)點(diǎn):
強(qiáng)不會(huì)讓用戶忽略或跳過,確保信息的交互響應(yīng);引導(dǎo)用戶操作;增加用戶的參與度,可以提升用戶的活躍度和參與度。
缺點(diǎn):
01、會(huì)中斷用戶的操作流程,打斷用戶的思路或行為。
02、可能會(huì)影響用戶體驗(yàn),因?yàn)橛脩粜枰却P(guān)閉彈窗后才能繼續(xù)其他操作。如果彈窗內(nèi)容過多或過于復(fù)雜,用戶可能會(huì)感到困惑或不知所措。
03、如果過度使用模態(tài)類彈窗,例如頻繁彈出廣告或無意義的信息提示,用戶可能會(huì)對(duì)其產(chǎn)生反感甚至抵制使用相關(guān)軟件或平臺(tái)。
4.2、非模態(tài)
可以不打斷父應(yīng)用程序,無需停止進(jìn)度,用戶仍可以對(duì)父級(jí)內(nèi)容進(jìn)行交互。大部分應(yīng)用于信息的反饋和提示。常見的非模態(tài)類彈窗大概有、警告提示、全局提示、通知彈窗、氣泡確認(rèn)框;
B端基礎(chǔ) | 彈窗設(shè)計(jì)基礎(chǔ)知識(shí)
 
 
4.2.1非模態(tài)優(yōu)點(diǎn)/缺點(diǎn)
優(yōu)點(diǎn):
不打斷操作流程;不會(huì)干擾用戶操作用戶體驗(yàn)更好;常用于輕量級(jí)的信息或提示。
缺點(diǎn):
可能會(huì)被忽略,導(dǎo)致信息傳遞不暢;不適合展示重要信息;形式通常比較單一,不能滿足復(fù)雜的展示需求
4.3、其他
林子大了什么鳥兒都會(huì)有,一定會(huì)有我沒有接觸到的前沿交互方式。所以這個(gè)其他留給未來更優(yōu)秀的我們?nèi)グl(fā)現(xiàn)。
5、彈窗尺寸
彈窗的尺寸和電腦屏幕分辨率是有關(guān)系的。主流的分辨率1920*1080像素。其他的還有1024x768、1280x800、1366x768、1440x900、1680x1050、1920x1080、2560x1440等。
我在設(shè)計(jì)界面是一般用的是1440*900的設(shè)計(jì)尺寸。在做彈窗的時(shí)候已經(jīng)不考慮1366*768分辨率以下的屏幕了。多以彈窗的安全高度要小于600px
彈窗的寬度還是要根據(jù)自己業(yè)務(wù)需求去定義的。比如我們的業(yè)務(wù)最寬的彈窗1280像素。像站酷的查看作品他是整屏的寬度。
模特還怪好看的
模特還怪好看的
 
我在我們平臺(tái)定義的表單彈窗寬度雖然很不嚴(yán)謹(jǐn)、好像也沒有什么理論支撐。但是確一直再用。尺寸分別為、400、600、800、1000、1280。之后還是要細(xì)化的。這樣的定義彈窗尺寸導(dǎo)致的結(jié)果是,開發(fā)還原想過不是太好。
B端基礎(chǔ) | 彈窗設(shè)計(jì)基礎(chǔ)知識(shí)
 
 
第二部分 |彈窗2.0項(xiàng)目里
承載內(nèi)容、為什么會(huì)有這么多的彈窗類型。問題不在于彈窗,而在于合適的承載內(nèi)容和交互類型。
B端基礎(chǔ) | 彈窗設(shè)計(jì)基礎(chǔ)知識(shí)
 
 
1、彈窗、抽屜、界面
在項(xiàng)目里我們應(yīng)該怎么去選擇這三種內(nèi)容呈現(xiàn)方式呢。如果你只是設(shè)計(jì)師大部分時(shí)間你也不用選。你只有建議的權(quán)利沒有決定的權(quán)利。如果產(chǎn)品原型是彈窗、你給做了個(gè)抽屜。你可以從下面幾方面去找支撐點(diǎn)去和產(chǎn)品撕逼、干翻他的原型用你的效果圖。
AI的提高畫面質(zhì)量還是有待提高呀
AI的提高畫面質(zhì)量還是有待提高呀
 
1.1、內(nèi)容
彈窗和抽屜或界面他們承載的內(nèi)容量是不一樣的。所以在選擇用那種交互方式時(shí)可以從我們業(yè)務(wù)需要展示的內(nèi)容量來考慮。簡(jiǎn)單的確認(rèn)或通知適合用彈窗、需要展示大量?jī)?nèi)容或進(jìn)行復(fù)雜的功能時(shí)就適合用抽屜或者界面了。
1.2、體驗(yàn)
我們可以從用戶體驗(yàn)方面出發(fā)、如頁(yè)面的空間感、考慮空間大小和布局。操作流程上、考慮用戶在界面上被打斷進(jìn)程的成本。一致性、確保與其他業(yè)務(wù)模塊交互方式保持一致,為用戶提供一致的體驗(yàn)。
1.3、效率
考慮到用戶的使用成本、B端設(shè)計(jì)中效率的提升優(yōu)先率老高了??紤]系統(tǒng)的加載速度、確保我們使用的交互方式不會(huì)影響整體的性能和體驗(yàn)。
 
本身彈窗、抽屜或者界面的使用選擇是需要很綜合考慮的??偟膩碚f核心是提升效率、保證我們用戶好的體驗(yàn)。
2、彈窗交互優(yōu)缺點(diǎn)
當(dāng)涉及到B端彈窗的交互方式時(shí),有以下幾點(diǎn)核心優(yōu)缺點(diǎn):
B端基礎(chǔ) | 彈窗設(shè)計(jì)基礎(chǔ)知識(shí)
 
 
2.1、優(yōu)點(diǎn)
提供及時(shí)反饋
彈窗可以快速向用戶顯示重要的信息或請(qǐng)求,使用戶能夠即時(shí)了解系統(tǒng)的狀態(tài)或需要執(zhí)行的操作。
簡(jiǎn)化操作流程
對(duì)于某些復(fù)雜的操作或任務(wù),彈窗可以提供直觀的界面和簡(jiǎn)化的步驟,使用戶更容易完成目標(biāo)。
吸引用戶注意力
通過使用彈窗,可以確保用戶在操作過程中不會(huì)被其他界面元素分散注意力,從而更專注于當(dāng)前的任務(wù)。
提供額外的信息或功能
彈窗可以包含更多的詳細(xì)信息或額外的功能選項(xiàng),使用戶能夠更深入地了解或操作某個(gè)特定內(nèi)容。
2.2、缺點(diǎn)
干擾用戶操作
過度或不合適的彈窗可能會(huì)干擾用戶的正常操作,打斷用戶的工作流程,影響用戶體驗(yàn)。
誤導(dǎo)用戶
不清晰或誤導(dǎo)性的彈窗信息可能會(huì)使用戶產(chǎn)生困惑或誤解,導(dǎo)致錯(cuò)誤的操作或決策。
影響性能
彈窗的彈出和關(guān)閉可能會(huì)增加系統(tǒng)的負(fù)擔(dān),影響性能和響應(yīng)速度。
不符合用戶習(xí)慣
對(duì)于習(xí)慣于傳統(tǒng)界面的用戶來說,過于復(fù)雜或與眾不同的彈窗交互方式可能會(huì)造成使用上的困擾和不適應(yīng)。
3、我的一些設(shè)計(jì)
我們項(xiàng)目里把升級(jí)彈窗做成了模版、廣告彈窗也是模版。當(dāng)然像二次確認(rèn)這樣的彈窗是組件,上貨看東西。
B端基礎(chǔ) | 彈窗設(shè)計(jì)基礎(chǔ)知識(shí)
 
 
這個(gè)是系統(tǒng)的一個(gè)展示彈窗、和一個(gè)從彈窗形式優(yōu)化到抽屜的模塊界面。
B端基礎(chǔ) | 彈窗設(shè)計(jì)基礎(chǔ)知識(shí)
 
 
這個(gè)就是一個(gè)在線聊天界面。是從SaaS里跳轉(zhuǎn)新建頁(yè)面。
大概是想了想、平時(shí)做的項(xiàng)目確實(shí)比較碎、最近也沒做整理盒復(fù)盤。所以界面的展示就不放太多了。而且有的信息頁(yè)模糊了。不是我不信家人們。是我不信自己、朦朧也是一種美吧。哈哈哈
 
B端基礎(chǔ) | 彈窗設(shè)計(jì)基礎(chǔ)知識(shí)
 
 
最后
我大學(xué)設(shè)計(jì)史陳老師告誡過我們。她說同學(xué)們,我其實(shí)不怕你們眼高手低。我怕的是你們眼都不高。和優(yōu)秀的人一起前行、希望和優(yōu)秀的你們一起去經(jīng)歷設(shè)計(jì)、生活、工作的美好。
期待你的加入、我們的大伐木累。我可以作品集指導(dǎo)反正閑著也沒事不要錢。我和群里的小伙伴都是多年一線設(shè)計(jì)師來自于天南海北,不乏有互聯(lián)網(wǎng)大廠設(shè)計(jì)師。再次
期待你的加入...
 
參考
優(yōu)設(shè)網(wǎng):4個(gè)方面層層遞進(jìn),分析如何設(shè)計(jì)B端產(chǎn)品的彈窗
知乎:B端設(shè)計(jì)指南04-彈窗
知乎:運(yùn)營(yíng)彈窗的設(shè)計(jì)要點(diǎn)拆解
知乎:淺談B端產(chǎn)品彈窗一級(jí)設(shè)計(jì)方法
人人都是產(chǎn)品經(jīng)理:WEB端彈框掌握著幾天就夠了
 


作者:彪形大漢pro
鏈接:https://www.zcool.com.cn/article/ZMTYwNjg4NA==.html
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

蘭亭妙微(cqzjtgb.com )是一家專注而深入的界面設(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。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan

設(shè)計(jì)的兩面性:理性決策與感性表達(dá)

天宇 設(shè)計(jì)思維

引言
設(shè)計(jì)應(yīng)該是感性的還是理性的?設(shè)計(jì)是感性重要還是理性重要?此類問題一經(jīng)出現(xiàn)便會(huì)引起爭(zhēng)議無數(shù),每個(gè)人對(duì)此都有自己的見解與理由,還有些人主張“理性與感性需要平衡”“既要理性也要感性”,此類觀點(diǎn)看似正確,卻缺乏任何實(shí)質(zhì)性的指導(dǎo)價(jià)值。
實(shí)際上,很多人都沒注意到問題本身存在的多義性。究竟什么是“設(shè)計(jì)”?有些人認(rèn)為是設(shè)計(jì)決策的過程,而有的人則認(rèn)為是最終產(chǎn)出的設(shè)計(jì)作品。大多時(shí)候,理性和感性兩種觀點(diǎn)看似針鋒相對(duì),實(shí)際上是站在設(shè)計(jì)的不同層面進(jìn)行討論。
設(shè)計(jì)的兩面性:理性決策與感性表達(dá)
 
 
 
01|設(shè)計(jì)決策
從設(shè)計(jì)決策的角度來看,感性設(shè)計(jì)指的是設(shè)計(jì)師在設(shè)計(jì)過程中主要依靠個(gè)人情緒或情感進(jìn)行創(chuàng)作。許多人誤認(rèn)為,只要在設(shè)計(jì)時(shí)能與用戶產(chǎn)生共情,理解其情緒波動(dòng),并將這些喜怒哀樂、喜好厭惡融入設(shè)計(jì)作品,就算是感性設(shè)計(jì)了。然而,共情并不等同于感性。共情是一種能力,理解他人處境與情感,并善于換位思考。而感性則是自己對(duì)外界事物產(chǎn)生的直接感受和情緒反應(yīng),強(qiáng)調(diào)的是個(gè)人視角。
在藝術(shù)領(lǐng)域,感性占據(jù)主導(dǎo)地位,但設(shè)計(jì)并非藝術(shù)。設(shè)計(jì)的主要目標(biāo)是解決問題和滿足特定需求,而藝術(shù)更多地關(guān)注自我表達(dá)和情緒傳遞。設(shè)計(jì)始終受到客戶需求、商業(yè)目標(biāo)、市場(chǎng)趨勢(shì)和技術(shù)可行性等一系列的限制與約束。由于這些條件的存在,直覺與天賦這些感性力量只能得到極其有限的發(fā)揮。這也是設(shè)計(jì)與藝術(shù)的顯著區(qū)別。
設(shè)計(jì)的兩面性:理性決策與感性表達(dá)
 
 
站在感性“對(duì)立面”的理性,將設(shè)計(jì)視為一項(xiàng)工程或科學(xué),力求流程化和系統(tǒng)化,講究方法論,注重各方面的調(diào)研,一切動(dòng)作因問題存在而起,以問題解決而終
。甚至在實(shí)際場(chǎng)景中持續(xù)觀察作品表現(xiàn),以期得出可復(fù)用的設(shè)計(jì)模型或定律,為后人更加高效地解決類似問題提供幫助。
所以,從解決問題的本質(zhì)屬性出發(fā),理性應(yīng)該才是設(shè)計(jì)的底色。數(shù)據(jù)驅(qū)動(dòng)、方法論支撐、可用性測(cè)試、競(jìng)品分析、用戶研究等都屬于理性思維的具象化體現(xiàn)。
由于大部分設(shè)計(jì)師的出身多以藝術(shù)打底,所以一旦設(shè)計(jì)與藝術(shù)的界限在心中變得模糊,會(huì)習(xí)慣性地
將產(chǎn)品看作自己的"作品",而非用戶的"解決方案"
。如此一來,當(dāng)面對(duì)來自各個(gè)方向的邊界與不確定性,本能的反應(yīng)就不是思考了,而是抵觸,尤其是“完美”的方案已在腦中形成,如果突如其來的新要求打亂了這一切,哪怕假以用戶之名也要選擇懟回去,并不斷美化、合理化自己的設(shè)計(jì)理念。對(duì)設(shè)計(jì)師來說,這是一種自私、不負(fù)責(zé)任和缺乏職業(yè)素養(yǎng)的表現(xiàn)。
設(shè)計(jì)的兩面性:理性決策與感性表達(dá)
 
 
接下來,想象一下你的手中有一把槍,準(zhǔn)備射擊某個(gè)目標(biāo)。你的第一個(gè)動(dòng)作是什么?大概率是瞄準(zhǔn)。因?yàn)榇蠹叶贾?,射擊前通過瞄準(zhǔn)鏡或者準(zhǔn)星,先對(duì)目標(biāo)位置進(jìn)行瞄準(zhǔn)校正,射擊時(shí)才能提高命中率,這也正是理性對(duì)于設(shè)計(jì)的重要性所在。
理性在設(shè)計(jì)中的作用類似于瞄準(zhǔn)動(dòng)作,它幫助我們?cè)谠O(shè)計(jì)過程中做出科學(xué)的決策,確保設(shè)計(jì)方案的準(zhǔn)確性和可執(zhí)行性。未經(jīng)理性思考的設(shè)計(jì),就像是不瞄準(zhǔn)就立即開槍,其結(jié)果往往難以預(yù)測(cè)。當(dāng)然也可能會(huì)擊中目標(biāo),這基本上取決于兩個(gè)因素:
  1.  
    目標(biāo)遠(yuǎn)近:
    近處的目標(biāo),即使不瞄準(zhǔn),也很容易擊中;但對(duì)于遠(yuǎn)處的目標(biāo),命中率則必然大幅下降。我們可以把目標(biāo)遠(yuǎn)近理解為設(shè)計(jì)需求的難易程度,對(duì)于簡(jiǎn)單需求,不用過多的理性分析,直接設(shè)計(jì)也能完成任務(wù),但面對(duì)復(fù)雜的設(shè)計(jì)項(xiàng)目,如果不進(jìn)行充分的理性分析上手就畫,大概率就要偏離產(chǎn)品目標(biāo)了。
  2.  
    個(gè)人經(jīng)驗(yàn):
    經(jīng)過反復(fù)練習(xí),可以練就不瞄準(zhǔn)也能遠(yuǎn)射的本領(lǐng),隨著經(jīng)驗(yàn)積累還能不斷提升距離值;在經(jīng)驗(yàn)不足的情況下,還不瞄準(zhǔn),就只能選擇一些近距離的射擊目標(biāo)了。設(shè)計(jì)也是這樣,對(duì)于某類產(chǎn)品的設(shè)計(jì)經(jīng)驗(yàn)較多,不用太多理性的分析決策,也能達(dá)成設(shè)計(jì)目標(biāo);缺乏經(jīng)驗(yàn)時(shí),還憑借直覺草率地進(jìn)行設(shè)計(jì),再簡(jiǎn)單的項(xiàng)目也可能會(huì)搞砸。
設(shè)計(jì)的兩面性:理性決策與感性表達(dá)
 
 
所以,沒有理性支撐而完全依賴直覺經(jīng)驗(yàn)的設(shè)計(jì),一個(gè)致命性的問題就是
不穩(wěn)定
!日常工作中,設(shè)計(jì)師的有效輸出和穩(wěn)定輸出至關(guān)重要。
 
02|設(shè)計(jì)表達(dá)
假設(shè)經(jīng)過瞄準(zhǔn)后的射擊都能順利擊中目標(biāo),那么接下來要關(guān)注的是什么呢?子彈的沖擊力和殺傷力!這里的子彈就是我們最終輸出的設(shè)計(jì)作品。在這一環(huán)節(jié),理性設(shè)計(jì)指的是方案完全圍繞產(chǎn)品功能來呈現(xiàn),追求效率與極簡(jiǎn)認(rèn)知,較少運(yùn)用裝飾性設(shè)計(jì)元素,即使使用,也大多兼具輔助內(nèi)容理解的功能性目的。
而感性設(shè)計(jì),我并不太愿意使用“感性”這一措辭,正如在上一段中的定義,感性強(qiáng)調(diào)的是個(gè)人出發(fā)的情緒表達(dá)。其實(shí),“情感化設(shè)計(jì)”才更負(fù)荷大家口中常說的“感性設(shè)計(jì)”所想表達(dá)的含義,相比“理性”的設(shè)計(jì)作品,情感化設(shè)計(jì)更具有“一擊必殺”的效果。
在滿足基礎(chǔ)功能需求的基礎(chǔ)之上,通過色彩、排版、圖像、動(dòng)畫等元素給予用戶充分的情感體驗(yàn),也可以利用敘事、對(duì)話、情景、微交互等策略引發(fā)共鳴。豐富多樣的情感化設(shè)計(jì)策略,讓用戶與產(chǎn)品之間更容易建立情感連接。
設(shè)計(jì)的兩面性:理性決策與感性表達(dá)
 
 
在設(shè)計(jì)決策的階段,理性確保了我們更高的命中概率,而情感的注入讓我們的設(shè)計(jì)表達(dá)具有深入人心的穿透力和影響力。典型設(shè)計(jì)案例如Apple、Tesla等產(chǎn)品設(shè)計(jì)無一不是理性決策和感性表達(dá)的充分結(jié)合。因此,回到開篇提出的問題,設(shè)計(jì)應(yīng)該是感性的還是理性的?我的回答是:
作為設(shè)計(jì)師,要
堅(jiān)持理性的設(shè)計(jì)決策
,同時(shí)
追求感性的設(shè)計(jì)表達(dá)
設(shè)計(jì)的兩面性:理性決策與感性表達(dá)
 
 
 
03|兩者關(guān)系
很多人認(rèn)為,不同的設(shè)計(jì)領(lǐng)域?qū)硇院透行缘囊笥兴煌?,在B端產(chǎn)品中,理性占據(jù)主導(dǎo)地位,而C端產(chǎn)品更強(qiáng)調(diào)感性。從設(shè)計(jì)最終所呈現(xiàn)的效果來看,這種觀點(diǎn)在一定程度上是合理的。B端產(chǎn)品多用于生產(chǎn)場(chǎng)景,追求的是可用性,是克制和效率;C端產(chǎn)品面向普通大眾的各種生活場(chǎng)景,因此關(guān)注體驗(yàn)的愉悅感受。兩者往往在風(fēng)格調(diào)性上差異化很大。
但是,對(duì)于設(shè)計(jì)決策來說,無論C端、B端還是G端,都屬于設(shè)計(jì)項(xiàng)目,都要進(jìn)行理性的需求分析和策略制定,即使某些產(chǎn)品類型最終選擇了偏感性的或情感化的表達(dá)手法,也是
基于理性決策后的一種選擇
,是實(shí)現(xiàn)目標(biāo)的一種手段。
所以我想說的是,理性和感性兩者既不是對(duì)立關(guān)系,也不是并列關(guān)系,而是先后關(guān)系或嵌套關(guān)系:
理性是設(shè)計(jì)的基礎(chǔ)和第一步,感性則是在理性之上的選擇和展開
。
 
最后的話
作為設(shè)計(jì)師,對(duì)于設(shè)計(jì)中的理性與感性之問,不應(yīng)停留在非此即彼或既要也要的簡(jiǎn)單認(rèn)知里,任何深入的思考都是有意義的。在這個(gè)存在分歧的問題上,希望我的觀點(diǎn)可以為你提供一點(diǎn)點(diǎn)啟發(fā),也希望各位設(shè)計(jì)師既能夠通過理性的分析制定出有效的設(shè)計(jì)策略,又能夠通過感性的表達(dá)手法創(chuàng)造出動(dòng)人的設(shè)計(jì)作品,不斷提升自身的設(shè)計(jì)價(jià)值,與產(chǎn)品實(shí)現(xiàn)共贏


作者:設(shè)計(jì)來電
鏈接:https://www.zcool.com.cn/article/ZMTYyNjY2MA==.html
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

蘭亭妙微(cqzjtgb.com )是一家專注而深入的界面設(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。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan

動(dòng)效讓這些設(shè)計(jì)更驚艷

天宇 交互設(shè)計(jì)及用戶體驗(yàn)

微動(dòng)效在產(chǎn)品設(shè)計(jì)中的運(yùn)用已經(jīng)非常普及了,無論是在圖標(biāo)還是界面場(chǎng)景中,都運(yùn)用得很普遍。通過動(dòng)效的輔助不僅可以提升設(shè)計(jì)情感化,也能解決更為復(fù)雜的交互場(chǎng)景,讓設(shè)計(jì)更驚艷。
 
最近在體驗(yàn)一些產(chǎn)品的過程中,黑馬哥也發(fā)現(xiàn)了幾個(gè)借助動(dòng)效表達(dá)的設(shè)計(jì)方案,效果十分的驚艷,分享出來和大家一起學(xué)習(xí)一下。
動(dòng)效讓這些設(shè)計(jì)更驚艷
 
 
 
 
目錄
一、3D 動(dòng)效呈現(xiàn)會(huì)員等級(jí)
二、情感化 IP 提升搜索關(guān)注度
三、結(jié)合場(chǎng)景的情感化動(dòng)效
四、3D 空間感的 Banner 設(shè)計(jì)
五、通過動(dòng)效引導(dǎo)用戶操作
六、微動(dòng)效引導(dǎo) VIP 續(xù)費(fèi)
七、動(dòng)態(tài)還原實(shí)時(shí)天氣
八、動(dòng)態(tài) IP 引導(dǎo)按鈕設(shè)計(jì)
九、微動(dòng)效賦予品牌活力
 
 
 
一、3D 動(dòng)效呈現(xiàn)會(huì)員等級(jí)
會(huì)員中心通常會(huì)通過 3D 圖標(biāo)來助力會(huì)員等級(jí)設(shè)計(jì),除了靜態(tài)的表達(dá)也會(huì)通過動(dòng)效和新穎的交互形式呈現(xiàn),以此提高會(huì)員中心的視覺表現(xiàn)力。
 
最近在體驗(yàn)騰訊視頻 APP 時(shí),會(huì)員專區(qū)在表現(xiàn)用戶會(huì)員等級(jí)的設(shè)計(jì)中,沒有使用傳統(tǒng)的徽章形式,而是以 3D 數(shù)字結(jié)合動(dòng)效的形式表達(dá)。3D 動(dòng)效的設(shè)計(jì)使得會(huì)員等級(jí)區(qū)別于常規(guī)形式,更有吸引力。 
動(dòng)效讓這些設(shè)計(jì)更驚艷
 
 
 
 
二、情感化 IP 提升搜索關(guān)注度
IP 形象是成就品牌的關(guān)鍵因素之一,被廣泛運(yùn)用到產(chǎn)品感官體驗(yàn)的設(shè)計(jì)中,帶來的情感化共勉也是顯而易見的。
 
在使用悟空瀏覽器 APP 時(shí),啟動(dòng)產(chǎn)品進(jìn)入首頁(yè)后搜索框上方出現(xiàn)悟空的 IP 形象,悟空呈現(xiàn)出左右環(huán)顧、上下打量,最后看向搜索框的系列動(dòng)作等表現(xiàn)。不僅提高了搜索功能的關(guān)注度,也使得產(chǎn)品設(shè)計(jì)更具情感化。
動(dòng)效讓這些設(shè)計(jì)更驚艷
 
 
 
 
三、結(jié)合場(chǎng)景的情感化動(dòng)效
根據(jù)不同的業(yè)務(wù)場(chǎng)景進(jìn)行設(shè)計(jì)表達(dá),可以更好的服務(wù)目標(biāo)用戶,而情感化的設(shè)計(jì)提升,可以拉近產(chǎn)品與用戶之間的親和力。
 
為了降低用戶等餐過程中出現(xiàn)的負(fù)面情緒,餓了么 APP 下單之后在詳情頁(yè)中根據(jù)點(diǎn)餐的不同設(shè)計(jì)了情感化的動(dòng)效表達(dá)。無論是快餐還是冷飲等,都針對(duì)性地設(shè)計(jì)了微動(dòng)效的元素,以此來表現(xiàn)當(dāng)前狀態(tài)。
動(dòng)效讓這些設(shè)計(jì)更驚艷
 
 
動(dòng)效讓這些設(shè)計(jì)更驚艷
 
 
 
 
四、3D 空間感的 Banner 設(shè)計(jì)
通過突出設(shè)計(jì)、交互、布局結(jié)構(gòu)等的創(chuàng)意性,可以使得 Banner 具備更強(qiáng)的差異化,以此來突出 Banner 的存在感。
 
騰訊視頻 APP 首頁(yè)的 Banner 布局也會(huì)經(jīng)常呈現(xiàn)出一些很有創(chuàng)意的方案,比如之前體驗(yàn)到一個(gè)結(jié)合 3D 空間感營(yíng)造的設(shè)計(jì)案例,就非常有吸引力。通過動(dòng)態(tài)過度到立體空間,再恢復(fù)到默認(rèn)形式,這個(gè)動(dòng)態(tài)的過程演變就能讓用戶過目不忘。
動(dòng)效讓這些設(shè)計(jì)更驚艷
 
 
 
 
五、通過動(dòng)效引導(dǎo)用戶操作
針對(duì)一些使用頻次不高或者過于隱藏的功能,為了提高用戶的操作概率,會(huì)通過一些特殊的設(shè)計(jì)表達(dá)來提升用戶的關(guān)注度,引導(dǎo)用戶進(jìn)行相關(guān)操作。
 
比如麥當(dāng)勞 APP 首頁(yè)中,為了吸引用戶下拉進(jìn)入二層樓,通過動(dòng)效的形式設(shè)計(jì)了一個(gè)搖擺的鈴鐺,以此來吸引用戶的注意力。用戶看到像是隨風(fēng)飄動(dòng)的鈴鐺,就會(huì)忍不住去拉動(dòng),這就達(dá)到了引導(dǎo)用戶操作的目的,提高了二層樓內(nèi)容的曝光度。
動(dòng)效讓這些設(shè)計(jì)更驚艷
 
 
 
 
六、微動(dòng)效引導(dǎo) VIP 續(xù)費(fèi)
針對(duì)一些無法通過占比面積進(jìn)行突出的元素,運(yùn)用微動(dòng)效的形式設(shè)計(jì)是常見的設(shè)計(jì)手法。
 
網(wǎng)易云音樂 APP “我的”板塊中,為了突出 VIP 續(xù)費(fèi)按鈕,黑膠唱片以動(dòng)效的形式在按鈕中來回滾動(dòng),以此強(qiáng)化續(xù)費(fèi)按鈕的關(guān)注度。
動(dòng)效讓這些設(shè)計(jì)更驚艷
 
 
 
 
七、動(dòng)態(tài)還原實(shí)時(shí)天氣
天氣類產(chǎn)品從簡(jiǎn)單的靜態(tài)預(yù)告升級(jí)為動(dòng)態(tài)實(shí)時(shí)還原,可以讓用戶更加直觀的判斷天氣變化,也能提高界面設(shè)計(jì)的感官體驗(yàn)。
 
比如 iPhone 自帶的天氣 APP,以動(dòng)態(tài)還原實(shí)時(shí)天氣作為界面背景,不僅便于用戶識(shí)別天氣,也使得產(chǎn)品設(shè)計(jì)更具情感化體驗(yàn)。
動(dòng)效讓這些設(shè)計(jì)更驚艷
 
 
 
 
八、動(dòng)態(tài) IP 引導(dǎo)按鈕設(shè)計(jì)
按鈕設(shè)計(jì)樣式可以發(fā)揮的空間很大,除了在造型、配色、空間感等方面突出設(shè)計(jì)以外,也能通過按鈕微動(dòng)效或者動(dòng)態(tài)引導(dǎo)等形式強(qiáng)化。
 
比如智行火車票 APP “搶票”板塊中,為了突出“添加搶票”按鈕的存在感,以動(dòng)效 IP 引導(dǎo)進(jìn)行設(shè)計(jì)。不僅使得按鈕更突出,設(shè)計(jì)感也顯得俏皮可愛,凸顯親和力。
動(dòng)效讓這些設(shè)計(jì)更驚艷
 
 
 
 
九、微動(dòng)效賦予品牌活力
立足于品牌做設(shè)計(jì)是突出產(chǎn)品差異化的關(guān)鍵,這也是產(chǎn)品設(shè)計(jì)未來的演變趨勢(shì)之一,如何提高品牌的曝光度和記憶度,成為設(shè)計(jì)師不斷探索的方向。
 
最近在使用夸克 APP 時(shí),微動(dòng)效賦予品牌 LOGO 的活力感讓人印象深刻。在眾多特殊節(jié)慶等時(shí)間段,夸克也會(huì)以動(dòng)效的形式賦予品牌更多變化,不僅使得產(chǎn)品更具年輕化屬性,也能更好的傳遞品牌基因。
動(dòng)效讓這些設(shè)計(jì)更驚艷
 
 
動(dòng)效讓這些設(shè)計(jì)更驚艷
 
 
 
 
小結(jié)
動(dòng)效使得產(chǎn)品具備更多的變化,也能輔助解決更多復(fù)雜功能的交互場(chǎng)景,探索動(dòng)效的場(chǎng)景運(yùn)用可以提升設(shè)計(jì)靈感,希望本期的分享可以帶給大家更多設(shè)計(jì)靈感。本文描述屬于個(gè)人體驗(yàn)總結(jié),不足之處我們努力改進(jìn)。
 
本文由 @黑馬青年 原創(chuàng)發(fā)布。未經(jīng)許可,禁止轉(zhuǎn)載。


作者:黑馬青年
鏈接:https://www.zcool.com.cn/article/ZMTYzOTIyOA==.html
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

蘭亭妙微(cqzjtgb.com )是一家專注而深入的界面設(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。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan

 

7大色彩技巧讓你界面更吸睛

天宇 B端ui設(shè)計(jì)文章及欣賞

色彩在我們?nèi)粘TO(shè)計(jì)中起著定生死的作用,它是設(shè)計(jì)的靈魂,舒適的色彩搭配可以讓設(shè)計(jì)師一遍定稿,感覺在自己的設(shè)計(jì)生涯中,大部分都是在與色彩的博弈中度過的,雖然客戶可能不懂色彩原理,可是客戶天生都是色彩的感受家,什么樣的色彩搭配美,通常他們瞄一眼就會(huì)有定論,不用你去辯解太多,不好的搭配,縱使有千萬種理由,也說服不了客戶,所以好好研究色彩以及每一種色彩傳遞的情感對(duì)我們做好設(shè)計(jì)至關(guān)重要。
 
7大色彩技巧讓你界面更吸睛
 
 
 
目錄
一、 色彩的定義
二、 色彩的三屬性
三、 色彩的三種常見模型
四、 色彩的語意及它的應(yīng)用
五、 不同場(chǎng)景下的色彩應(yīng)用
六、 色彩在B端設(shè)計(jì)中的作用
七、 B端色彩設(shè)計(jì)使用的原則
 
7大色彩技巧讓你界面更吸睛
 
 
 
 
 
一、色彩的定義?
1、物理學(xué)角度
色彩是光的屬性,當(dāng)光波通過物體時(shí),物體會(huì)吸收某些波長(zhǎng)的光,而反射或透射其他波長(zhǎng)的光,這些被反射或透射的光波長(zhǎng)度決定了我們看到的顏色。
 
2、心理學(xué)角度
色彩是人腦對(duì)光波長(zhǎng)的視覺感知,不同的波長(zhǎng)刺激視網(wǎng)膜上不同類型的感光細(xì)胞,進(jìn)而產(chǎn)生不同的色彩感覺。
 
3、 藝術(shù)學(xué)角度
色彩是藝術(shù)創(chuàng)作的重要元素,它不僅關(guān)乎視覺感受,還與情感、文化、象征意義相關(guān)聯(lián)。
 
4、 設(shè)計(jì)學(xué)角度
在設(shè)計(jì)領(lǐng)域,色彩是傳達(dá)信息、影響情緒和創(chuàng)造美感的關(guān)鍵工具。
 
5、 計(jì)算機(jī)科學(xué)角度
在數(shù)字圖像處理中,色彩通常通過顏色模型(如RGB、CMYK等)來定義,這些模型通過不同比例的原色或色料混合來表示各種顏色。
 
 
 
二、色彩的三屬性
1、色相
色相是指不同顏色之間的差別,即不同顏色的表象和名稱,每個(gè)顏色都有自己的專屬ID,如紅、橙、黃、綠、青、藍(lán)、紫等。不同的色別都可用光譜中的波長(zhǎng)來表示,人的眼睛可分辨出的色別有180種左右。
7大色彩技巧讓你界面更吸睛
 
 
 
2、明度
明度是指色彩的明暗程度。一般在反光率相同的情況下,不同色別的明暗程度不同。如黃色光比紅色光更明亮,而紅色光則比青色光要明亮。
同時(shí),同一色相在受光強(qiáng)弱或者物體對(duì)光的吸收、反射性能不同的情況下,會(huì)呈現(xiàn)不同的明暗變化和差異。
7大色彩技巧讓你界面更吸睛
 
 
  
 
3、飽和度(純度)
飽和度(純度)是指同一色別的純凈度和鮮明度的變化。從色光的角度而言,光的波長(zhǎng)單一程度越高,飽和度就會(huì)越高;不同色別所達(dá)到的飽和度不同,一般情況下,紅色的純度可達(dá)到最高,綠色的則相對(duì)較低;同一色相深淺不同的顏色有不同的飽和度;黑白色光的滲入會(huì)導(dǎo)致飽和度和明度發(fā)生變化;通常,照明光線的性質(zhì)、物體表面結(jié)構(gòu)對(duì)光線吸收與反射的性能等因素影響飽和度。
7大色彩技巧讓你界面更吸睛
 
 
 
 
 
三、色彩的三種常見模型
1、HSB模型
HSB模型也叫HSV模型,其中H代表色相,即顏色的種類;S代表飽和度,即顏色的純度;B(V)代表亮度,即顏色的明亮程度。
 
這種色彩模型是我日常在的設(shè)計(jì)工作中用的最多的一種色彩模型,如果在同色系中如果只想讓他們有細(xì)微的變化,我通常會(huì)通過調(diào)節(jié)S和B的百分比數(shù)值來達(dá)到自己想要的目的。
7大色彩技巧讓你界面更吸睛
 
 
以上就是我在設(shè)計(jì)項(xiàng)目中,運(yùn)用該色彩模型做的一個(gè)實(shí)戰(zhàn),項(xiàng)目中用到了一個(gè)圖形,需要用同色系來表達(dá),我保持了H色值的不變,讓S值和B值都發(fā)生著微妙的不同,于是就產(chǎn)生了四五種同色系的綠色,該色彩模型特別的好使,也鼓勵(lì)大家多在實(shí)戰(zhàn)中運(yùn)用這樣的色彩模型,簡(jiǎn)單實(shí)用。
 
H色相:Hue,以角度(0°-360°)表示
S飽和度:Saturation,以百分比值(0%-100%)表示
B/V 亮度:Brightness 或 Value,以百分比值(0%-100%)表示
 
 
 
 
2、RGB模型
RGB是從顏色發(fā)光的原理來設(shè)計(jì)定的,通俗點(diǎn)說它的顏色混合方式就好像有紅、綠、藍(lán)三盞燈,當(dāng)它們的光相互疊合的時(shí)候,色彩相混,而亮度卻等于三者亮度之總和,越混合亮度越高,即加法混合。
 
紅、綠、藍(lán)三個(gè)顏色通道每種色各分為256階亮度,在0時(shí)“燈”最弱——是關(guān)掉的,而在255時(shí)“燈”最亮。當(dāng)三色灰度數(shù)值相同時(shí),產(chǎn)生不同灰度值的灰色調(diào),即三色灰度都為0時(shí),是最暗的黑色調(diào);三色灰度都為255時(shí),是最亮的白色調(diào)。
7大色彩技巧讓你界面更吸睛
 
 
R紅:Red,以數(shù)值(0-255)表示
G綠:Green,以數(shù)值(0-255)表示
B藍(lán):Blue,以數(shù)值(0-255)表示
7大色彩技巧讓你界面更吸睛
 
 
 
 
3、CMYK模型
雖然RGB模型色彩更加的豐富,但是很多顏色不能完全打印出來,于是CMYK模型就成了打印、印刷的不二選擇。C是青、M是品紅、Y是黃、K是黑,通過顏料反射和吸收光線來顯色。
 
記得之前自己從事平面工作的時(shí)候,就經(jīng)常要用到CMYK模式,因?yàn)橛〕鰜淼男Ч钍亲钚〉?,是最靠近設(shè)計(jì)效果圖的。
7大色彩技巧讓你界面更吸睛
 
 
通過對(duì)比,我們發(fā)現(xiàn)RGB色彩模型顏色顯示上確實(shí)更加的絢麗豐富些,而CMYK的色彩模型顏色顯示上就黯淡了不少,但是要印刷的話,就必須轉(zhuǎn)化為成CMYK的色彩模式。
 
R青:Cyan,以百分比值(0%-100%)表示
M品紅:Magenta,以百分比值(0%-100%)表示
Y黃:Yellow,以百分比值(0%-100%)表示
B黑:Black,以百分比值(0%-100%)表示
 
 
 
 
四、色彩的語意及應(yīng)用
1、紅色的語意及應(yīng)用
紅色代表熱情、活力、強(qiáng)烈的情感和愛。它可以象征著激情、勇氣和行動(dòng)力,也常與興奮、熱烈的情緒相關(guān)。
著名的快餐品牌肯德基,在自己的網(wǎng)頁(yè)及店鋪裝修中都運(yùn)用了紅色,因?yàn)榧t色是所有顏色中最容易引起人們注意的顏色,也是很容易刺激人們食欲和購(gòu)買的顏色。
7大色彩技巧讓你界面更吸睛
 
 
 
 
2、橙色的語意及應(yīng)用
橙色傳達(dá)溫暖、歡快和積極向上的情感;它常與樂觀、友好、創(chuàng)造力聯(lián)系在一起,給人以活力充沛和充滿希望的感覺。
百度網(wǎng)盤的這個(gè)登錄界面就運(yùn)用了橙色,給人陽光、向上、熱情的感覺,通過色彩的運(yùn)用一下讓界面有了溫度。
7大色彩技巧讓你界面更吸睛
 
 
 
 
3、黃色的語意及應(yīng)用
黃色象征快樂、開朗和樂觀;它能帶來明亮、愉悅的情緒,代表著陽光、溫暖和智慧。
叫叫閱讀是一款非常著名的兒童閱讀軟件,整個(gè)色調(diào)采用的是非常有活力的黃色,這與兒童處于好奇與活力的階段相符合,這種高亮的黃色,飽和度和明度都非常的高,特別容易抓住兒童的目光,同時(shí)它是一種快樂的顏色,也是一種能激發(fā)孩子創(chuàng)造力和想象力的顏色,特別符合兒童成長(zhǎng)的需求。
7大色彩技巧讓你界面更吸睛
 
 
 
 
4、綠色的語意及應(yīng)用
綠色代表平靜、和諧與生機(jī)。綠色常與大自然相關(guān),給人帶來安寧、放松的感覺,也象征著成長(zhǎng)、希望和新生。
青椒云的目標(biāo)用戶是吸引年輕用戶和創(chuàng)意工作者,綠色這種富有活力和創(chuàng)意的顏色更容易吸引他們的關(guān)注,同時(shí)綠色也代表著健康、可持續(xù)發(fā)展的企業(yè)形象。
7大色彩技巧讓你界面更吸睛
 
 
 
 
5、青色的語意及應(yīng)用
青色寓意清新、寧?kù)o和沉穩(wěn),它給人一種冷靜、理智的印象,同時(shí)也帶有一絲清新的活力。
青色是一種帶有藍(lán)色和綠色的顏色,因此青色既有藍(lán)色的專業(yè)感、信任感,也有綠色的生機(jī)感、希望感。
以下是日本某牙醫(yī)品牌的官網(wǎng)首頁(yè),病人希望在這里帶來健康與復(fù)蘇,也希望獲得專業(yè)、可靠的治療,而青色就成了很好傳遞這種情感的品牌色。 
7大色彩技巧讓你界面更吸睛
 
 
 
 
6、藍(lán)色的語意及應(yīng)用
藍(lán)色代表冷靜、忠誠(chéng)和信任;它常與沉穩(wěn)、深邃的情感相關(guān),能帶來寧?kù)o、平和的心境,也象征著智慧和理性。
123云盤使用了藍(lán)色,藍(lán)色符合社會(huì)的普遍審美認(rèn)知,接受度比較高;其次,藍(lán)色給人安全的感覺,也符合云盤的初衷,給用戶安全的存儲(chǔ)服務(wù)。
7大色彩技巧讓你界面更吸睛
 
 
 
 
7、紫色的語意及應(yīng)用
紫色象征神秘、高貴和浪漫;它常給人一種優(yōu)雅、奢華的感覺,同時(shí)也帶有神秘莫測(cè)的氛圍,與夢(mèng)幻、創(chuàng)造力等情感相關(guān)。
美柚的主要用戶是女性,紫色在色彩心理學(xué)中常被認(rèn)為具有優(yōu)雅、神秘、浪漫的特質(zhì),這些特質(zhì)與女性的審美和情感需求相契合,能夠吸引女性的關(guān)注。
7大色彩技巧讓你界面更吸睛
 
 
 
 
8、白色的語意及應(yīng)用
 
白色代表著純潔、神圣、信任、安靜、樸素和雅致,是一種充滿純潔的顏色,它可以跟任何顏色和諧的共生。
以下是熊掌ID的登錄界面,顏色用了大量的白與灰,簡(jiǎn)潔又不失大氣,傳遞出了一種質(zhì)樸、雅致的感覺。 
7大色彩技巧讓你界面更吸睛
 
 
 
 
 
五、不同場(chǎng)景下的色彩應(yīng)用
 
1、商場(chǎng)的色彩為什么總是多彩熱烈的?
 
? 吸引顧客注意力
在眾多商業(yè)場(chǎng)所中脫穎而出,色彩鮮艷的商場(chǎng)外觀和內(nèi)部裝飾更容易在人們的視線中凸顯出來,吸引過往行人的目光,激發(fā)他們的好奇心和探索欲。
 
確實(shí)多彩的顏色更加容易引起我的關(guān)注,這不看到商場(chǎng)的美圖,都忍不住拍照留念了,成功的吸引了我的目光。
7大色彩技巧讓你界面更吸睛
 
 
 
? 增強(qiáng)可見性
即使在較遠(yuǎn)的距離或在繁忙的街道上,多彩熱烈的配色也能讓商場(chǎng)更容易被發(fā)現(xiàn),提高商場(chǎng)的知名度和曝光度。
多彩的配色,讓我遠(yuǎn)遠(yuǎn)的就被商場(chǎng)美輪美奐的插畫吸引,大大增加了商場(chǎng)的可見性。
7大色彩技巧讓你界面更吸睛
 
 
 
?
營(yíng)造愉悅氛圍
色彩可以激發(fā)積極情緒,明亮、鮮艷的色彩往往與快樂、活力和興奮等積極情緒相關(guān)聯(lián)。當(dāng)顧客進(jìn)入一個(gè)色彩豐富的商場(chǎng)時(shí),會(huì)感受到一種愉悅和輕松的氛圍,從而更愿意在商場(chǎng)中停留和購(gòu)物。
星沙永旺城的美陳設(shè)計(jì)很好,墻面采用極具誘惑力的顏色與美食,把小小實(shí)物十倍放大,增加了視覺看點(diǎn),讓人忍不住過去拍照曬一下,大大增加了愉悅性。
7大色彩技巧讓你界面更吸睛
 
 
 
?
緩解壓力
在現(xiàn)代生活中,人們常常面臨各種壓力。走進(jìn)一個(gè)多彩熱烈的商場(chǎng),可以暫時(shí)擺脫日常的煩惱和壓力,享受購(gòu)物的樂趣。
特別可愛夸張的插圖設(shè)計(jì),引發(fā)了絲絲童趣和歡樂,讓人短暫忘記壓力,遠(yuǎn)離煩惱。
7大色彩技巧讓你界面更吸睛
 
 
 
?
引導(dǎo)消費(fèi)行為
商場(chǎng)通常會(huì)使用不同的顏色來區(qū)分不同的區(qū)域,如購(gòu)物區(qū)、餐飲區(qū)、娛樂區(qū)等。這樣可以幫助顧客更快速地找到自己感興趣的區(qū)域,提高購(gòu)物效率。
突出重點(diǎn)商品,對(duì)于一些重點(diǎn)推薦的商品或促銷活動(dòng),商場(chǎng)可以使用鮮艷的色彩來突出展示,吸引顧客的注意力,引導(dǎo)他們進(jìn)行購(gòu)買。
7大色彩技巧讓你界面更吸睛
 
 
 
?
塑造品牌形象
6.1 傳達(dá)個(gè)性和風(fēng)格
不同的商場(chǎng)可能有不同的品牌定位和目標(biāo)客戶群體。通過選擇特定的色彩組合,商場(chǎng)可以傳達(dá)出自己的個(gè)性和風(fēng)格,吸引與之相符的顧客。
 
6.2 增強(qiáng)品牌記憶度
獨(dú)特而鮮明的色彩搭配可以讓商場(chǎng)在顧客的心中留下深刻的印象,提高品牌的記憶度和辨識(shí)度。
 
芙蓉區(qū)的龍湖天街主要面向中等收入新興家庭,是一個(gè)區(qū)域型的購(gòu)物中心,集購(gòu)物、餐飲、休閑、娛樂等多業(yè)態(tài)于一體,為消費(fèi)者提供一站式商業(yè)綜合體,它在餐飲區(qū)采用了大量的吃喝玩樂的插畫,來引導(dǎo)用戶消費(fèi)。
7大色彩技巧讓你界面更吸睛
 
 
 
 
2、為什么藍(lán)色在B端設(shè)計(jì)中廣泛應(yīng)用?
? 視覺特性方面
1.1 穩(wěn)定性
藍(lán)色給人一種沉穩(wěn)、可靠的感覺。在B端產(chǎn)品中,用戶往往需要處理重要的業(yè)務(wù)數(shù)據(jù)和進(jìn)行復(fù)雜的操作,藍(lán)色的穩(wěn)定性可以讓用戶感到安心,增強(qiáng)對(duì)產(chǎn)品的信任感。
7大色彩技巧讓你界面更吸睛
 
 
 
1.2 專業(yè)性
藍(lán)色通常與科技、專業(yè)領(lǐng)域相關(guān)聯(lián)。B端產(chǎn)品通常面向企業(yè)用戶,需要傳達(dá)出專業(yè)、高效的形象,藍(lán)色正好符合這一需求。
 
? 心理影響方面
2.1 減少焦慮
相比鮮艷、刺激的顏色,藍(lán)色較為柔和,不容易引起用戶焦慮和緊張的情緒;在B端使用場(chǎng)景中,用戶可能需要長(zhǎng)時(shí)間使用產(chǎn)品,藍(lán)色的舒緩效果有助于提高用戶的使用體驗(yàn)。
 
2.2 提高專注度
藍(lán)色具有一定的沉靜作用,能夠幫助用戶集中注意力,專注于工作任務(wù)。對(duì)于B端用戶來說,高效完成工作是首要目標(biāo),藍(lán)色的這一特性有助于提高工作效率。
 
B端產(chǎn)品在心理上追求的是類似如下圖的這種寧?kù)o式的體驗(yàn),跟教育有著異曲同工之處,就像這個(gè)易貝樂少兒英語一樣,用大面積的藍(lán)色,希望孩子在這里能很快的安靜下來學(xué)習(xí)、專注自己的事情。
7大色彩技巧讓你界面更吸睛
 
 
 
? 行業(yè)習(xí)慣方面
3.1 科技行業(yè)引領(lǐng)
許多知名的科技企業(yè)和軟件產(chǎn)品在 B 端市場(chǎng)中廣泛使用藍(lán)色,逐漸形成了一種行業(yè)習(xí)慣。其他企業(yè)在設(shè)計(jì)B端產(chǎn)品時(shí),也會(huì)傾向于選擇藍(lán)色以符合用戶的認(rèn)知和期望。
 
3.2 傳統(tǒng)與延續(xù)
在過去的設(shè)計(jì)中,藍(lán)色在 B 端領(lǐng)域的成功應(yīng)用使得它成為了一種傳統(tǒng)選擇。設(shè)計(jì)師們?cè)谘永m(xù)這一傳統(tǒng)的同時(shí),也不斷優(yōu)化和創(chuàng)新藍(lán)色的運(yùn)用方式,使其更符合現(xiàn)代設(shè)計(jì)趨勢(shì)和用戶需求。
 
嘉為科技是一個(gè)有著20多年技術(shù)沉淀的科技公司,它的官網(wǎng)和產(chǎn)品風(fēng)格一直是沿用著科技藍(lán)的風(fēng)格,應(yīng)該也是基于傳統(tǒng)的沉淀吧。
7大色彩技巧讓你界面更吸睛
 
 
 
?藍(lán)色可以提高產(chǎn)品的復(fù)用率
很多用戶都能接受藍(lán)色的B端界面,當(dāng)面對(duì)有差不多需求客戶時(shí),同一套UI,可以多次復(fù)用,可以減少開發(fā)成本和設(shè)計(jì)成本,這也是自己通過長(zhǎng)期實(shí)戰(zhàn)觀察發(fā)現(xiàn)的。
 
一個(gè)UI風(fēng)格,用在了兩個(gè)項(xiàng)目中,不同的用戶,趨向同樣的風(fēng)格,說明藍(lán)色在大家心目中的接受度是非常的高,用藍(lán)色可以促進(jìn)設(shè)計(jì)的多次復(fù)用。
7大色彩技巧讓你界面更吸睛
 
 
在日常的項(xiàng)目中,我看到的B端UI界面是千篇一律的穩(wěn)重,不追求過于刺激的顏色搭配,通常都比較的干凈簡(jiǎn)潔,不像商場(chǎng)里面的美陳背景設(shè)計(jì),色彩對(duì)比非常的強(qiáng)烈,比較的吸引人眼球。
 
有一次我厭煩了常規(guī)的穩(wěn)重風(fēng),探索一種大膽的色彩風(fēng)格時(shí),雖然風(fēng)格比較新穎,可是發(fā)出去客戶的接受度不高,覺得太不穩(wěn)重了,然后重新按照以往習(xí)慣進(jìn)行設(shè)計(jì)時(shí),就很好,客戶一致認(rèn)同。
 
可見每個(gè)領(lǐng)域都有自己的色彩運(yùn)用習(xí)慣,商場(chǎng)需要吸引人眼球、刺激消費(fèi),越大膽越好,可是B端設(shè)計(jì)需要提供一個(gè)讓人平靜去處理工作事項(xiàng)的環(huán)境,它需要安靜,不需要過于刺激的顏色搭配。
7大色彩技巧讓你界面更吸睛
 
 
 
 
 
六、色彩在B端設(shè)計(jì)中的作用?
1、通過色彩向用戶反饋操作結(jié)果及當(dāng)前狀況
比方在日常設(shè)計(jì)當(dāng)中,紅色代表流程失敗,綠色代表流程成功,橙色代表信息有告警,藍(lán)色代表著鏈接,同時(shí)不同的按鈕顏色也可以很好的區(qū)分按鈕狀態(tài),在反饋結(jié)果和狀況方面,色彩起著非常重要的作用。
 
下面這個(gè)IDC運(yùn)營(yíng)的監(jiān)測(cè)平臺(tái),它就是通過顏色來區(qū)分不同的告警級(jí)別的,可見顏色在B端產(chǎn)品中的重要性。(備注:圖中數(shù)據(jù)都不是真實(shí)數(shù)據(jù),僅做展示)
7大色彩技巧讓你界面更吸睛
 
 
 
 
2、可以很好的進(jìn)行品牌傳達(dá)
B端設(shè)計(jì)中大面積使用品牌色,可以強(qiáng)化品牌形象,使用與品牌標(biāo)志風(fēng)格相近的色彩,可以幫助用戶快速識(shí)別和記住品牌,在不同的B端產(chǎn)品界面中使用統(tǒng)一的色彩方案,有助于建立品牌的連貫性和一致性,增強(qiáng)用戶對(duì)品牌的信任。
 
例如我給湖南高速設(shè)計(jì)的一套B端界面設(shè)計(jì),用戶強(qiáng)烈要求改變傳統(tǒng)的藍(lán)色風(fēng)格,要求整套界面設(shè)計(jì)要用湖南高速品牌色-綠色,說明在追求大流和品牌色之間,客戶更加傾向品牌的傳達(dá)。(備注:圖中數(shù)據(jù)都不是真實(shí)數(shù)據(jù),僅做展示)
7大色彩技巧讓你界面更吸睛
 
 
 
 
3、顏色可以很好的進(jìn)行信息區(qū)分
在B端界面設(shè)計(jì)中,顏色在幫助信息區(qū)分起著非常重要的作用,通??梢酝ㄟ^不同的色彩來區(qū)分功能區(qū)域,可以讓用戶更清晰地了解界面的結(jié)構(gòu)和布局,例如,導(dǎo)航欄使用一種特定的顏色,而內(nèi)容區(qū)域則使用另一種顏色。
 
我設(shè)計(jì)的天翼寫作,就是這樣的設(shè)計(jì)思路,導(dǎo)航欄和內(nèi)容區(qū)的顏色完全不一樣,這里顏色起到了很好的區(qū)分作用。
7大色彩技巧讓你界面更吸睛
 
 
 
 
4、舒適的色彩搭配可以提升用戶體驗(yàn)
選擇合適的色彩對(duì)比度可以增強(qiáng)文本的可讀性,減少用戶的視覺疲勞。例如,黑色文字在白色背景上通常比較容易閱讀。
 
選擇適當(dāng)?shù)纳士梢誀I(yíng)造出專業(yè)、高效、舒適的工作氛圍,從而影響用戶的情緒和感受,提高用戶的使用體驗(yàn)。
 
我參與的這個(gè)后臺(tái)界面,就是通過合理的色彩搭配來引導(dǎo)用戶使用的,當(dāng)用戶已經(jīng)完成的環(huán)節(jié)都是用綠色表示,沒有走完的流程就會(huì)是灰色的,寓意指示非常的鮮明,很好的解決了用戶不知道清晰進(jìn)程的卡點(diǎn),提升了用戶體驗(yàn)。
7大色彩技巧讓你界面更吸睛
 
 
 
 
5、色彩可以傳遞性格
人的性格有活潑的、文靜的、沉穩(wěn)的、深邃的,其實(shí)色彩也是有性格的,不同的色彩也有不同的性格,當(dāng)我們對(duì)色彩的性格有足夠多的了解,在面對(duì)不同的客戶時(shí),我們對(duì)色彩的拿捏以及設(shè)計(jì)需求的把握時(shí),會(huì)更加的游刃有余。
7大色彩技巧讓你界面更吸睛
 
 
 
我們平常確實(shí)是在做設(shè)計(jì),但是我們更多的是在與人打交道,我們更好的聆聽,會(huì)幫助我們更快的抓取到客戶的喜好,快速做出滿足客戶需求的設(shè)計(jì),少受加班之苦。
比方說我之前給云門戶設(shè)計(jì)的一套UI,客戶的決策層是男性,且年齡偏大,他們就偏愛深沉的UI風(fēng)格;而我負(fù)責(zé)的天翼云電腦專家,客戶的決策層是女性,且年齡偏年輕,她每次就喜歡輕盈、明快的UI色調(diào),不同的決策層客戶,就會(huì)帶來不同的設(shè)計(jì)結(jié)果。
 
7大色彩技巧讓你界面更吸睛
 
 
 
 
 
七、B端色彩設(shè)計(jì)使用的原則
1、B端設(shè)計(jì)中,色彩設(shè)計(jì)應(yīng)遵循6:3:1原則
在這個(gè)登錄頁(yè)面中,我就是運(yùn)用的6:3:1原則,60%的主色,30%的次要色,10%的點(diǎn)綴色;使用了大面積的藍(lán)色和藍(lán)灰色,最后使用一點(diǎn)點(diǎn)的橙色,這樣的配色會(huì)顯得高級(jí)。
7大色彩技巧讓你界面更吸睛
 
 
 
 
2、文字、卡片背景色和邊框都使用無彩色
為了保證畫面風(fēng)格的統(tǒng)一、干凈整潔,文字顏色、邊框顏色、以及邊框背景色都需要用到無彩色,通常通過顏色的深淺來區(qū)分信息的層級(jí)關(guān)系。
 
比方說我參與的星辰大模型AI文檔生成能力的應(yīng)用,里面無論文字顏色還是底色都是運(yùn)用的無彩色,只是通過了色彩深淺變化來做了層級(jí)區(qū)分,因?yàn)闊o彩色可以起到很好的降噪作用,既傳達(dá)了信息,又不會(huì)顯得界面凌亂復(fù)雜。
7大色彩技巧讓你界面更吸睛
 
 
 
 
3、需要凸顯的內(nèi)容,用明度和純度比較高的色彩
比方說,日常我們?cè)O(shè)計(jì)的卡片都是用的白色,而底色我們用的是灰色,因?yàn)榭ㄆ锩娴膬?nèi)容都是比較重要的信息,需要用一個(gè)亮度比較的高的顏色,讓內(nèi)容往前走,而灰色的背景通常就往后走的感覺,這樣能跟卡片形成一個(gè)一前一后的對(duì)比,更好的幫助內(nèi)容進(jìn)行傳播。
 
比方說我設(shè)計(jì)的這個(gè)IT運(yùn)維監(jiān)控平臺(tái)的首頁(yè),物理主機(jī)、網(wǎng)絡(luò)及安全設(shè)備、工單、在途工單這幾個(gè)指標(biāo)是非常關(guān)鍵的,所以他們的圖片底色用了純度比較高的有彩色來標(biāo)識(shí)。
 
7大色彩技巧讓你界面更吸睛
 
 
 
 
4、設(shè)計(jì)前一定要有定色調(diào)的意識(shí)
作為設(shè)計(jì)師,我們的設(shè)計(jì)工作其實(shí)就是在設(shè)計(jì)一種感覺,一種情緒,設(shè)計(jì)前定調(diào)的意識(shí)真的太重要了,感覺對(duì)了,什么都就對(duì)了。
 
比方說我前段時(shí)間接到了一個(gè)B端的大屏可視化需求設(shè)計(jì),客戶說之前的大屏設(shè)計(jì)不喜歡,希望重新出一個(gè)新的設(shè)計(jì),然后公司的需求對(duì)接人員在給我下達(dá)需求時(shí),真的就只是給我下達(dá)了這幾個(gè)字,讓我重新出一個(gè)設(shè)計(jì)試試。
 
以我的職業(yè)直覺,感覺這個(gè)需求是不夠細(xì)化的,于是我就多問了幾句,我問客戶是想要常規(guī)的藍(lán)色調(diào)的還是別的?果然一問,客戶說不希望再用常規(guī)的藍(lán)色的,希望新的設(shè)計(jì)要用他們的品牌色綠色,剛聽到這幾個(gè)字的時(shí)候,我以為這次我把握住需求了,在收集參考圖的時(shí)候,我發(fā)現(xiàn)常見的綠色大屏有深色的和淺色的,根據(jù)自己以往的作圖習(xí)慣,我覺得深色會(huì)更加的受歡迎一些,我自以為是的朝著深色的方向去出圖,出到了一半的時(shí)候,我內(nèi)心有些許的忐忑,我于是找了一深一淺的參考圖,讓同事跟客戶確認(rèn)一下,客戶是想要深色的感覺,還是要淺色的感覺,這次溝通又給了我深深的一擊,客戶不按常理出牌,說希望按淺色的風(fēng)格來出圖。
 
在出稿之前,通過自己反復(fù)的溝通確認(rèn),發(fā)現(xiàn)設(shè)計(jì)前的定調(diào)意識(shí)真的太重要了,要不是有出圖前一波三折的反復(fù)確認(rèn)以及需求的細(xì)化,就不會(huì)有后來的一遍過稿。
7大色彩技巧讓你界面更吸睛
 
 
 
5.設(shè)計(jì)的灰色盡量使用帶有色彩偏向的灰
不管我們?cè)O(shè)計(jì)什么色系的界面,都避不開用到灰色,在設(shè)計(jì)中用跟主視覺相符的灰,會(huì)使得界面更加的高級(jí)、協(xié)調(diào)與美觀,注意好了這個(gè)小細(xì)節(jié),會(huì)給我們的設(shè)計(jì)加分不少。
 
下面是我日常體驗(yàn)到的兩個(gè)界面,上面綜合管理平臺(tái)里面的灰色就沒有跟主色調(diào)藍(lán)色相呼應(yīng),灰色沒有向藍(lán)色傾斜,界面看起來就沒那么美觀;下面通義千問的灰色設(shè)計(jì)就非常的注重細(xì)節(jié),灰色偏紫,整個(gè)界面看起來渾然天成,毫無違和,美感、檔次瞬間提升好幾個(gè)等級(jí)。
 
一個(gè)微小細(xì)節(jié)的在意,在無形中拉高了設(shè)計(jì)的高度,十個(gè)細(xì)節(jié)乃至更多細(xì)節(jié)的在意,就會(huì)帶來更多意想不到的結(jié)果。
 
7大色彩技巧讓你界面更吸睛
 
 
 
 
總結(jié):
以上就是我最近對(duì)色彩的一些頓悟、感受和學(xué)習(xí)收獲,在不斷的復(fù)盤總結(jié)中,我們總會(huì)收獲一些新的認(rèn)知,通過這次色彩的復(fù)盤之旅,發(fā)現(xiàn)色彩對(duì)設(shè)計(jì)師真的太重要了,希望我的分享對(duì)大家有啟發(fā),不足之處也歡迎大家留言交流。


作者:姝斐suphie
鏈接:https://www.zcool.com.cn/article/ZMTYzOTMwMA==.html
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

蘭亭妙微(cqzjtgb.com )是一家專注而深入的界面設(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。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan

以用戶為中心的交互設(shè)計(jì)思維

天宇 交互設(shè)計(jì)及用戶體驗(yàn)

 
聊聊關(guān)于設(shè)計(jì)思維的內(nèi)容,會(huì)從產(chǎn)品設(shè)計(jì)、體驗(yàn)設(shè)計(jì)、交互設(shè)計(jì)三個(gè)方面入手。
目前是第三篇,關(guān)于交互設(shè)計(jì)思維的內(nèi)容。到這里設(shè)計(jì)思維的內(nèi)容全部結(jié)束了。
感謝
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維
 
 
以用戶為中心的交互設(shè)計(jì)思維


作者:DesignLink
鏈接:https://www.zcool.com.cn/article/ZMTY0OTg1Mg==.html
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

蘭亭妙微(cqzjtgb.com )是一家專注而深入的界面設(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。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan

 

設(shè)計(jì)的意義

藍(lán)藍(lán)設(shè)計(jì)的小編 設(shè)計(jì)思維

保羅·蘭德說:“設(shè)計(jì)是一種行為,是想象力馳騁的過程和產(chǎn)物。”

作為設(shè)計(jì)師,設(shè)計(jì)是我們的專業(yè),也是我們用來解決商業(yè)問題的工具。

我們過去也許都曾思考過類似設(shè)計(jì)的價(jià)值、意義或是本質(zhì)之類的問題。思考這類問題在某種意義上或許都是為了當(dāng)我們遇到困難、沖突、低谷或是不確定性的時(shí)候給自己找一些能夠堅(jiān)持下去的理由。

設(shè)計(jì)師在從業(yè)的不同階段,對(duì)設(shè)計(jì)的理解不同。從追求工具技能到表現(xiàn)力、方法論、風(fēng)格到影響行業(yè)甚至社會(huì)審美意識(shí)等等。不斷的錘煉之后,對(duì)設(shè)計(jì)意義也會(huì)有不同理解。

我們奉為的大師,都擅長(zhǎng)用自己的知識(shí)架構(gòu)定義對(duì)設(shè)計(jì)的理解。

保羅·蘭德就是一位我們公認(rèn)的設(shè)計(jì)大師、藝術(shù)家。他是當(dāng)今美國(guó)乃至世界上最杰出的圖形設(shè)計(jì)師、思想家及設(shè)計(jì)教育家之一。他最出名的企業(yè)標(biāo)志設(shè)計(jì),包括IBM,UPS,ABC標(biāo)志以及為史蒂夫·喬布斯設(shè)計(jì)NeXT.那段經(jīng)典橋段。

去研究這些前輩們?nèi)绾慰创O(shè)計(jì)、理解設(shè)計(jì)以及如何與設(shè)計(jì)相處一生,是另一種設(shè)計(jì)哲學(xué)的思辨。

保羅·蘭德說:

“設(shè)計(jì)是一種行為,是想象力馳騁的過程和產(chǎn)物。”

設(shè)計(jì)表現(xiàn)可能看似是簡(jiǎn)單的組裝、排序或是美化的過程,但設(shè)計(jì)的過程也是賦予信息意義的過程。不斷的簡(jiǎn)化、厘清、修飾甚至可能去說服、去取悅過后,設(shè)計(jì)就是把散文變成詩(shī)歌的過程。

設(shè)計(jì)師是孤獨(dú)的,大部分時(shí)候他們是一個(gè)人在戰(zhàn)斗。

設(shè)計(jì)是個(gè)人行為,即便在設(shè)計(jì)成熟度較高的國(guó)家、企業(yè)或是大型團(tuán)隊(duì),設(shè)計(jì)師仍需在一線才能真正掌控在這場(chǎng)戰(zhàn)斗中可能遇到的極其細(xì)節(jié)的變化和給人傳達(dá)的感受。

設(shè)計(jì)需要沖突來加深傳達(dá)的“戲劇性”。但設(shè)計(jì)過程也面臨種種沖突。這是設(shè)計(jì)的商業(yè)價(jià)值與藝術(shù)價(jià)值平衡的過程。正是因?yàn)檫@種關(guān)心很難平衡,才會(huì)出現(xiàn)雇主與設(shè)計(jì)師之間的沖突。

企業(yè)的目標(biāo)是達(dá)到商業(yè)、經(jīng)濟(jì)、政治甚至社會(huì)性目的。對(duì)設(shè)計(jì)師而言,設(shè)計(jì)是一種創(chuàng)造和實(shí)驗(yàn)行為。通過這種行為來平衡之前的目標(biāo)。

設(shè)計(jì)品質(zhì)最終決定設(shè)計(jì)師與核心決策者之間的關(guān)系。關(guān)心越是緊密,設(shè)計(jì)的產(chǎn)出就越有可能出彩。這其實(shí)并不難理解,對(duì)設(shè)計(jì)完成度有高追求的企業(yè),CEO也大多都跟設(shè)計(jì)團(tuán)隊(duì)或是設(shè)計(jì)咨詢公司有較為緊密的往來。就比如蘋果的喬布斯與喬納森是我們都公認(rèn)的CEO與設(shè)計(jì)師高緊密度關(guān)系的典范。

當(dāng)今社會(huì),市面上依然存在太多糟糕的設(shè)計(jì)。

一來,核心的決策者對(duì)設(shè)計(jì)專業(yè)的理解度不夠。

二來,很多決策依賴于市場(chǎng)調(diào)研,既得利益的權(quán)重大于長(zhǎng)遠(yuǎn)利益。

再就是我們回避不開的話題,設(shè)計(jì)師在某種意義上話語權(quán)不夠。

抉擇者很多時(shí)候不了解或是存在對(duì)某類元素特定的喜好偏見,他們有評(píng)價(jià)權(quán),但卻缺乏對(duì)設(shè)計(jì)專業(yè)知識(shí)的儲(chǔ)備。所以就會(huì)普遍出現(xiàn)外行指導(dǎo)內(nèi)行的情況。過往(現(xiàn)在好一些),他們將設(shè)計(jì)師看做一套繪圖工具,一個(gè)合作供應(yīng)商而不是一個(gè)業(yè)務(wù)團(tuán)隊(duì)里重要的組成部門。

體系完整的企業(yè)可能會(huì)引入市場(chǎng)調(diào)研團(tuán)隊(duì),調(diào)研團(tuán)隊(duì)為營(yíng)銷提供定位信息,設(shè)計(jì)師來解讀和演繹那些信息。如果調(diào)研團(tuán)隊(duì)能理解設(shè)計(jì)師的工作過程與其產(chǎn)生共鳴,就有可能促成正確決策甚至產(chǎn)生驚喜的創(chuàng)意作品。

但很多時(shí)候,我們聽到了太多這樣的回復(fù):

 

我喜歡它;

我不喜歡它;

它太簡(jiǎn)單了;

它太復(fù)雜了;

它讓我想起某某...

常常一句“我不喜歡”就可以終結(jié)任何設(shè)計(jì)作品。就像當(dāng)初一位IBM的主管第一次看到這個(gè)條紋logo時(shí)嘲弄到說“這東西讓我想起格魯吉亞的鎖鏈囚犯”。

每個(gè)人所能感知的信息都不盡相同。

有人既看不到logo的意義,也看不到它的功能。也正因?yàn)檫^于用喜好而不是專業(yè)去評(píng)判,才讓糟糕的設(shè)計(jì)一直留存于我們的世界。而大眾對(duì)糟糕的設(shè)計(jì)要比對(duì)好設(shè)計(jì)更加熟悉,于是大家習(xí)慣于選擇不好的設(shè)計(jì),因?yàn)楹退麄兂ο嗵帯?/p>

新事物讓人感受到威脅,而舊事物讓人安心。

要判斷一個(gè)設(shè)計(jì)的內(nèi)在價(jià)值,決定性因素不是使用期,而是它所設(shè)定的“品質(zhì)預(yù)期”。這是設(shè)計(jì)師的價(jià)值,也是設(shè)計(jì)師該練就的“知覺”。

何為知覺?

我們可以把知覺暫定為“瞬間的洞悉”。設(shè)計(jì)師在做設(shè)計(jì)決策的時(shí)候大部分都是依賴過往的知識(shí)儲(chǔ)備以及慣性技能。不斷的嘗試,都是通過瞬間對(duì)各方向的可能性判斷。

本能、預(yù)感、沖動(dòng)、洞悉之后的綜合“洞悉”,這就是知覺。

說到logo,我們常把logo當(dāng)成品牌價(jià)值傳遞的重要符號(hào)。

它是一面旗幟、一個(gè)簽名、一個(gè)路標(biāo)。大部分時(shí)候,雇主期待logo能描述一個(gè)行業(yè),但歷史上最成功的logo都沒能做到。蘋果、勞斯萊斯、可口可樂、或是IBM等等...不可否認(rèn)的是它們都是歷史上最成功的logo,但它們卻無法做到能傳遞它們的行業(yè)屬性。因?yàn)?strong>logo遠(yuǎn)不如它所代表的產(chǎn)品重要,它所代表的比它看起來的樣子更重要。


因?yàn)橹挥衛(wèi)ogo與它所屬的公司、產(chǎn)品、服務(wù)聯(lián)系起來時(shí),它才具備真正的意義。一流的產(chǎn)品和公司的logo傳遞出一流的形象。反之一個(gè)公司如果是二流的,那么它的logo最終也會(huì)被歸為二流。

 

 

logo首先要告訴人們“是誰”,而不是“是什么”。這才是它最基礎(chǔ)且最重要的功能。它所扮演的角色就是“指示”。“簡(jiǎn)潔”是達(dá)成指示的手段。所以設(shè)計(jì)過程中的特點(diǎn)、好記以及清楚都是需要設(shè)計(jì)師在打磨細(xì)節(jié)前首先要做好的決策。一個(gè)復(fù)雜、挑剔、模糊的設(shè)計(jì)潛藏著自我毀滅性的風(fēng)險(xiǎn)。

 

“好的設(shè)計(jì)帶來好的生意”。但不可否認(rèn),即使不好的設(shè)計(jì),也可能帶來好的生意(比如下圖)。如果這樣,還需要好的設(shè)計(jì)么?

好的設(shè)計(jì)可以增添額外的附加價(jià)值,很多時(shí)候,也許光看著它就能給人們帶來快樂。它們更尊重感官,并通過這種友好的感官體驗(yàn),給企業(yè)帶來回報(bào)。人們更容易記得精美而不是一團(tuán)糟的形象。它折射出一個(gè)考慮周全,目標(biāo)明確的企業(yè),反映了它的產(chǎn)品或者服務(wù)的品質(zhì)。所以,這個(gè)世界需要好的設(shè)計(jì),設(shè)計(jì)師要做的就是用設(shè)計(jì)向世界傳遞一些更有價(jià)值的觀點(diǎn)。這是設(shè)計(jì)師的工作,也是設(shè)計(jì)該有的意義。

「大寶推薦閱讀書單之《設(shè)計(jì)的意義》」



作者:大寶頻道
鏈接:https://www.zcool.com.cn/article/ZMTQ3ODQzMg==.html
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

蘭亭妙微(cqzjtgb.com )是一家專注而深入的界面設(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。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan

 

日歷

鏈接

個(gè)人資料

存檔

乐业县| 缙云县| 鄂温| 万载县| 奉新县| 上杭县| 黔江区| 华容县| 吉安市| 阿鲁科尔沁旗| 葫芦岛市| 长武县| 郓城县| 乌审旗| 巩留县| 恩平市| 兴和县| 蒙自县| 高密市| 漾濞| 荥阳市| 团风县| 仁布县| 五台县| 郎溪县| 开江县| 娄烦县| 怀远县| 珠海市| 安庆市| 甘德县| 综艺| 德清县| 丰城市| 开远市| 嘉禾县| 日照市| 瑞丽市| 拉萨市| 渑池县| 沙洋县|