現(xiàn)代管理學(xué)家-彼得.德魯克說過：“如果你不能夠測量，那么就沒法很好的管理它”。B端體驗(yàn)設(shè)計曾經(jīng)在我的心中是不可測量的，覺得它很縹緲，它就是一種感受，一種體驗(yàn)，而每個人的感受又是不一樣的，想法也是不一樣的，這又該如何去評判體驗(yàn)的好與壞；這一度讓我苦惱，經(jīng)過學(xué)習(xí)研究，發(fā)現(xiàn)其實(shí)也沒那么飄，本文將通過具體的案例來跟大家探討體驗(yàn)設(shè)計在B端設(shè)計中的應(yīng)用，以及它有哪些具體的思維模型和可量化的方法論。

 

 

 

 

 

一、B端用戶體驗(yàn)設(shè)計的10大好處

 

1、主動吸引

好的用戶體驗(yàn)是用戶積極參與，它就是那道光，讓用戶不自覺地被吸引，而主動靠近產(chǎn)品，想要一探究竟。

 

百度網(wǎng)盤企業(yè)版把產(chǎn)品簡介以動畫的形式放在了首頁，形式非常的美觀時尚，讓人不禁想要點(diǎn)進(jìn)去看看，進(jìn)去之后是一個詳細(xì)的產(chǎn)品介紹說明，說明也是通過MG動畫的形式展出的，畫面美輪美奐，讓人不禁想多看幾遍，產(chǎn)品的吸引感比較強(qiáng)。

 

 

 

 

 

2、提升效率

好用的B端產(chǎn)品，可以提升用戶操作效率，讓你的工作如同行云流水。相反，如果產(chǎn)品難用，那就像是用鈍刀切黃油，不僅效率低下，還可能讓人心情煩躁。

 

人人都是產(chǎn)品經(jīng)理在文章投稿發(fā)布頁面，設(shè)置了一個文章導(dǎo)入功能，支持文章從公眾號、簡書、知乎專欄導(dǎo)入，大大節(jié)約了投稿人編輯文本和排版的時間，節(jié)約了用戶寶貴的時間，投稿人不需要重復(fù)排版去應(yīng)對每個平臺的需求，也加大了人們投稿的意愿。

 

 

 

 

 

3、愉悅心情

面對每天都要用的產(chǎn)品，若其使用體驗(yàn)好，用戶就會覺得工作也是一件令人愉悅的事情，若使用體驗(yàn)差，就會影響用戶工作時的心情，嚴(yán)重的還會阻礙用戶（員工）KPI的達(dá)成，導(dǎo)致用戶的離職率上升。

 

飛書的登錄加載頁非常有趣，小鳥不停啄食以及鈴鐺不斷搖擺的動畫，看著非常的童趣，感受到了童真的快樂和輕松愉悅的氛圍。

 

 

 

 

 

4、符合心智

B端產(chǎn)品若沒有體驗(yàn)設(shè)計這一環(huán)節(jié)，產(chǎn)品想法落地就只是研發(fā)邏輯的呈現(xiàn)，而不是用戶需求與用戶心智的呈現(xiàn)，無法給用戶提供合理的人機(jī)交互。體驗(yàn)設(shè)計打開了用戶需求和心智的世界，讓用戶感受到產(chǎn)品是為他們量身定制的。

 

今年由Alibaba Design發(fā)起D20全球設(shè)計院長峰會，他的官網(wǎng)首頁設(shè)計的特別符合用戶的心智，畫面簡潔又不失時尚，還帶著點(diǎn)動感，特別的耐看，人性深處也更多的會對動的東西產(chǎn)生更多的注意力。

 

下邊的導(dǎo)航欄，設(shè)計的也非常貼切，正好在一個電腦屏幕中展示，想要看哪個部分，直接點(diǎn)擊對應(yīng)的導(dǎo)航欄就能精準(zhǔn)的跳到該部分，不需要用戶進(jìn)行長時間拖拽就能看到。

 

 

 

 

 

5、簡化流程

在符合業(yè)務(wù)邏輯的基礎(chǔ)上，體驗(yàn)設(shè)計可以優(yōu)化B端復(fù)雜的流程，把復(fù)雜的迷宮簡化成一條直線，從而讓用戶在操作界面時感覺到暢通和舒適。

 

騰訊文檔的登錄頁，沒有讓用戶輸入一連串的賬號和密碼，通過二維碼的方式，讓用戶掃碼登錄，快捷又方便，簡化了用戶登錄的流程。

 

 

 

 

 

6、優(yōu)化布局

體驗(yàn)設(shè)計師參與過的界面布局，與研發(fā)工程師構(gòu)建的界面布局完全不同，這種不同體現(xiàn)在設(shè)計思路和設(shè)計結(jié)果上。體驗(yàn)設(shè)計師從用戶視角出發(fā)，在布局上追求信息主次分明、重點(diǎn)突出、同類功能樣式一致性等，讓用戶用著更舒服；體驗(yàn)設(shè)計師就像是室內(nèi)裝潢師，他們把界面布局設(shè)計得像一個溫馨的家，每個角落都井然有序，每個功能都恰到好處。

 

這是日常參與的一個頁面設(shè)計，上面這個是研發(fā)工程師設(shè)計開發(fā)的頁面，下面那個是我運(yùn)用體驗(yàn)思維設(shè)計的一個新的改良頁面，通過對比發(fā)現(xiàn)，運(yùn)用了體驗(yàn)思維的頁面設(shè)計，信息傳達(dá)更加的清晰，信息之間的層次感更強(qiáng)，美觀度也更高。

 

 

 

 

 

7、反饋友好

在體驗(yàn)設(shè)計師沒有介入之前，B端產(chǎn)品界面的反饋信息要么意思表達(dá)不清晰，要么是一連串的代碼，體驗(yàn)設(shè)計師參與后讓用戶更加容易理解產(chǎn)品的設(shè)計思路，讓產(chǎn)品變得“會說話”，提供清晰易懂的反饋，甚至在你迷茫時，還能給你指明方向，告訴你下一步該干什么。

 

網(wǎng)絡(luò)拓?fù)鋱D是描繪網(wǎng)絡(luò)結(jié)構(gòu)和設(shè)備間互聯(lián)關(guān)系的圖形化表示，它直觀地展示了網(wǎng)絡(luò)中各個節(jié)點(diǎn)（如計算機(jī)、服務(wù)器、交換機(jī)、路由器等）以及它們之間的物理連接或邏輯連接，通過可視化的拓?fù)鋱D，給運(yùn)營人員良好的使用反饋，讓他們知道每臺設(shè)備的運(yùn)營情況。

 

 

 

 

 

8、促進(jìn)增長

對于Saas產(chǎn)品，在滿足業(yè)務(wù)場景的條件下，好的體驗(yàn)就像是口碑的種子，一旦種下，就會生根發(fā)芽，讓越來越多的人愿意為它付費(fèi)，甚至愿意將它推薦給朋友，這樣，你的產(chǎn)品就像一棵茁壯成長的樹，不斷吸引新的養(yǎng)分。

 

oneThingAI推出邀請有禮，每個會員給他人推薦會獲得相應(yīng)的代金券，再加上這個工具的體驗(yàn)感很好，工具非常的便捷，一學(xué)就能快速上手，我記得當(dāng)時這個優(yōu)惠活動，讓很多的AI愛好者紛紛注冊購買，這個推薦有禮的策略以及良好的產(chǎn)品體驗(yàn)，很好的促進(jìn)了產(chǎn)品銷量的增長。

 

 

 

 

 

9、減少投訴次數(shù)

好的體驗(yàn)設(shè)計會讓人覺得很人性化，感覺使用過程像呼吸一樣自然，更容易獲得用戶的認(rèn)可，從而減少投訴次數(shù)，提升用戶的滿意度。

 

以下是自己曾經(jīng)參與過的項(xiàng)目，上面那個是完全沒考慮用戶體驗(yàn)，沒考慮用戶喜歡什么樣的風(fēng)格，有什么特殊化的要求，哪些參數(shù)、指標(biāo)需要明顯化的展示？沒有這些考慮，結(jié)果很慘，被客戶一頓亂批，還被投訴到了公司老大那里去。

 

下面那個是跟客戶反復(fù)溝通后出來的效果，考慮到了客戶對地域文化的表達(dá)有需求，對關(guān)鍵數(shù)據(jù)指標(biāo)的展示有需要，對風(fēng)格有著朝氣、蓬勃、陽光的表達(dá)有需求，抓取到了這些關(guān)鍵信息后，開始靠近用戶的需求，結(jié)果客戶很滿意，也再沒有因?yàn)閁I被投訴過。

 

 

 

 

 

10、超越競品

B端市場競爭越來越激烈，產(chǎn)品越來越多，靠功能多已無法輕易勝出，還需要好的用戶體驗(yàn)加持，好的用戶體驗(yàn)就像明星的光環(huán)，它能讓產(chǎn)品在眾多競爭者中脫穎而出，成為用戶心中的明星。

 

360瀏覽器的體驗(yàn)做的是相當(dāng)?shù)暮?，在眾多的瀏覽器中可謂是一股清流，看到它頭頂部的動效沒，那個是鼠標(biāo)移上去，那些花才會動，不移上去，不會動，這個動效它跟傳統(tǒng)的動效不一樣，它讓用戶與它之間產(chǎn)生了一個交流的動作，非常的吸引人，產(chǎn)品的情感化做的很好。

 

 

 

 

 

二、B端用戶體驗(yàn)設(shè)計中的三大模型

 

C端是客戶用戶體驗(yàn)，B端則是企業(yè)用戶體驗(yàn)，他是為大公司及其員工內(nèi)部使用的應(yīng)用程序創(chuàng)建的用戶體驗(yàn)設(shè)計。B端設(shè)計常見的用戶體驗(yàn)度量模型有以下三個：

 

 

 

 

1、HEART + GSM模型（Google）

 

1.1 簡介

 

Google公司在2010年提出的HEART模型，其以用戶為中心的設(shè)計理念，成為了業(yè)界廣泛認(rèn)可和應(yīng)用的度量體系。HEART模型不僅僅是一套度量工具，它更是一種思維模式，引導(dǎo)我們從用戶的角度出發(fā)，深入理解并優(yōu)化用戶體驗(yàn)。

 

 

 

 

藍(lán)藍(lán)設(shè)計(yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標(biāo)定制、用戶體驗(yàn)設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計，以及相關(guān)的軟件開發(fā)服務(wù)，咨詢電話：01063334945。我們建立了一個微信群，每天分享國內(nèi)外優(yōu)秀的設(shè)計，有興趣請加入一起學(xué)習(xí)成長，咨詢及進(jìn)群請加藍(lán)小助微信ben_lanlan。

關(guān)鍵詞：UI咨詢、UI設(shè)計服務(wù)公司、軟件界面設(shè)計公司、界面設(shè)計公司、UI設(shè)計公司、UI交互設(shè)計公司、數(shù)據(jù)可視化設(shè)計公司、用戶體驗(yàn)公司、高端網(wǎng)站設(shè)計公司、銀行金融軟件UI界面設(shè)計、能源及監(jiān)控軟件UI界面設(shè)計、氣象行業(yè)UI界面設(shè)計、軌道交通界面設(shè)計、地理信息系統(tǒng)GIS UI界面設(shè)計、航天軍工軟件UI界面設(shè)計、醫(yī)療行業(yè)軟件UI界面設(shè)計、教育行業(yè)軟件UI界面設(shè)計、企業(yè)信息化UI界面設(shè)計、軟件qt開發(fā)、軟件wpf開發(fā)、軟件vue開發(fā)

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

一、B端用戶需求的深入理解和分析

在當(dāng)今高度信息化的商業(yè)環(huán)境中，B端產(chǎn)品已成為企業(yè)高效運(yùn)營和持續(xù)發(fā)展的關(guān)鍵支撐。

這些產(chǎn)品不僅提供工具和服務(wù)，更是企業(yè)優(yōu)化流程、提升工作效率和競爭力的有力武器。然而，要打造一款成功的B端產(chǎn)品，關(guān)鍵在于對

B端用戶需求的深入理解與分析。

B端用戶，

如企業(yè)決策者、團(tuán)隊(duì)管理者和專業(yè)人員以及普通員工，他們在日常工作中處理復(fù)雜的業(yè)務(wù)流程，對數(shù)據(jù)分析、系統(tǒng)整合、安全性等方面有著極高的要求。

這些用戶的獨(dú)特需求不僅體現(xiàn)在產(chǎn)品的基本功能上，更涉及到產(chǎn)品的易用性、可擴(kuò)展性以及服務(wù)支持等多個層面。

 

 

 

 

 

 

 

 

 

 

需求分析是產(chǎn)品設(shè)計的核心環(huán)節(jié)，它要求設(shè)計師深入探究用戶的需求、痛點(diǎn)和期望，從而確保產(chǎn)品能夠滿足用戶的實(shí)際需求。對于B端用戶而言，需求分析的重要性更為突出。這是因?yàn)锽端產(chǎn)品往往需要解決企業(yè)運(yùn)營中的具體問題，其設(shè)計必須緊密圍繞用戶的需求展開，以確保產(chǎn)品的實(shí)用性和高效性。

在需求分析的過程中，我們需要關(guān)注以下幾個方面：

 

 

首先，

功能性需求

是B端用戶最為關(guān)注的一點(diǎn)。他們需要產(chǎn)品具備強(qiáng)大的數(shù)據(jù)處理能力、靈活的業(yè)務(wù)流程管理功能以及全面的安全防護(hù)措施。這些功能性的需求是確保B端產(chǎn)品能夠滿足企業(yè)日常運(yùn)營需要的基礎(chǔ)。

其次，

易用性需求

同樣不容忽視。盡管B端產(chǎn)品往往面向具備一定專業(yè)素養(yǎng)的用戶，但簡潔直觀的界面設(shè)計、流暢的操作體驗(yàn)以及可定制的用戶界面仍然是提升用戶滿意度的關(guān)鍵。通過優(yōu)化用戶交互流程、減少冗余信息，我們可以幫助用戶更高效地完成工作任務(wù)。

此外，

整合與擴(kuò)展性需求

也是B端用戶關(guān)注的重點(diǎn)。企業(yè)需要產(chǎn)品能夠與其他系統(tǒng)無縫對接，實(shí)現(xiàn)數(shù)據(jù)共享和業(yè)務(wù)協(xié)同。同時，隨著企業(yè)業(yè)務(wù)的發(fā)展，產(chǎn)品還需要具備良好的擴(kuò)展性，以支持新功能的快速添加和部署。

最后，

服務(wù)與支持需求

同樣重要。B端用戶期望獲得專業(yè)的客戶支持、完善的培訓(xùn)機(jī)制以及豐富的資源文檔，以確保產(chǎn)品的穩(wěn)定運(yùn)行和持續(xù)優(yōu)化。

 

 

綜上所述，深入理解B端用戶的獨(dú)特需求是打造成功B端產(chǎn)品的關(guān)鍵。通過全面的需求分析，我們可以確保產(chǎn)品不僅滿足用戶的基本功能需求，更在易用性、整合擴(kuò)展性和服務(wù)支持等方面提供卓越的體驗(yàn)。這將有助于提升企業(yè)的運(yùn)營效率，進(jìn)而推動其在激烈的市場競爭中脫穎而出。

 

二、B端用戶的獨(dú)特需求

B端用戶，即企業(yè)級用戶，他們的需求與C端個人用戶有著顯著的差異。

這些差異主要體現(xiàn)在以下幾個方面：

 

 

業(yè)務(wù)強(qiáng)驅(qū)動性：

B端產(chǎn)品的主要需求來源于業(yè)務(wù)方，由業(yè)務(wù)驅(qū)動并主導(dǎo)。

這是因?yàn)锽端產(chǎn)品主要是為了解決組織內(nèi)某個或某一類具體業(yè)務(wù)領(lǐng)域的問題。業(yè)務(wù)方通常離業(yè)務(wù)最近，也最了解使用用戶的需求，因此他們在產(chǎn)品需求上擁有較大的話語權(quán)。

用戶群體差異大：

不同于C端用戶需求的大同小異，B端用戶群體的需求差異巨大。

這些差異主要體現(xiàn)在角色差異、組織差異、管理層級差異、用戶深度差異、客戶規(guī)模差異、客戶行業(yè)差異以及客戶性質(zhì)差異等。這種多樣性要求B端產(chǎn)品在設(shè)計時需要考慮更多的變量和定制化需求。

高效性與便捷性

：

企業(yè)級用戶非常重視工作效率和操作流程的簡化。

他們希望產(chǎn)品能夠提供高效的功能和簡潔的操作界面，以減少工作中的繁瑣步驟和時間成本。因此，B端產(chǎn)品設(shè)計需要注重提升用戶的工作效率，提供便捷的操作體驗(yàn)。

安全性與穩(wěn)定性：

對于企業(yè)級用戶來說，數(shù)據(jù)安全和系統(tǒng)穩(wěn)定是至關(guān)重要的。

他們需要一個可靠且安全的平臺來處理和存儲敏感的業(yè)務(wù)數(shù)據(jù)。B端產(chǎn)品必須能夠提供強(qiáng)大的安全防護(hù)措施和穩(wěn)定的系統(tǒng)性能，以確保企業(yè)業(yè)務(wù)的正常運(yùn)行和數(shù)據(jù)的安全。

定制化與靈活性：

每個企業(yè)的業(yè)務(wù)流程和需求都是獨(dú)特的，因此B端用戶希望產(chǎn)品能夠根據(jù)自身的實(shí)際情況進(jìn)行定制。

他們需要一個靈活可配置的產(chǎn)品解決方案，以滿足企業(yè)特定的業(yè)務(wù)需求和工作流程。

集成性與兼容性：

在企業(yè)級應(yīng)用中，B端產(chǎn)品往往需要與其他系統(tǒng)或軟件進(jìn)行集成，以實(shí)現(xiàn)數(shù)據(jù)的共享和流程的協(xié)同。

因此，產(chǎn)品的集成性和兼容性是企業(yè)用戶非常關(guān)注的一個方面。B端產(chǎn)品設(shè)計需要考慮到與現(xiàn)有系統(tǒng)的無縫對接和數(shù)據(jù)交換的便捷性。

 

 

綜上所述，B端用戶的獨(dú)特需求主要體現(xiàn)在業(yè)務(wù)的強(qiáng)驅(qū)動性、用戶群體的大差異性、對高效便捷的追求、對安全穩(wěn)定的重視、對定制化和靈活性的需求以及對集成性和兼容性的關(guān)注等方面。這些需求特點(diǎn)要求B端產(chǎn)品在設(shè)計時必須充分考慮企業(yè)級用戶的實(shí)際需求和業(yè)務(wù)場景，以提供符合用戶期望的優(yōu)質(zhì)產(chǎn)品解決方案。

 

三、

B端產(chǎn)品設(shè)計的核心原則

B端產(chǎn)品設(shè)計需要遵循一系列核心原則，以確保產(chǎn)品能夠滿足企業(yè)級用戶的獨(dú)特需求。

 

 

3.1 用戶中心設(shè)計

深入理解目標(biāo)用戶：

在設(shè)計B端產(chǎn)品時，必須首先了解目標(biāo)用戶，包括他們的工作流程、需求痛點(diǎn)以及行為習(xí)慣。這需要通過深入的用戶研究和調(diào)查來實(shí)現(xiàn)，以便更好地設(shè)計適合用戶的產(chǎn)品。

符合用戶期望：

產(chǎn)品的設(shè)計應(yīng)以用戶為中心，確保功能、界面和操作都符合用戶的期望和習(xí)慣。這有助于提高用戶滿意度和使用效率。

3.2 簡潔直觀的界面

簡約性：

B端產(chǎn)品的交互界面應(yīng)該簡潔明了，避免過多的復(fù)雜功能和視覺元素。這樣用戶可以更輕松地理解和使用產(chǎn)品。

直觀性：

界面設(shè)計應(yīng)直觀易懂，減少用戶的學(xué)習(xí)成本。通過明確的導(dǎo)航和標(biāo)識，幫助用戶快速找到所需功能。

3.3 強(qiáng)大的功能支持

滿足業(yè)務(wù)需求：

B端產(chǎn)品需要提供豐富的功能，以滿足企業(yè)復(fù)雜的業(yè)務(wù)需求。這些功能應(yīng)涵蓋用戶在工作流程中的各個環(huán)節(jié)，確保用戶能夠順利完成工作任務(wù)。

靈活配置：

產(chǎn)品功能應(yīng)具備高度的可配置性，以便用戶根據(jù)自身需求進(jìn)行靈活調(diào)整。這有助于提升產(chǎn)品的適用性和用戶體驗(yàn)。

3.4 高度可配置性

定制化體驗(yàn)：

 

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

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

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

作者：張陽光Designer
鏈接：https://www.zcool.com.cn/article/ZMTYyMTczNg==.html
來源：站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請注明出處。

本文沒有咬文嚼字的地方，只是一個配色技巧的分享，十分簡單，簡單到流淚，但或許對你來說又十分實(shí)用，實(shí)用到無語。原本就是天然的饋贈，你我只是順手采擷之......

網(wǎng)頁視覺層面主要是由形式（或叫布局）、色彩、圖片和文字信息組成，設(shè)計師通常對形式感關(guān)注的比較多，因?yàn)橐曈X沖擊力、設(shè)計差異性或創(chuàng)新大多都仰賴形式呈現(xiàn)，而色彩主要影響整體觀感、設(shè)計品質(zhì)以及受眾情緒，很多時候我們設(shè)計了一個不錯的形式卻未能做出這個稿子應(yīng)有的品質(zhì)，會不會太可惜？

形式需要思考創(chuàng)造，圖片素材需要學(xué)習(xí)處理，文字需要梳理編排，但網(wǎng)頁色彩是不是一定需要有天生的色感、豐富的理論和多年經(jīng)驗(yàn)沉淀才能運(yùn)用自如？

當(dāng)然不！

關(guān)于網(wǎng)頁配色

網(wǎng)頁配色的文章在網(wǎng)絡(luò)上很多，甚至有些泛濫，稍微關(guān)注過的同學(xué)應(yīng)該都知道“色輪”、“色卡”等輔助性配色工具，但那更多都是從印刷介質(zhì)上的色彩系統(tǒng)延伸出來的，不完全適用于網(wǎng)頁，甚至造成很大的局限，比如你會較真的通過色輪來選用網(wǎng)頁色彩嗎？再比如通過下面提供的配色組合，你能自由的應(yīng)對一個又一個的類型相若的網(wǎng)頁設(shè)計需求嗎？

由于CMYK與RGB色彩模式不同，網(wǎng)頁的色彩呈現(xiàn)數(shù)量要龐大的多，選用也應(yīng)該更自由，但在配色上卻常碰到設(shè)計作品偏臟、發(fā)灰、花哨等大問題，這事兒得解決。

網(wǎng)頁案例剖析

“網(wǎng)頁配色不宜超過三種。”

真理，這沒錯，但更多是從色相（赤橙黃綠青藍(lán)紫等不同顏色）上來說的。

色相差異明顯，主要色彩的選取就比較好辦，常見的有對比色、臨近色、冷暖色調(diào)互補(bǔ)等方式，可以簡單設(shè)定，或直接從成功作品中借鑒主輔色配比都可以，比如常見的朱紅點(diǎn)綴深藍(lán)、明黃點(diǎn)綴深綠等。

但通常，我們需要面對的設(shè)計需求在色彩分配上會有更多的問題出現(xiàn)：

（由于本人從事游戲網(wǎng)頁視覺設(shè)計工作，故案例均以游戲網(wǎng)頁做示意說明，其他網(wǎng)頁類型可以做延伸思考或僅作參閱）

如上所示，根據(jù)網(wǎng)頁信息的多寡，會有更多色彩區(qū)域的層級劃分和文字信息層級區(qū)分需求，那么在守住“網(wǎng)頁色彩（相）不超過三種”的原則下，只能尋找更多同色系的色彩來完善設(shè)計，也就是在“飽和度”和“明度”上做文章。

這也就是本文為解決這一問題所要分享的“天然”配色技巧：疊柔配色法。

疊柔配色技巧分享（這里才是正文，上面都是廢話）

這個方法非常簡單，無需知道三角函數(shù)、四則運(yùn)算，無需理解色彩指數(shù)和直方圖，甚至不用了解色階曲線和亮度強(qiáng)弱......甚至，你可以對色彩毫無知覺。

★只需要明白三個關(guān)鍵詞：疊加、柔光和透明度（填充）。

如果連這三個關(guān)鍵詞都不甚明了，那就記住他們所在的位置（下圖）：

注意：透明度與填充略有不同，填充不會影響到“混合選項(xiàng)”的效果，而透明度則是作用于整個圖層。

順便，花幾分鐘時間了解一下這個配色技巧的原理：

即：用純白色（#ffffff）和純黑色（#000000）通過“疊加”和“柔光”的混合模式（效果類似調(diào)整飽和度和明度），在任意一個色彩上得到最匹配的顏色（然后通過調(diào)整透明度選取最適合的輔色）。

（上圖示例中，調(diào)整疊/柔模式的黑白色塊的不同透明度（取10%到100%整數(shù)值為例）就可以得到差異較明顯的40種配色，通過這種技巧，理論上每一種顏色都可以輕易獲得無窮盡的“天然配色”，并且是“0失誤”?。?/p>

★ 由于疊加和柔光模式對圖像內(nèi)的最高亮部分和最陰影部分無調(diào)整，因此該配色方法對純黑色和純白色不起作用。

設(shè)計實(shí)戰(zhàn)演示：

要不要像上面圖示看起來的那樣復(fù)雜？

不用，只需要理解了上面的方法，就可以忘記圖示，在你的設(shè)計工作中自由發(fā)揮！

簡單三步：

①  一個黑或白色，或黑白漸變（可以是點(diǎn)、線、面...甚至字體）

②  混合模式選擇疊加或柔光

③  調(diào)整透明度（1%-100%隨意，省心的做法是直接鍵入一個整數(shù)值，比如：輕質(zhì)感類頁面可以選擇20%-40%，重質(zhì)感感類可以鍵入60%或以上）

如下圖：

（無論你采用何種主色，用黑白色彩疊加或柔光，你都可以輕松自如的獲得完美匹配的整套色系，附件有PSD源文件：下載地址在回復(fù)中的226樓）

這并不僅僅適用于色域劃分或提取幾個輔色，如下圖：字體顏色、細(xì)節(jié)線條、按鈕漸變、邊角高光、描邊陰影......都可以用黑白色肆意揮灑！

方法延伸（細(xì)節(jié)篇）

假如將該方法運(yùn)用到一個按鈕上......

通過混合選項(xiàng)中的“陰影、外發(fā)光、描邊（不適用疊柔法）、內(nèi)陰影、內(nèi)發(fā)光”可以自由的刻畫5層像素級細(xì)節(jié)（當(dāng)然，通常在實(shí)際的使用中刻畫1到3層即可）。

且無論形狀、色彩如何變化，這些細(xì)節(jié)都如影隨形、色彩都隨變而變~可節(jié)省大量重調(diào)細(xì)節(jié)或盲目選取配色的時間！

細(xì)節(jié)、品質(zhì)和效率，一石三鳥，兼而得之！

（近期看到設(shè)計圈有討論“網(wǎng)頁雕花不可取”的課題，假如讓細(xì)節(jié)成為習(xí)慣，讓美感成為直覺，雕花也便只是普通設(shè)計行為而已。）

案例歷練：

后記：

疊柔配色法：無招勝有招~把抓不住的感覺交給精密的計算機(jī)，科學(xué)化進(jìn)行你的設(shè)計。

更短的時間，更高的品質(zhì)，你，值得擁有~......

另：方法是死的，人是活的，配合色階、曲線、色彩平衡等，還可以玩出更多花樣來......

分享來自：TGideas-騰訊游戲官方設(shè)計團(tuán)隊(duì)

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

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

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

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

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

作者：夜小七_(dá)PD
鏈接：https://www.zcool.com.cn/article/ZMTQyODg0.html
來源：站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請注明出處。

· 同樣是收錢，為何微信轉(zhuǎn)賬可以在【電腦端】接收，而微信紅包只能在【手機(jī)端】進(jìn)行？

· 同樣是顯示訂單節(jié)點(diǎn)，為何快遞物流是【倒序】，而外賣卻是【正序】？

3月中旬，“Apple ID將成歷史”的話題登上熱搜，科技網(wǎng)站MacRumors爆料蘋果預(yù)計將在今年把“Apple ID”更名為“Apple Account”，屆時，使用超20年的“Apple ID”逐步淡出視野，成為記憶。看似簡單的文案更改，其背后考量可能是復(fù)雜的。僅從文案的字面含義來看，“ID”指的是可以代表某個身份的一串?dāng)?shù)字或編碼，服務(wù)于“認(rèn)證”環(huán)節(jié)的工具屬性更強(qiáng)，而當(dāng)前蘋果給“Apple ID”的定位卻是“一個賬戶盡享Apple所有服務(wù)”，顯然“Account（賬戶）”的含義更加寬泛，即能代表身份標(biāo)識，又可以包含自定義設(shè)置、功能權(quán)限、服務(wù)狀態(tài)等所有個人相關(guān)的信息，文案更加符合實(shí)際定位，精準(zhǔn)地表述也讓用戶容易理解和區(qū)分。

同樣是為了降低用戶困擾，提升行為數(shù)據(jù)，2021年，蘋果發(fā)布iOS 14.5時，其播客服務(wù)將“訂閱”功能更名為“關(guān)注”，因?yàn)閾?jù)市場分析機(jī)構(gòu)Edison Research的調(diào)研數(shù)據(jù)顯示，有47%的人認(rèn)為“訂閱”播客需要付費(fèi)，這意味著過去幾年，可能有很多用戶因?yàn)閾?dān)心收費(fèi)而不使用播客服務(wù)，造成大量用戶流失。更名為“關(guān)注”后，文案表述不容易發(fā)生歧義，可以消除用戶不必要的擔(dān)憂。