首頁

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

資深UI設(shè)計者

過去一年 COVID-19 肆虐全球,封鎖與隔離使我們與數(shù)字世界的互動方式發(fā)生了巨變,這使得我們在數(shù)字世界的時間變得更長了,我們思考與互動的方式也產(chǎn)生了變化,新冠病毒的爆發(fā)也為 2021 年的設(shè)計趨勢帶來了新的思考。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

本文主要整理了 2021 年的設(shè)計趨勢與思考,主要為 ToB 方向。隨著產(chǎn)業(yè)互聯(lián)網(wǎng)行業(yè)的發(fā)展和數(shù)字化的進(jìn)程,設(shè)計工具以及生產(chǎn)方式也在不斷進(jìn)化發(fā)展。在 5G、人工智能、大數(shù)據(jù)、云計算、物聯(lián)網(wǎng)的技術(shù)浪潮下,對設(shè)計團(tuán)隊也提出了更高的要求。

行業(yè)趨勢

1. SaaS 趨勢:一線工作者將成為決策的中心,“職業(yè)前線”是常態(tài)。

工作一直在我們的社會生活中發(fā)揮著重要作用,但從未像在疫情期間那樣重要。在疫情期間,數(shù)月的封鎖給人們的情感健康帶來了損失。當(dāng)然這有助于遠(yuǎn)程感知的技術(shù)和工具的發(fā)展和進(jìn)步,但是還有很長的路要走。

對于一線員工來說尤其如此,不幸的是,一線員工通常與公司的聯(lián)系最少,但最容易感染該病毒。諸如教師,醫(yī)生,零售人員和制造工人之類的基本工人通常無法獲得與同事相同的公司范圍內(nèi)的技術(shù)。許多人甚至沒有公司電子郵件,甚至沒有辦公桌。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @Farhan Fauzan

但是,公司開始意識到這些一線職工(他們通常是客戶的第一個接觸點(diǎn))可以為組織帶回寶貴而獨(dú)特的見解。企業(yè)現(xiàn)在正試圖通過集中工具來完成這些任務(wù),例如輪班制或與他們的手機(jī)即時共享重要的健康和安全信息,從而使這些員工的工作更輕松。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @Barly Vallendito

普華永道美國副主席、風(fēng)險投資與創(chuàng)新全球領(lǐng)導(dǎo)者 Vicki Huff 指出,數(shù)字化解決方案在這里發(fā)揮著重要作用?!睘榱嗽?2021 年茁壯成長,企業(yè)需要將員工置于工作空間理念的中心。通過對員工體驗(yàn)的磨練,雇主可以提高生產(chǎn)力,增加參與度,并創(chuàng)造出更多連接和的勞動力。實(shí)現(xiàn)這一目標(biāo)的核心將是與公司現(xiàn)有的技術(shù)堆棧相整合,并為員工個人提供個性化服務(wù)的數(shù)字化解決方案?!?

2. 數(shù)字健康與員工健康趨勢

我們對 COVID-19 的了解還不夠,但這將會是可穿戴設(shè)備,遠(yuǎn)程醫(yī)療和人工智能等新數(shù)字健康發(fā)展機(jī)會。到 2021 年,我們可以預(yù)料這些技術(shù)將繼續(xù)發(fā)展。

我們還看到了一些出色的自監(jiān)控應(yīng)用程序應(yīng)用于可穿戴設(shè)備,可提供有關(guān)步數(shù),睡眠,心率或血壓的即時可視化數(shù)據(jù)。這些復(fù)雜的功能使用戶能夠掌控自己的健康,并告知他們?nèi)绾胃淖兩罘绞健?

醫(yī)療保健人工智能軟件,硬件和服務(wù)市場,預(yù)計到 2025 年全球?qū)⒊^$ 340 億@Businesswire

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ Pillo Home Healthcare Robot @415Agency

Oracle-Workplace Intelligence 最近對 12,000 名員工(包括 3,100 名 C 級高管)進(jìn)行的一項(xiàng)調(diào)查顯示,企業(yè)領(lǐng)導(dǎo)者與任何人一樣容易受到職業(yè)壓力的影響。71%的高管表示 2020 年是他們有史以來最緊張的工作年,而 53%的高管表示在工作中遇到精神健康問題。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @ILLO

專注于改善員工的福祉不僅是正確的事情,而且公司也意識到這可以提高業(yè)務(wù)績效。這就是為什么他們正在尋找技術(shù)和其他工具來提高工作滿意度,工人健康,可持續(xù)性,工作與生活的平衡以及靈活的工作安排。

或許人工智能之類的技術(shù)能對于這一追求提供重要幫助。Oracle-Workplace Intelligence 研究發(fā)現(xiàn),75%的員工認(rèn)為 AI 可以幫助提供對其工作至關(guān)重要的信息,自動化任務(wù)并減輕壓力。報告還顯示,68%的員工寧愿使用機(jī)器人而不是經(jīng)理來討論工作場所的壓力。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @Shahin Srowar

3. 人工智能工程化(AI Engineering)

多年來,人們一直擔(dān)心自動化技術(shù)在企業(yè)中的迅速普及會導(dǎo)致工作崗位減少?,F(xiàn)實(shí)要樂觀得多:自動化不是要替換工作,而是要增強(qiáng)工作。

公司知道,員工在重復(fù)性的工作上花費(fèi)了太多時間。因此,越來越多地使用機(jī)器人來執(zhí)行這些任務(wù),例如歸檔工單,發(fā)送和簽名文檔以及與同事交換每小時的班次等。由于自動化,企業(yè)將更多的精力投入到改善工作文化和確保員工對工作滿意的工作上。

人工智能工程化立足于三大核心支柱:數(shù)據(jù)運(yùn)維、模型運(yùn)維和開發(fā)運(yùn)維。強(qiáng)大的人工智能工程化策略將促進(jìn)人工智能模型的性能、可擴(kuò)展性、可解釋性和可靠性,完全實(shí)現(xiàn)人工智能投資的價值。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @Craftwork Studio

4. 企業(yè)數(shù)字孿生

數(shù)字孿生是真實(shí)世界環(huán)境、產(chǎn)品或資產(chǎn)的虛擬表示,用于多種目的。制造商使用數(shù)字雙胞胎來管理機(jī)器和工廠的性能和效率,而城市規(guī)劃者則使用它們來模擬新開發(fā)項(xiàng)目的潛在影響。2021 年數(shù)字孿生將會在物聯(lián)網(wǎng)(IoT)平臺中有更廣泛的應(yīng)用。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @azure.microsoft.com

5. 全面體驗(yàn)(Total Experience)

Gartner 將多重體驗(yàn)定義為一種重要的戰(zhàn)略科技趨勢。而在今年,這一趨勢又進(jìn)一步發(fā)展成為全面體驗(yàn)(TX),將多重體驗(yàn)與客戶、員工和用戶體驗(yàn)相聯(lián)系。Gartner 預(yù)計在未來三年中,提供 TX 的企業(yè)機(jī)構(gòu)在關(guān)鍵滿意度指標(biāo)方面的表現(xiàn)將超越競爭對手?!庇捎谝咔?,移動、虛擬和分布式互動日益盛行,因此企業(yè)機(jī)構(gòu)需要有 TX 策略。TX 將改善體驗(yàn)的各個組成部分,實(shí)現(xiàn)業(yè)務(wù)成果的轉(zhuǎn)型。這些相互交織的體驗(yàn)是企業(yè)運(yùn)用創(chuàng)新革命性體驗(yàn)實(shí)現(xiàn)差異化,從而從疫情中恢復(fù)的關(guān)鍵驅(qū)動力。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @Hamza Abdelhak

6. 行為互聯(lián)網(wǎng)(Internet of Behaviors)

行為互聯(lián)網(wǎng)(IoB)不斷涌現(xiàn),許多技術(shù)都在捕獲并使用人們?nèi)粘I钪械摹皵?shù)字塵?!?。IoB 匯集了面部識別、位置跟蹤和大數(shù)據(jù)等當(dāng)前直接關(guān)注個人的技術(shù),并將結(jié)果數(shù)據(jù)與現(xiàn)金購買或設(shè)備使用等相關(guān)的行為事件相關(guān)聯(lián)。

企業(yè)機(jī)構(gòu)使用該數(shù)據(jù)來影響人的行為。例如為了在疫情期間監(jiān)控對健康規(guī)定的遵守情況,企業(yè)機(jī)構(gòu)可以通過使用 IoB 計算機(jī)視覺來查看員工是否戴著口罩或通過熱成像來識別發(fā)熱者。

Gartner 預(yù)測,到 2025 年末,全球一半以上的人口將至少參加一項(xiàng)商業(yè)或政府的 IoB 計劃。雖然 IoB 在技術(shù)上可成為可能,但社會各界將對各種影響行為的方法展開廣泛的倫理和社會學(xué)討論。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ BayouFord Driver App@hamam zai

7. 網(wǎng)絡(luò)安全網(wǎng)格(Cybersecurity Mesh)

網(wǎng)絡(luò)安全網(wǎng)格使任何人都可以安全地訪問任何數(shù)字資產(chǎn),無論資產(chǎn)或人員位于何處。它通過云交付模型解除策略執(zhí)行與策略決策之間的關(guān)聯(lián),并使身份驗(yàn)證成為新的安全邊界。到 2025 年,網(wǎng)絡(luò)安全網(wǎng)格將支持超過一半的數(shù)字訪問控制請求。

Gartner 研究副總裁 Brian Burke 先生認(rèn)為:“新冠疫情加快了耗時數(shù)十年的數(shù)字化企業(yè)變革過程。我們已經(jīng)越過了一個轉(zhuǎn)折點(diǎn),大多數(shù)企業(yè)機(jī)構(gòu)的網(wǎng)絡(luò)資產(chǎn)現(xiàn)在都已超出傳統(tǒng)的物理和邏輯安全邊界。隨著隨處運(yùn)營的不斷發(fā)展,網(wǎng)絡(luò)安全網(wǎng)狀組網(wǎng)將成為從非受控設(shè)備安全訪問和使用云端應(yīng)用與分布式數(shù)據(jù)的最實(shí)用方法。”

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ Digital security@Stephane Vasadze

體驗(yàn)趨勢

1. 虛擬現(xiàn)實(shí)&增強(qiáng)現(xiàn)實(shí)(VR&AR)

虛擬現(xiàn)實(shí)(VR)再次興起

VR 一直以來是“未來派”技術(shù)的代表之一,在相當(dāng)一段時間卻很難成為主流,當(dāng)然這與 Facebook 的 Oculus Rift、HTC Vive 和 PS VR 之類頭戴相關(guān)設(shè)備高昂的價格標(biāo)簽也有一定的關(guān)系。

不過由于最近 VR 游戲的發(fā)行成功,包括“半條命”(Half-Life Alyx),VR 熱度再次上升。新興廠商為動態(tài)和創(chuàng)造性的混合現(xiàn)實(shí)構(gòu)建新的解決方案;此外,醫(yī)療健康,在線展覽和娛樂藝術(shù)的需求也在增加。

虛擬現(xiàn)實(shí)游戲行業(yè)內(nèi)的全球收入預(yù)計從$ 4 億在 2017 年到 2024 年增長到$ 24 億。@Statista

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ 微軟 HoloLens 展示了“計算的新現(xiàn)實(shí)”。@microsoft.com

那么除了游戲行業(yè)該如何進(jìn)軍 VR 市場?在疫情期間,GDC 在 2020 年使用 VR 中主持了他們的演講,使遠(yuǎn)程參會者能夠 360 度觀看展臺,通過網(wǎng)絡(luò)研討會和聊天室進(jìn)行互動。在 2021 年,我們可以看到更多的企業(yè)會利用這項(xiàng)技術(shù)來觸及全球更多的用戶。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @Mikhail Gorbunov

同時我們還可以預(yù)見在數(shù)字醫(yī)療中使用大量 VR 可以改善對慢性疼痛,焦慮癥和創(chuàng)傷后應(yīng)激障礙的治療。我們甚至可能會看到劇院和博物館采用了這項(xiàng)技術(shù),以保持對公眾的虛擬開放。

設(shè)計增強(qiáng)現(xiàn)實(shí)(AR)

AR 同樣是是“未來派”技術(shù)的代表之一,已經(jīng)獲得越來越多普及。你可以在花園里偶遇一頭真人大小的長頸鹿,也可以想象宜家家具設(shè)計是否符合家里的風(fēng)格,不少廠商已經(jīng)透露不少新穎的 AR 應(yīng)用場景。

通過對于 AR 產(chǎn)品的全球市場可能驟增至 85%,在未來四年將有$ 1650 億市場@Statista

根據(jù)《行業(yè)周刊》的報道,蘋果等公司已經(jīng)在重建和重組日常用戶更容易使用的產(chǎn)品。這家科技巨頭正在研發(fā)多種 AR 產(chǎn)品,包括可以無線連接至 iPhone 并向佩戴者發(fā)出光束的內(nèi)容(如電影,地圖等)的數(shù)字眼鏡,這聽起來似乎有點(diǎn)酷?

2020 年 9 月,馬克·扎克伯格(Mark Zuckerberg)宣布 Facebook 將于明年啟動“邁向增強(qiáng)現(xiàn)實(shí)眼鏡之路的下一步”。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @sparkar.facebook.com

2. 非接觸式互動

語音用戶界面(VUI)

在疫情期間,當(dāng)我們思考如何在不接觸的情況下與設(shè)備進(jìn)行交互時,語音和手勢交互似乎成為了另一種 UI&UX 的趨勢。

其實(shí)早在疫情爆發(fā)之前,這種趨勢就已經(jīng)很明顯,語音交互是未來幾年主要的 UI&UX 趨勢之一,在設(shè)計中可添加語音用戶界面的場景越來越多。例如,您可以使用語音聊天機(jī)器人使訪客使用語音命令進(jìn)行通信。虛擬助手也是如此。在未來幾年中,許多公司將創(chuàng)建完整的語音用戶界面。

學(xué)習(xí)語音交互設(shè)計 → https://www.uisdc.com/zt/vui

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @ Denislav Jeliazkov

語音交互基于 AI 人工智能,我們希望最終能通過語音助手來解決復(fù)雜的問題并且易于使用。下一代 AI 助手將具備:高級個性化,個性化主要的目標(biāo)是使用戶感知內(nèi)容是專屬的。基于語音的助手將通過分析語音和面部表情來了解確認(rèn)交互者的身份。非接觸式交互,語音優(yōu)先界面幫助設(shè)計師減少用戶達(dá)到期望結(jié)果所必須采取的步驟。

手勢控制

手勢控制是一種隨著觸控屏出現(xiàn)而引入的各種手勢控制機(jī)制的一種新技術(shù)拓展?,F(xiàn)在懸空手勢已經(jīng)實(shí)現(xiàn)在設(shè)備上正常工作。例如,最近歐洲豪華車品牌 DS Automobiles 通過空中觸覺反饋和手勢展示了其新的非接觸式控件,聲稱該系統(tǒng)提供的精度比觸摸屏高三倍。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ Haptics and Gesture Control in Automotive @ Ultraleap

視覺趨勢

1. 3D 設(shè)計

3D 同樣是 2021 年的設(shè)計趨勢,3D 設(shè)計目前更容易應(yīng)用在企業(yè)的品牌或產(chǎn)品應(yīng)用中。

審美是一種循環(huán),在長達(dá) 12 年的扁平化設(shè)計之后,Mac 新操作系統(tǒng) Apple Big Sur 也讓 3D 在 UI 設(shè)計中得到更頻繁的使用

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @Eric Hoffman

實(shí)際上早在 2017 年的 Build 大會上微軟宣布采用全新的 Microsoft Fluent Design System 就包含 3D 設(shè)計的五大核心元素:Light(光感)、Depth(深度)、Motion(動畫)、Material(材質(zhì))和 Scale(縮放)。其中就包含微軟最早在 Win7 時代就應(yīng)用了亞克力(毛玻璃)效果,而蘋果則將這一特性發(fā)揮得淋漓盡致。從 z 軸維度出發(fā)的設(shè)計,用它來制造出覆蓋內(nèi)容之上的感覺,令界面元素更有層級,更有趣?;蛟S是因?yàn)槲④洸]有很好的將 Fluent 應(yīng)用在實(shí)際產(chǎn)品中,一直處于概念優(yōu)于實(shí)際。

3D 設(shè)計的流行離不開行業(yè)的布道者們的引領(lǐng),2021 年 3D 設(shè)計將進(jìn)入一個新的開始。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @Ryan.Jyu

2021 年,設(shè)計師(藝術(shù)家)們將徹底打開對 3D 的探索之門,這種趨勢將會大量呈現(xiàn)設(shè)計師們在各種材質(zhì)、光效、物理模擬等深入研究的效果。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @mav.farm

基于 Web GL 的 three.js 正流行;通過 Web 可以隨時隨地訪問 3D 的故事場景,相比過去,現(xiàn)在的前端框架和庫能夠顯著提升頁面加載時效,使得能夠支持更大更為精細(xì)的 3D 場景。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @adidaschile20.com

在 2021 年,3D 只會變得越來越流行,尤其是看到日益普及的 VR 和 AR 技術(shù)。很酷的抽象感,不尋常的角度,您可以在 3D 中完成所有操作而無需使用真實(shí)實(shí)體對象,例如,當(dāng)您需要展示昂貴的汽車或不尋常的房子時,這通??梢怨?jié)省更多成本。3D 吸引了人們的注意力,并使網(wǎng)站更具吸引力,使用戶在頁面上停留的時間更長,轉(zhuǎn)化率也提升了。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @experience.soletanche-bachy.com

當(dāng)然技術(shù)雖不斷發(fā)展,但 3D 的主要缺陷任然存在。3D 對象結(jié)構(gòu)越復(fù)雜,在用戶設(shè)備上執(zhí)行的負(fù)載也就越大。需要確保網(wǎng)站已經(jīng)優(yōu)化完全,以保證可以顯示完整的動態(tài)效果。否則用戶遇到加載過慢或失敗的情況下會適得其反,用戶會產(chǎn)生嚴(yán)重流失。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @Gleb Kuznetsov

2. 動態(tài)化設(shè)計

我們相信所有年齡階段的用戶都喜歡觀看引人入勝的動畫故事或者可交互動畫動作。嘗試使用簡約的界面與大膽有趣的元素結(jié)合在一起,既可吸引用戶,也能保證信息清晰明了。

2021 年,動畫設(shè)計案例將越來越多。無論是界面 UI 動畫,還是大型營銷動畫(包含 3D),技術(shù)的發(fā)展將帶來全新的體驗(yàn)。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @richardmattka.com

3. SVG(可伸縮矢量圖像)的廣泛應(yīng)用

過去在企業(yè)應(yīng)用設(shè)計中,由于瀏覽器兼容問題導(dǎo)致沒有辦法完全覆蓋 SVG,現(xiàn)在除了可以應(yīng)用全局 SVG Icon 以外還可以通過 SVG 來繪制矢量插圖,插圖使用 XML 定義基本屬性,例如路徑、形狀、字體和顏色以及更高級的功能。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @Huseyin

當(dāng)提高顯示分辨率時,PNG、GIF 和 JPEG 會丟失質(zhì)量。而 SVG 可以任意放大或縮小矢量格式而不會降低質(zhì)量。相比位圖,SVG 具有更輕量的體積,更快的訪問速度。

4. UI&UX 輕量化設(shè)計

UI&UX 持續(xù)精簡優(yōu)化已然是趨勢,更少的字段顯示與更少的字段填寫。即使用戶達(dá)到所需結(jié)果所必須采取的步驟也是如此。

注冊與登錄步驟就是案例,2021,請勿強(qiáng)迫用戶記住密碼。例如,在在線商城中,用戶的個人標(biāo)識符可以是他們的電話號碼或生物特征數(shù)據(jù)。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @developer.apple.com

蘋果公司推出了“超級按鈕”,它替代了隨機(jī)數(shù)據(jù)進(jìn)行網(wǎng)絡(luò)注冊。在許多應(yīng)用程序中,您現(xiàn)在只需一個按鈕即可注冊,而無需社交網(wǎng)絡(luò)的參與。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @Heavyweight

冗余的 UI 資產(chǎn)會給設(shè)計系統(tǒng)的維護(hù)和迭代帶來沉重的負(fù)擔(dān),保留核心組件并提升組件利用率,去繁化簡似乎是未來的趨勢。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @bn digital

隨著 iOS 和 Android 陸續(xù)支持了深色模式,深色模式也成為大眾應(yīng)用設(shè)計的標(biāo)配。企業(yè)級應(yīng)用的深色模式也將成為 2021 的趨勢之一。

生產(chǎn)力趨勢

疫情帶來的封鎖與隔離給我們的工作方式帶來極大的挑戰(zhàn),遠(yuǎn)程辦公與在線協(xié)作將會成為常態(tài)化,如何有效的讓設(shè)計師們在線協(xié)作一直是一個巨大難題。

1. 基于 Web 的在線協(xié)作工具,多人實(shí)時在線協(xié)同

Figma

Figma 是一款免費(fèi)的在線 UI 設(shè)計工具,可用于創(chuàng)建、協(xié)作、原型設(shè)計與設(shè)計對接。通過實(shí)時在線的設(shè)計協(xié)作能夠打破設(shè)計師之間的視圖壁壘,能夠?qū)崟r進(jìn)行設(shè)計共享、修改以及反饋。你無需擔(dān)心是否保存,你的設(shè)計稿永遠(yuǎn)保持版本。全平臺兼容,只需打開瀏覽器就可以隨時隨地進(jìn)行設(shè)計。除此之外 Figma 與 Sketch 一樣通過輕量化主體+開放的 API 接口和插件生態(tài)系統(tǒng),豐富的第三方插件市場能夠?yàn)樵O(shè)計生產(chǎn)帶來更多的可能性。

截至 2020 年 4 月,F(xiàn)igma 的估值超過 20 億美元。@福布斯

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ Figma@Remilla Ty

Miro

團(tuán)隊線上協(xié)作的設(shè)計思維導(dǎo)圖工具,核心功能是支持團(tuán)隊在線協(xié)作白板服務(wù),無論是思維導(dǎo)圖、各式圖表、概念圖、還是資訊分析用的魚骨圖、價值鏈分析、PEST 分析,Miro 提供了豐富的免費(fèi)模板。不僅如此 Miro 還提供了更為豐富的內(nèi)容格式,包括視頻、圖片、文檔、標(biāo)簽等。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @miro.com

Pitch

在線演示文稿工具,支持多人實(shí)時在線或離線以及跨設(shè)備構(gòu)建。這是一種針對現(xiàn)代團(tuán)隊需求而構(gòu)建的演示軟件。Pitch 可幫助團(tuán)隊更好地協(xié)作,、精美地制作演示文稿。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @pitch.com

2. 基于 Web 的輕量化工具

在線工具已然成為一種趨勢,從格式轉(zhuǎn)換、圖片處理到 3D 建模我們逐漸可以通過一個瀏覽器來使用這些輕量化工具來解決我們實(shí)際的設(shè)計問題,F(xiàn)igma 已經(jīng)滿足 UI 設(shè)計師的生產(chǎn)力工具所有需求,未來或許有更多基于 Web 的生產(chǎn)力工具出現(xiàn)。

Spline

Spline 是一款 3D 設(shè)計工具,你可以無需下載客戶端在瀏覽器中創(chuàng)建 3D 項(xiàng)目。Spline 最大的特點(diǎn)是輕量,其操作界面跟 Sketch、Figma 結(jié)構(gòu)一致,能夠以 2D 的方式進(jìn)行 3D 設(shè)計;無需 3D 設(shè)計基礎(chǔ)。Spline 具備基礎(chǔ)的 3D 模型編輯功能,同時提供豐富的在線 3D 模型庫使用,模型支持添加事件,通過設(shè)置不同模型狀態(tài)進(jìn)行交互切換。文件可以導(dǎo)出靜態(tài)圖片也可以免費(fèi)導(dǎo)出離線網(wǎng)頁。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @spline.design

Vectary 3.0

Vectary 一款在線 3D 建模設(shè)計工具,提供免費(fèi)場景、模型和材質(zhì)庫,無需從頭開始或花費(fèi)很長時間建造模型,提升 3D 設(shè)計效率。素材庫包含上千個免費(fèi)的可自定義 3D 模型,以及數(shù)百種高質(zhì)量紋理化的材質(zhì)可供使用。VECTARY 現(xiàn)已在 Iphone 和 Android 中全面開通支持 AR 界面,通過在您的網(wǎng)站上使用 Vectary 3D / AR Viewer,每種類型的訪客都可以獲得交互式 3D 或 AR 體驗(yàn)。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @vectary.com

3. 工具平臺化

用未來設(shè)計工具將不僅僅聚焦設(shè)計產(chǎn)出本身,而是不斷向設(shè)計的上下游延伸,打通工作的流程中的各個節(jié)點(diǎn),連接和傳遞每個節(jié)點(diǎn)產(chǎn)出物、打通信息流,從設(shè)計研究→設(shè)計創(chuàng)作→代碼實(shí)現(xiàn)→項(xiàng)目&資產(chǎn)管理,做到全流程全角色全場景覆蓋,形成一個更低成本、更便捷的團(tuán)隊協(xié)作模式。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @invisionapp.com/studio

4. 自動化&智能化

用戶界面設(shè)計工具的趨勢之一:借助現(xiàn)代工具和技術(shù)簡化設(shè)計師的工作流程。例如,Adobe 在 10 月宣布了他們對 Photoshop 22.0 版的更新,其中包括 Nvidia 的許多令人敬畏的 AI 驅(qū)動的功能,這是一組圖像編輯工具,Adobe 稱其為“神經(jīng)過濾器”。Sketch App 最近更新了顏色變量和組件視圖功能,方便更有效的管理顏色一致性。Figma 也迅速更新了為分布式團(tuán)隊添加新功能,包括模板和虛擬會議功能,這些新功能使遠(yuǎn)程協(xié)作更加輕松。Pixelmator 的圖形編輯器的最近更新具有增強(qiáng)的機(jī)器學(xué)習(xí)功能和 GPU 驅(qū)動的圖像編輯功能。

生成設(shè)計(Generative design)是另一個潛在的 UX / UI 趨勢。這是可以分析大量相似數(shù)據(jù),找到其定義特征和特征,然后根據(jù)所提供的數(shù)據(jù)創(chuàng)建新特征的數(shù)據(jù)。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @helpx.adobe.com

5. 結(jié)構(gòu)化設(shè)計系統(tǒng)

代碼結(jié)構(gòu)化思維應(yīng)用設(shè)計工具將是 2021 年的趨勢之一,助力設(shè)計師構(gòu)建結(jié)構(gòu)化組件。Figma 更新的組件變體功能將設(shè)計系統(tǒng)的組織形式結(jié)構(gòu)化,統(tǒng)一管理組件的多種類型、尺寸、以及不同狀態(tài);優(yōu)化設(shè)計層級,從而簡化了資產(chǎn)面板并更緊密地將組件映射到代碼。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @Mohamad Rasouli

6. 設(shè)計開發(fā)態(tài)

設(shè)計開發(fā)態(tài)能夠極大提升設(shè)計與開發(fā)的對接效率,也能減少設(shè)計師與開發(fā)者直接的隔閡。

例如:你可以創(chuàng)建響應(yīng)設(shè)計內(nèi)容的動態(tài)框架。過去搭建或修改一個組件需要不斷的調(diào)整設(shè)計尺寸及間距,現(xiàn)在通過自動布局設(shè)定參數(shù)即可自動適應(yīng)。Figma 中的自動布局(Auto Layout)功能其實(shí)是引入了接近 CSS Box 模型和 Flexbox 在 Web 上的工作方式。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @AsiaInfo Design

New Invision DSM 在 Web 端更新了開發(fā)組件管理方式,通過將“組件代碼”與“設(shè)計稿件”綁定,將設(shè)計系統(tǒng)進(jìn)行統(tǒng)一管理;Zeplin 同樣也更新了設(shè)計組件(UI components)綁定代碼(React components)的功能,讓開發(fā)同學(xué)查看設(shè)計稿切圖標(biāo)注時,可直接訪問已經(jīng)代碼化的組件詳情,提升前端開發(fā)效率。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @Wojciech Zieliński

7. 設(shè)計稿即代碼(Design to Code)

我們常見的 D2C 主要出現(xiàn)在設(shè)計交付前端工具中,如 Sketch Mesure、Zeplin,主要功能是導(dǎo)出靜態(tài)頁面代碼(HTML+CSS)其問題是:代碼機(jī)構(gòu)不合理,可維護(hù)性差。目前業(yè)內(nèi)討論較多的是圖片生成代碼的能力:通過 AI 人工智能將草稿/視覺稿一鍵生成可維護(hù)的前端代碼,提高前端開發(fā)效率。

微軟的 Micosoft AI 的 Sketch2Code 即通過 AI 訓(xùn)練的 Custom Vision Model 可以針對 HTML 手繪模式執(zhí)行對象識別,用于將有意義的設(shè)計元素檢測到圖像中,每個檢測到的元素通過文本識別服務(wù)提取手寫內(nèi)容,被檢測對象的信息及其在圖像中的位置被同步到底層算法結(jié)構(gòu)中,最后對應(yīng)包含檢測到的設(shè)計元素的布局生成有效的 HTML。

除了基本的靜態(tài)設(shè)計能力外,動態(tài)交互、動畫展示等等在新一代的設(shè)計產(chǎn)品里面都可以結(jié)構(gòu)化描述的,未來的 D2C 可以運(yùn)用這部分?jǐn)?shù)據(jù)來生成交互邏輯、動畫代碼等。

越來越火的To B行業(yè),在 2021 年有哪些值得關(guān)注的設(shè)計趨勢?

△ @No-Code web builder@Mohan

結(jié)語

設(shè)計趨勢是周期性的,UI&UX 設(shè)計的新趨勢每年都在變化,這是一種審美循環(huán)。趨勢是必然的,趨勢背后是技術(shù)發(fā)展的浪潮??梢姷氖窃O(shè)計創(chuàng)造的可視語言,這是一種手段,而我們更應(yīng)該關(guān)注背后所傳達(dá)價值。

文章來源:優(yōu)設(shè)  作者:AsiaInfo Design

藍(lán)藍(lán)設(shè)計www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)


B端C化也許是產(chǎn)品設(shè)計的新風(fēng)向

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

最近好多朋友加我微信,向我“咨詢”一二(咨詢真是不敢當(dāng),充其量就是一起探討),基本上集中在 B 端的產(chǎn)品設(shè)計上,略加整理,大概如下幾個問題出現(xiàn)的頻率比較高:

前兩個問題百度一下就可以知道,我就不多說了,重點(diǎn)說說最后一個:B 端如今還有什么機(jī)會留給設(shè)計師們發(fā)揮的空間么?

當(dāng)我在思考這個問題而不得結(jié)果的時候,偶然間發(fā)現(xiàn)今日頭條上線了“我和我的家鄉(xiāng)”,可以免費(fèi)觀看,我就利用坐馬桶的時間斷斷續(xù)續(xù)看完了。說來也挺有意思,感覺恰巧因?yàn)檫@部電影找到了答案:主旋律電影想要被大眾接受順勢而為是必然;

從當(dāng)年火爆到的“建國大業(yè)”到去年的“我和我的家鄉(xiāng)”都是典型的主旋律電影娛樂化;這個事情讓我明白,歌頌祖國未必要手撕鬼子,葛優(yōu)大爺和沈騰叔叔的段子也可以讓我明事理… 所以說不要一味的固守,破局或者順勢有可能是未來的路。我用這個思路套了下剛剛的問題,嗯~也許B端C化是未來 toB 產(chǎn)品的新方向;


NO.1

從設(shè)計風(fēng)格上來講 B 端產(chǎn)品走 C 端老路的趨勢已經(jīng)越來越明顯;從我的角度來看原因主要是(都是在下的猜測),身份模糊(公民和員工之間來回切換)但承載設(shè)備不變(都是手機(jī)或電腦)的情況下打開的 app 也順勢越來越趨同,依據(jù)場景變來變?nèi)サ脑V求大幅降低;再聚焦回來,C端產(chǎn)品從最開始的提倡“花里胡哨”到如今的“高級感”演變過程走了很長,接下來B端也跟隨著從“克制/簡約”進(jìn)化到了“高級感”,具體體現(xiàn)在 2 個點(diǎn)上:信息層次和色彩體系;

1.信息層次:封裝度高,密度低

不知道大家有沒有察覺,在過往使用toB的經(jīng)驗(yàn)里,會有特別累的感覺?我一直堅持一個觀點(diǎn),不管是UI還是交互做設(shè)計的本質(zhì)同樣是對信息的重新編排和處理;通過設(shè)計用的舒服才是王道;

C化最核心的一點(diǎn)就是對信息的處理,以往toB產(chǎn)品的信息密度高和模塊化封裝度低的特質(zhì),隨著新方向的到來也勢必會退出歷史的舞臺;(PS.這些短語都是知識點(diǎn)哈,趕緊記下來,省的匯報的時候只知道說大白話,不知道怎么用理論支持)。

另外隨著MacOS和windows的設(shè)計語言升級(一定意義上操作系統(tǒng)也是B端工具),越來越多的產(chǎn)品跟隨著走上了“材質(zhì)區(qū)分層級”的路線,這也不失是一種好的做法,阿里云就是個典型:


2.色彩體系:

如果你是我的老讀者,應(yīng)該還記得我之前寫過的一篇跟顏色相關(guān)的文章,里面有相對還算全面的定義色彩體系的理論和實(shí)操,感興趣的話可以翻看一下,另外給大家準(zhǔn)備了色彩樣板,有需要的鐵子可以可以試試(文末有領(lǐng)取方式)。

這里再啰嗦一句,作為B端來說,萬綠叢中一點(diǎn)紅是形成“高級感”的最好辦法,其他的就先不展開。之前坊間傳言B端不需要視覺設(shè)計?我是真真的不認(rèn)同啊,不好看也是爛體驗(yàn)的一種,畢竟顏值即正義,好看并不可恥,中看不中用才是忌諱,別給B端產(chǎn)品瞎定義,做一個既好看又好用的產(chǎn)品ta不香么...


NO.2

從我的認(rèn)知上講,用戶體驗(yàn)不再區(qū)分B/C兩端很多年了,但截止到目前為止B端產(chǎn)品的體驗(yàn)遠(yuǎn)不如C端產(chǎn)品做得;其中的原因無非這 2 點(diǎn):

專業(yè)性上好理解,就是用戶基本會被冠以「專業(yè)」之名,所以會出現(xiàn)很多「我以為你懂的」的設(shè)計理念;對于信息量的龐大與否,坦誠的講,造成的原因很有可能是交互上對信息的處理處理不到位,反反復(fù)復(fù)進(jìn)行單一流程的多次復(fù)用,導(dǎo)致看起來很龐大的假象,就這個問題我們展開來說說:

1. “單線程”變“多線程”

B端產(chǎn)品永遠(yuǎn)的主旋律都是“效率”,簡化復(fù)雜流程,專注當(dāng)前任務(wù),是體驗(yàn)的“標(biāo)準(zhǔn)方法”;對于效率的追求我從不否認(rèn),但對方法的執(zhí)行我還是持懷疑態(tài)度,打個比方QQ作為C端巨無霸級的產(chǎn)品一早就出現(xiàn)拖拽 tab 上的紅點(diǎn)消除所有信息:

如上圖所示,這個交互設(shè)計解決了把單線程的操作整合成了單個行為控制多線程操作,減少了很多勞動力的重復(fù)浪費(fèi);這么說有點(diǎn)繞不好理解,用圖來表示估計會好理解一些:

類似的產(chǎn)品還有12306的搶票,思路也大致相同,假如你是過年回家需要購票,當(dāng)你盤算出車次和時間之后,是不得逐條線路搶票?搶票是幫助你規(guī)劃線路,你只需要設(shè)置終點(diǎn),ta自動分流到,匹配到合適的車次,這就是單操作變多線程的處理辦法;

距離QQ的那個交互6年過去了,依舊沒有B端產(chǎn)品可以借鑒這個思路(企業(yè)im的一鍵已讀不能算哈,這個借鑒不高級),其實(shí)很多工作場景下對多線程自動化的工作需求比比皆是,比如很多企業(yè)內(nèi)部上傳文件的時候,上傳一個等一會,且不說有多么低效,更重要的是工作的節(jié)奏遭到了破壞...

概括起來說,在某些場景下(可能是大部分)并不需要專注過程,關(guān)注結(jié)果的意義也許更大;

雖說打工人天下無敵,但也扛不住面面俱到,設(shè)置好工作起點(diǎn)和終點(diǎn),分配好精力也是B端產(chǎn)品設(shè)計義不容辭的責(zé)任,其他無關(guān)緊要的過程,只要不出大的差錯,就隨ta去吧~


2. 新手引導(dǎo)和用戶反饋要做巧

不管是 B 還是 C 在新手引導(dǎo)的主流方法,基本上是上來一股腦的/傾其所有的給我展示所有功能,每次都是無奈的狂點(diǎn)下一步下一步;但當(dāng)用了一段時間,發(fā)現(xiàn)功能沒認(rèn)全的時候...我再也找不回來新手引導(dǎo)了,哈,沒法復(fù)現(xiàn)了,這尼瑪應(yīng)該是最糟糕的體驗(yàn)了吧!基于此我建議新手引導(dǎo)要與內(nèi)容場景相結(jié)合,通過場景牽引的方式達(dá)到學(xué)習(xí)操作的目的;舉個用戶評分的例子:

總之減少用戶試錯,也必定可以極大優(yōu)化用戶體驗(yàn)。


總結(jié)一下

特殊情況影響讓今年是企業(yè)產(chǎn)品高速發(fā)展的一年,各種各樣的企業(yè)賽道號角都已經(jīng)吹響,拼功能的年代已經(jīng)過去,體驗(yàn)有可能是決定購買決策的關(guān)鍵點(diǎn);所以在不改變功能和底層技術(shù)的情況下找到體驗(yàn)突破口是對業(yè)務(wù)最大的貢獻(xiàn);另外希望別過度迷戀所謂的行業(yè)標(biāo)準(zhǔn)方法,試著打破壁壘,站在“產(chǎn)品體驗(yàn)架構(gòu)師”的角度上才能一覽眾山小,加油~

文章來源:UI中國  作者:負(fù)能量補(bǔ)給站

藍(lán)藍(lán)設(shè)計www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

UI設(shè)計-個人集錦

前端達(dá)人

收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏



轉(zhuǎn)自:站酷

作者:Lyxi106


藍(lán)藍(lán)設(shè)計www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計、 網(wǎng)站建設(shè) 平面設(shè)計服務(wù)

合群汽車APP

前端達(dá)人

為海南合群汽車銷售公司設(shè)計的一站式服務(wù)平臺APP



轉(zhuǎn)自:站酷

作者:RainBow丶Lin


藍(lán)藍(lán)設(shè)計www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計、 網(wǎng)站建設(shè) 平面設(shè)計服務(wù)

工具管理系統(tǒng)

前端達(dá)人

收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏




轉(zhuǎn)自:站酷

作者:戲歡你


藍(lán)藍(lán)設(shè)計www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)


產(chǎn)品細(xì)節(jié)剖析,讓你看看大廠是如何做設(shè)計的

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

前言


設(shè)計的思考不僅要注重表象層面,也需要圍繞信息傳達(dá)這一設(shè)計的本質(zhì)功能,以充滿自省的精神深化和反思自己的設(shè)計意識,即做到“好看、好用”。在設(shè)計過程中,要站在公司的利益上,懂用戶所想,在每一個關(guān)鍵點(diǎn)都要帶給用戶意想不到的驚喜,這些往往都是通過細(xì)節(jié)體現(xiàn)出來的。





2021 | 第01篇分享目錄(001~015)


001.「夸克瀏覽器」首個頁面-我的地盤我做主

002.「百度」為什么把返回按鈕放在了左下角?

003.「優(yōu)酷」彈幕中毫不違和感的廣告推送

004.「QQ」發(fā)送圖片-便捷的交互路徑

005.「美團(tuán)」減少一步操作、提升一級體驗(yàn)

006.「京東」搜索框-觸發(fā)用戶轉(zhuǎn)化動機(jī)的占位符

007.「騰訊視頻」付費(fèi)片-試看6分鐘的激進(jìn)小心思

008.「高德地圖」模擬現(xiàn)實(shí)事物運(yùn)行規(guī)律的微交互

009.「網(wǎng)易云音樂」定制您的專屬首頁

010.「夸克瀏覽器」關(guān)鍵詞-提前預(yù)知用戶的需求

011.「快手」剛剛看多-貼心的用戶提醒

012.「騰訊視頻」VIP欄目-免費(fèi)營銷策略轉(zhuǎn)化用戶

013.「支付寶」城市天氣-不僅僅是天氣預(yù)報

014.「躺平」趣味化的下拉刷新樣式

015.「滴滴打車」添加途經(jīng)點(diǎn)-解決位置不統(tǒng)一的情況





001.「夸克瀏覽器」首個頁面-我的地盤我做主


產(chǎn)品體驗(yàn):

進(jìn)入夸克瀏覽器的首個頁面,除此必要的元素之外,看到的是一片純凈之美。長按搜索框下方的空白區(qū)域,點(diǎn)擊“+”號,可根據(jù)用戶自己的喜好從彈窗中將想要的站點(diǎn)入口添加到搜索頁,便于快捷訪問。

設(shè)計思考:

UC瀏覽器可能不是每個移動端用戶都知道,但絕對是一方霸主,夸克與UC本是一家。昨天在網(wǎng)上看到一個帖子說“自從用了夸克之后就把別的瀏覽器全部刪掉了,沒有天氣掛件、沒有新聞推送、沒有購物頻道、沒有游戲插件、沒有精準(zhǔn)廣告、就是最原始的上網(wǎng)工具,仿佛在這看到了當(dāng)年的塞班時代一心一意做用戶體驗(yàn)的影子”。迄今為止,沒有任何一個應(yīng)用可以滿足所有用戶的需求,UC瀏覽器也是如此,夸克可以將那些視UC為糞土的用戶給攬過來,表面上看似搶奪用戶,實(shí)則是風(fēng)險對沖,當(dāng)一個出了問題不是還有另一個么?用戶不管是在夸克還是UC,其實(shí)都在自家,一個獨(dú)善其身,一個兼濟(jì)天下。

用過手機(jī)瀏覽器的人都知道,在資訊爆炸的今天,夸克的畫面干凈得令人難以置信。在干凈的同時,并非是缺少這些站點(diǎn)模塊,而是放在了暗處,用戶可以根據(jù)自己的喜好將站點(diǎn)咨詢模塊調(diào)用出來,自定義空白區(qū)域,寓意用戶“自己的地盤自己做主”。眾所周知,大多數(shù)瀏覽器都有站點(diǎn)推薦的功能,不過該功能都是給相應(yīng)網(wǎng)站打廣告的,內(nèi)容沉雜,尤其是一些強(qiáng)制性的內(nèi)容讓用戶產(chǎn)生了逆反心理,而夸克精選中的網(wǎng)站,則是一些價值很高的優(yōu)秀站點(diǎn),并非廣告業(yè)務(wù),這點(diǎn)可以從致用戶的一封信和網(wǎng)站類型得出。這也是夸克被譽(yù)為最純凈瀏覽器的原因之一,不管是APP內(nèi)容還是用戶體驗(yàn)、易用性方面都能提升用戶的忠誠度,深得廣大用戶喜愛。





002.「百度」為什么把返回按按鈕放在了左下角?


產(chǎn)品體驗(yàn):

進(jìn)入百度APP,頁面中80%以上的返回操作入口都放置在左下角,單手操作手機(jī)的用戶觸手可及。

設(shè)計思考:

Android智能設(shè)備的返回入口其實(shí)一直都在屏幕下方,只不過是根據(jù)品牌的不同,左右位置不同而已。根據(jù)后來大屏手機(jī)的普及,為了節(jié)約空間資源,使屏幕最大化的被使用,把原先硬件上的部分操作入口給隱藏了,但一直都存在。設(shè)計師都知道,iOS與Android的設(shè)計規(guī)范存在著差異化,比如返回入口就一直在左上角,雖然也有右滑返回的交互手勢,但畢竟是隱藏的,而且對于部分頁面的左右滑動,只能對tab導(dǎo)航起到作用,基于目前的趨勢,手機(jī)的屏幕越來越大,單手操作的靈活性就成了難點(diǎn)。

百度APP的大部分頁面則是把返回按鈕直接從左上角搬到了左下角,被較為激進(jìn)的用戶稱為反人類的設(shè)計,其實(shí)并非如此。大屏幕尺寸已經(jīng)是趨勢,屏幕大意味著內(nèi)容可以更大限度地得到展示,將返回按鈕放在左下角能有效的解決的用戶單手操作大屏幕手機(jī)操作的難點(diǎn),更易于操作,提升便捷性。更有效的防止用戶因操作困難而導(dǎo)致手機(jī)滑落(碎屏),增加安全系數(shù)。





003.「優(yōu)酷」彈幕中毫不違和感的廣告推送


產(chǎn)品體驗(yàn):

在優(yōu)酷觀看視頻打開彈幕后,每隔幾分鐘,系統(tǒng)會推送一條廣告穿插在彈幕的內(nèi)容中,點(diǎn)擊可進(jìn)入對應(yīng)的頁面。

設(shè)計思考:

在互聯(lián)網(wǎng)產(chǎn)品中,花樣廣告的出場方式屢見不鮮,比如在看視頻、看書之前/過程中,總是被突入起來的的廣告打斷,用戶雖然很煩但別無選擇,畢竟沒有一款真正的既免費(fèi)又免廣告還很牛B的產(chǎn)品無償提供給用戶使用,即便用戶覺得自己沒有認(rèn)真看過這些廣告,但是只要它們在用戶面前完成了播放,哪怕只是聽到了,那就完成了品牌意識 的輸出這個過程,可能會無形中就知道了這個品牌的存在和定位,在未來的某個場景中,用戶會默許和遵從這個品牌的輸出方式,乃至消費(fèi)。廣告作為企業(yè)盈利的一種方式,不可避免,只會在盡可能減少用戶反感或抗拒的情況下自然出現(xiàn)。

優(yōu)酷APP用了一種較為新奇的方式植入廣告,基于很多用戶在看視頻時都有開彈幕的習(xí)慣,直接將廣告穿插在了彈幕區(qū)域,每間隔幾分鐘就會推送一條,跟隨彈幕一起流動,毫無違和感。雖然廣告植入會引起用戶的反感,但以彈幕的方式出現(xiàn),并未占用額外空間及打擾用戶觀看視頻,很大程度上降低了對用戶的打擾及觀看視頻的沉浸體驗(yàn),增加了用戶對廣告的接受程度,如果對某個廣告感興趣,點(diǎn)擊后面的入口即可直接跳轉(zhuǎn)對應(yīng)的內(nèi)容頁面。





004.「QQ」發(fā)送圖片-便捷的交互路徑


產(chǎn)品體驗(yàn):

在QQ聊天對話框,點(diǎn)擊工具欄的圖片入口調(diào)出相冊,按住想要發(fā)送的圖片并往上拖動,松手即可發(fā)送。

設(shè)計思考:

我們下載到手機(jī)的APP,大部分在首次打開時都會彈出一系列的系統(tǒng)權(quán)限,比如相冊、相機(jī)、位置、網(wǎng)絡(luò)...等,社交類型的更是不必多說,基于應(yīng)用本身的性質(zhì),相冊、相機(jī)及通訊錄類型的權(quán)限都是必備開啟狀態(tài),以便于在使用過程中的圖片、視頻交流。

QQ開啟相冊權(quán)限后在用戶體驗(yàn)上更是舉一反三,用戶在聊天過程中如果有使用圖片的需求,點(diǎn)擊后,系統(tǒng)會將手機(jī)最近保存的50張圖片,按照時間的先后順序以完整縮略圖的方式直接顯示在聊天界面的工具欄下方,用戶只需按住想要選擇的圖片并往上拖動,松手即可發(fā)送,非常方便,免去了常規(guī)的觸發(fā)跳轉(zhuǎn)頁面調(diào)取相冊的多步驟操作,且有效降低聊天過程中因頁面跳轉(zhuǎn)帶來的沉浸式的視覺思路阻斷,優(yōu)化了操作路徑,提升產(chǎn)品的易用性。





005.「美團(tuán)」減少一步操作、提升一級體驗(yàn)


產(chǎn)品體驗(yàn):

在美團(tuán)訂單列表頁面,單擊其中一個訂單從右側(cè)向最左側(cè)滑動,即可出現(xiàn)彈出提示,點(diǎn)擊刪除完成操作。

設(shè)計思考:

刪除操作,我們一點(diǎn)也陌生,大部分出現(xiàn)在列表類型的頁面。早期智能設(shè)備的刪除入口基本都是通過右上角編輯或單個內(nèi)容區(qū)域明顯的刪除圖標(biāo)入口以完成對應(yīng)的刪除需求。后來,也不乏一些應(yīng)用為了節(jié)省頁面空間,去掉了明面上的刪除入口,通過長按交互操作來完成刪除流程,但時至今日,并不廣為人知。

美團(tuán)APP的訂單列表,只需將單個內(nèi)容從右滑至最左側(cè),從自動出現(xiàn)的彈窗中完成刪除操作。其實(shí)這種交互方式在目前看來并不新鮮,基本普及了,但關(guān)注細(xì)節(jié)的用戶會發(fā)現(xiàn),大部分APP內(nèi)容的刪除,都是在左滑之后調(diào)出刪除入口,需點(diǎn)擊之后才彈出確認(rèn)框,繼而完成刪除。美團(tuán)APP則是在用戶有明確刪除需求的情況,從右至左大區(qū)域滑動并自動觸發(fā)刪除入口,省去點(diǎn)擊觸發(fā)彈窗的操作步驟,正所謂移動界面、體驗(yàn)至上,減少一步操作,就能提升一級體驗(yàn)。

(除了需要對用戶的刪除操作做出挽留、有營銷的多功能隱藏入口外,如無明確需求,建議省略左滑后需要再次點(diǎn)擊觸發(fā)彈窗的這一步操作)





006.「京東」搜索框-觸發(fā)用戶轉(zhuǎn)化動機(jī)的占位符


產(chǎn)品體驗(yàn):

京東搜索框的占位符,會根據(jù)用戶曾經(jīng)搜索或查看過的商品關(guān)鍵詞進(jìn)行提示,每2秒鐘切換一次,以便提醒用戶再次查找之前可能想購買的的商品。

設(shè)計思考:

占位符就是在輸入框中占住一個固定的位置,然后用戶可以根據(jù)文案描述或提示語來明確每個表單輸入框應(yīng)當(dāng)填什么內(nèi)容,并且能夠促進(jìn)表單輸入完成和提高轉(zhuǎn)化率所存在的一個元素。最為常見的就是“請輸入xxx”一段提示性質(zhì)的文案,但如果把占位符的作用僅限于此,那就太浪費(fèi)資源了。

京東APP搜索框的占位符開啟了自動搜索建議機(jī)制,不僅展示了平臺主推、熱門等部分商品的關(guān)鍵詞,還通過動態(tài)預(yù)測用戶查詢方向,曾經(jīng)搜索或?yàn)g覽過的商品關(guān)鍵詞會替代占位符給予用戶提示。比如用戶搜索或購買過狗糧,后續(xù)進(jìn)入APP,系統(tǒng)就以占位符的方式推薦跟小狗相關(guān)的商品,比如狗窩、驅(qū)蟲藥、罐頭等,雖然不能直接進(jìn)行搜索,但足以喚醒無目標(biāo)用戶的購物記憶,幫助用戶明確購物需求,以便用于迅速作出決策、執(zhí)行操作,起到提升下單轉(zhuǎn)化的推動作用。





007.「騰訊視頻」付費(fèi)片-試看6分鐘的激進(jìn)小心思


產(chǎn)品體驗(yàn):

觀看騰訊視頻付費(fèi)影片,可免費(fèi)試看6分鐘,時間到了會自動暫停并彈出付費(fèi)渠道彈窗,付費(fèi)/放棄觀看二選一。

設(shè)計思考:

廣告和影片付費(fèi)對視頻類型的應(yīng)用來說,是兩個非常重要的盈利渠道。平臺除了日常的維護(hù)費(fèi)用外,且不說影片的質(zhì)量怎么樣,單是購買版權(quán)就是很大一筆費(fèi)用,所以收費(fèi)也是合情合理,用戶通??梢酝ㄟ^購買單片或開通平臺VIP觀看付費(fèi)影片。使用過騰訊視頻的用戶都知道,付費(fèi)影片可以免費(fèi)試看6分鐘,那么為什么不是直接放在付費(fèi)區(qū)域,只對付費(fèi)用戶開放呢?

騰訊視頻的試看其實(shí)相當(dāng)于打開用戶的潘多拉魔盒,大部分影片6分鐘基本已初入劇情,能吊足胃口,激發(fā)用戶看下去的興趣,如果用戶不喜歡,也有自己選擇的權(quán)利。通過一小段的試看把付費(fèi)片的部分價值明確告知用戶,用細(xì)節(jié)不斷觸達(dá)用戶心智,達(dá)到吸引用戶、引導(dǎo)用戶轉(zhuǎn)化目的。另外,很多用戶都傾向于回報別人的好意,投之以木桃,報之以瓊瑤,通過免費(fèi)時間段的觀看,礙于面子心理,也有可能觸發(fā)用戶的付費(fèi)動機(jī)(這個不難理解,比如我們路過某個熟人的水果攤,每次都會叫我們?nèi)L一下,久而久之,即使沒有購買需求,礙于面子,多少也會買一點(diǎn)),從而形成轉(zhuǎn)化,為平臺帶來收益。





008.「高德地圖」模擬現(xiàn)實(shí)事物運(yùn)行規(guī)律的微交互


產(chǎn)品體驗(yàn):

高德地圖規(guī)劃路線后,選擇出行方式時,用模擬現(xiàn)實(shí)事務(wù)的微動效圖標(biāo)+文案提示對應(yīng)的出行方式,直觀且趣味的表現(xiàn)方式更有代入感。

設(shè)計思考:

我們經(jīng)常在網(wǎng)上看到這樣的問題“高德地圖與百度地圖到底哪個好用”,準(zhǔn)確的說是各有千秋,高德地圖用戶略多于百度地圖,若論起用戶使用體驗(yàn),兩家的應(yīng)用一點(diǎn)都不含糊。在導(dǎo)航軟件作為用戶出行必備軟件之一的今天,不僅僅是認(rèn)路,更是用戶在外吃、喝、玩、樂的一款綜合體,其用戶體驗(yàn)一直都是企業(yè)研究的重點(diǎn)。

使用高德地圖選擇出行時,出行方式圖標(biāo)以模擬現(xiàn)實(shí)事物的運(yùn)行規(guī)律, 利用現(xiàn)有認(rèn)知,幫助用戶輕松掌握界面的使用方式,縮短對出行方式的理解時間, 的降低用戶的學(xué)習(xí)成本。同時圖標(biāo)動效的展現(xiàn)方式,能增加趣味性、以及用戶對于界面功能直接操縱的感知,降低操作難度,用情感化方式的表現(xiàn),提升用戶粘性。





009.「網(wǎng)易云音樂」定制您的專屬首頁


產(chǎn)品體驗(yàn):

在網(wǎng)易云音樂首頁,將頁面向上滑至底部,進(jìn)入自定義排序功能,即可定制用戶自己喜歡的專屬首頁樣式以及功能模塊的先后順序。

設(shè)計思考:

很多設(shè)計團(tuán)隊都深知用戶體驗(yàn)至上的道理,但一個應(yīng)用界面的交互及展現(xiàn)樣式不管以何種方式呈現(xiàn),都不可能滿足所有用戶的需求,只能在不斷追求細(xì)節(jié)的基礎(chǔ)上來滿足更多用戶。首頁自定義在一些部分較為個性化的APP上已經(jīng)不足為奇了,即根據(jù)用戶自身的需求,去修改系統(tǒng)、官方提供的頁面內(nèi)容及先后順序。不過在眾多APP的首頁自定義功能的認(rèn)知里,都是對頁面的原有功能進(jìn)行增減及自定義排序。

在網(wǎng)易云音樂APP版本的首頁底部也增加了自定義排序功能入口,不同于其他APP頁面自定義的是除了能對現(xiàn)有功能進(jìn)行增減及排序外,還特別定制了三種不同設(shè)計樣式的呈現(xiàn)以供用戶選擇,相當(dāng)于用戶隨時都可以對首頁進(jìn)行改版。不用的用戶都有不同的視覺瀏覽及操作喜好,比如大卡片、九宮格、操作熱區(qū)的范圍等,網(wǎng)易云音樂通過提供不同的首頁樣式可以滿足更多用戶的需求,提供更愉快的使用體驗(yàn),增強(qiáng)用戶的信任感,即多滿足一個用戶就可能多留住一群用戶,降低了用戶流失概率。





010.「夸克瀏覽器」關(guān)鍵詞-提前預(yù)知用戶的需求


產(chǎn)品體驗(yàn):

使用夸克瀏覽器搜索相關(guān)內(nèi)容時,系統(tǒng)會自動檢索關(guān)鍵詞,并將關(guān)鍵詞對應(yīng)的常見內(nèi)容結(jié)果以卡片樣式展示給用戶,隨著關(guān)鍵詞的變化,匹配的內(nèi)容也隨之改變。

設(shè)計思考:

說到瀏覽器的作用,想必大家腦海里的第一印象就是搜索,將自己不明白的東西通過搜索引擎從互聯(lián)網(wǎng)大數(shù)據(jù)中自動匹配出海量的相關(guān)數(shù)據(jù)鏈接,提供的信息量非常龐大,包含各色各樣的新聞、問答、文章,可以說一應(yīng)俱全,涵蓋一切,其各種瀏覽器的搜索操作方式大同小異,基本都是通過輸入關(guān)鍵詞,然后點(diǎn)擊搜索出結(jié)果。

夸克瀏覽器在用戶搜索的操作(點(diǎn)擊搜索之前)過程中,增加了一個細(xì)節(jié),即“行為預(yù)判”,通過用戶輸入的關(guān)鍵詞,提前預(yù)知用戶可能想要查找的內(nèi)容,以簡介的方式呈現(xiàn),給用戶提供一個快捷通道,加深用戶對此關(guān)鍵詞條的認(rèn)知,快速判斷出是否滿足自己的需求。系統(tǒng)所匹配的卡片式內(nèi)容簡介是通過數(shù)據(jù)庫長時間的數(shù)據(jù)分析,提取其中較為共性、常見的內(nèi)容來反映用戶可能出現(xiàn)的興趣與需求,并合理挖掘使用,通過引導(dǎo)便于用戶快速識別并點(diǎn)擊,縮短輸入時間,還能解決用戶對關(guān)鍵詞組織不清晰、邏輯不清的用戶給與指導(dǎo),提升產(chǎn)品的易用性。





011.「快手」剛剛看過-貼心的用戶提醒


產(chǎn)品體驗(yàn):

從快手“精選”欄目進(jìn)入用戶主頁,在作品列表將所瀏覽過的視頻上標(biāo)記剛剛看過,避免重復(fù)點(diǎn)擊觀看。

設(shè)計思考:

身處移動互聯(lián)網(wǎng)浪潮之中,我們不難發(fā)現(xiàn),如今的短視頻把用戶的卷入和參與推向了一個新高度,尤其是生活在大城市高度壓力下的年輕用戶群。學(xué)累了,就想刷個小視頻放松下,真以為然后就能集中精力再去學(xué)習(xí)?其實(shí)都是在扯淡,總覺得接下來的某個視頻會有種奇異的魔力,一刷就停不下來,就好比在無邊無際的海洋中,越喝越渴,別說自身難以碎片化學(xué)習(xí),就連老人和小孩都帶進(jìn)來了。抖音和快手作為目前短視頻的代表,都有著龐大的用戶群,在用戶需求基本都能滿足的條件下,其戰(zhàn)略方向準(zhǔn)確的基礎(chǔ)上,誰的用戶體驗(yàn)最好,誰就是最后的贏家。

快手APP雖然被后來者抖音趕超,但在用戶體驗(yàn)上從未含糊過。細(xì)心的用戶可能會發(fā)現(xiàn),在用戶主頁的作品列表中,剛剛看過的短視頻做作了提醒標(biāo)記,告知用戶少走冤路,避開已看過的短視頻,可以避免用戶因重復(fù)點(diǎn)擊觀看而浪費(fèi)時間,且在非WiFi環(huán)境下,還能節(jié)約用戶的數(shù)據(jù)流量,這個提示算是很貼心了。





012.「騰訊視頻」VIP欄目-免費(fèi)營銷策略轉(zhuǎn)化用戶


產(chǎn)品體驗(yàn):

騰訊視頻VIP欄目中的電視劇,基本都可以免費(fèi)看前面的幾集,然后根據(jù)劇情的發(fā)展程度,從免費(fèi)變成付費(fèi),未完結(jié)的電視劇還可以通過二次付費(fèi)進(jìn)行超前點(diǎn)播。

設(shè)計思考:

免費(fèi)的東西人人都喜歡,古今中外大都如此,免費(fèi)策略營銷也因此有強(qiáng)大的生命力。但互聯(lián)網(wǎng)應(yīng)用如若完全免費(fèi),不具商業(yè)性,可能連基本的日常生活都難以維持。大家都知道,會員付費(fèi)是影視類應(yīng)用盈利的一大來源,但用戶對付費(fèi)造成自己財產(chǎn)損失有種天然的抗拒,通常電視劇都提供幾集免費(fèi)觀看,然后才硬性要求開通VIP。

視頻類應(yīng)用大都如此,這里以騰訊視頻為例。不難發(fā)現(xiàn),付費(fèi)區(qū)不同的電視劇,其免費(fèi)觀看的集數(shù)不同,這并不是隨意設(shè)定,而是根據(jù)劇情的發(fā)展程度,在某個“高潮”即將迭起的那一集開始收費(fèi),通過免費(fèi)階段的觀看,對用戶產(chǎn)生一定的吸引,勾起想要看下去的欲望,從而出現(xiàn)付費(fèi)動機(jī)以促成用戶開通VIP。這其中還有一部分互惠原則存在,即給用戶免費(fèi)一部分之后,降低用戶付費(fèi)的心理負(fù)擔(dān),提高對費(fèi)用的接受程度,來而不往非禮也。針對未完結(jié)的電視劇,如果熱度較高,在用戶的觀看欲望高漲之際抓住機(jī)會點(diǎn),通過二次付費(fèi)提供超前點(diǎn)播,用戶也隨之接受。不管是強(qiáng)制VIP還是二次付費(fèi)點(diǎn)播,其都需要在合適的時間、合適的地點(diǎn)予以合理的出現(xiàn),才有利于的轉(zhuǎn)化用戶。





013.「支付寶」城市天氣-不僅僅是天氣預(yù)報


產(chǎn)品體驗(yàn):

支付寶首頁左上角城市下方提供了天氣狀況,進(jìn)入切換地區(qū)頁面,會展示當(dāng)前城市最近幾天的天氣情況。

設(shè)計思考:

隨著支付功能的普及,幾乎也成了每天都會打開的引用,它集合了我們的衣食住行,以前出門不能忘了帶錢包,而現(xiàn)在只需要一部手機(jī)就能搞定一切。雖然功能眾多,但對大部分用戶來說,最主要還是歸結(jié)于支付功能,除了部分線上支付外,就是線下支付了,顧名思義,線下即涉及用戶的出行。

支付寶首頁城市下方的天氣預(yù)報,為用戶提供了貼心的提醒,便于有出行需求的用戶根據(jù)天氣狀況的程度決定是否必須出行或準(zhǔn)備出行的必備物品。同時支付寶集合人們的生活服務(wù),即使用戶放棄出行,部分事情也可以通過支付寶線上解決,比如外賣、購物等。





014.「躺平」趣味化的下拉刷新樣式


產(chǎn)品體驗(yàn):

躺平APP在頁面下拉刷新時,會出現(xiàn)一個倒掛俯沖的“小人兒”動效結(jié)合情感化設(shè)計,趣味且引人注目。

設(shè)計思考:

下拉刷新是APP不可缺少的功能,十分常見,主要從品牌、功能、驚喜、運(yùn)營、反饋五個維度結(jié)合情感化設(shè)計。在頁面下拉刷新的時候,整個頁面也會跟著下移,待頁面數(shù)據(jù)加載完成,頁面會恢復(fù)到初始狀態(tài),在這中間就存在一個時間差,一個好的下拉刷新樣式,能讓用戶通過時間差享受到趣味化的視覺體驗(yàn)及減少等待過程中的焦慮感。

躺平APP下拉刷新使用了品牌IP插圖,從外觀視覺上是給用戶打造品牌印象,倒掛俯沖的“小人兒”動效結(jié)合情感化設(shè)計,趣味化的用戶體驗(yàn),能在產(chǎn)品特性上帶給用戶驚喜,勾起回憶,通過視覺跟用戶進(jìn)行情感互動。





015.「滴滴打車」添加途經(jīng)點(diǎn)-解決位置不統(tǒng)一的情況


產(chǎn)品體驗(yàn):

使用滴滴出行叫車,用戶在行程前輸入目的地時,點(diǎn)擊右側(cè)“+”符號添加最多不超過三個途經(jīng)點(diǎn)。司機(jī)將按照乘客預(yù)先設(shè)定多個“途經(jīng)點(diǎn)”,把多個乘客送達(dá)預(yù)定位置,每個途經(jīng)點(diǎn)的停留時間不超過3分鐘。

設(shè)計思考:

打車模式從之前的線下出租車轉(zhuǎn)戰(zhàn)到線上,誕生的了很多叫車平臺,其用的最多、知名度最高的當(dāng)屬滴滴出行,線上叫車服務(wù)給我們的出行帶來的極大的便利。不知道大家有沒有碰到過這種情況,幾個人一起叫車但下車點(diǎn)不同,等到需要時可能會跟司機(jī)發(fā)生不必要的糾紛或不愉快的出行。多個人的上車點(diǎn)不同,但終點(diǎn)一樣,也會被迫每人都要叫車,因此需要付出更多的金錢成本。

滴滴出行APP的添加途經(jīng)點(diǎn)功能,完美的解決的多個用戶出行的這種煩惱。途經(jīng)點(diǎn)旨在滿足多人共同乘車、個人多點(diǎn)出行等場景下多目的地經(jīng)停的需求,減少口頭溝通帶來的誤解與不便。途經(jīng)點(diǎn)可以為乘客停車3分鐘,不用額外收費(fèi),如乘客需要在某個地點(diǎn)長時等待,則需與司機(jī)溝通達(dá)成一致即可,隨著此功能的上線,滴滴出行為用戶提供了更為便捷的打車體驗(yàn)。


文章來源:站酷  作者:大漠飛鷹CYSJ

藍(lán)藍(lán)設(shè)計www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)


設(shè)計的概念

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

什么是設(shè)計?如何定義設(shè)計?

設(shè)計概論的系列文章是從新設(shè)計概論與應(yīng)用的課程中分裂出來的,整個完整的知識體系參考了100多本設(shè)計概論,藝術(shù)概論,設(shè)計史等書籍的知識,屬于非常專業(yè)知識。設(shè)計概論作為設(shè)計的最深層的知識,不應(yīng)該只應(yīng)用于考研與學(xué)術(shù)研究,我個人很希望把這些研究型知識作為應(yīng)用型知識的參考。


如果問設(shè)計師設(shè)計是什么,可能大多數(shù)人都回答不上來。設(shè)計只注重表面形式與風(fēng)格,就無法產(chǎn)出有深度的作品。每天都在看流行風(fēng)格與設(shè)計趨勢,而不探究和挖掘設(shè)計的本質(zhì)相關(guān)的知識,設(shè)計思維就會被形式所困,風(fēng)格所限。



目錄


1. 第一個故事(電話機(jī))

2. 第二個故事(瓦西里椅)

3. 設(shè)計的萌芽

4. 思維延伸(快速過稿)

5. 再延伸(自我思維)

6. 語言與語源




第一個故事


在理解設(shè)計的概念之前,我們先講兩個關(guān)于設(shè)計的小故事,第一個故事,在1876年3月,亞歷山大·貝爾申請了電話的專利,早期的電話是壁裝式的,是裝在墻壁的,上面的兩個鈴鐺起到來電提醒的作用,下面是聽筒和話筒;貝爾申請完專利后,同年他發(fā)出了世界上第一條電話信息,1年以后創(chuàng)建了貝爾電話公司,從此改變了人們的通信方式。

Alexander Graham Bell  1847~3/3-1922年8月2日 


過了61(1937年),美國藝術(shù)設(shè)計師亨利 · 德雷夫斯,為貝爾公司設(shè)計的以塑料為材料的電話機(jī),如下圖所示,別看它表面很光滑像金屬,其實(shí)它的外殼是塑料材質(zhì);

undefined

塑料材質(zhì)電話機(jī)  型號Model 302


金屬材質(zhì)的電話機(jī)長這樣,觀察細(xì)節(jié)它有撥號盤是用黃銅做的,外殼就是金屬的;以塑料材質(zhì)的電話機(jī)迅速代替了以金屬為材料的電話機(jī),塑料的成本低,做工工藝要求更低,就這樣,塑料材質(zhì)的電話機(jī)迅速風(fēng)靡全球,影響至世界;

金屬材質(zhì)電話機(jī)  貝爾電話MFG公司


那我們縱觀電話的發(fā)展來看,電話一直不斷的進(jìn)行創(chuàng)新,如金屬材質(zhì)變?yōu)樗芰喜馁|(zhì),座機(jī)變?yōu)槭殖蛛娫?,還有諾基亞經(jīng)典手機(jī)3210和蘋果Iphone12智能手機(jī)的出現(xiàn),都是在滿足人們的諸多需求;直到2007年喬布斯發(fā)布第一代Iphone手機(jī)后,現(xiàn)代智能電話不僅成為了人們必備的通信設(shè)施,也成為了人們娛樂和工作的智能工具。

 史蒂夫·喬布斯



這里我們就要思考一下!

為什么要不斷進(jìn)行電話改進(jìn)?

進(jìn)行的創(chuàng)新與創(chuàng)造?

 

  


第二個故事


我們坐過的或者見過的鋼管椅,如圖所示比較現(xiàn)代化的椅子,這種椅子就是用鋼管作為骨架的椅子,它的原型,也就是世界上第一把鋼管椅,是由包豪斯設(shè)計師馬塞爾 · 布魯耶設(shè)計的,也就是他做的這個椅子。

馬塞爾·布魯耶與瓦西里椅


椅子尺寸是79×79×79厘米,最大高度42厘米;背靠與座面采用皮革、帆布材料,1925年生產(chǎn),他的設(shè)計靈感來自阿德勒自行車的把手,這里有點(diǎn)抽象,我們找一個實(shí)際例子進(jìn)行對比,大圖就是阿德勒自行車,自行車把手和椅子外形很像吧。為了紀(jì)念他的老師,抽象藝術(shù)大師瓦西里·康定斯基,就把這椅子命名為“瓦西里”椅。

現(xiàn)代鋼管椅的設(shè)計是瓦西里椅的延伸

 

講完故事我們需要思考一下。電話機(jī)由金屬材料改為塑料材料,改良的意義在于要滿足當(dāng)下的需求進(jìn)行的創(chuàng)新與制造;而瓦西里椅不管是以阿德勒為原型進(jìn)行設(shè)計,還是現(xiàn)代椅子以它為原型進(jìn)行設(shè)計,設(shè)計的特性都是在原有的思維基礎(chǔ)上進(jìn)行創(chuàng)新與創(chuàng)造。電話機(jī)和椅子的創(chuàng)新都意味著“設(shè)計是思維形成的過程”,這也是設(shè)計本身的概念。

 



設(shè)計的萌芽


上面講的兩個故事因貼近我們的生活,所以理解起來沒什么難度。其實(shí)這里用“設(shè)計的萌芽”來解釋這個概念似乎更合理。


設(shè)計的萌芽是從舊石器時代開始的,當(dāng)時人類對一些天然的石塊(瑪瑙和石英巖等)進(jìn)行石器的打制(通過敲打的方法進(jìn)行工具的制造),打制的方法有幾種,分別是錘擊法,碰砧法,砸擊法,間接打法,石器的制作是通過對各種石頭的敲打制成的。

舊石器時代特點(diǎn) - 打制石器


而新石器時代的到來,人類利用骨頭、石頭和木頭等材料,通過磨制的方法來制作各種各樣的石器。后來通過改變材料的物理性質(zhì)為嘗試,做出了手工藝美術(shù)代表——陶器。

新石器時代特點(diǎn) - 磨制石器


新石器時代的器物注重實(shí)用性與審美性的結(jié)合,滿足物質(zhì)需求與審美需求的需要。作品有陶鷹鼎、人頭形器口彩陶瓶、漩渦紋罐、弧邊三角紋彩陶盆等,石器時代也意味著設(shè)計活動的產(chǎn)生。

陶鷹鼎 -代仰韶文化 (約公元前5000年-前3000年) 


從打制石器到磨制石器,以及人類開始使用工具1利用工具2進(jìn)行藝術(shù)創(chuàng)造活動3 ,新的思維不斷發(fā)展和形成,就意味著設(shè)計是思維形成的過程。


注解12:磨制的石器、陶器、畜牧業(yè)、手工業(yè)和原始農(nóng)業(yè)這些新時期石器的根本標(biāo)志的出現(xiàn),就足以說明人類開始更有效地使用工具和利用工具。


注解3 :設(shè)計活動是依存于最早的藝術(shù)活動中的,也可以直接說設(shè)計源于藝術(shù);但藝術(shù)的起源一直都是斯芬克斯之謎;而我只能通過格羅塞的著作《藝術(shù)的起源》中尋找一些信息。


第三章 - 原始民族 開頭寫到“藝術(shù)的起源,就是文化起源的地方”;

第四章 - 藝術(shù) 章節(jié)中寫道“無論什么時代,無論什么民族,藝術(shù)都是一種社會的表現(xiàn),假使我們拿它當(dāng)作個人的現(xiàn)象,就立刻會不能了解它原來的性質(zhì)個意義;是不可以理解,孤芳自賞的各類藝術(shù)形態(tài)均是社會現(xiàn)象的縮影呢,這個還挺值得探究的。

 

 

思維延伸


我們確定了設(shè)計是思維形成的過程后,根據(jù)“兩個故事”和“設(shè)計的萌芽”進(jìn)行理性的推斷,就可以得出設(shè)計的定義。從廣義的角度去理解,人類一切創(chuàng)造性活動和造物活動都可以稱為設(shè)計;


狹義角度去理解,設(shè)計就是構(gòu)想和解決問題的過程,應(yīng)以人為本,通過系統(tǒng)化的方法去滿足消費(fèi)者的市場需求,進(jìn)而產(chǎn)生功能價值審美價值。

 

我們只理解設(shè)計的概念(設(shè)計是思維形成的過程)和設(shè)計的定義是遠(yuǎn)遠(yuǎn)不夠的,知識是拿來思考拿來使用的,所以這里就要利用“設(shè)計是思維形成的過程”這個核心概念,看它能引發(fā)什么新的思考,能得哪些相應(yīng)的體現(xiàn)。


首先要考慮的是 “為什么不能快速過稿” 的問題,設(shè)計師是設(shè)計思維,客戶是戰(zhàn)略思維,設(shè)計思維考慮的是設(shè)計的審美與功能的問題,戰(zhàn)略思維考慮的是成本控制,轉(zhuǎn)化率,市場滲透,品牌統(tǒng)一化等等一系列問題;設(shè)計師與客戶考慮問題的角度不同,思維不同就會產(chǎn)生摩擦與碰撞,造成意見和觀念不一致的結(jié)果。所以人們的思維模式與認(rèn)知影響了設(shè)計,影響了設(shè)計的形成。


當(dāng)設(shè)計思維與戰(zhàn)略思維不同頻,不同步的情況下,就會產(chǎn)生矛盾與分歧,互相不理解,互相不配合,甚至各自強(qiáng)行給對方灌輸自己的思維模式與認(rèn)知,最后完全由客戶來指導(dǎo)設(shè)計師做設(shè)計,進(jìn)而破壞了設(shè)計的意義與作用。
相反,讓兩種思維同頻,設(shè)計師理解客戶,客戶理解設(shè)計師,出來的稿子就能更準(zhǔn)確,更能符合實(shí)際的客戶需求與市場需求,最終就可以實(shí)現(xiàn)快速過稿。怎么讓思維同頻,快速的建立起互相理解的過程呢,這里是有方法的。


客戶理解設(shè)計師的方法是,設(shè)計師通過闡述自身的設(shè)計理念來讓客戶更有代入性的去理解你的設(shè)計目的。設(shè)計師理解客戶的方法,是通過較為客觀的研究與分析,來更深入的理解客戶的需求。這就需要掌握一手資料和二手資料,從中進(jìn)行分析和研究,才能對癥下藥設(shè)計出適合客戶并滿足需求的設(shè)計。


一手資料有兩個維度的考量,分別是調(diào)研方法研究和圖文影像資料的研究,調(diào)研方法研究里面包含幾種研究方法,分別是對人,事,物,環(huán)境的觀察、直接溝通、客觀分析、角色互換、采訪(電話/微信/郵件)、問卷調(diào)查、小組討論、民族調(diào)查研究(社會性),內(nèi)容比較多就不講了..



調(diào)研方法研究(研究方法)

客觀分析采訪(電話/微信/郵件)

問卷調(diào)查
小組討論

民族調(diào)查研究(社會性)


圖文影像資料研究(資料收集)

自媒體 / 小視頻

宣傳片

圖片資料

現(xiàn)場拍攝

文檔資料

錄音

音頻資料

草圖和繪畫

H5小程序

 


再延伸


如果說設(shè)計是思維形成的過程,那我們設(shè)計師的自我思維就直接影響了設(shè)計的形成。如我是一個固步自封的設(shè)計師,自我思維是封閉的,那又怎么能做出包羅萬象的設(shè)計形式呢!


自身知識儲備不足,又怎么能設(shè)計出有層次,有高度的作品呢!正如克萊夫·斯特普爾斯·路易斯(C.S路易斯)說過:你的所見所聞決定于你所站的位置以及你是一個怎樣的人。自我思維越完善,知識儲備越豐富,看待設(shè)計的角度就會變得不同,解決問題的方法也就會更多。

 

思維知識可以擴(kuò)展延伸出“自我思維”“自我控制”“自我認(rèn)識”“思維態(tài)度”“興趣點(diǎn)與好奇心”“自我管理”“自我控制”“自我認(rèn)識”等!


思維知識延伸(基于設(shè)計的概念)

自我思維 - 心理學(xué)家日莫曼(B.JZimmerman)提出了著名的關(guān)于自我思維和自我監(jiān)控結(jié)構(gòu);

自我控制 - 自我檢查和分析 / 主動糾正偏差 / 及時反饋信息

自我認(rèn)識 - 自我觀察 / 自我圖式 / 自我概念 / 自我評價

思維態(tài)度 - 心理結(jié)構(gòu)三大因素(認(rèn)知因素 / 情感因素 / 意向因素),態(tài)度的特性(社會性 / 針對性 / 協(xié)調(diào)性 / 穩(wěn)定性 / 潛在性),態(tài)度的功能(對社會性的判斷 / 忍耐力 / 工作效率),態(tài)度的形成(欲望 / 知識 / 個體經(jīng)驗(yàn)),態(tài)度的改變(順從階段 / 同化階段 / 內(nèi)化階段)..

興趣點(diǎn)與好奇心- 通過尋找興趣點(diǎn)與激發(fā)好奇心的方式來調(diào)動我們的主觀能動性 / 內(nèi)驅(qū)力與外驅(qū)力

內(nèi)驅(qū)力 - 缺少興趣的誘因,就會造成工作不飽的自身問題。對所做的工作沒興趣就不會覺得滿足,對設(shè)計知識缺少探索心理,不會喚醒你自身的緊張狀態(tài),是缺乏內(nèi)部驅(qū)動力的表現(xiàn)。

外驅(qū)力 - 缺少好奇心的誘因,就會造成工作不飽和的環(huán)境問題。每天你都在重復(fù)同樣的工作,做著類似的視覺效果,處理類似的業(yè)務(wù)需求,長時間處在這樣的環(huán)境中,會把你對設(shè)計和其他知識的好奇心給磨滅掉,是缺乏外部驅(qū)動力的表現(xiàn)。

 


語源與語言


從語言的角度去理解設(shè)計,語言是文化的載體,在語言中找到最早描述藝術(shù)與設(shè)計的概念,就能更好的去理解設(shè)計,并能通過更客觀的角度去理解設(shè)計的概念與定義。

undefined

在希臘語言體系中,希臘語Tekhné(τ?χνη)是“藝術(shù)”的意思,這個詞也有“技術(shù)”和“技藝”的意思。

undefined

古希臘人理解的“藝術(shù)”涵蓋范圍比較廣,其中包括音樂,繪畫,雕塑,手工業(yè),農(nóng)業(yè),醫(yī)藥,烹飪等。在古希臘人眼里,藝術(shù)(審美性)與技術(shù)(功能性)是不同的且又不能獨(dú)立和分離的活動。



其余內(nèi)容就是課程的知識了!

語源的源頭

英語體系中對Design的定義

Design的名詞釋義

Deisgn的動詞釋義

Design的語義

考研知識梳理

..

文章來源:站酷     作者:羅耀_系列

藍(lán)藍(lán)設(shè)計www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

從2020年終復(fù)盤看2021新商機(jī):8個趨勢、3個洞察、1種信仰

資深UI設(shè)計者

魔幻的2020年已經(jīng)過去了,我們終于迎來了新的一年。站在2021年的開頭,本文作者對2020年進(jìn)行了總結(jié),盤點(diǎn)了2020年的8個趨勢熱點(diǎn)、預(yù)測了2021年的3個洞察以及為什么新經(jīng)濟(jì)公司要做長期主義者,希望讀后對你有所啟發(fā)。

充滿期待的2021年已拉開序幕,我決定為2020這一年中值得思考和回味的事情做個總結(jié)。橋水基金創(chuàng)始人瑞·達(dá)利歐說:如果你不覺得去年的你是個蠢貨的話,說明你進(jìn)步慢了。

2020年的紅人新經(jīng)濟(jì)領(lǐng)域,究竟經(jīng)歷了哪些有價值的改變和進(jìn)化?在我的記憶碎片中,瞬間涌現(xiàn)了下面8個趨勢熱點(diǎn):

  • “后浪”崛起;
  • 明星紅人化;
  • 新國貨;
  • 宅經(jīng)濟(jì);
  • 社群賣場;
  • 下沉市場;
  • 紅人算法化;
  • CEO帶貨。

再將上述8個碎片關(guān)聯(lián)起來,清晰呈現(xiàn)了3個行業(yè)洞察:

  1. “去中心化”是大勢所趨;
  2. 品效合一是必然選擇;
  3. “紅人”職業(yè)化,“職業(yè)”紅人化

收集碎片,遵循規(guī)律,知行合一,我們漸漸踩準(zhǔn)了時代趨勢。沒有預(yù)約,時代的機(jī)遇也不用刻意安排。

約翰·列儂有一句話:“所有的事到最后都會是好事。如果還不是,那就是還沒到最后?!笔返俜颉滩妓棺鳛榧s翰·列儂的狂熱粉絲,在執(zhí)掌蘋果公司的那些年里,將“長期主義”一以貫之。

什么叫長期主義?“長期主義”的英文叫Long-termism,在我的理解中,就是不賺“短期的錢”,不接受“無戰(zhàn)略的盈利”,產(chǎn)品被視作“價值觀和信仰的載體”。

8個趨勢熱點(diǎn),3個行業(yè)洞察,和長期主義信仰,作為我這里復(fù)盤2020的基本脈絡(luò)。如果還沒有把復(fù)盤、反思當(dāng)作習(xí)慣,也許你的工作還沒正式開始。行動時尊重未來的自己,復(fù)盤時尊重過去的自己。

一、盤點(diǎn)2020年的8個趨勢熱點(diǎn)

有人用一句話回顧2020年:“我們無數(shù)次凝視深淵,也無數(shù)次被深淵凝視。”我們何曾想過,某些時間買個口罩那么難,回一趟家那么難,電影院開個門那么難,奧運(yùn)會開個幕那么難……

哪怕挑戰(zhàn)多多,2020年的新經(jīng)濟(jì)熱點(diǎn)和亮點(diǎn)仍是層出不窮。

1. 趨勢熱點(diǎn)之:“后浪”崛起

2020年是一個重要時間窗口,95后、00后的年輕世代,即“后浪”們,正在形成新的流量中心。

你在抖音、B站、快手上看到的,盡是一些諸如“爺青回”、“有內(nèi)味了”、“AWSL”、“真香”這類新詞,類似李子柒、朱一旦、華農(nóng)兄弟這些網(wǎng)絡(luò)紅人,不斷創(chuàng)造很多新的、有趣的東西掀起了“后浪”們的熱情。

“后浪”們眼中的有趣,是隨心、隨喜的。

比如,華農(nóng)兄弟在院子里宰殺動物,一只公雞無意中路過,進(jìn)入了視頻畫面,觀眾們一看,像是來送終的,于是“送終雞”的彈幕流行起來(跟韓國演員宋仲基的名字發(fā)音一樣),成為華農(nóng)兄弟走紅的一個標(biāo)配。

農(nóng)村生活的平淡無奇,可以在“后浪”粉絲的篩選、反饋之下,成為一個一個傳播力甚廣的紅人標(biāo)簽。

任何可以調(diào)侃的素材,刺激笑點(diǎn)的瞬間,在“后浪”們眼里,都可以作為話題,作為一種小眾愛好,凝聚粉絲,積聚流量。他們時刻想知道,這世界上還有哪些未知的生活方式。

流量向哪里遷移,商業(yè)也隨之發(fā)生變革:流量從線下轉(zhuǎn)移到線上,誕生了亞馬遜、淘寶和京東商城;流量從PC端轉(zhuǎn)移到移動端,由于移動端可以隨時在線、隨處定位,誕生了美團(tuán)、餓了么和滴滴;流量從四面八方向紅人、意見領(lǐng)袖身上轉(zhuǎn)移,天下秀、B站、完美日記逐漸成為焦點(diǎn)。

2. 趨勢熱點(diǎn)之:明星紅人化

2020年,很多一線紅人逐漸“明星化”,部分一線紅人“帶貨”流量遠(yuǎn)超過一線明星,有淘寶主播、有脫口秀紅人主播活躍于熱播綜藝,受關(guān)注度都不輸影視明星。

很多影視明星在疫情之前就遭遇“失業(yè)潮”了,他們不斷尋求新的出路,比如主動進(jìn)入直播電商領(lǐng)域,商業(yè)效果反而不敵那些一線紅人,于是出現(xiàn)了“明星失業(yè)、紅人補(bǔ)位”的聲音。

影視明星是否真的被草根紅人打???這不是重點(diǎn)。明星主動進(jìn)入電商直播間給消費(fèi)品牌“帶貨”,已經(jīng)不是新聞了。

明星帶貨和紅人帶貨的消費(fèi)邏輯大不相同:紅人帶貨就是物美價廉,高性價比,鄰家女孩真誠推薦;明星帶貨則撬動了粉絲們的“養(yǎng)成心態(tài)”,粉絲要支持偶像(愛豆)成長。

直播帶貨的最大商業(yè)阻力,大概就是“人紅貨不紅”了。很多影視明星的粉絲量特別大,也積極嘗試直播帶貨,但翻車的情況不少。影視明星往往太過表現(xiàn)自己,搶走了觀眾本該對產(chǎn)品(品牌)的注意力。

這就像演員和推銷員的區(qū)別,一個推銷員可以成為很棒的演員,可是演員不一定能成為很棒的推銷員。因?yàn)橥其N員要同時做到讓人鼓掌叫好,讓人愿意掏錢買單。演員就不擅長做后一點(diǎn),這就是隔行如隔山。

重點(diǎn)是讓產(chǎn)品成為關(guān)注焦點(diǎn),而不是賣東西的人本身成為關(guān)注焦點(diǎn)。很多重要的內(nèi)容細(xì)節(jié),建議參考我之前的文章《為什么你的直播帶貨賠錢了》。

3. 趨勢熱點(diǎn)之:新國貨爆發(fā)

在2020年天貓“雙11”成交過億的品牌里,有16個是入駐天貓不到3年,其中大部分是新國貨品牌;同時,諸如大白兔奶糖、回力運(yùn)動鞋、謝馥春、百雀羚、馬應(yīng)龍這等祖母級品牌,也正在經(jīng)歷一輪復(fù)蘇。

按照《彭博商業(yè)周刊》的觀點(diǎn)這背后的最大推手就是95后、00后新世代消費(fèi)者,因?yàn)閺?019年開始,95后和00后成了全球最大的消費(fèi)群體,這個趨勢會一直持續(xù)到2030年。

95后、00后是中國“正?!币淮拈_始,他們沒有物質(zhì)匱乏的記憶,也不缺機(jī)遇,所以,不用顧慮這顧慮那,而折疊自己、迎合別人,屈就周圍環(huán)境。他們就是做自己喜歡的事情,做好自己。

95后、00后是“去中心化”的一代,他們眼中已經(jīng)沒有大眾品牌、國民偶像了,他們接受信息的來源主要是社交網(wǎng)絡(luò)、紅人社群,他們買東西、看東西,幾乎都會給自己打標(biāo)簽,將自己與蕓蕓眾生區(qū)別開。

“后浪”們對品牌認(rèn)同度普遍降低,不是品牌變得不重要了,而是品牌觸達(dá)“后浪”消費(fèi)者的路徑不同以往了。

現(xiàn)今,在年輕消費(fèi)者的購物“決策鏈”中,從興趣激發(fā)(即“種草”),到研究比價,到下單購買,最后到分享裂變,處于中心位置的,是社交APP和社交紅人。絕大多數(shù)的“后浪”消費(fèi)者在進(jìn)入銷售渠道前已經(jīng)做好了購買決定,在美妝和3C數(shù)碼品類,這種趨勢尤其明顯。

過去,品牌公司那種廣告轟炸+明星代言的常規(guī)做法,依然可以奏效,但是效費(fèi)比已經(jīng)大大不如從前了。

在這個變化中,娛樂圈也大受沖擊,已經(jīng)不可能再打造類似“四大天王(劉德華、張學(xué)友、郭富城、黎明)”那樣的全民偶像。相反,紅人主播、紅人博主、紅人UP主們更加契合“后浪”們的胃口。

4. 趨勢熱點(diǎn)之:宅經(jīng)濟(jì)效應(yīng)明顯

“宅經(jīng)濟(jì)”是2020年一個熱詞,新聞媒體談了很多?!昂罄恕眰兊墓聵分髁x持續(xù)升級,宅起來,線上解決一切問題。

  • 2017年,美團(tuán)外賣服務(wù)了1.3億單身“孤宅”人群;
  • 2018年,國內(nèi)的游戲總用戶數(shù)達(dá)到6.26億,其中“孤宅”用戶貢獻(xiàn)了一大半銷售額;
  • 2019年,天貓“雙11”的進(jìn)口商品,不是嬰兒奶粉,不是高科技產(chǎn)品,而是進(jìn)口貓糧;
  • 2020年,紅人新經(jīng)濟(jì)迎來引爆式增長,游戲主播、紅人博主UP主開始成為一種成熟職業(yè),諸如導(dǎo)購、教師甚至菜農(nóng)等360行紛紛“紅人化”。

“后浪”們普遍有一種“孤樂主義”心態(tài),與其在人群中委曲求全,寧愿選擇自己宅起來。阿里研究院的數(shù)據(jù)顯示,95后、00后人群當(dāng)中,一個人看電影的比例高達(dá)54%,一個人叫外賣比例達(dá)到了33%……

所以,阿里電商系統(tǒng)開始推一人食、一人租、一人旅行、一人火鍋以及迷你小家電、自助唱吧等等。這是一種“單人的樂活模式”,更是一種新的商業(yè)布局。

這個商業(yè)生態(tài)包括遠(yuǎn)程辦公(阿里釘釘、騰訊文檔、華為云WeLink)、網(wǎng)購電商(京東、淘寶天貓、拼多多)、社交社區(qū)(微信、陌陌、西五街、小紅書),資訊服務(wù)(頭條、百度、騰訊新聞)、外賣生活(美團(tuán)、餓了么、58同城)、娛樂視頻(抖音、快手、優(yōu)酷)、網(wǎng)絡(luò)游戲(騰訊游戲、網(wǎng)易游戲)、在線教育(學(xué)而思、新東方、簡書)、金融理財(螞蟻金服、東方財富)等等……

這個商業(yè)生態(tài)更是包括眾多頭部、腰部和精致的納米紅人,以及背后的7億粉絲群體,構(gòu)成了線上最具人氣的商業(yè)流量中心。當(dāng)城市越來越大、新經(jīng)濟(jì)生態(tài)越來越成熟、人際交往越來越虛擬的時候,“孤獨(dú)的城市動物”正在催化各種商業(yè)創(chuàng)新。

5. 趨勢熱點(diǎn)之:社群賣場興起

2020年,紅人導(dǎo)購已經(jīng)成為零售行業(yè)的重要武器。紅人導(dǎo)購最關(guān)注的,是社區(qū)團(tuán)購,就是圍繞一個線下社區(qū),以近距離社交為起點(diǎn),來發(fā)起團(tuán)購。

每一個導(dǎo)購員就是一個帶貨紅人,早上在社群里推“超劃算的爆款產(chǎn)品”用于鞏固鐵粉,晚上發(fā)布打折信息,定時發(fā)問候紅包(現(xiàn)金+菜品折扣)用于培養(yǎng)用戶習(xí)慣。

一位叫香帥的金融課紅人教師,講過一位“皮皮媽媽”,特別能干,她與附近幾個小區(qū)的團(tuán)長合作,沒有依靠任何平臺,利用微信群建立了近千人規(guī)模的“團(tuán)購合作社”——他們幾個團(tuán)長,本身有超市采購、機(jī)場免稅店、糧油食品企業(yè)的工作背景,有很多供應(yīng)鏈資源,可以與廠商直接對接。

他們每周組織團(tuán)購5次左右,商品品類覆蓋蔬菜、水果、肉蛋奶,甚至是羽絨服、化妝品、品包包。

傳統(tǒng)零售的接觸用戶過程,是漏斗型的一級一級篩選用戶,先要廣泛搜羅用戶,然后從眾多用戶里進(jìn)行精準(zhǔn)定位,找到并影響目標(biāo)用戶,從目標(biāo)用戶里篩選潛在用戶,再找到普通用戶,最終獲得忠誠用戶。

社群零售的接觸用戶過程,是寶塔型的一級一級影響用戶,要先去找到忠誠用戶,通過忠誠用戶去找到并影響普通用戶,通過普通用戶再去影響潛在用戶,最終向廣泛的目標(biāo)用戶擴(kuò)大影響。

傳統(tǒng)零售是“越篩選越小眾”,社群賣場是“越影響越大眾”。

6. 趨勢熱點(diǎn)之:深挖下沉市場生態(tài)

過去,很多創(chuàng)業(yè)者總是講“工匠精神”,要精工細(xì)料、要死磕細(xì)節(jié)。但這是要成本的,產(chǎn)品貴到了一定程度,你的市場很難走出北上廣深,商業(yè)的可復(fù)制性也沒有了。比如,30元一杯的星巴克是無法下沉到小縣城、小鄉(xiāng)鎮(zhèn)的。

如果你有打江山的那個霹靂手段,將效率做到感人,將價格壓到骨頭,從一線都市到六線縣城鄉(xiāng)鎮(zhèn),你都有辦法搞定,讓現(xiàn)存的、潛在的對手都怕你,那就算你厲害。

看看中國地圖,查查政府官方網(wǎng)站,可以清楚看到未來消費(fèi)市場新的增長引擎,主要來自于國內(nèi)2856個“縣”、41658個“鄉(xiāng)鎮(zhèn)”、662238個“村”,他們沒有高房價或高租金的困擾,可支配收入并不低。

甚至有人直言,藏在縣城的萬億生意,尚未被充分發(fā)掘?,F(xiàn)在的下沉市場越來越好,一個賣大雞排的本土品牌,門店數(shù)量已經(jīng)超過麥當(dāng)勞,一個做刨冰起家的本土品牌,門店數(shù)量也超過了星巴克。

我看,突破下沉市場的核心方法論就一句話——站在巨人的肩膀上拉客賣貨。這個巨人就是當(dāng)今中國強(qiáng)大的數(shù)字商圈生態(tài)。

有人認(rèn)為,騰訊、阿里巴巴、天下秀、滴滴、美團(tuán)都在做一件事,就是“線上商圈基礎(chǔ)設(shè)施建設(shè)”,它們在各自的領(lǐng)域里“鋪路”和“修橋”,而且這個“線上商圈”是沒有城鄉(xiāng)界限的。

現(xiàn)今1美金的平均快遞成本就可以通運(yùn)全國,品牌也可隨時隨地觸達(dá)8億網(wǎng)購用戶。超過100萬的紅人,透過IMS天下秀平臺直線對接萬千消費(fèi)品牌,紅人逐漸成為一種主流的且大受歡迎的新興職業(yè)。

現(xiàn)今,想要開創(chuàng)一個新消費(fèi)品牌,包括產(chǎn)品的研發(fā)設(shè)計、制造、物流、營銷等環(huán)節(jié),都會出現(xiàn)專業(yè)化的服務(wù)商。你只需要專注洞察、連接及服務(wù)好用戶,將用戶或者消費(fèi)者變成粉絲,集中精力做品牌就好了。

哪怕你身處遙遠(yuǎn)的深山、疆域的邊緣、城市的角落,只要你懂需求、會表達(dá)、能溝通,就可以打造個人IP,直連消費(fèi)品牌,除了紅人主播可以帶貨,可能一篇好文章、一張好圖片甚至一曲好音樂,都可以賦能品牌,都可以帶貨。

很多農(nóng)村小哥、小鎮(zhèn)青年、偏遠(yuǎn)地區(qū)的民宿業(yè)者,靠短視頻帶貨賺錢,或是打農(nóng)家樂廣告招徠游客,已經(jīng)非常普遍了。

7. 趨勢熱點(diǎn)之:紅人算法化

2020年9月,《人物》雜志刊登了一篇熱文《外賣騎手,困在系統(tǒng)里》,近幾年來外賣平臺通過算法系統(tǒng)壓縮送餐時間,建立了一套“超時罰款”規(guī)則,使得騎手的工作難度越來越大,甚至越來越危險。送餐小哥活在了算法里,壓力很大,網(wǎng)絡(luò)紅人可能也不輕松,紅人要怎么當(dāng),算法來告訴你。

2020年,幾乎所有互聯(lián)網(wǎng)平臺都拋棄了按照純時間線排布內(nèi)容的算法,改用打亂時間線的智能算法推薦(最保守的微信公眾號也邁出了這一步)。

比如:B站首頁默認(rèn)就是推薦模塊,哪怕用戶訂閱列表里的所有紅人全停止更新了,也不影響消費(fèi)者(粉絲)獲取源源不斷的感興趣內(nèi)容。

比如:抖音的分發(fā)機(jī)制也變得更加務(wù)實(shí),紅人創(chuàng)作的內(nèi)容投喂給算法,算法再分發(fā)給用戶,用戶不會在乎哪個紅人創(chuàng)作的,用戶只在乎自己的口味。

創(chuàng)業(yè)者們一定要知道,內(nèi)容消費(fèi),就是當(dāng)我們刷抖音、微博、微信看到內(nèi)容的時候,這些消費(fèi)是目前為止互聯(lián)網(wǎng)里面最大的消費(fèi),而這些內(nèi)容的源頭是紅人博主、主播、UP主。最終靠什么發(fā)掘其中的商業(yè)價值?

答案是:算法。

Google的商業(yè)算法,很好理解,就是用戶在搜索引擎里搜過內(nèi)衣,好的,網(wǎng)頁打開之時,就會看到很多內(nèi)衣的消費(fèi)選擇。

Facebook的商業(yè)算法,就是另外一種套路,用戶可能曾在社交平臺上對一個汽車產(chǎn)品點(diǎn)贊,但他的個人頁面上,可能會出現(xiàn)完全沒什么關(guān)系的度假村內(nèi)容,因?yàn)槠脚_通過大數(shù)據(jù)分析,知道你是誰,就必然需要什么。

紅人新經(jīng)濟(jì)時代的算法策略,將紅人和場景當(dāng)作“廣告位+新貨架”。你看到的那些紅人,本質(zhì)上是一個個算法。 你透過直播互動的數(shù)據(jù)沉淀,清楚知道用戶(消費(fèi)者)的生活方式,在一種生活方式的背景下,用戶想要什么,就很清楚了。

紅人為什么會變成算法?

在一個時間段內(nèi),哪一個產(chǎn)品最好賣?哪一個定價最好賣?哪一些臺詞最好賣?哪一些包裝最好賣?同時,如何應(yīng)對直播用戶的問答?怎樣的問題需要怎樣的臺詞、演示細(xì)節(jié)進(jìn)行匹配?如何持續(xù)改良行為模式,提高直播效率?……

這些都是靠背后動態(tài)沉淀的大量數(shù)據(jù),進(jìn)行矯正、優(yōu)化的。如何駕馭這些數(shù)據(jù),靠的就是一套好的算法?!耙痪€紅人們”的一言一行、一個眼神,都是基于直播間人氣、銷售轉(zhuǎn)化等等數(shù)據(jù)指標(biāo),進(jìn)行算法矯正的。所以,“一線紅人們”就是一個一個人格化的算法。

Google、Facebook以及紅人新經(jīng)濟(jì)時代的商業(yè)算法,決定了用戶最終會看到什么內(nèi)容。

Google的推薦系統(tǒng),基于用戶搜索行為,包括搜索的歷史記錄等等;Facebook獲取的,是用戶的社交信息,像是居住地、性別、職業(yè),還有用戶在平臺上的點(diǎn)贊、留言;紅人直播模式獲取的,是基于紅人、粉絲互動呈現(xiàn)的生活方式數(shù)據(jù)。

  • 搜索商業(yè)算法,瞄準(zhǔn)你想要什么;
  • 社交商業(yè)算法,瞄準(zhǔn)你是誰,然后一定會需要什么;
  • 紅人商業(yè)算法,瞄準(zhǔn)你想要什么樣的生活方式,自然需要什么。

需要更多深度觀察,請參閱我之前的文章《算法時代,偉大的公司如何癡迷于客戶》。

8. 趨勢熱點(diǎn)之:CEO帶貨潮

2020年的消費(fèi)市場,典型特征就是“看人下單”,每一個內(nèi)容賬號的背后,每一個紅人主播、博主、UP主的背后,都是一個細(xì)分消費(fèi)市場。

“后浪”消費(fèi)群體主要透過社交分享,實(shí)現(xiàn)了基于人與人之間信任關(guān)系的購買。淘寶的直播帶貨,快手的達(dá)人賣土特產(chǎn),小紅書的大V種草,西五街的新品測評,以及拼多多的熟人推薦,都是看人下單(而非看品牌下單)的邏輯。

CEO們(甚至很多政府官員)紛紛走上一線,親自進(jìn)直播間賣貨,不一定是要拿到多少銷售額,更重要是,贏得需求洞察上的話語權(quán)、產(chǎn)業(yè)鏈上的主導(dǎo)權(quán)、公司命運(yùn)的主宰權(quán)。

需求洞察方面,近年快速崛起的喜茶、完美日記,幾乎都是CEO直接主管內(nèi)容團(tuán)隊,每天都在網(wǎng)上跟消費(fèi)者接觸,沉淀了更多源于用戶的意見,這就有了在需求洞察上的話語權(quán)。

尤其是那些年輕創(chuàng)業(yè)者,因?yàn)轭A(yù)算有限,會選擇低成本、紅人化的品牌推廣,將自己塑造成為一個紅人(意見領(lǐng)袖),把流量導(dǎo)向產(chǎn)品銷售,經(jīng)過多次轉(zhuǎn)發(fā)、傳播,這些紅人CEO不僅給企業(yè)省下巨大的廣告開支,也讓年輕消費(fèi)者覺著他們和自己貼得更近了。

這個商業(yè)效果,是不能用帶貨金額來計算的。產(chǎn)業(yè)鏈話語權(quán)方面,很多紅人主播直接繞過了品牌,讓廠家直接供貨,李子柒、薇婭是這樣。也有一些紅人主播甚至直接繞過廠家,自己做供應(yīng)鏈。

多年以前,比爾·蓋茨曾經(jīng)表示:“要么電子商務(wù),要么無商可務(wù)。”可是,現(xiàn)在已經(jīng)不是B2C了,而是直接繞過商家,從供應(yīng)商那里買東西,甚至自己做供應(yīng)鏈。紅人直播帶貨給電商運(yùn)營效率,帶來了革命性的升級。

組織動員方面,CEO親自直播賣貨,也是要贏得公司命運(yùn)的主宰權(quán)。這給人一個清楚信號,“老板都直播帶貨了,這么拼,你為何不積極跟上?”這不僅是一種廣告效果,更是一種“全員營銷”的動員能量。

總體看來,CEO主動直播帶貨,主動參與內(nèi)容創(chuàng)作、與粉絲(消費(fèi)者)對話,這種迅速收集消費(fèi)需求、匯攏資金、按需生產(chǎn)、分發(fā)商品的模式,效率遠(yuǎn)高于傳統(tǒng)電商。

可以預(yù)期,未來紅人直播帶貨將會成為新消費(fèi)品牌的新常態(tài),而CEO直播帶貨也將成為給公司“立人設(shè)”的一種靈活方式。需要更多內(nèi)容細(xì)節(jié),請參閱我之前的文章《董明珠直播帶貨20萬,其實(shí)是賺到了“2個億”》。

二、面向2021年的三大洞察

諾貝爾醫(yī)學(xué)獎獲得者紐斯林·福爾哈德說過:“解決問題的關(guān)鍵在于收集到足夠數(shù)量的碎片,并努力積累到這些碎片之間的關(guān)聯(lián)性?!?

華為輪值CEO徐直軍直言:“經(jīng)驗(yàn)是華為最大的浪費(fèi)。”不要輕易放過一段經(jīng)歷和經(jīng)驗(yàn),如果能夠從每一段經(jīng)歷和經(jīng)驗(yàn)中沉淀一點(diǎn)未來可能用得上的思考,積累下來就是大智慧。

2020年的趨勢熱點(diǎn)當(dāng)中,可以呈現(xiàn)三大洞察:

1. 流量“去中心化”是大勢所趨

去年疫情期間,物流受阻,電商平臺的效率發(fā)揮不出來,“社區(qū)團(tuán)購(紅人導(dǎo)購)”進(jìn)來補(bǔ)位;孩子上學(xué)的節(jié)奏受影響,紅人教師(和助理們)可以P2P(一對一)進(jìn)行輔導(dǎo);公司難以集體辦公了,小團(tuán)隊一個個可以自行組織工作任務(wù),即“去中心的自組織”……

紅人新經(jīng)濟(jì)領(lǐng)域的“去中心化”,十幾年來是一以貫之的。

十幾年前的紅人,主要是傳統(tǒng)媒體(營造出格事件)催化走紅的;后來,有了博客、視頻網(wǎng)站,你要走紅還得靠平臺的編輯優(yōu)先推薦;有了社交媒體,諸如Papi醬、雪梨等人,靠生活調(diào)性走紅;現(xiàn)今,大量紅人主播承接了短視頻和直播興起的勢能,比如李子柒、手工耿、李雪琴,主要靠優(yōu)質(zhì)內(nèi)容走紅。

紅人新經(jīng)濟(jì)本質(zhì)上是一種去中心化的呈現(xiàn)方式,除了紅人、意見領(lǐng)袖之外,某個物品、某個品牌、某個地方、某樣美食、某一首歌,甚至某個虛擬形象都可以成為紅人主體,進(jìn)而與粉絲建立起穩(wěn)定關(guān)系,促進(jìn)了消費(fèi)變現(xiàn)。

什么叫“去中心化”?

我舉兩個例子:過去,村里就你家有一部固定電話,好的,你家很快成了村里與外界聯(lián)系的中心節(jié)點(diǎn);現(xiàn)在,人人有一部智能手機(jī),人人都成了信息節(jié)點(diǎn),那個連接效率是不可同日而語的。那么,最有價值的就是那個掌握大家聯(lián)系方式的人。

你上視頻網(wǎng)站下載電影,你要下載的那個電影,并不是存在視頻網(wǎng)站的服務(wù)器(中心平臺)上,而是存在無數(shù)人的電腦上。

視頻網(wǎng)站只是維護(hù)了一張列表,上面記錄著:誰的電腦上有哪部電影,當(dāng)你的電腦要下載一部電影時,會自動查一下這張列表。那么,最有價值的就是那個掌握大家資源列表的人。

去年,我們公司被“百萬紅人”送上A股主板市場。天下秀不是中心化的商業(yè)強(qiáng)權(quán),而是掌握了紅人資源列表,進(jìn)行“去中心化的商業(yè)賦能”。

據(jù)克勞銳《2020年中國紅人發(fā)展年報》顯示:綜合了微博、微信、抖音、快手、小紅書、B站、淘寶直播數(shù)據(jù)發(fā)現(xiàn),2020年粉絲量大于1萬的紅人數(shù)量已經(jīng)達(dá)到了900萬+,而這些紅人日均產(chǎn)出內(nèi)容數(shù)量達(dá)到了3750萬+。

為什么品牌需要我們?

因?yàn)槠放菩枰谡_的時間、正確的場景,連接正確的紅人,以正確的傳播方式(文字、圖片、視頻)出場。

為什么紅人需要我們?

因?yàn)榧t人也需要在正確的時間、正確的場景,連接正確的品牌,釋放商業(yè)價值。這么多的“正確”搭配在一起,就需要有大數(shù)據(jù)和算法進(jìn)行精準(zhǔn)匹配,而我們就提供了這樣一種能力。

2. 品效合一是企業(yè)的必然選擇

過去的品牌公司會有一個基本考量:營銷推廣、品牌運(yùn)營是兩個維度的,(營銷)追求銷售效果or(品牌)追求企業(yè)調(diào)性?預(yù)算該怎么投,怎么平衡這個比例?長期以來,是非常傷腦筋的。

2020年則是實(shí)現(xiàn)品效合一的關(guān)鍵一年,其中的重要變量就是紅人。紅人就是把“粉絲”還原成“消費(fèi)者”的那個物種,品牌則千方百計找到最合適的紅人幫忙。

為什么紅人商業(yè)(紅人廣告+直播電商)可以促使品效合一的加速到來?背后有兩個核心邏輯:

1)效果革命

紅人增進(jìn)了交易效率的空前提高,過去,從產(chǎn)品到消費(fèi)者,要經(jīng)過多層渠道商、經(jīng)銷商,到零售店,最后被消費(fèi)者看見,決定會不會買,這是一個很長的決策鏈條。

過去的交易方式,付款需要輸入密碼,網(wǎng)銀需要用 U 盾來支付,現(xiàn)在這些步驟都省略了,刷個臉就行了,甚至可以免密支付。

現(xiàn)在,從產(chǎn)品到消費(fèi)者,只需要一個直播間,只經(jīng)過一層物流。除了消費(fèi)鏈條大幅縮短,供給和需求之間的連通效率大大提高了。

如今所有的直播帶貨,從帶寬、運(yùn)算、支付、成交,到最后的朋友圈發(fā)文炫耀,一個人從決策到購買的鏈路縮短到3分鐘之內(nèi)——這是中國互聯(lián)網(wǎng)歷史上完全沒有過的。

2)品牌革命

紅人作為現(xiàn)今最重要的內(nèi)容生產(chǎn)者,是廣告位+新貨架的完美合體。本質(zhì)上,一切的表達(dá)都是文案,一切的產(chǎn)出都是創(chuàng)意,一切的產(chǎn)品和品牌都是內(nèi)容,一切的內(nèi)容都是廣告。

近幾年來,消費(fèi)品牌紛紛借助紅人流量,給自身品牌進(jìn)行“人格化”賦能,要使消費(fèi)者不僅僅將品牌當(dāng)作一個僵化的標(biāo)簽,而是一個可交流、有溫度的人格IP。

商業(yè)的本質(zhì)就是消費(fèi)者的注意力在哪里,產(chǎn)品就在哪里。聰明的品牌越來越清楚,能支持自己走得更遠(yuǎn)的其實(shí)是粉絲,而不是哪個標(biāo)簽或者LOGO。

3. “紅人”職業(yè)化,“職業(yè)”紅人化

2020年,是紅人職業(yè)化、職業(yè)紅人化的重要一年。

無論你是什么學(xué)歷、什么出身、什么背景、你喜歡什么、擅長什么,你都可以把自己擺在網(wǎng)絡(luò)平臺上,被所有人看見。比如有很多五星級酒店大廚,因?yàn)橛幸婚T烹飪的手藝,通過短視頻教會更多人做家常菜。

也有很多優(yōu)秀的老師,把黑板搬到了網(wǎng)上,做更廣泛的知識普及;還有醫(yī)生、化妝師、心理學(xué)家、裝修工人等等,在網(wǎng)絡(luò)上分享自己的專業(yè)經(jīng)驗(yàn),獲得很多人的喜愛。

紅人的“準(zhǔn)入門檻”確實(shí)不高,只要你有手機(jī),注冊一個賬號,就可以開始發(fā)視頻,開直播。但還有一個事實(shí)是,步入社會之后,我們說一個行業(yè),一份工作的“門檻”高低,不僅體現(xiàn)在“準(zhǔn)入門檻”,更在于職業(yè)化。

什么是職業(yè)化?不是在工作技能上有多高超,而是你學(xué)會把自己的生活人格和職業(yè)人格分開。在合適的地方,合適的時候,扮演合適的角色。

任何人把自身的優(yōu)勢發(fā)揮到,都可能成為焦點(diǎn)。但是,能不能長久在里面待下去,能不能勝任這份工作,背后仍需要有專業(yè)化的技術(shù)(數(shù)據(jù)、算法)引導(dǎo)。前面講過,算法可以教你怎么做好紅人?

算法之外,更重要是你要用自己的本心與這個世界碰撞。

你隨意的一個感受瞬間,分享一首曲子,或者發(fā)一條微博、朋友圈、小紅書、抖音,都在向身邊的人傳達(dá)著你平凡生活中的點(diǎn)點(diǎn)滴滴,可能被人忽略,可能被人厭煩,也許,也許,你也會被人喜歡,被人關(guān)注,被人模仿。只要你是認(rèn)真的,世界上總有一直喜歡你的人。

那些一直喜歡你的人,就是你的價值觀同盟,你也可以成為他們的品味代言人,這也是紅人的核心本質(zhì)。人人都有機(jī)會成為紅人,無疑你也可以,流量和效果不用花錢買,你的口碑和影響力會自然擴(kuò)散,成為你的私域流量。

給自己的觀點(diǎn)找到知音,讓自己的(內(nèi)容)產(chǎn)品遇見懂你的人,這是“紅人”職業(yè)化+“職業(yè)”紅人化的內(nèi)在本質(zhì)。

三、1種信仰:為什么新經(jīng)濟(jì)公司要做長期主義者

所有的美好都是與你環(huán)環(huán)相扣的,只是需要時間。

復(fù)盤2020,進(jìn)擊2021,但是我們不會忘記,把時間和信念投入到能夠長期產(chǎn)生價值的事情上,我們始終是長期主義者。

我的理解當(dāng)中,長期主義不是一個策略選擇,不是你想要什么,不是你賭現(xiàn)在收獲or未來收獲,而是一種繞不過去的必然堅持。

1. 唯有長期主義者,才能踩準(zhǔn)風(fēng)口

我說唯有長期主義者,才能踩準(zhǔn)風(fēng)口,可能有點(diǎn)反直覺。

你看2020年的直播電商引爆行情,從紅人到明星、企業(yè)家、店主店員,無人不直播,無商家不轉(zhuǎn)型邁入直播電商,大家都要搶這個風(fēng)口,但真正賺錢的是極少數(shù)人。

你以為紅人主播、直播電商是“風(fēng)口上的豬”,但被風(fēng)吹起來的,一定是長期主義者。這個領(lǐng)域人家已經(jīng)深耕十幾年了,以前默默無聞,現(xiàn)在終于成功了,你說風(fēng)口來了,可是,風(fēng)口就是人家做出來的。

紅人,是消費(fèi)品牌與消費(fèi)者之間的最連接者。

但是要實(shí)現(xiàn)這個連接,并不容易。你要匹配紅人與品牌,就要有最完整的紅人資源清單;你要精準(zhǔn)找到人、貨、場的優(yōu)化組合,就要對紅人價值合理評估;你還要有專業(yè)的紅人孵化機(jī)制,以及針對不同需求建立傳播矩陣、策略組合,這都需要很長時間的積累和沉淀。

我們?nèi)ツ戢@得了不錯的發(fā)展成就,你覺得這是站在了風(fēng)口上,但是背后十幾年的長期準(zhǔn)備,很少有人看見。

很多看起來像是風(fēng)口的東西快速到來,那些沒有準(zhǔn)備的人,或者沒有考慮好的人,或者盲目去應(yīng)戰(zhàn)的人,他一定會嘗到非常多的失敗。因?yàn)槿魏涡袠I(yè)機(jī)會都是螺旋進(jìn)化的,一邊發(fā)展,一邊洗牌。

2. 長期主義是反人性、磨心智的

真正的長期主義者專注做一件大事,而這件大事一定是一直默默取得進(jìn)展,這個過程是反人性、磨心智的。

“股神”巴菲特總是把自己的投資策略(長期投資、價值投資)開誠布公,貝索斯有一次忍不住問:“你的策略這么簡單,為什么大家不照抄你呢?”

巴菲特的回答耐人尋味:“因?yàn)闆]有人愿意慢慢變富?!比诵园?,顯然更喜歡見效快的努力。

長期主義者多年專注一個細(xì)分領(lǐng)域,不敢越雷池一步。

日本人建筑做得好,日本水泥有100多種。法國人面包做得好,法國面粉有100多種。你離開專業(yè),就所知有限了,不能總聽人講故事,那些講故事的人大多是業(yè)余的,他們的故事也只是科普水平。

有人問我,我公司為何不簽約、捧紅一些自己的紅人?我說:“我公司沒有紅人,也不去簽約和捧紅某一個紅人。但我有紅人大數(shù)據(jù)平臺,做了亞洲范圍內(nèi)的自媒體排行榜,甚至教紅人怎么成長。

這是我們作為大數(shù)據(jù)公司、平臺公司所應(yīng)該做的事情”,長期專注,其實(shí)是最磨練心智的。

堅守是最不容易的,做好一個企業(yè)需要10-20年時間。如果你想做到,可能需要30-40年時間。一個堪稱偉大的企業(yè),必須要有50年以上的歷練。

在我關(guān)注的領(lǐng)域里,基本十年能有一個結(jié)果都算比較快了。

四、總結(jié)

最后,我想再重復(fù)一遍:“很多關(guān)鍵時刻,會有一些運(yùn)氣,比如當(dāng)下的直播電商熱潮,但都不會影響大局。你要保持長期的集中心力建立護(hù)城河,也就是那些改不了、奪不走、丟不掉的東西。

真正的長期主義者,不管潮起潮落,人來人往,這些長期不變的東西,就是你公司的基本盤?!?

文章來源:人人都是產(chǎn)品經(jīng)理  作者:IMS李檬

藍(lán)藍(lán)設(shè)計www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)



萬字干貨!超全面的色彩與應(yīng)用指南

周周

萬字干貨!超全面的色彩與應(yīng)用指南

色彩是影響用戶最簡單和最重要的一個因素。研究表明,人們只需 90 秒就能對一種產(chǎn)品做出下意識的判斷,而其中高達(dá) 60%以上的判斷僅基于顏色。因此,選擇合適的顏色對于改進(jìn)產(chǎn)品的轉(zhuǎn)換率和提高產(chǎn)品的可用性是非常有用的。在沒有文字的場景中,顏色的搭配非常重要。如何配色可以使設(shè)計感更強(qiáng),如何配色更好看,哪些配色不好看,解決這些問題就需要學(xué)習(xí)色彩理論。

色彩基礎(chǔ)知識

我們身處在一個多彩的世界中,物體的不同顏色,會讓我們產(chǎn)生不同的情緒。色彩,即光從物體反射到人的眼睛所引起的一種視覺心理感受,按字面含義上理解可分為色和彩?!干故侵溉藢M(jìn)入眼睛的光傳至大腦時所產(chǎn)生的感覺,「彩」則指多色的意思,是人對光變化的理解。色彩的基本理論雖然老生常談,但在 UI 設(shè)計中具體怎么運(yùn)用,還有關(guān)于色彩的性格和含義,都是我們需要了解的。因此在學(xué)習(xí) UI 配色之前我們先來了解色彩的基礎(chǔ)知識。

1. 色彩常識

原色

所有的色彩都源自“紅黃藍(lán)”三種原色,很多人誤以為三原色是“紅綠藍(lán)”,其實(shí)不是。紅綠藍(lán)是顯示上的三原色,計算機(jī)屏幕的顯示是色光三原色(紅 red,綠 green,藍(lán) blue)即 RGB 組成的,每一個像素的顏色都用三原色值來顯示,與美術(shù)上的三原色不一樣。原色是其他顏色調(diào)配不出來的。把原色相互混合,可以調(diào)和出其他種顏色。

萬字干貨!超全面的色彩與應(yīng)用指南

雖然 RGB 在顯示設(shè)備上表現(xiàn)良好,但并不夠人性化。因?yàn)槿藗兣袛囝伾?,往往是通過:這是什么顏色?是不是太艷了?是太亮了還是太暗了?這樣的感官維度,而很難通過紅綠藍(lán)的亮度層級去判斷。所以人們后來基于 RGB 衍生出了 HSB 模式和 HSL 模式。

印刷三原色為青(Cyan)、品紅(Magenta)、黃(Yellow)。是減色模式,混合為深灰色,并不能產(chǎn)生黑,所以在印刷時加上黑色油墨,才能產(chǎn)生純正的黑,就是 CMYK 顏色模式。

萬字干貨!超全面的色彩與應(yīng)用指南

間色

又叫“二次色”。它是由三原色兩兩混合調(diào)配出來的顏色。紅與黃調(diào)配出橙色;黃與藍(lán)調(diào)配出綠色;紅與藍(lán)調(diào)配出紫色,橙、綠、紫三種顏色又叫“三間色”。在調(diào)配時,由于原色在份量多少上有所不同,所以能產(chǎn)生豐富的間色變化。

萬字干貨!超全面的色彩與應(yīng)用指南

復(fù)色

也叫“復(fù)合色”。復(fù)色是用原色與間色相調(diào)或用間色與間色相調(diào)而成的“三次色”復(fù)色是最豐富的色彩家族,千變?nèi)f化,豐富異常,復(fù)色包括了除原色和間色以外的所有顏色。例如,黃色與橙色混合得到橙黃,紅色與紫色混合得到紫紅。

萬字干貨!超全面的色彩與應(yīng)用指南

冷暖色

最后由三種原色、三種間色和六種復(fù)色組成的系統(tǒng)就稱為十二色環(huán),從紫色至黃綠為冷色,黃色至紫色為暖色。冷色令人聯(lián)想到天空、海洋、冰雪等,產(chǎn)生寒冷、理智、寧靜等感覺;暖色則令人聯(lián)想到太陽、火焰、熱血等,產(chǎn)生溫暖、熱烈、危險等感覺。

萬字干貨!超全面的色彩與應(yīng)用指南

雖然可以用「冷」、「暖」色系來劃分色彩,但配色的變化卻有千種萬種。借著色彩的組合方式,從「非常冷」到「涼爽」到「暖和」再到「炎熱」都可以用不同的配色組來表現(xiàn)色彩的印象。

  • 知識點(diǎn):

不同的色輪由不同的人發(fā)明,他們對于色彩的見解不一樣,因此創(chuàng)建出來的色輪用途也不一樣。比如:伊頓色輪又被稱之為美術(shù)三原色,是由顏料的三原色混合疊加而成;RGB 色輪主要運(yùn)用于電腦、手機(jī)、平板等一系列科技產(chǎn)品,RGB 的三原色是光的三原色;CMYK 色輪主要用于印刷領(lǐng)域。

2. 色彩三屬性

豐富多樣的顏色可以分成兩大類,即有彩色系和無彩色系。彩色系的顏色具有三個基本特征:色相、明度和飽和度,在色彩學(xué)上被稱為色彩三大要素或色彩三屬性。

萬字干貨!超全面的色彩與應(yīng)用指南

色相(Hue)

色相是自然狀態(tài)下的色彩,是色彩的相貌。簡言之,色環(huán)上沒有改變明暗的色彩。色相是色彩的首要特征,是區(qū)別各種不同色彩的標(biāo)準(zhǔn)。例如紅、橙、黃、綠、青、藍(lán)、紫就是其中不同的基本色相。黑色是沒有色相的中性色。不同的色相在人眼中的差異是色相本身對應(yīng)光的波長不同而造成的。紅色波長最長,紫色的波長最短。

萬字干貨!超全面的色彩與應(yīng)用指南

飽和度(Saturation)

飽和度是色彩的純度,他表示顏色中所含有色成分的比例。增加飽和度,色彩會變得更強(qiáng)烈、鮮艷生動;降低飽和度,顏色中灰色成分越大,色彩會變得暗淡乏味。當(dāng)一種顏色摻入黑、白或其他色彩時,純度就產(chǎn)生了變化,當(dāng)摻入的顏色達(dá)到很大的比例時,人的眼睛就無法感知出來了。

萬字干貨!超全面的色彩與應(yīng)用指南

飽和度為 0 的顏色為無彩色,就是黑、白、灰。數(shù)值越大,顏色中的灰色越少,顏色越鮮艷。飽和度高的地方給人感覺靠近,而飽和度低的地方則給人的感覺很遙遠(yuǎn)。高飽和度和低飽和度的色彩都給人堅硬的感覺。

明度(Brightness)

明度,指色彩的明暗度,反應(yīng)的是色彩的深淺變化。以自然界為例,一些物體在早晨和晚上的色彩不同。如樹木和山脈,早晨色調(diào)淺;傍晚因?yàn)楣饩€減少了,色調(diào)變得偏暗。距光源越近的物體,明度越高,反之,則明度越暗。

萬字干貨!超全面的色彩與應(yīng)用指南

明度在 UI 設(shè)計中扮演重要的角色,明度運(yùn)用得好,可以實(shí)現(xiàn)好的對比效果。明度達(dá)到 100%時,色彩就會變成白色(黑白模式下);明度是 0%時,就會變成黑色。色彩的明度變化往往會影響到純度,例如藍(lán)色加入黑色以后明度降低了,同時純度也降低了;如果藍(lán)色加入白色則明度提高了,純度卻降低了。

3. 色彩的搭配

完整的 UI 配色應(yīng)包含主色、輔助色和中灰色。主色通常與品牌色一致,輔助色一般選擇與主色色調(diào)一致且能拉開層次的顏色,強(qiáng)調(diào)色選擇與主色相對立的互補(bǔ)色。下面我們來學(xué)習(xí)幾種常見的配色方案。

單色

單色是指某個色彩的明度變化,即在色彩上疊加 10%-90%白色或黑色得到的一組顏色。單色搭配由于彼此之間色彩相同,因此能和諧共處,但因較為樸素也就不容易引人注目,而且會給人一種單調(diào)的感覺。單色配色在色彩變化上也適合長時間閱讀,顏色波動較少,比較適合沉浸式交互的界面設(shè)計。

萬字干貨!超全面的色彩與應(yīng)用指南

蝦米音樂就是單色搭配的最好例子,它將主色橙色用在主要功能入口、標(biāo)簽欄圖標(biāo)等所有界面的關(guān)鍵元素上,給人非常精致和統(tǒng)一的視覺體驗(yàn)。

萬字干貨!超全面的色彩與應(yīng)用指南

如若想要在色彩變化上融入一點(diǎn)微妙的變化,可以嘗試在色環(huán)中選用兩側(cè)相近的顏色,這樣色彩層次豐富了而統(tǒng)一感也不會變,稱之為“鄰近色配色”。

鄰近色

是指在色相環(huán)中相鄰的兩種顏色,在色相環(huán)上相距 60°,或者相隔五六個數(shù)位的兩色。它可以在同一個色調(diào)中建立起豐富的質(zhì)感和層次,優(yōu)點(diǎn)是陽光、活潑、穩(wěn)定、和諧但不單調(diào),理所當(dāng)然稱為最安全的配色法則。鄰近色色相相近,冷暖性質(zhì)相近,傳遞的情感也較為相似。例如,紅色,黃色和橙色就是一組鄰近色。鄰近色表現(xiàn)的情感多為溫和穩(wěn)定,沒有太大的視覺沖擊。

萬字干貨!超全面的色彩與應(yīng)用指南

美顏相機(jī)的主色是粉色,將淺粉色和淺紫色作為輔助色,既能信息區(qū)分又和諧統(tǒng)一。

萬字干貨!超全面的色彩與應(yīng)用指南

互補(bǔ)色

互補(bǔ)色是指在色相環(huán)上對立(180°)的兩個顏色,色相環(huán)上夾角呈現(xiàn)一條直線,例如黃色和紫色、橙色和藍(lán)色、紅色和綠色等。互補(bǔ)色有著非常強(qiáng)烈的對比度,在顏色飽和度很高時,可以產(chǎn)生許多十分強(qiáng)烈的視覺效果,就會使這兩種顏色都顯得更加鮮明,也將視覺沖擊力強(qiáng)度提升至峰值。這類配色形式優(yōu)缺點(diǎn)和對比色很相似。常給人一種潮流、刺激、興奮的感覺,把互補(bǔ)色放在一起,會給人強(qiáng)烈的排斥感,搭配不好會很山寨。

萬字干貨!超全面的色彩與應(yīng)用指南

Airbnb 的主色為紅色,界面設(shè)計中使用主色的互補(bǔ)色「墨綠」作為主色調(diào),給人清晰、簡潔的感覺。

萬字干貨!超全面的色彩與應(yīng)用指南

分裂互補(bǔ)色

分裂互補(bǔ)色是指尋找三種顏色,其中兩種互為鄰近色,另一種與它們形成互補(bǔ)色,例如黃色和藍(lán)色、洋紅。這種搭配既能保持互補(bǔ)色強(qiáng)烈的對比及視覺上的趣味性,又能讓顏色變得柔和。

萬字干貨!超全面的色彩與應(yīng)用指南

36Kr 將藍(lán)色作為主色,互補(bǔ)色黃色作為輔助色用在圖標(biāo)、標(biāo)簽上,再選擇黃色的鄰近色紅色作為另一輔助色,用在不同的信息上,有助于用戶區(qū)分產(chǎn)品信息。

萬字干貨!超全面的色彩與應(yīng)用指南

對比色

指在色環(huán)上相距 120°~180°之間的兩種顏色,也是兩種可以明顯區(qū)分的色彩,包括顏色三要素的對比、冷暖對比,彩色和消色的對比等。對比色能使色彩效果表現(xiàn)更明顯,形式多樣,極富表現(xiàn)力。需要注意的是,互補(bǔ)色一定是對比色,但是對比色不一定是互補(bǔ)色。因?yàn)閷Ρ壬姆秶?,包括的要素更多,如冷暖對比、明度對比、純度對比等。這類配色形式優(yōu)點(diǎn)是視覺沖擊力強(qiáng)烈、富有跳躍性、突出、點(diǎn)綴能力強(qiáng),比如常用作畫面中的點(diǎn)綴色,或與主體固有色成對比關(guān)系的背景色,用于突出主體。缺點(diǎn)是大面積使用比較難把控。

萬字干貨!超全面的色彩與應(yīng)用指南

馬蜂窩的主色是黃色,對比色藍(lán)色作為輔色用在標(biāo)簽、小圖標(biāo)上,紅色作為強(qiáng)調(diào)色用在價格等信息上。

萬字干貨!超全面的色彩與應(yīng)用指南

對比色也不單純是兩個顏色之間的對比,而是色調(diào)之間的對比!對比色還包括:補(bǔ)色對比、色相對比、明度對比、飽和度對比、冷暖對比,飽和度越高對比越強(qiáng)烈,明度反差越大對比越強(qiáng)烈。

四元色搭配

四元色搭配在色環(huán)上形成了一個矩形,使用不是一對而是兩對互補(bǔ)色。將其中的一個顏色作為主色,其余顏色作為輔色進(jìn)行搭配可以得出不錯的效果。

萬字干貨!超全面的色彩與應(yīng)用指南

四元色是比較難以平衡的顏色,不過搭配好了會非常出彩。不信可以自己用用感受一下,尤其是使用其中一個顏色作為主色,其他的三個顏色作為輔助色的時候。

萬字干貨!超全面的色彩與應(yīng)用指南

4. 色彩和光源關(guān)系

了解了色彩的基本知識,下面說說色彩和光源的關(guān)系。如果想描繪好對象的色彩,那么就必須了解對象的固有色、光源色、環(huán)境色及它們之間的關(guān)系和變化。

固有色

即物體本身的顏色。是指在光源條件下物體占主導(dǎo)地位的色彩,如紅色的罐子、綠色的植物等。物體的固有色并不存在,在繪畫過程中為了觀察方便經(jīng)常引入“固有色”這一概念。從實(shí)際方面來看,即使日光也是在不停地變化中,何況任何物體的色彩不僅受到投照光的影響,還會受到周圍環(huán)境中各種反射光的影響。所以物體色并不是固定不變的。

萬字干貨!超全面的色彩與應(yīng)用指南

光源色

物體只有在光源的照亮下才能觀察到它們的色彩。光源有自然光(太陽、天光)和人造光(燈),這些光源都各自具有不同的顏色。太陽光是偏黃色暖色光,月光是偏青的冷色光,陰天則更多的是藍(lán)灰色的天光,普通燈光是偏黃色的暖色光。光源的顏色對物體的顏色影響很大,想象一下一個置于紅色光源照射下的藍(lán)色物體會是什么顏色。

環(huán)境色

物體周圍環(huán)境的顏色就是環(huán)境色。環(huán)境色對物體的影響非常大,如在紅色背景下的白色物體,由于光源打到紅色背景上的背景反射光也會“染”到白色物體上,因此白色物體的部分表面會蒙上一層淡紅色的色彩。所以,設(shè)計師在用電腦作圖時也需要考慮并想象環(huán)境色的影響。

5. 色彩空間

Lab

Lab 的全稱是 CIELAB,有時候也寫成 CIE L*a*b*。最突出的特點(diǎn)是它的生理特性,一是它包括人眼所看到的所有顏色,是目前為止色域最寬的色彩空間,二是跟人眼一樣,首先看到的是明暗,其次是色彩,可以用數(shù)字化的方式描述人的視覺感應(yīng),在計算機(jī)視覺中廣泛應(yīng)用。

萬字干貨!超全面的色彩與應(yīng)用指南

LAB 顏色空間中,L 表示亮度,取值[0-100]對應(yīng)[純黑—純白];A顏色表示從綠色到紅色的范圍,取值[-128—+127]對應(yīng)[綠—洋紅];B表示從藍(lán)色到黃色的范圍,取值[-128—+127]對應(yīng)[藍(lán)-黃],正是暖色,負(fù)是冷色。Lab顏色空間中亮度和顏色是分開的, L通道沒有顏色,a通道和b通道只有顏色。不像在RGB顏色空間中,R通道、G通道、B通道每一個既包含有明度又包含有顏色。

在表達(dá)色彩范圍上,最全的是 Lab 模式(其次是 RGB 模式,最窄的是 CMYK 模式),它彌補(bǔ)了 RGB 色彩模型和 CMYK 色彩模式色彩分布不均的不足。也就是說 Lab 模式所定義的色彩最多,且與光線及設(shè)備無關(guān),并且處理速度與 RGB 模式同樣快,比 CMYK 模式快數(shù)倍。

Hsb

HSB 和 HSV 是同一個東西,只是名稱不同。在 Photoshop 拾色器上可以看到每個顏色都有一組 HSB 值,H 表示色相、S 表示純度、B 表示明度。色相值為 0~360 度,即圓;純度和明度值為 0~100%,因此,了解 HSB 模式的原理,就能了解色彩的本質(zhì)。

當(dāng)我們需要調(diào)配同色系色彩,保持色相不變,只需要改變純度和明度即可。如下圖所示的 3 種同色系綠色,他們的色相(H152)都一致,僅在純度和明度上有所變化。

萬字干貨!超全面的色彩與應(yīng)用指南

當(dāng)色相和純度都為 0 時,色彩稱為中性色,也稱為灰度色,即黑白灰。其中,灰不是單指某一種顏色,而是一系列從黑到白的過渡色。

萬字干貨!超全面的色彩與應(yīng)用指南

灰度色多用于文字,通常一個應(yīng)用中的文字不應(yīng)超過 3 種灰度色。深黑用于標(biāo)題、正文等主要文字;淺黑或深灰用于輔助、提示性文字;淺灰用于禁用、失效等狀態(tài)文字;純白用于深色按鈕文字。

萬字干貨!超全面的色彩與應(yīng)用指南

此外,灰度色由于沒有任何色相,始終沉著冷靜,減少對內(nèi)容的視覺干擾,因此常用于界面背景色,例如 MOO 音樂的界面設(shè)計。

萬字干貨!超全面的色彩與應(yīng)用指南

Hsl

HSL 色彩模式是工業(yè)界的另一種顏色標(biāo)準(zhǔn),是通過對色相(H)、飽和度(S)、亮度(L)三個顏色通道的變化以及它們相互之間的疊加來得到各式各樣的顏色的。在原理和表現(xiàn)上,HSL 和 HSB 中的 H(色相) 完全一致,但二者的 S(飽和度)不一樣,L 和 B (明度 )也不一樣。

取一個顏色試試看,先選一個顏色 #0688F9,放入 “HSL Color Picker”,顯示 HSL 數(shù)值為:H(208), S(95), L(50),但是我們放在 Sketch 里面看一下,顯示的 HSB 數(shù)值為,H(208), S(98), B(98) 。

萬字干貨!超全面的色彩與應(yīng)用指南

HSL 的 H 代表的是人眼所能感知的顏色范圍,這些顏色分布在一個平面的色相環(huán)上,取值范圍是 0°到 360°的圓心角,每個角度可以代表一種顏色。色相值的意義在于,我們可以在不改變光感的情況下,通過旋轉(zhuǎn)色相環(huán)來改變顏色。在實(shí)際應(yīng)用中,我們需要記住色相環(huán)上的六大主色,用作基本參照:360°/0°紅、60°黃、120°綠、180°青、240°藍(lán)、300°洋紅,它們在色相環(huán)上按照 60°圓心角的間隔排列。

萬字干貨!超全面的色彩與應(yīng)用指南

HSL 相比 RGB 的優(yōu)勢

我們來做一個基于 HSL 的調(diào)色實(shí)踐。你可不可以快速說出“海棠紅”所對應(yīng)的 RGB 色值?如果再加一點(diǎn)橙色進(jìn)去,把亮度提高一點(diǎn),色值又是多少?想想那應(yīng)該是一個介于洋紅和紅色之間的,性感嬌艷的顏色。我們可以假定它在色相環(huán) H 上的角度是 330°左右,飽和度較高,亮度適中,看看那是什么顏色?

萬字干貨!超全面的色彩與應(yīng)用指南

em…我們想要的顏色應(yīng)該再接近紅色一點(diǎn),讓我們把色相(H)+20°到 350°,現(xiàn)在好多了。

萬字干貨!超全面的色彩與應(yīng)用指南

通過改變色相值 H,我們實(shí)現(xiàn)了色相從洋紅向海棠紅的偏移。 大感覺接近了,但還是略微有點(diǎn)灰暗,我們可以通過增加飽和度(S)+15%,讓這個顏色變得更鮮活,看起來更亮麗。

萬字干貨!超全面的色彩與應(yīng)用指南

感覺還是差點(diǎn),海棠紅是屬于少女的顏色,應(yīng)當(dāng)再嫩一點(diǎn)、通透一點(diǎn),不會這么強(qiáng)烈。那可以通過增加亮度 L,+10%試試看,嗯,這才是我們想要的顏色。

萬字干貨!超全面的色彩與應(yīng)用指南

同理,如果想加點(diǎn)橙色進(jìn)去, 再亮一點(diǎn),我們通過心算就大致可以確定色相環(huán)的相位和亮度值。在這里,我們需要讓 H 增加 20°,L 增加 5%。

萬字干貨!超全面的色彩與應(yīng)用指南

在使用 HSL 調(diào)色的過程中,不需要了解復(fù)雜的色光混合原理,這是一個自然的、感性的、易于理解的過程。相比之下,RGB 調(diào)色方式顯得非常笨拙復(fù)雜、難以理解,而 HSL 是多么的友好。

  • 知識點(diǎn):

需要提醒一下的是,CSS 代碼里支持的是 HSL,而不是 HSB。如果和前端對接時,UI 給到的是 HSB 的色值,那么最終落地的顏色效果會與設(shè)計稿有出入。Photoshop 中的 Hex 和 RGB 顏色可以直接在 CSS 文件中使用,但是 Photoshop 中的 HSB 模式顏色和 HSL 是不同的。

Yuv

YUV,是一種顏色編碼方法。常使用在各個影像處理組件中。YUV 在對照片或影片編碼時,考慮到人類的感知能力,允許降低色度的帶寬。Y 表示明亮度(Luminance 或 Luma),也就是灰度值;U(Cb)表示色度(Chrominance);V(Cr)表示濃度(Chroma);通常 UV 一起描述影像色彩和飽和度,用于指定像素的顏色。

萬字干貨!超全面的色彩與應(yīng)用指南

采用 YUV 色彩空間的重要性是它的亮度信號 Y 和色度信號 U、V 是分離的。如果只有 Y 信號分量而沒有 U、V 信號分量,那么這樣表示的圖像就是黑白灰度圖像(回想一下小時候看的黑白電視)。彩色電視采用 YUV 空間正是為了用亮度信號 Y 解決彩色電視機(jī)與黑白電視機(jī)的兼容問題,使黑白電視機(jī)也能接收彩色電視信號。

色彩心理學(xué)

色彩心理學(xué)是美術(shù)知識學(xué)習(xí)中非常重要的一部分。他所研究的是色彩通過對人視覺上的刺激,而引發(fā)人情感和感官上的變化,通過日常生活中人們對應(yīng)用色彩的經(jīng)驗(yàn)積累而歸納總結(jié)出人類對色彩心理上的預(yù)期感受。在生活中,色彩心理學(xué)對人們對顏色的認(rèn)知有很大的影響。為什么交通信號燈用紅色表示停止通行而不是綠色呢?為什么大多快餐店用紅色或黃色作為品牌的主色?這都是色彩心理學(xué)的相關(guān)知識。

萬字干貨!超全面的色彩與應(yīng)用指南

雖然紅、藍(lán)是受到最普遍喜愛的顏色(通過對 App Store 應(yīng)用流行顏色分類統(tǒng)計得知)。但并不意味著這一準(zhǔn)則可以套用在所有產(chǎn)品上。產(chǎn)品的屬性是什么,用戶定位是什么,要傳達(dá)的產(chǎn)品氣質(zhì)是什么等等,這些都是選擇應(yīng)用圖標(biāo)的顏色時需要考慮的問題。世界上第一間 Airbnb 房間是在一條叫 Rausch street 的街上誕生的,因此 Airbnb 的主色被命名為「Rausch」的溫暖顏色。在挑選主色調(diào)的時候,4 名設(shè)計師前往世界 13 個城市,只為了更好地理解 Airbnb 的理念:熱情、能量和自信,這正是 Rausch 要傳遞的信息。除了 Rausch 以外,Airbnb 還有其它九種顏色,包括 Kazan、Beach、Tirol、Foggy 等等,它們也都是以 Airbnb 的社區(qū)街道命名的。

萬字干貨!超全面的色彩與應(yīng)用指南

下面來講解每一種顏色都各自帶有什么樣的性格,只有理解了顏色的性格才能正確的使用它們。

黑色

黑色代表著品質(zhì)、高端、時尚、低調(diào)、權(quán)威、嚴(yán)肅、穩(wěn)重,是一種充滿質(zhì)感的顏色。它是所有色彩中最有力量的,能很快吸引用戶的注意力。作為一種無彩色,能讓它和其他色彩百搭,黑色+金黃色,給人一種奢華精致的感覺;黑色+銀灰色,則給人一種成熟穩(wěn)重的感覺;黑色+紅色,給人一種時尚潮流的感覺。因此黑色是一種永遠(yuǎn)流行的主要色彩。

萬字干貨!超全面的色彩與應(yīng)用指南

白色

白色代表著純潔、簡單、純真、樸素、信任、開放、雅致,白色常常被認(rèn)為是“無色”,即不是色彩。單一使用白色通常不會引起任何情感,但是當(dāng)白色與其他顏色配合使用時,白色能很好的襯托,大量的留白讓其他元素脫穎而出。在界面設(shè)計中,作為無彩色的白色,常用于背景色,緩和各種顏色的沖突,以襯托其他色彩,提高畫面明度,提高文字可讀性。

萬字干貨!超全面的色彩與應(yīng)用指南

灰色

灰色是代表著睿智、老實(shí)、執(zhí)著、嚴(yán)肅、壓抑、沉穩(wěn)。介于黑色和白色之間,也屬于無彩色,沒有色相也沒有純度,只有明度的變化。它和任何顏色都能很好的搭配,也常常用于背景色或用于突出其他彩色?;疑幌窈谏敲磮杂泊萄?,他更有彈性,它比黑色更有深層次的力量。因此在畫面中,很少出現(xiàn)純黑,基本都是用深灰色來代替黑色,也可以用淺灰色來代替白色。

萬字干貨!超全面的色彩與應(yīng)用指南

紅色

紅色代表著喜慶、熱情、歡樂、斗志、奔放、自信,是一種充滿能量的顏色。這是最醒目和強(qiáng)勢的顏色,一登場即獲得全場的關(guān)注,甚至能引起一些生理反應(yīng),例如心跳呼吸加快等。紅色最能烘托氣氛,在中國傳統(tǒng)節(jié)日里都使用熱鬧的紅色來裝飾,因此也就不難理解每逢佳節(jié)各大電商應(yīng)用活動頁一片紅,為的就是發(fā)沖動,引人消費(fèi)。同時紅色也代表了警示、告誡。所以在界面設(shè)計中常用紅色的文字和按鈕來警示用戶慎重操作。

萬字干貨!超全面的色彩與應(yīng)用指南

橙色

橙色代表著溫暖、歡樂、輝煌、健康、陽光、年輕、華麗,是一種充滿朝氣的顏色。橙色并不像紅色那樣咄咄逼人,而且它烘托出的活躍氣氛沒有危險的感覺,反而是一種友好。因此越來越多的應(yīng)用避開常見的紅色和藍(lán)色,而選擇橙色的原因。

萬字干貨!超全面的色彩與應(yīng)用指南

黃色

黃色代表著信心、青春、聰明、尊貴、輝煌、時尚,是一種充滿活力的顏色。黃色是明度極高的顏色,其鮮亮的色調(diào)使它在眾多圖標(biāo)陣列中顯得尤為突出。盡管在警示效果上沒有紅色那么明顯和強(qiáng)烈,但是還是能給人很醒目和危險的感覺(例如道路警示牌)。同時因?yàn)檫^于明亮,也是一種非常難以運(yùn)用的顏色,性格不穩(wěn)定常有偏差,和別的顏色配合使用易失去本來的性格。不過黃+黑的搭配很流行,例如站酷和美團(tuán)外賣。

萬字干貨!超全面的色彩與應(yīng)用指南

綠色

綠色代表著健康、生命、青春、寧靜、自然、和平、安全、舒適,是一種充滿希望的顏色。綠色給人無限的安全感,當(dāng)情緒低落與消極時看一些綠色,能緩解我們焦躁的情緒。綠色在生活中被廣泛運(yùn)用,如安全出口的顏色就是綠色,但綠色的飽和度要適當(dāng)控制,如高飽和度的綠色也會令人興奮,引起注意。

萬字干貨!超全面的色彩與應(yīng)用指南

青色

青色代表著堅強(qiáng)、古樸、活潑、清爽、柔和、優(yōu)雅、希望,是一種充滿靈動的顏色。青色是一種介于綠色與藍(lán)色之間的顏色,如果無法界定一種顏色是藍(lán)色還是綠色時,這個顏色就可以被稱為青色。豆瓣的主色調(diào)是青色,很符合豆瓣小清新的氣質(zhì),帶給用戶恬靜的感受。

萬字干貨!超全面的色彩與應(yīng)用指南

藍(lán)色

藍(lán)色代表著冷靜、科技、靈性、自由、放松、未來、理智、純凈、商務(wù),是一種充滿理性的顏色。藍(lán)色是天空的顏色,是大海的顏色。在色彩心理學(xué)的測試中發(fā)現(xiàn),幾乎沒有人對藍(lán)色反感。純凈的藍(lán)色通常讓人聯(lián)想到海洋和天空,可以撫平內(nèi)心的傷口,讓人的內(nèi)心感到平和,有助于人的頭腦變得冷靜。例如 twitter 的主色調(diào)是藍(lán)色,在社交應(yīng)用里藍(lán)色是一種很安全的顏色,高純度的顏色傳遞了信賴、年輕和溝通的氛圍。

萬字干貨!超全面的色彩與應(yīng)用指南

紫色

紫色代表著高貴、浪漫、優(yōu)雅、性感、幸運(yùn)、夢幻、時尚、創(chuàng)造性,是一種充滿神秘的顏色。是小孩子和有創(chuàng)造力的人十分喜歡的顏色。紫色的光波最短,在自然界中較少見到,所以被引申為象征高貴的色彩。紫色的明度在所有有彩色的顏色中是的。與不同的顏色結(jié)合會展現(xiàn)出不同的風(fēng)格特色。紫+粉常用于女性化的產(chǎn)品調(diào)性,黃色是紫色的對比色。

萬字干貨!超全面的色彩與應(yīng)用指南

色彩對用戶體驗(yàn)的影響

當(dāng)我們討論色彩的時候,聊的更多的是色彩的搭配。雖然有些設(shè)計師認(rèn)為有些色彩是一些純粹的美學(xué)上的選擇,但是實(shí)際上,色彩對于用戶的心理和行為的影響相對更深,最終會反映在用戶體驗(yàn)和行為反饋上。

當(dāng)然,色彩理論是一個相對復(fù)雜的主題。從用戶體驗(yàn)的角度上來說,色彩所涉及到的遠(yuǎn)不是配色方案這一個維度。通常,我們聊得最多的是不同色彩所產(chǎn)生的心理效應(yīng),以及多色彩搭配時,相互之間的影響和可訪問性上的問題。設(shè)計師可以將色彩更好地運(yùn)用到設(shè)計中,而無需重新考慮整個過程。一旦設(shè)計師掌握了基礎(chǔ)知識,色彩理論中最有意義的部分之一就是學(xué)習(xí)將更多意想不到的色彩融入他們的設(shè)計中。

萬字干貨!超全面的色彩與應(yīng)用指南

1. 色彩心理學(xué)和用戶體驗(yàn)緊密關(guān)聯(lián)

界面顏色的情感影響不容忽視。盡管有些顏色在 Ui 設(shè)計中是“通用的”(例如,黑色,白色和灰色,實(shí)際上幾乎所有好的設(shè)計中都使用了其中的至少一種),但它們結(jié)合使用的顏色可能會對體驗(yàn)設(shè)計產(chǎn)生巨大影響。當(dāng)然,顏色的使用方式也會對顏色的感知產(chǎn)生巨大影響。以藍(lán)色為例,在簡約的布局當(dāng)中,大面積使用藍(lán)色作為主色調(diào),和在大面積白底上使用很小的一抹藍(lán)色用來強(qiáng)調(diào) CTA 按鈕,所帶來體驗(yàn)是截然不同的。

尊重文化差異

人類對于色彩都有著共通的認(rèn)知,但不同國家對于色彩賦予了不同的含義。紅色在中國象征著喜慶、財富和愛情,而在西方國家被賦予了流血、犧牲、暴力和激進(jìn)的文化意義,貶義的味道更重一些。而白色與紅色相反,白色在中國代表了死亡、反動和投降,以白色為主的設(shè)計常常會被視之為過于「素」,認(rèn)為不夠吉利。而西方國家卻認(rèn)為白色高雅、純潔和幸運(yùn),因此要根據(jù)不同的文化背景,使用不同的色彩,才能更好地降低被誤解的風(fēng)險。

萬字干貨!超全面的色彩與應(yīng)用指南

另外一方面,隨著現(xiàn)代主義運(yùn)動的普及,白色也擁有了更加現(xiàn)代的特征。在日本,白色甚至和當(dāng)?shù)匚幕Y(jié)合,延伸出更加細(xì)膩獨(dú)特的精神特質(zhì),隨著日本戰(zhàn)后設(shè)計領(lǐng)域的發(fā)展和崛起,白色在這一地區(qū)的含義則更加豐厚。原研哉在《白》一書當(dāng)中,針對白色的含義和特征進(jìn)行了非常深入的探討,之后的《Subtle》一書當(dāng)中,雖是圍繞紙來探討微妙的體驗(yàn),但是也沒少提及白色本身的特征。

萬字干貨!超全面的色彩與應(yīng)用指南

例如股票交易市場,在國際股票市場通常是綠漲紅跌,這是因?yàn)榧t色在西方國家代表著財政赤字,綠色代表著財富;而在中國正好相反是紅漲綠跌,這是因?yàn)樵谥袊t色象征著財富。

萬字干貨!超全面的色彩與應(yīng)用指南

設(shè)計師必須根據(jù)產(chǎn)品的目標(biāo)受眾來審視其調(diào)色板的文化含義,這一點(diǎn)很重要。如果產(chǎn)品要面向全球受眾,請確保在使用的顏色和圖像之間取得平衡,以防止負(fù)面的文化內(nèi)涵。如果產(chǎn)品主要只針對特定文化,則設(shè)計師可以不用太關(guān)心所選調(diào)色板在其他文化中可能產(chǎn)生的影響。

歷史對配色的影響

時間變化對于配色所帶來的影響不僅僅如此。比如中日兩國在色彩使用上,還存在一個非常典型的差異,歷史上日本在一個很長的周期內(nèi)是作為中國的屬國所存在的,這也使得中國自古以來崇尚飽和度較高的正色,而日本則大多使用飽和度偏低的間色,這一特征可以從兩國的傳統(tǒng)色上體現(xiàn)出來:

萬字干貨!超全面的色彩與應(yīng)用指南

△ 中國傳統(tǒng)色:https://color.uisdc.com/

萬字干貨!超全面的色彩與應(yīng)用指南

△ 日本傳統(tǒng)色:https://color.uisdc.com/jp.html

性別誤區(qū)

或許天生如此,女性不喜歡灰色、棕色和橙色。她們鐘愛藍(lán)色、紫色和綠色。而男性不喜歡紫色、棕色和橙色。男性喜歡藍(lán)色、綠色和黑色。只要記住,當(dāng)你的產(chǎn)品目標(biāo)用戶群是男性時,選擇能傳達(dá)男性氣概的色彩,想象下你把運(yùn)動類應(yīng)用的界面使用女性色彩,結(jié)果可想而知。

萬字干貨!超全面的色彩與應(yīng)用指南

△ 男女最喜歡的顏色

萬字干貨!超全面的色彩與應(yīng)用指南

△ 男女最不喜歡的顏色

3. 針對色盲用戶群體的設(shè)計

你有沒有想過你的 APP 使用人群中會有視力障礙者?

當(dāng)人們談?wù)撋r,他們通常指的是不能感知某些色彩。 大約 8%的男性和 0.5%的女性患有不同程度的色盲——他們在識別部分或者全部顏色時有困難。面對如此龐大的特殊受眾,設(shè)計師理應(yīng)關(guān)注他們的需求。

萬字干貨!超全面的色彩與應(yīng)用指南

△ 正常人和紅綠色盲看到的相同色彩

因?yàn)樯び卸嘀乇憩F(xiàn)形式,例如紅綠色盲,藍(lán)黃色盲和單色色盲。所以運(yùn)用多樣的視覺線索來連接你 APP 的重要狀態(tài)是很重要的。絕不要僅僅依靠色彩來表示系統(tǒng)狀態(tài)。 相反,應(yīng)使用元素(如筆畫,指示符,圖案,紋理或文本)來描述操作和內(nèi)容。需要注意的就是不要簡單認(rèn)為色盲就是簡單的分不清紅綠,色盲用戶對色彩的感受差異不僅僅是單獨(dú)某種的問題,是某些范圍色光的敏感程度問題。

有趣的事實(shí):Facebook 的標(biāo)志和不怎么討喜的藍(lán)色配色是特意挑選的。因?yàn)?FB 創(chuàng)始人馬克·扎克伯格是紅綠色盲,他對藍(lán)色的識別是最好的。他曾說過,“藍(lán)色是我生命中最豐富的顏色,我?guī)缀蹩梢钥匆娺@世上所有的藍(lán)色?!?

萬字干貨!超全面的色彩與應(yīng)用指南

△ facebook

Photoshop 有非常實(shí)用的工具來幫助模擬色盲,在「視圖」的「校樣設(shè)置」菜單內(nèi)選中就可以使用了。這個功能讓設(shè)計師可以看到在色盲用戶的眼中你的界面是什么樣子的。

萬字干貨!超全面的色彩與應(yīng)用指南

△ pinterest登陸頁紅綠色盲視圖

下面以點(diǎn)狀圖信息圖形為例,來說明如何為色盲用戶優(yōu)化信息圖:

萬字干貨!超全面的色彩與應(yīng)用指南

優(yōu)化采用了這樣一些手段:1.調(diào)整配色,將色盲人士容易混淆的紅、綠、橙色換為紅、藍(lán)、黃色。2.調(diào)整明度,使圖中幾個顏色在明度上差異更明顯。3.為不同元素賦予不同形狀。所有使用點(diǎn)元素的信息圖,都可以參考這種解決方式。

在實(shí)際設(shè)計過程中,我們需要在美觀和友好之間進(jìn)行權(quán)衡。我們也可以采用一些交互手段,避免同一界面中元素太多太過雜亂的問題。

4. 流行趨勢對色彩的影響

這是更長維度上的變化,在短時間以內(nèi),流行色的趨勢變化,對于用色也同樣存在影響。這種影響在時尚行業(yè)有著非常直接的體現(xiàn),而在網(wǎng)頁和 UI 設(shè)計行業(yè),同樣存在。比如 2020 年的潘通年度流行色是「經(jīng)典藍(lán)」(Classic Blue),也就明白了為什么 iphone12 今年的主打色是藍(lán)色了。

萬字干貨!超全面的色彩與應(yīng)用指南

所以,當(dāng)你在設(shè)計的時候,如果你的目標(biāo)用戶群體有著清晰的地域或者性別偏向,你可以有目的地利用這些知識來規(guī)避設(shè)計陷阱,更好地發(fā)揮色彩本身的功能和優(yōu)勢。如果受眾廣泛,則可以盡量使用通用性更強(qiáng)的色彩來進(jìn)行設(shè)計。

  • 知識點(diǎn):

你知道世界上的顏色是什么嗎?

是否存在一種色彩,是不分性別文化,大家都會喜歡的呢?確實(shí)有人通過大規(guī)模的調(diào)研和探索找到了一種世界上的色彩:馬爾斯綠(Marrs Green)。來自全世界 100 多個國家 3 萬多人響應(yīng)號召完成了這項(xiàng)投票,并且最終選取出來的一款綠色。

萬字干貨!超全面的色彩與應(yīng)用指南

色彩在UI設(shè)計中的應(yīng)用

1. 色彩的應(yīng)用

人腦對于色彩的記憶度要高于形態(tài),即一個 App 給用戶留下深刻印象的往往是界面的色彩。例如說到支付寶,我們可能想不起它的首頁長什么樣子,標(biāo)簽欄圖標(biāo)是那些,但能馬上記起它的界面主色是藍(lán)色。因此運(yùn)用好色彩對 UI 設(shè)計十分重要,它能直觀的呈現(xiàn)產(chǎn)品的氣質(zhì)和性格,能有效的幫助用戶組織和閱讀信息,與界面設(shè)計產(chǎn)生聯(lián)系和記憶。好的配色往往依靠設(shè)計師審美、感覺搭配出來,但合理的顏色搭配必定存在合理的配色規(guī)律和配色方法論的支撐,下面結(jié)合相關(guān)案例為大家講解色彩運(yùn)用的幾個技巧。

不得觸碰的禁區(qū)

分析研究了很多優(yōu)秀設(shè)計作品,發(fā)現(xiàn)他們在用色的時候有一部分區(qū)域是不會使用的,也就是我們常說的“配色禁區(qū)”。當(dāng)然,這里的“禁區(qū)”是帶雙引號帶的,并沒有什么絕對的禁區(qū),只是說這些顏色不易控制,在連基礎(chǔ)色都沒有駕馭好之前,盡量少碰。

配色禁區(qū)大概分為這三種:三角形禁區(qū)、矩形禁區(qū)、扇形禁區(qū)(紅色為禁區(qū)),如下圖:

萬字干貨!超全面的色彩與應(yīng)用指南

綜合看來,不管是那種禁區(qū),右下角區(qū)域的顏色是很少用的。畢竟他們又臟又深,當(dāng)然什么顏色都能駕馭的大師請略過。

  • 知識點(diǎn):

在界面設(shè)計中,一般主色和輔助色都集中在右上角,次要的和不可點(diǎn)的顏色都集中在中上方,而文字信息和背景色則集中在左側(cè),右下角禁區(qū)是我們要重點(diǎn)避開的對象。

色調(diào)一致

在 App 設(shè)計之前應(yīng)先確定界面的主色調(diào),主色將占據(jù)界面中很大的比例,通常是品牌色,而輔助色、點(diǎn)綴色、背景色等都應(yīng)以主色調(diào)為基準(zhǔn)來搭配,這樣才能保證 App 整體色調(diào)的一致。色調(diào)一致的界面,能帶給用戶始終如一的視覺體驗(yàn)。例如馬蜂窩將黃色(品牌色)作為主色,以及從主色搭配出的藍(lán)色(對比色)貫穿 App 始終。

萬字干貨!超全面的色彩與應(yīng)用指南

60-30-10 原則

60% 30% 10%的原則,是達(dá)到色彩平衡的最佳比例。在 60%的空間使用主色,可以運(yùn)用到導(dǎo)航欄、按鈕、圖標(biāo)等關(guān)鍵的元素中,使之成為整個 App 的視覺焦點(diǎn)和色彩關(guān)系;30%的空間使用輔助色,可以平衡過多的主色而造成的視覺疲勞;最后剩下 10%的空間為點(diǎn)綴色,可以用在一些不太重要的元素又需要區(qū)分的時候。6:3:1 原則構(gòu)建了一種豐富的色彩層次,讓界面看上去和諧、平衡和不雜亂。

萬字干貨!超全面的色彩與應(yīng)用指南

嗶哩嗶哩將粉色運(yùn)用到頁簽、標(biāo)簽欄、按鈕、入口圖標(biāo)等上,藍(lán)色的輔助色用在角標(biāo)、圖標(biāo)上,還有黃色、紅色用在一些小圖標(biāo)、小標(biāo)簽上,主次非常清晰明了。

萬字干貨!超全面的色彩與應(yīng)用指南

色不過三

經(jīng)常很多大神在網(wǎng)上說配色不要超過三種色,其實(shí)就是「色不過三」原則,即在一個頁面中不要使用超過 3 種顏色搭配,這也和上面說的“60-30-10 原則”類似,即一個主色、一個輔助色和一個點(diǎn)綴色。但在實(shí)際 UI 設(shè)計中,迫于產(chǎn)品的需要可能會使用更多數(shù)量的色彩,但切記不可超過 7 種色相(注意不是 7 種色值),每個色相還可以運(yùn)用其飽和度、明度的變化分解出豐富的色彩搭配。

萬字干貨!超全面的色彩與應(yīng)用指南

美團(tuán)外賣的首頁 20 個功能入口大圖標(biāo)的背景用了 9 種不同的色彩,每種色彩又包含一種低飽和度色彩進(jìn)行彩色漸變,但并沒有顯得雜亂,而是呈現(xiàn)一種年輕時尚的律動感。這是因?yàn)檫@里雖然使用了 9 種不同的色彩,但仔細(xì)觀察發(fā)現(xiàn)只使用了 3 種色彩,其他 6 種則是從前者鄰近色中提取出來的搭配,再將它們錯落放置,呈現(xiàn)出豐富多彩的色彩搭配,整體和諧統(tǒng)一。

遠(yuǎn)離純黑色和純灰色

黑色就像沒有生命力的深淵,使用戶陷入冷冷的負(fù)面情緒中。遠(yuǎn)離純黑色和純灰色,是因?yàn)樗鼈儾淮嬖谟诂F(xiàn)實(shí)世界里。嘗試在純黑和純灰中加入一些色調(diào),會讓界面看上去更柔和自然。另外,純黑色還會與白色產(chǎn)生強(qiáng)烈的對比度,看久了會使人疲勞,讓用戶產(chǎn)生焦慮的情緒。MONO 的導(dǎo)航欄并不是深黑色,而是加入了藍(lán)色的低飽和度藍(lán)黑色,它的界面背景也是加入了藍(lán)色的的淺色,這樣就不會讓界面看上去死氣沉沉的。

萬字干貨!超全面的色彩與應(yīng)用指南

遵循色彩心理學(xué)

前文我們已經(jīng)了解過各種色彩的心理學(xué)知識,就是為了我們在進(jìn)行 App 設(shè)計時提供依據(jù)。這些色彩都是源于人類對大自然最原始的感受,藍(lán)色的天空、綠色的草地、黃色的沙漠等等,自然的色彩,對于我們來說是司空見慣的,但其中卻蘊(yùn)含著豐富的美感,并達(dá)到了和諧統(tǒng)一。網(wǎng)易云音樂使用紅色作為主色,這種熱情奔放的顏色傳遞出一種充滿能量、自信的氣質(zhì)。

萬字干貨!超全面的色彩與應(yīng)用指南

良好的可讀性

良好的可讀性在界面設(shè)計中能為用戶提供主次分明、層次清晰的閱讀體驗(yàn),而一個可讀性差的界面則會成為用戶瀏覽的障礙。那如何確保界面具有良好的可讀性呢?這就需要在界面設(shè)計中注意色彩搭配的對比,如在淺色背景上使用深色文字,在深色背景上使用淺色文字,使用高對比的度的亮色展示重要的元素,用低對比度的淺色來體現(xiàn)需要弱化和次要的內(nèi)容。例如蘋果 Music 的主要功能入口,標(biāo)簽欄圖標(biāo)、按鈕等都是用了高純度的紅色,與其他元素形成鮮明對比,就連深灰色的輔助文字都有著清晰的可讀性。

萬字干貨!超全面的色彩與應(yīng)用指南

從大自然中獲得靈感

配色中盡量使用大眾熟悉的色彩,如自然界中人們常見的色彩等。從大自然中獲取的配色靈感可以使你的設(shè)計更加切合用戶的審美,非常自然。而藝術(shù)是對自然的直接反映,是非常寶貴的資源,值得好好利用。我們可以搜集各種與自然風(fēng)光相關(guān)的圖片,從中提取色彩運(yùn)用到設(shè)計中,這些幾近完美的搭配呈現(xiàn)出來的和諧美感能瞬間打動人心。天氣應(yīng)用 Marline 就是一個很好的例子,它的界面背景漸變就參考大自然的變化,隨著不同時間段呈現(xiàn)出清晨、日出、正午、日落、深夜、雨天等漸變色,打開應(yīng)用即喚起了用戶的快樂情緒。

萬字干貨!超全面的色彩與應(yīng)用指南

將 UX 顏色與品牌相匹配

品牌價值在創(chuàng)建調(diào)色板中發(fā)揮關(guān)鍵作用,但是它們不是唯一重要的因素,行業(yè)規(guī)范也是關(guān)鍵。使用與品牌主要競爭產(chǎn)品幾乎相同的配色方案不失一種好方法。配色在品牌視覺中所發(fā)揮的作用是不言而喻的,但是,色彩本身的內(nèi)涵和情緒特質(zhì)并不是全部。比如一個行業(yè)當(dāng)中,很多產(chǎn)品都使用了藍(lán)色,那么你的產(chǎn)品繼續(xù)使用藍(lán)色,可以讓用戶更快「識別出」你所屬的領(lǐng)域,但是本身也存在讓人混淆的風(fēng)險。如果你想要在視覺上脫穎而出,可以試著使用不同的色彩。

萬字干貨!超全面的色彩與應(yīng)用指南

△中國區(qū)或美國區(qū),紅色和藍(lán)色都是最流行的顏色。

在進(jìn)行品牌設(shè)計的時候,選擇配色的第一步,始終是了解各種顏色或者色相的氣質(zhì)和情感屬性。然后,在具體設(shè)計的時候,再進(jìn)一步根據(jù)品牌的氣質(zhì)和需求,再在色相的基礎(chǔ)上調(diào)整明暗和飽和度。也可以打破常規(guī)創(chuàng)造出與眾不同的配色方案。

從強(qiáng)調(diào)色入手

想要讓配色方案更加突出,在設(shè)計中添加強(qiáng)調(diào)色可能是最容易入手的地方。舉個例子,一個律師咨詢的 App 可能會使用傳統(tǒng)的藍(lán)色作為基礎(chǔ)配色,但是,如果能夠加入檸檬綠作為強(qiáng)調(diào)色,會顯得獨(dú)特很多。

冷暖色對比搭配

冷暖對比色是自然平衡的規(guī)律,可以在設(shè)計中大量使用,這樣的配色會使作品非常的出彩,同時不顯單調(diào),讓用戶感覺舒服平和。而且這種搭配方法基本沒有啥缺點(diǎn),使用在設(shè)計中,技巧性比較多,對設(shè)計的細(xì)膩感受要求比較高,需要多練習(xí)。

萬字干貨!超全面的色彩與應(yīng)用指南

黑白色搭配不過時

黑色是所有中性色中最強(qiáng)的,而白色是最常用的背景顏色。黑色是一個很好的選擇,有種高端和永恒的感覺,而白色可以帶給用戶自由,寬敞和透氣的感覺。如上所述,黑色和白色也是最大的對比色,如果合理的使用黑色配合白色,會營造出一種優(yōu)雅的氛圍。

萬字干貨!超全面的色彩與應(yīng)用指南

強(qiáng)交互色彩

交互色彩在執(zhí)行過程中必須清晰且在界面中保持一致。號召性用語必須相對于背景具有足夠的對比度,并且相對于其他組件必須具有足夠的視覺權(quán)重,以便用戶可以輕松識別它們。Nike 健身應(yīng)用中,「開始」按鈕以高飽和度的檸檬綠作為主色,從背景中脫引而出。

萬字干貨!超全面的色彩與應(yīng)用指南

但是,交互色彩并不總是以最具飽和度或最亮為特征,而是通過色調(diào)、形狀、大小或?qū)Ρ榷?,從屏幕上脫穎而出。因此,交互色彩的有效性將基于用戶識別交互區(qū)域和執(zhí)行任務(wù)的速度來衡量。同時,次要功能權(quán)重要更輕,并在視覺上更接近信息元素。如上圖 Nike Training 界面中,“設(shè)置”和“聲音”按鈕只用簡單的白色,減輕對主按鈕的干擾,也避免了頁面中出現(xiàn)多個強(qiáng)交互按鈕。

保證良好的可讀性

可讀性是任何設(shè)計中的重要因素。你的顏色應(yīng)該清晰易讀,尤其是在處理文字時。因此對比度對視覺效果的影響就非常關(guān)鍵,對比度過小,就會使得界面出現(xiàn)灰蒙蒙的效果。清晰的對比度,一般會采用色彩的兩極,黑紙白字或白紙黑字。而在彩色背景上要讓內(nèi)容清晰可見,就需要搭配純白或高明度的文字,避免灰色文字。也要注意避免彩色背景上搭配互補(bǔ)色和明度接近的文字,因?yàn)檫@兩種搭配會產(chǎn)生一種“震顫效應(yīng)”,發(fā)出光暈的視覺效果。

萬字干貨!超全面的色彩與應(yīng)用指南

UI 中的陰影

沒有完全純黑的陰影,陰影的顏色是會受到物體本身固有色的影響,一定要避免使用純黑色(#000000),使用不太深的灰色,效果會更好。對于有顏色的元素,好的做法是為陰影設(shè)定與元素相同的顏色,并使其更暗一些。

萬字干貨!超全面的色彩與應(yīng)用指南

如果是有顏色的元素,并且它處在黑暗的背景下,一般情況下,是不建議使用陰影的。但是如果你一定要用,把陰影透明度調(diào)到小于 10%及以下,并且顏色跟隨主色調(diào)來。比如按鈕為綠色,則可以為按鈕設(shè)定一個更深的綠色陰影,并加上小于 10%的透明度數(shù)值。如下圖,左側(cè)的按鈕陰影很自然,右側(cè)的則有一層模糊發(fā)光的效果,顯得不夠漂亮。

萬字干貨!超全面的色彩與應(yīng)用指南

  • 知識點(diǎn):

為什么「超鏈接文字」要用藍(lán)色?

簡單說,因?yàn)樵谧钤缙诘木W(wǎng)站頁面中,藍(lán)色能呈現(xiàn)最高的對比度。

萬字干貨!超全面的色彩與應(yīng)用指南

Tim Berners-Lee——web 的主要開創(chuàng)者,被認(rèn)為是最早用藍(lán)色鏈接的人。

一個很早期的 web 瀏覽器 Mosaic,用的是深灰色背景和黑色文字。那時候,能用的非黑色、最深的文字顏色,就是藍(lán)色。所以,讓超鏈接文字突出顯示,同時保證可讀性,就選定了藍(lán)色。此后超鏈接文字都用藍(lán)色的傳統(tǒng)沿用至今。

2. App 設(shè)計中的色彩搭配

App 的色彩搭配能直觀、快速的反饋到用戶的大腦中形成記憶思維。好的色彩搭配可以加深用戶對產(chǎn)品的印象;明確界面的視覺層次,讓用戶分清主次信息;同時還能給用戶賞心悅目的視覺享受。那么,在 UI 設(shè)計時該如何進(jìn)行色彩搭配呢?我們可以從 App 中都包含了那些色彩開始,通常一個 App 中包含了主色、輔助色、點(diǎn)綴色、背景色這 4 類,下面就以微信讀書為例進(jìn)行詳細(xì)的講解(個人角度)。

主色

主色是指在配色中處于主導(dǎo)地位的色彩,給用戶的第一眼印象,通常是產(chǎn)品的品牌色。在 App 設(shè)計中,主色一般占有色相色彩的 60%的比例。這里指的是 60%的界面都使用到的主色比例,而不是使用面積(因?yàn)橥ǔR粋€界面中使用面積最大的是背景色)。還有就是背景色多為淺灰色或白色,它們都屬于無色相色彩,因此不涉及到配色過程中。我們看到微信讀書的第一印象,就可以判斷它的主色為藍(lán)色,這也是它的品牌色。在標(biāo)簽欄、按鈕、圖標(biāo)、注冊登陸全都使用了這種純凈的主色,使界面看上去非常和諧一致。

萬字干貨!超全面的色彩與應(yīng)用指南

輔助色

輔助色與主色相輔相成,輔助色的功能是幫助主色建立更完整的形象,使界面豐富精彩起來,避免畫面過于單一。通常,主色的鄰近色、互補(bǔ)色、分散互補(bǔ)色和三角對立色都可以成為優(yōu)秀的輔助色,但注意輔助色不宜過多,否則就會使界面看上去花哨分散了主題。根據(jù) 6:3:1 原則,輔助色可以占有色相色彩的 30%或更少為宜。

萬字干貨!超全面的色彩與應(yīng)用指南

在微信讀書中,綠色、橙色、梅紅、藍(lán)紫色是除了主色以外使用最多的顏色,它們都是輔助色,主要用于功能圖標(biāo)和欄目分類上。雖然輔助色看起來有點(diǎn)多,但其實(shí)都是從主色的鄰近色和對比色(及其鄰近色)中提取出來的搭配,而且只用在頁面中很少的地方,這種搭配技巧既可以豐富色彩的搭配,傳遞出年輕活躍的產(chǎn)品氣質(zhì),又保證了整體搭配的和諧統(tǒng)一。

萬字干貨!超全面的色彩與應(yīng)用指南

點(diǎn)綴色

點(diǎn)綴色是除了主色和輔助色以外的另一種色彩,通常體現(xiàn)在細(xì)節(jié)上。其作用是,當(dāng)頁面中主色和輔助色不能滿足關(guān)鍵信息的提示時,就需要點(diǎn)綴色來吸引用戶眼球,還有就是利用點(diǎn)綴色來平衡畫面的冷暖色調(diào)。點(diǎn)綴色通常都是分散的,使用面積小,顏色非常顯眼,能與主色形成強(qiáng)烈的對比。一般點(diǎn)綴色是主色的互補(bǔ)色。在微信讀書中,使用了香檳金、梅紅和紅色作為點(diǎn)綴色。香檳金用在文章分享按鈕上,梅紅色用在點(diǎn)贊圖標(biāo)上,強(qiáng)調(diào)其特殊性,紅色用在通知及退出登錄提醒上,用于警示。

萬字干貨!超全面的色彩與應(yīng)用指南

來康康這三種點(diǎn)綴色與主色之間存在什么樣的關(guān)系,在色相(H)上,3 種點(diǎn)綴色為鄰近色,與主色為互補(bǔ)色;在明度(B)上,3 種點(diǎn)綴色均為高明度色彩,起到強(qiáng)提醒的作用。這種強(qiáng)對比的互補(bǔ)色的點(diǎn)綴色可以快速引起用戶注意力。

萬字干貨!超全面的色彩與應(yīng)用指南

背景色

背景色就比較好理解了,通常為了襯托內(nèi)容,大多數(shù) App 都是用淺灰色作為背景色,以白色作為背景色的對比色,來區(qū)分視覺層次。建議是可以根據(jù)前景色來提取背景色,將其調(diào)亮或變暗,這樣可以讓界面色調(diào)更加統(tǒng)一。在微信讀書中背景色是偏藍(lán)色調(diào)的淺灰色,而不是純灰色,背景對比色是在白色里加入了藍(lán)色色相,而不是純白色,整體對比較柔和,給人清爽通透的感覺。

萬字干貨!超全面的色彩與應(yīng)用指南

  • 知識點(diǎn):

支付寶 Alipay Design 團(tuán)隊提出過一個配色原則:

以同色系配色為主導(dǎo),多色搭配為輔。

同色系為統(tǒng)一的色相,使用中可以加深品牌色的感知,可以讓界面更有層次,同時可以讓界面保持色彩上的一致性;由于業(yè)務(wù)的多樣化,我們需要多色搭配為輔;多色的輔助顏色,也可稱之為功能色,可設(shè)定不同的任務(wù)屬性和情感表達(dá);再搭配中性色黑白灰,賦予更多的變化和層次。兩種配色通過主次、使用比例,可靈活運(yùn)用在業(yè)務(wù)的各個場景中,具有非常好的延展性。

3. 迷人的漸變色

不同于單一色彩,漸變色不屬于任何色彩,它營造出千變?nèi)f化的視覺效果,卻又不會增加視覺負(fù)擔(dān)。相較于單一的色彩,漸變色的復(fù)合性質(zhì)讓它在界面設(shè)計中具有更強(qiáng)的視覺沖擊力,有助于快速搶占視線。如今,這種的色彩正逐漸成為一種潮流,究其原因是目前大量的扁平風(fēng)格造成 UI 設(shè)計的嚴(yán)重同質(zhì)化,人們需要追求更加個性的視覺語言來滿足日益增長的設(shè)計需求。下面我們來了解幾種常見的漸變的使用技巧。

色相、飽和度、明度的漸變

色相(H)漸變是指由一種色彩向另一種色彩的過渡,這種漸變因跨度大產(chǎn)生的視覺效果非常明顯;飽和度(S)漸變是指同一種色彩不同純度的過度,其產(chǎn)生的視覺效果比較和諧單調(diào);明度(B)漸變是同一種色彩不同明暗的過度,這種漸變的視覺效果給人一種沉靜的氛圍。

萬字干貨!超全面的色彩與應(yīng)用指南

漸變的表現(xiàn)形式

在界面設(shè)計中經(jīng)??炊喔鞣N各樣的漸變表現(xiàn)方式,使用最多的有以下幾種:

  • 水平漸變

這個很好理解,是指角度為 0 的線性漸變,是最流行的漸變形式。界面設(shè)計中多用在導(dǎo)航欄、進(jìn)度條、按鈕等元素上,能讓畫面變得精致而通透。例如京東使用橙紅漸變的設(shè)計語言貫穿整個 App,從應(yīng)用圖標(biāo)到導(dǎo)航欄、按鈕、標(biāo)簽,全部都運(yùn)用了這種由紅色到橙色的過渡。仔細(xì)觀察發(fā)現(xiàn)在很多小標(biāo)簽上都使用了水平漸變設(shè)計手法,使產(chǎn)品看起來更年輕化。

萬字干貨!超全面的色彩與應(yīng)用指南

  • 知識點(diǎn):

在水平漸變中,通常把輕(亮)的色彩放在左邊,重(暗)的色彩放在右邊,這樣由左向右的方向感剛好與人的瀏覽習(xí)慣保持一致。而反過來就會與人的瀏覽視線相悖,應(yīng)避免。

垂直漸變

即角度為 90°的線性漸變,它通常被用在正方形或豎條形的元素上,如注冊登陸頁,個人中心頭部等。垂直漸變中上下兩種色彩的深淺變化會產(chǎn)生截然不同的視覺效果,上淺下深會讓給人一種凸起的立體感,而上深下淺會給人一種凹陷下去的空間感。例如「紀(jì)念碑谷」的背景是采用了單色相和多色相的垂直漸變作為游戲背景,在讓整個畫面豐富的同時又不會太搶奪主體的色彩,使畫面顯得清新透氣而不沉悶。

萬字干貨!超全面的色彩與應(yīng)用指南

角度漸變

角度漸變通常有對角漸變和多角度漸變。有角度的漸變相比水平和垂直漸變,它的使用場景更廣,如圖標(biāo)背板、啟動頁、注冊登錄頁、標(biāo)簽等。想讓界面更加絢麗、動感和迷人,這時候我們可以考慮多組漸變搭配使用。

萬字干貨!超全面的色彩與應(yīng)用指南

色塊漸變

漸變的顏色不只可以運(yùn)用在一個色塊上,還可以運(yùn)用在一組色塊上。設(shè)計師運(yùn)用一組近似性色彩,將每個菜單項(xiàng)清晰區(qū)分開,讓界面平衡在一個頻率上,這樣的畫面更有節(jié)奏感和舒適性。不同于平滑的漸變,色塊漸變不再是單純的背景裝飾,在某些地方還具有一定的功能性,比如使用不同的色塊來分割的列表樣式。Clear Todos 是一款日常任務(wù)清單的 APP,它拋棄了傳統(tǒng)的列表樣式,使用了一系列色塊來作為列表的分割,非常漂亮和精致。

萬字干貨!超全面的色彩與應(yīng)用指南

徑向漸變

是指色彩以圓心向四周擴(kuò)散的漸變,是一種模擬光源照射的視覺效果,因此光源是整個畫面的視覺焦點(diǎn),將關(guān)鍵元素放在光源中心就會成為主角。通常被運(yùn)用到大背景上,如啟動頁、引導(dǎo)頁等。Solar 天氣應(yīng)用的背景就是徑向漸變,光源擴(kuò)散的效果營造出一種夢幻般的美感。

萬字干貨!超全面的色彩與應(yīng)用指南

和諧的漸變色

漸變色是由一個色彩走向另一個色彩的過程,有著迷人的視覺效果。如果你仔細(xì)觀察兩種色彩的過渡關(guān)系,就會發(fā)現(xiàn)不是每次都會得到滿意的效果,例如紅綠漸變就很糟糕,因?yàn)樗鼈儍烧呤腔閷α⒌纳?,但是如果加入黃色的過渡色就會好很多。原因是當(dāng)兩種色彩之間超過 90 度就會導(dǎo)致其漸變色看上去不太和諧自然,只有控制在 90 度之內(nèi)才會產(chǎn)生美妙的變化。如何改善超過 90 度的兩種色相的漸變呢?這時候可以在兩色之間加入過渡色進(jìn)行調(diào)和。例如當(dāng)從黃色到藍(lán)色漸變時,就可以加入紫色作為過渡才能呈現(xiàn)完美的視覺效果。

萬字干貨!超全面的色彩與應(yīng)用指南

  • 知識點(diǎn):

在搭配漸變色時,盡量只改變其色相(H)、飽和度(S)、明度(B)中的一項(xiàng),這樣才能創(chuàng)造出和諧的漸變色方案。

創(chuàng)建調(diào)色板及配色工具

調(diào)色板幫助我們在設(shè)計項(xiàng)目中建立色彩規(guī)范、提高工作效率。通過上文對色彩基礎(chǔ)知識的學(xué)習(xí),接下來為大家介紹幾種簡單易用的創(chuàng)建調(diào)色板的小技巧,以及 Materia design 配色方法和配色網(wǎng)站推薦。

1. 從設(shè)計作品收集色彩

打開 dribbble,每一幅作品預(yù)覽頁左下角都有一份自動生成的配色板,很多同學(xué)可能不知道這個配色文件是可以下載的。將調(diào)色板保存到本地,為自己在創(chuàng)作時提供靈感。在 ps 里的操作步驟是:點(diǎn)擊“窗口—色板”,然后在色板的屬性面板右上角打開“導(dǎo)入色板”,載入剛下載的色彩文件即可。

萬字干貨!超全面的色彩與應(yīng)用指南

它也有顏色搜索工具,輸入或選擇顏色值即可搜索相關(guān)配色的設(shè)計作品。

萬字干貨!超全面的色彩與應(yīng)用指南

2. 從圖片取色

這種方法也很常用,不需要任何插件,丟一張圖片到 Ps,然后將圖片「馬賽克」處理下就可得到一組配色。例如,我們需要一組同色系的綠色,在網(wǎng)上(建議 unsplash 或 500px 等專業(yè)圖片網(wǎng)站)找一張樹葉的圖片,接著將圖片在 Ps 中打開,進(jìn)入“濾鏡—像素化—馬賽克”,在打開的窗口里調(diào)節(jié)單元格大小即可。

萬字干貨!超全面的色彩與應(yīng)用指南

同時,建議平時多去收集好看的攝影圖片和優(yōu)秀的配色方案,看的多了就知道什么是好的什么是 Low 的配色,對提升審美也有很大幫助。

萬字干貨!超全面的色彩與應(yīng)用指南

△ pinterest畫板

3. 自定義色塊疊加

該方法稍微復(fù)雜一點(diǎn),示例步驟如下:第一步繪制一個正方形做底板,填充一個顏色#5354F0;第二步分別在正方形的上和下 1/3 處疊加 20%的白色和黑色;第三步分別在正方形中和右 1/3 處疊加 40%、80%的紫紅色#DF56FA;最后改變紫紅色圖層的混合模式為疊加即可得到一組藍(lán)紫色色調(diào)的調(diào)色板。

萬字干貨!超全面的色彩與應(yīng)用指南

4. 色彩系統(tǒng)

Materia design 調(diào)色板

Materia design 從生活場景中提煉出 19 個充滿活力的色彩,旨在和諧地協(xié)同工作,可用于開發(fā)品牌調(diào)色板。Materia design 提供了一整套調(diào)色板,從原色開始,延伸出其他許多色彩,這些色彩和諧相處,可用于產(chǎn)品設(shè)計的品牌色?;A(chǔ)色的飽和度是 500,Google 建議以此作為產(chǎn)品應(yīng)用的主色調(diào),可以再選擇一種輔助色,并在主色的基礎(chǔ)上進(jìn)行飽和度,明度變化,構(gòu)成一套配色方案。

萬字干貨!超全面的色彩與應(yīng)用指南

如果上面的色板不能滿足你的需求,你可以選擇一個主色,Materia design 調(diào)色板生成工具會為你生成完整的色板。

萬字干貨!超全面的色彩與應(yīng)用指南

主色和強(qiáng)調(diào)色

在色彩選取時,需要先明確品牌色在界面中的使用場景及范圍。在基礎(chǔ)色板中選擇主色,建議選擇飽和度為 500 的基礎(chǔ)色作為主色,根據(jù)設(shè)計需要在主色的基礎(chǔ)上增加 1~3 種不同飽和度、明度的色彩建立層次感,再選擇一種強(qiáng)調(diào)色突出重要內(nèi)容或操作,例如 FAB 的背景色。

萬字干貨!超全面的色彩與應(yīng)用指南

深/淺背景上的文字

Materia design 通過文本的不透明度建立在不同背景上的深淺對比,對于淺色背景上黑色文字,主文字不透明度 87%,次要文字不透明度 60%,禁用文字不透明度 38%;而黑色背景上的白色文字正好相反;彩色背景上的白色文字不透明度 100%,分割線不透明度 12%。Ant Design 也定義了一套用于界面文字、背景、分割線的中性色,在落地的時候同樣也是按照透明度的方式實(shí)現(xiàn)的。

萬字干貨!超全面的色彩與應(yīng)用指南

背景

為了提高應(yīng)用之間的一致性和閱讀的可讀性,背景色根據(jù)設(shè)計需要選擇純白色或飽和度依次為 50、100、300 的灰色。

萬字干貨!超全面的色彩與應(yīng)用指南

5. 配色工具推薦

顏色是一個很難掌握的概念-因?yàn)橛袩o限多種可能的顏色組合,對于很多設(shè)計師來說還是一件蠻困難的事,為了讓設(shè)計配色變得容易些,下面推薦幾個常用的配色網(wǎng)站,希望能幫助大家在日常工作中節(jié)省更多的時間。

Adobe Color

Adobe Color 是一個基于網(wǎng)絡(luò)的應(yīng)用程序和創(chuàng)意社區(qū),提供免費(fèi)的色彩主題,并且在 Adobe 相應(yīng)的軟件中也提供了擴(kuò)展程序,比如我們常用的 Photoshop 和 Illustrator。

萬字干貨!超全面的色彩與應(yīng)用指南

△ https://color.adobe.com/

Adobe Color 通過拖拽色輪或輸入自定義色值,可以創(chuàng)造出基于相似、互補(bǔ)、三原色、正方形等不同色彩規(guī)則的配色方案。除此之外,還支持 CMYK、RGB、HSV 多種色彩模式的配色調(diào)整。用法很簡單,點(diǎn)擊顏色塊上的小三角確定基礎(chǔ)色,就會自動生成 5 個基于你所選色彩規(guī)則的配色方案,拖動下方的顏色條時相應(yīng)的也會改變配色方案。如果沒有靈感可以通過頂部導(dǎo)航進(jìn)入“探索”頁,這里為我們提供了很多提取好的顏色和圖片,有的是攝影作品,有的是設(shè)計作品,上方的輪播圖提供的一些其他內(nèi)容,比如潘通流行色、Adobe 社區(qū)和手機(jī)端的 APP 等等,非常的實(shí)用。

Eva Design System

Eva Design System 是一個基于深度學(xué)習(xí)算法的配色網(wǎng)站。適用于給我們的產(chǎn)品或品牌生成一個系統(tǒng)的配色方案。右上角可以切換淺色模式和深色模式的對比。

萬字干貨!超全面的色彩與應(yīng)用指南

△ https://colors.eva.design/

Colorhunt

Color Hunt 是由設(shè)計師 Gal Shir 創(chuàng)建的開放調(diào)色板集合,每天更新豐富的配色方案。顏色卡片下方可以看到更新的時間和喜歡人數(shù)。鼠標(biāo)懸浮在任一色塊上顯示顏色值,點(diǎn)擊顏色卡進(jìn)入詳情頁可下載和分享,驚喜的是還可以添加到 chrome 瀏覽器,方便隨時隨地使用。

萬字干貨!超全面的色彩與應(yīng)用指南

△ https://colorhunt.co/

Grabient

Grabient 是一個非常漂亮且實(shí)用的漸變配色網(wǎng)站,支持 CSS 樣式代碼復(fù)制、360 度漸變旋轉(zhuǎn)、自由增加或刪除漸變顏色等功能。設(shè)計師可以在色塊下方自由添加和調(diào)整漸變的色系、以及線性漸變方向。

萬字干貨!超全面的色彩與應(yīng)用指南

△ https://www.grabient.com/

當(dāng)然,以上這些配色工具只是為我們提供方便的,而不是主導(dǎo)我們的,所以在使用配色工具的時候最好是要有一定的理論基礎(chǔ)作為支撐,讓你的配色有理有據(jù),切忌生搬硬套。

  • 知識點(diǎn):

對于新手設(shè)計師來說,顏色越少越容易把控畫面。色彩層級越精簡,就越容易達(dá)到整體色彩平衡,掌握好色彩的功能劃分必然會讓你的配色過程保持思路清晰從而提率。

萬字干貨!超全面的色彩與應(yīng)用指南

同時,不管是 2C 還是 2B,很多大公司都構(gòu)建了自己的設(shè)計系統(tǒng)。如果你想學(xué)習(xí)別人是如何進(jìn)行配色布局的,最快的方式就是研究他們的設(shè)計源文件。

6. 關(guān)于色彩空間配置(附加內(nèi)容)

建議設(shè)計軟件使用 sRGB 作為色彩空間的默認(rèn)配置,而不要采用未管理( Sketch 中默認(rèn)是未管理),若團(tuán)隊協(xié)作請?zhí)崆氨3稚士臻g配置的統(tǒng)一性。如果有需要針對廣色域色彩空間做項(xiàng)目,可以單獨(dú)設(shè)置該項(xiàng)目文檔的色彩空間為 Display P3 或者 Adobe RGB。

Mac 系統(tǒng)色彩空間配置

建議所有 macOS 用戶都在系統(tǒng)偏好設(shè)定的顯示器顏色設(shè)定當(dāng)中換用 sRGB IEC61966-2.1 這個校色方案,可以極大改善系統(tǒng)顯示效能。如果有外接顯示器,也建議使用外接的默認(rèn)選項(xiàng),默認(rèn)選項(xiàng)一般可以發(fā)揮出該顯示器的最大色彩性能。

萬字干貨!超全面的色彩與應(yīng)用指南

Sketch 色彩空間配置

Sketch 默認(rèn)顏色配置是 Unmanaged「非托管」, 我們可以在「偏好設(shè)置」中為 Sketch 指定默認(rèn)的色彩空間配置,如此一來每次新建設(shè)計文檔將會默認(rèn)采用我們的設(shè)置作為默認(rèn)的色彩空間,不用每次新建文檔都單獨(dú)設(shè)置一次。

設(shè)置方法:Sketch → 偏好設(shè)置(Preferences) → 通用(General) → 顏色描述文件(Color Profile),修改下拉框選擇器的內(nèi)容為 sRGB IEC61996-2.1。(其他設(shè)計軟件設(shè)置方法類似)

萬字干貨!超全面的色彩與應(yīng)用指南

如果要更改已有的文檔為 sRGB 色彩配置,可以通過文件——更改顏色配置,在彈出的對話窗里對文件進(jìn)行色彩空間的更改即可。

寫在最后

其實(shí)無論是色彩理論還是配色方法,最本質(zhì)的東西就那些,更多的還是需要設(shè)計師在日后的工作中不斷的摸索和積累。這篇文章全部寫下來耗費(fèi)了不少時間(小聲 BB:其實(shí)每篇都是),抱歉內(nèi)容確實(shí)有點(diǎn)多,但其實(shí)已經(jīng)是收著點(diǎn)寫了。就像大樹一樣,有很多分枝不斷生長,需要了解很多細(xì)分出來的深度知識。這也是寫這類文章的樂趣,通過不斷的查閱資料,把過去很多模糊的概念摸清楚了。果然學(xué)透一個知識點(diǎn)的最好方式就是把它講出來才能真正為自己所有。關(guān)于色彩的知識先分享到這里,希望對大家有所幫助,文中有不嚴(yán)謹(jǐn)或錯誤的地方,歡迎大家指正,一起學(xué)習(xí)成長。


文章來源:優(yōu)設(shè)網(wǎng)     作者:印跡



藍(lán)藍(lán)設(shè)計www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)


移動互聯(lián)網(wǎng)中被消音的群體和小眾社區(qū)的“生與死”

資深UI設(shè)計者

編輯導(dǎo)讀:為了滿足不同用戶的個性化需求,產(chǎn)品的種類不斷豐富。相較于巨頭們都熱衷的年輕群體和大眾化產(chǎn)品,一些小而美的小眾產(chǎn)品也在悄悄發(fā)展,并且收獲了一群穩(wěn)固的用戶群體。本文作者從自身工作經(jīng)歷出發(fā),對此發(fā)表了自己的看法,與你分享。

“風(fēng)口之上,行業(yè)之下”應(yīng)該是很多創(chuàng)業(yè)型公司的真實(shí)寫照。作為創(chuàng)業(yè)公司的打工人,在巨頭之下討生活,要比大廠的打工人做著多倍努力的工作已是共識。對外我們習(xí)慣稱自己的公司“小而美”,對內(nèi)我們只能在業(yè)務(wù)之內(nèi)想盡“奇招”只求不做炮灰活下去!

“風(fēng)口之上”是指工作大行業(yè)是15年的移動醫(yī)療和17年的短視頻直播,“行業(yè)之下”指的是熱門行業(yè)中的垂類細(xì)分領(lǐng)域,在小眾人群中謀生存,服務(wù)的是腫瘤病患和中老年人群。工作方向倒是始終如一,社區(qū)運(yùn)營從未改變。腫瘤病患社區(qū)和中老年短視頻社區(qū)工作其實(shí)都不算成功,某種意義算是失敗的工作經(jīng)歷。

在做“腫瘤社區(qū)”時,發(fā)力點(diǎn)是內(nèi)容聚合人,人獲得內(nèi)容,此時像做內(nèi)容圈。中老年的直播則進(jìn)化為人與人之間的交流,通過直播載體形成群體意識,成為社區(qū)圈,下文從兩個社區(qū)案例的執(zhí)行層聊聊我“失敗”的經(jīng)驗(yàn)。

一、垂類病種醫(yī)療社區(qū)

簡單說社區(qū)形成條件是依托某個屬性將大家聚集在一起,彼此產(chǎn)生一定的交互并沉淀優(yōu)質(zhì)內(nèi)容。對于疾病社區(qū)的線下映射多見各類病友社團(tuán)如“**愛心之家”,病友的線上組織則多以Q群垂類論壇形式存在,下文討論的腫瘤病患社區(qū)則依托QQ興趣部落而建。

首先交代一下背景,公司產(chǎn)品為腫瘤病友社區(qū)APP,作為打工人工作職責(zé)之一是讓目標(biāo)用戶知道并使用產(chǎn)品,在QQ興趣部落上建“社區(qū)”目的就是為了導(dǎo)流。

(部落內(nèi)嵌在手Q中,并有獨(dú)立APP,但已被戰(zhàn)略放棄,上圖為網(wǎng)頁端)

回看15年的部落像是社區(qū)的1.0版本-貼吧,確定社區(qū)調(diào)性和方向、做內(nèi)容、找用戶、設(shè)規(guī)則、做活動并最終達(dá)成完成病友社區(qū)小生態(tài),形成內(nèi)容的產(chǎn)生分發(fā)并做到產(chǎn)品的導(dǎo)流就是我的工作了。

1. 定調(diào)性和方向

社區(qū)調(diào)性向以玄學(xué)著稱,大眾認(rèn)可好的社區(qū)是有自己的文化如快手的老鐵、社區(qū)用戶有很強(qiáng)的歸屬感如B站的二次元和有屬于站內(nèi)的故事如知乎的“剛下機(jī)……”,但之所以稱為玄學(xué)是以上并非社區(qū)的調(diào)性的全部,社區(qū)至少是鏈接內(nèi)容、消費(fèi)者和生產(chǎn)者并形成三方間良好粘性的產(chǎn)品形態(tài)。

產(chǎn)品定位就是腫瘤病人,那興趣部落自然也是圍繞腫瘤病患做內(nèi)容的消費(fèi)和生產(chǎn),方向也就是腫瘤病患感興趣的內(nèi)容方向。

2. 做內(nèi)容

所謂萬事開頭難,對于從零做社區(qū)填充內(nèi)容是第一步,運(yùn)營最苦逼的搬運(yùn)工作在所難免了,其次利用了信息不對稱我也搜尋互聯(lián)網(wǎng)上已有的內(nèi)容進(jìn)行二次編輯整合,盡量簡單直白的說明了內(nèi)容,在這過程中印象最深的是人肉去把中科院腫瘤醫(yī)院的各科室腫瘤指南變成電子版的經(jīng)歷,作為非醫(yī)學(xué)生的我不要太痛苦。

社區(qū)需要優(yōu)質(zhì)內(nèi)容,上述內(nèi)容雖說干貨滿滿,但此時更像是一個媒體平臺。作為剛?cè)胄械倪\(yùn)營所能參考的就是已有的pc端腫瘤病友論壇貼吧,發(fā)現(xiàn)病友自建論壇除“久病成醫(yī)”的干貨貼外,經(jīng)歷貼和求助帖其活躍度是相當(dāng)高,此時基本可以確定部落對ugc內(nèi)容的方向-讓用戶生產(chǎn)經(jīng)歷貼!

因?yàn)檫€處在零起步階段,沒有用戶情況下只能繼續(xù)“運(yùn)營人”的自嗨并發(fā)揮“寫作”天賦。由于承擔(dān)自媒體工作,做故事內(nèi)容征集寫自媒體同時可同步社區(qū)作為冷啟內(nèi)容。

到現(xiàn)在還是做基礎(chǔ)社區(qū)氛圍的搭建,在寫人物故事時會刻意去尋找真實(shí)案例,并有意進(jìn)行種子用戶的挖掘。對于這部分人群尤其年輕的病患,他們需要一個有歸屬感能夠發(fā)聲證明自己存在的地方,不過難點(diǎn)就是他們對社區(qū)的信賴程度,是否愿意發(fā)聲。此時前面鋪墊的內(nèi)容承擔(dān)著中立的工具屬性,無廣告的社區(qū)氛圍則利于促成用戶發(fā)聲。

在這個過程中主動幫助他們發(fā)聲,撰文寫故事的方式幫助記錄生活點(diǎn)滴,降低ugc社區(qū)產(chǎn)生內(nèi)容的智力成本,高度相似的經(jīng)歷提供閱讀內(nèi)容外還可用于用戶的二次創(chuàng)作如持續(xù)的跟帖互動形成新的消費(fèi)內(nèi)容,原型人物會有社區(qū)榮譽(yù)感,激勵持續(xù)創(chuàng)作開帖。

相近的內(nèi)容密度足夠高會產(chǎn)生更為細(xì)分的內(nèi)容,帶來有效的討論,有了交流進(jìn)而有了用戶間圍繞內(nèi)容進(jìn)行互動從而帶動整體的社區(qū)氛圍。

腫瘤社區(qū)有個難逃的話題就是死亡,有過同用戶的溝通一部分人會樂觀面對,但多數(shù)人還是恐懼,社區(qū)能做的就是客觀的記錄,社區(qū)能做的只是提供精神的寄托,無法替代醫(yī)學(xué)治療。

3. 找用戶

做內(nèi)容和找用戶基本同時進(jìn)行,好在社區(qū)足夠垂直,干貨內(nèi)容可以先行一步,另一個好處垂類社區(qū)如方向得當(dāng)用戶自然易于發(fā)現(xiàn)。

1)QQ群

在15、16年QQ群一直是尋找目標(biāo)用戶的地方,搜索關(guān)鍵詞會出現(xiàn)相應(yīng)的QQ群,雖然微信已經(jīng)普及仍有部分社群持續(xù)這高活躍狀態(tài),QQ興趣部落誕生之初也是同社群結(jié)合相當(dāng)緊密,此時需要做的就是同群主溝通能否接入興趣部落。

說明興趣部落同QQ群的關(guān)系以及通過填充的內(nèi)容對應(yīng)用戶存在的需求,但由于人群的特殊性存在部分售賣假藥等黑產(chǎn)已經(jīng)給部分用戶帶來創(chuàng)傷,對于有公司背景的我和kol溝通還是有一定的難度。

因?yàn)樯鐓^(qū)內(nèi)有干貨內(nèi)容的存在,作為用戶在社群內(nèi)分享會吸引一部分目標(biāo)用戶通過內(nèi)容轉(zhuǎn)化關(guān)注到社區(qū),另外同群主(kol)溝通中說明社群所不具備且社區(qū)所能提供的東西,通過公司已有的公立醫(yī)院醫(yī)生資源,為社群提供醫(yī)生群內(nèi)答疑等,盡量消除用戶的疑慮。

2)微博

對于尋人尤其是大v用戶微博應(yīng)該是最好的渠道了,微博的認(rèn)證和粉絲關(guān)注已經(jīng)幫你篩選了最精準(zhǔn)的用戶出來。

通過微博關(guān)鍵詞找到了很多精準(zhǔn)且在垂類病種中有影響力的醫(yī)生、病患,除去醫(yī)生外病患資源是早期社區(qū)大V的來源,其抗病經(jīng)歷也可反哺自媒體作為內(nèi)容傳播。在某段時間主要精力就放在同這部分用戶溝通上,另外通過微博的前身博客也找到了一個龐大的腫瘤病友組織,他們會定期做線下病友交流分享會,分享治療心得交換名醫(yī)資源,甚至出書寫傳記,其中不乏抗癌明星。

我有幸參與過他們的線下組織并因此結(jié)緣抗癌明星,由此也獲得其書籍整理電子版并進(jìn)行傳播的權(quán)利,這也幫助吸引了很大一部分病患家屬,增加了社區(qū)的關(guān)注。

3)自媒體

在工作時同時兼顧自媒體賬號,由于APP功能所限,某些社區(qū)功能會以興趣部落作為承接載體,所以自媒體也會向興趣部落做引流。

在社區(qū)(興趣部落)做話題征集引導(dǎo)用戶生產(chǎn)內(nèi)容,通過前期鋪墊內(nèi)容讓用戶從逛社區(qū)到融入社區(qū),從參與互動到生產(chǎn)并獲得認(rèn)同和反饋,從社區(qū)中選取優(yōu)質(zhì)內(nèi)容在自媒體中進(jìn)行二次傳播。

4)興趣部落垂類榜單

由于在他人平臺上身份等同吧主,除管理社區(qū)外就是研究平臺規(guī)則。社區(qū)創(chuàng)建在醫(yī)療分類之下,研究興趣部落醫(yī)療垂類貼吧排序規(guī)則,爭奪曝光資源也是工作之一,QQ的海量用戶可通過興趣部落的排名為其引流關(guān)注。

4. 設(shè)規(guī)則做活動

社區(qū)是基于QQ興趣部落功能,作為創(chuàng)建者(大酋長)只能圍繞創(chuàng)建話題、刪帖、頂帖等基礎(chǔ)的貼吧玩法做拓展。

上述闡述了做腫瘤社區(qū)時的一些經(jīng)驗(yàn),在運(yùn)營工作上感悟到內(nèi)容和氛圍的重要,對于垂類社區(qū)其價值為細(xì)分人群提供率“解決”問題的工具,通過社區(qū)的某種行為讓目標(biāo)人群有了反饋甚至產(chǎn)生了社交貨幣并獲得了社交資本。

關(guān)于商業(yè)模式其實(shí)本不該是運(yùn)營操心的事,但現(xiàn)在回頭去看“風(fēng)口之上,豬也能飛起來”這件事取決于風(fēng)是否持續(xù)的吹,移動醫(yī)療行業(yè)政策決定生死。再好的交互、再給力的用戶體驗(yàn),為病人提供社區(qū)氛圍感,聚集無數(shù)同屬性用戶之后能做的也多是醫(yī)療之外的幫助,腫瘤疾病可算重癥也可看為慢性病,風(fēng)口過了什么“院外護(hù)理、在線診療”此類短期難以變現(xiàn)均被資本看作無效棄子。

不過因?yàn)楦鞣N原因不能同公司繼續(xù)走一下去,甚至興趣部落也因其內(nèi)核趨同貼吧并沒有很好的移動化已被鵝廠戰(zhàn)略舍棄,現(xiàn)在蘋果市場已搜不到其獨(dú)立APP,QQ上也找不到任何興趣部落存在過的影子,仿佛從未出現(xiàn)過,唯一證明它存在的地方可能只剩官方建立的Q群,一年未響動的群有了聲響,不停@官方詢問部落后續(xù)……但已無人回復(fù)。

二、中老年短視頻直播社區(qū)

互聯(lián)網(wǎng)公司中提及中老年多和下沉用戶一同出現(xiàn),少見單獨(dú)以中老年用戶為主要人群的移動互聯(lián)網(wǎng)產(chǎn)品。相比腫瘤病患為求生刻意尋求帶有關(guān)鍵詞的產(chǎn)品,對該人群多數(shù)不愿承認(rèn)自己老了且產(chǎn)品下載路徑更傾向于社交傳播,市場中帶有中老年關(guān)鍵詞的APP下載量也不盡人意,如果本身不是中老年,除觀察長輩手機(jī)/家庭群發(fā)鏈接外很難知道他們使用那些產(chǎn)品。

公司始于視頻剪輯工具后轉(zhuǎn)型社區(qū),種種原因社區(qū)玩家變?yōu)橹欣夏耆藒

或許是2016年千播大戰(zhàn),跟風(fēng)做了直播,在17年初入職時直播僅支持開播、觀看等基礎(chǔ)功能,而我的工作就是從社區(qū)培養(yǎng)主播、引導(dǎo)社區(qū)用戶觀看直播。

1. “奇特”的產(chǎn)品形態(tài)

人有生理、安全、歸屬和愛的需要,也有被尊重和自我實(shí)現(xiàn)的需求,對于中老年人歸屬和被需要可能格外看重。當(dāng)中老年人的個人價值不能在社會和家庭得到施展時,很容易陷入精神的空虛,所以也能理解長輩頻繁發(fā)“養(yǎng)生雞湯、美文祝福、年畫風(fēng)和游玩照片”之類內(nèi)容的原因,想必是從中可獲得一定的精神滿足感。

A產(chǎn)品提供了剪輯功能滿足了部分中老年生產(chǎn)“朋友圈素材”的需求,同時在A產(chǎn)品中內(nèi)容有曝光展示的機(jī)會,通過某些策略的制定給予了他們被“重視”的感覺,在理想狀態(tài)下符合上圖“為工具而來,因網(wǎng)絡(luò)而留下”的認(rèn)知路徑。

2. “友好”的社區(qū)氛圍

對一款社區(qū)產(chǎn)品來說,社區(qū)氛圍就是產(chǎn)品調(diào)性也能說明用戶的特質(zhì),可以增強(qiáng)用戶的歸屬感,不過另一面就是過于強(qiáng)調(diào)調(diào)性則造成用戶容易抱團(tuán),排斥其他用戶,產(chǎn)品容易造成天花板,這是產(chǎn)品用戶量始終上不來的原因之一。

本文不討論A產(chǎn)品因社區(qū)調(diào)性帶來的負(fù)面情況,重點(diǎn)在社區(qū)的進(jìn)化以及直播如何融入社區(qū)。

1)成為提供“社會資本”的工具

“年紀(jì)大了就容易懷舊”外出旅行拍照、家庭合影或者日?;ú荨⒇埞返日紦?jù)著父母的相冊存儲。父母使用各類工具將照片制作成視頻音樂相冊時,滿足了相冊存儲功能同時也增加了照片的趣味性而獲得了自我滿足,分享到社交渠道獲得親友的贊譽(yù)甚至請教制作方法,獲得了成就感,在自我滿足和外部榮譽(yù)之下,部分用戶獲得持續(xù)制作內(nèi)容的動力,工具也就獲得了社交傳播。

2)成為獨(dú)特的社區(qū)

理想狀態(tài)下,看到社區(qū)中相似的內(nèi)容聚集時可幫助用戶快速融入,相似的內(nèi)容也可讓更多用戶有意愿產(chǎn)生相近的內(nèi)容,從而產(chǎn)生更多的社區(qū)內(nèi)容,社區(qū)內(nèi)容的相似性又幫助找到相似的社區(qū)用戶如此往復(fù)。

但對于UGC短視頻產(chǎn)品,絕大部分用戶上傳的內(nèi)容對非好友來說都不具備價值,當(dāng)內(nèi)容不具優(yōu)勢時,互動或許可帶來轉(zhuǎn)機(jī)。

不管是用工具心態(tài)制成后的站外分享,還是因社區(qū)策略制作后的站內(nèi)“被動”展示,人們都是在尋求最有效的途徑來最大化他們的社會資本。平臺通過現(xiàn)有用戶屬性取“最大公約數(shù)”來擇優(yōu)選出內(nèi)容展示,幫助部分用戶獲得除朋友圈外的額外社會貨幣,給予社會資本,讓其獲得滿足。

有別于其他群體,產(chǎn)品提供內(nèi)容曝光、評論展示等基礎(chǔ)功能后,由于中老年用戶的“人情觀-別人給我點(diǎn)贊互動,我要回訪”會形成較好的互動行為,上述行為就會產(chǎn)生新的社交貨幣即除因熟練使用工具、有精美素材制作的視頻內(nèi)容外,良好的社交互動行為也會因此獲得他人的關(guān)注,這一層“工作證明”降低了社區(qū)貨幣的獲得門檻,畢竟多數(shù)人創(chuàng)作內(nèi)容也是尋找“存在感”,內(nèi)容只是其中的媒介。

雖然內(nèi)容中的中老年喜愛的視頻、游玩影集和年畫風(fēng)音樂MV評論區(qū)多見“點(diǎn)贊、真棒、加油期待回訪”之類在我們看來不痛不癢的留言,但對他們來說這種公開式的留言方式寫出已出于真心而非敷衍,細(xì)想線下場景兩個不熟的中年人見面不也多是寒暄,而進(jìn)化為重度社區(qū)用戶“60后姐妹團(tuán)愛恨情仇”更像宮斗劇,“出場”方式絕非這么簡單,有機(jī)會可詳聊。

3. “奇特”的直播定位

說回直播,17年市面可參考的直播形態(tài)多為膚白貌美的秀場和游戲直播,我的工作是要社區(qū)的中老年用戶來參與直播,將直播作為用戶的內(nèi)容之一,增加用戶對社區(qū)的認(rèn)同感,這也是我開篇說明自己做的是社區(qū)運(yùn)營而非直播運(yùn)營原因。

1)社區(qū)短視頻同直播的關(guān)系

人的時間有限,使用產(chǎn)品基本就是零和博弈的過程,產(chǎn)品內(nèi)短視頻同直播就是相互依存且相互沖突的關(guān)系,短視頻本質(zhì)是認(rèn)同,是粉絲,直播的本質(zhì)是注意力,是轉(zhuǎn)化。

對于新用戶如果無法快速理解短視頻社區(qū)的成長路徑,即不知道如何制作出符合社區(qū)調(diào)性的視頻作品時,直播或許可以為新用戶獲得新的社交貨幣,減少流失并為后續(xù)更快的融入社區(qū)做鋪墊(前提是社區(qū)內(nèi)容同直播內(nèi)容格調(diào)相符)。

對老用戶來說,社區(qū)原有的視頻制作成本高、頻次低,無法帶動產(chǎn)品高頻使用并且部分用戶無法通過此類“工作證明”獲得滿足感,或存在社區(qū)的階級固化,急需新玩法打破現(xiàn)有規(guī)則,直播則提供了對社區(qū)有粘性但沒有找到合適的工作證明的用戶。

不管是新老用戶對于直播“1.0版本的定位就是讓社區(qū)用戶有更好的歸屬感,同社區(qū)氛圍不割裂”

2)直播的成長

有了上述定位就需要考慮下面的問題:

  • 中老年對直播的認(rèn)知(“直播社區(qū)”是什么)
  • A產(chǎn)品做直播的優(yōu)勢(“直播社區(qū)”的玩法)
  • A產(chǎn)品的用戶為何要參與直播(用戶參與“直播社區(qū)”的理由)
  • 直播是否能增加用戶對產(chǎn)品的認(rèn)同歸屬感(用戶融入“直播社區(qū)”并形成新的文化)

問題1 中老年對直播的認(rèn)知(“直播社區(qū)”是什么)

直播雖已經(jīng)過千播大戰(zhàn)的教育,但目標(biāo)人群畢竟不同,要從業(yè)務(wù)層面考慮用戶是否對直播有認(rèn)知,認(rèn)知程度如何,解決問題最重要,以共情同理心將用戶分為一下3種情況:

①社區(qū)原有kol:

“富有的,給他更多;沒有的,把他僅有的也拿走。”這是《圣經(jīng)·馬太福音》中的一句話,作為社區(qū)我們當(dāng)然不會照單全收,直播冷啟我們需要讓更多用戶知道直播,kol的直播可以讓更多用戶知道。

這部分用戶多有一定的身份標(biāo)簽,根據(jù)標(biāo)簽的不同定制直播欄目類似如“名人堂”,在站內(nèi)做banner宣傳、活動推廣,給他們直播的理由,將直播打造成他們?nèi)菀桌斫獾碾娨暀谀?,而他們就是上電視的名人??赡軆?nèi)容的趣味性大打折扣,但對滲透有很大的幫助,用戶也樂意配合,作為短視頻內(nèi)容的直播延伸。

因?yàn)橹欣嫌脩舻膶W(xué)習(xí)成本高,他們在社區(qū)中已獲得足夠的成就感并且實(shí)際精力不允許拓展太多新玩法,在原有工作證明得以保留的情況下,想要長期持續(xù)直播產(chǎn)生內(nèi)容并非易事,所以注定只能是直播頻道的“導(dǎo)流者”。

②社區(qū)用戶:

這部分用戶大概率因kol而看直播,后續(xù)做直播活動如歌唱、朗誦比賽等活動脫穎而出。在社區(qū)無法獲得的滿足感但通過直播可獲得,由于本身有一定好友,所以直播動力更持續(xù),可將一部分精力放在直播中,該部分為后續(xù)社區(qū)型直播用戶主力軍,幫助平臺豐富直播內(nèi)容,拉長直播時長,是直播頻道中的主力玩家。

相比圖文視頻,直播更為立體的展示一個人的性格外貌,通過言談舉止了解這個人的思想,通過環(huán)境了解這個人的生活背景,直播豐富了他本人。當(dāng)我們都愛鄧麗君,喜歡她的歌,通過短視頻將愛好擴(kuò)散,通過直播將愛好表演出來,滿足了用戶多場景互動。

③非社區(qū)型用戶

直播先是基于內(nèi)容后是基于人,這句話放在這部分用戶中更為直觀。沒有了社區(qū)粉絲基礎(chǔ),這部分用戶如能持續(xù)直播必懂得一定用戶運(yùn)營技巧,畢竟直播內(nèi)容由平臺把關(guān),定是模仿了部分社區(qū)直播內(nèi)容并加之發(fā)揚(yáng)光大才能得以生存。

說上述話的原因是由于要保證社區(qū)調(diào)性,對于直播內(nèi)容、主播年齡都有嚴(yán)格的控制,雖為明確說明,但有意扶持中老年主播如有一定才藝則更是力捧。對于市面常見的秀場類主播尤其年輕貌美、聲音浮夸如出現(xiàn)則刻意打壓,減少流量,保證中老年主播的“生存環(huán)境”,嚴(yán)格把控社區(qū)調(diào)性。

因?yàn)榍捌趯?nèi)容的嚴(yán)要求,后續(xù)站內(nèi)原生主播持續(xù)生長,出現(xiàn)了很多中老年且實(shí)力不凡之人,這部分主播后續(xù)成為產(chǎn)品的營收主力軍。對比短視頻,他們將直播作為新的社交貨幣并融入到社區(qū)之中,與短視頻社區(qū)也不會存在很大的割裂感。

問題2 A產(chǎn)品做直播的優(yōu)勢(“直播社區(qū)”的玩法)

大眾認(rèn)知下如果是中老年直播可能是這樣:

優(yōu)勢:

  • 時間充裕,目標(biāo)群體相比年輕人娛樂時間更多
  • 經(jīng)濟(jì)優(yōu)勢,一二線目標(biāo)用戶可消費(fèi)能力強(qiáng)
  • ③孤獨(dú)感和被需要感,社會身份的轉(zhuǎn)變需找到新的生活價值
  • ④中老年娛樂內(nèi)容少,線下受地理位置等因素影響娛樂方式有限,線上專屬中老年社交娛樂方式主要集中在微信、k歌和短視頻產(chǎn)品中,直播內(nèi)容較少。

劣勢:

  • 學(xué)習(xí)成本高,主動參與性低
  • 消費(fèi)理性,區(qū)別秀場荷爾蒙消費(fèi)中老年消費(fèi)較為理性
  • 常見的秀場類內(nèi)容及彈幕互動方式對中老年不友好,容易受到忽視從而無法在直播間獲得“身份地位”和認(rèn)同
  • 認(rèn)知改變難,市面直播多以年輕化內(nèi)容為主且節(jié)奏快,目標(biāo)用戶可能感知”無法參與“甚至抵觸心理。

A產(chǎn)品做中老年直播的優(yōu)劣勢:

優(yōu)勢:

  • 有錢:中老年用戶集中且”高凈值“用戶多
  • 想玩:平臺無多人及時互動功能,對中老年人線上”群體性“活動的社交需求沒得到滿足
  • 場景:提供除短視頻互動外的社交場景,增加社交貨幣

劣勢:

除中老年直播劣勢外,已有社區(qū)用戶習(xí)慣站內(nèi)功能,任何新功能都會引起短暫的不滿,部分占據(jù)社交資本用戶不愿增加新的社交貨幣來稀釋原有生態(tài)。

基于上述優(yōu)劣勢為其添加玩法,優(yōu)勢中針對群體性社交、孤獨(dú)感和被需要這幾點(diǎn),全民k歌的歌房可獲得一定的滿足,他們以家族、興趣愛好為據(jù)點(diǎn),半熟人間邀請制形成獨(dú)特的社區(qū)文化。

但k歌畢竟存在門檻,針對普遍的孤獨(dú)感,陪伴式和中老年的泛文化類直播內(nèi)容尚可入手。對目標(biāo)用戶,好的運(yùn)營方式就是根據(jù)特性做活動,前期以邀請制找主播,為主播增加曝光讓站內(nèi)用戶都知道開通直播并來圍觀,通過產(chǎn)品功能讓用戶參與到直播中。

劣勢中的學(xué)習(xí)成本高那就需要產(chǎn)品的補(bǔ)足,同理心和共情能力之下提出產(chǎn)品策略如上麥互動交互展示方式就需根據(jù)目標(biāo)用戶做考慮。

這里說兩個值得夸耀的細(xì)節(jié),產(chǎn)品雖然迭代了很多營收項(xiàng)功能,但對上麥按鈕和麥序數(shù)量這兩點(diǎn)基本沒做過多改變。

上麥按鈕:上麥按鈕和禮物按鈕同級別且優(yōu)于打字互動和轉(zhuǎn)發(fā),直播業(yè)務(wù)模式下禮物按鈕重要不用過多說明,上麥按鈕的突出則出于以下幾點(diǎn)考慮:

  • 中老年用戶生理機(jī)能考慮,語音或視頻直接對話效率一定高于打字看彈幕。
  • 對主播來說,主播為社區(qū)用戶轉(zhuǎn)化且初衷多為打發(fā)時間,主播在意的是有人和他說話并且越方便越好,便利的操作有利于用戶上麥的互動。
  • 對觀眾來說,對比其他直播產(chǎn)品上麥并非重點(diǎn),A產(chǎn)品并沒參考主流樣式而是根據(jù)實(shí)際情況為觀眾提供最便利的上麥互動方式。增加上麥就能增加用戶間的互動交流,能彌補(bǔ)內(nèi)容的不足,甚至從最終付費(fèi)的心理來看,互動最終讓用戶間突破主播觀眾隔閡,讓成為朋友變成可能,付費(fèi)也成為人情的往來。從圍觀的觀眾來講,有內(nèi)容的互動式聊天肯定要比無主題的單人演講有趣的多,畢竟在少了顏值的情況下,大家默認(rèn)關(guān)注的是內(nèi)容,也滿足了老年人愛湊熱鬧的心理,同時上麥的用戶也可幫助主播“招呼”直播間觀眾,調(diào)動大家的情緒。
  • 對平臺來說,上麥可以增加主播開播時長、觀眾觀看時長、促進(jìn)用戶社交等,對中老年平臺在社區(qū)內(nèi)培養(yǎng)直播行為有利而無害,理論上社區(qū)化的直播也不希望出現(xiàn)粉絲集中在某一個主播身上,保證每個主播開播都會有一定量的忠粉觀看足以。

對于上麥可能有些人會聯(lián)想歌房或多人窗口直播,但從用戶角度則沒有了“主播”概念,用戶上麥更多是作為主播內(nèi)容補(bǔ)充,起到參與的目的,而且歌房的出現(xiàn)不利于其他用戶開播,會對開播主播數(shù)有影響,我們希望的是部分用戶通過上麥體驗(yàn)到直播的樂趣,可在合適的機(jī)會自行開播并召集好友捧場參與上麥互動,形成新的主播篩選循環(huán)。

如果產(chǎn)品參照其他直播將上麥弱化,我相信直播社區(qū)化基本等于失敗。上述都是因?yàn)樯消湴粹o做的明顯帶來的好處,壞處有沒有?可能的壞處就是上麥觀眾存在違規(guī)行為,雖然這可能會給平臺造成負(fù)面影響,但畢竟是小概率事件且可以通過技術(shù)加人工審核手段及時處理。

麥序數(shù)量:這里的麥序數(shù)量對比秀場類平臺應(yīng)該少見,多數(shù)這個麥序量級直播形態(tài)基本已變類歌房小窗口形式。產(chǎn)品沒有改變的原因是保證了“主播”身份也滿足了中老年愛熱鬧的心,多人互動有利于形成討論、互動,幫助直播加速社區(qū)化,形成用戶好友關(guān)系……

問題3 A產(chǎn)品的用戶為何要參與直播(用戶參與“直播社區(qū)”的理由)

上文很大的篇幅都在敘述關(guān)于“社交資本、工作證明”的內(nèi)容,對為何使用直播,簡單來說提供了新的社交貨幣。

短視頻是內(nèi)容,用戶之間的交流在于異步的互動,直播則在社區(qū)之上更進(jìn)一步,需要實(shí)時面對面的交流互動,這一點(diǎn)其實(shí)很考驗(yàn)個人能力,尤其還是在用愛發(fā)電的中老年人群里。

也曾尋找過公會,但在成本等考慮之下還是選擇了“最笨”但最符合社區(qū)化的方式。在做直播內(nèi)容的時候發(fā)現(xiàn),不管任何年齡層都愿意為“美”消費(fèi),用戶參與短視頻制作是希望追求社交貨幣,直播能獲得滿足時他們也樂意嘗試。

作為主播他們有了被眾星捧月的感覺,我會為這些中老年主播建立粉絲群,引導(dǎo)產(chǎn)生適合的短視頻內(nèi)容幫助分發(fā),為他們吸粉,在直播的過程中作為內(nèi)容的生產(chǎn)者除精神上的獎勵外,還會獲得真真切切的收益,參考中老年為各種極速版產(chǎn)品的獎勵金而打卡拉新,直播的營收足以帶給他們額外的驚喜。

作為觀眾同樣因內(nèi)容而來,在付費(fèi)觀眾中直播打賞可以算是付出網(wǎng)絡(luò)成本最“少”,網(wǎng)絡(luò)社交見效最快獲得社交資本的方式了,直播間內(nèi)等級地位較低的人總會突顯出小部分付費(fèi)用戶的特殊,當(dāng)形成足夠的社區(qū)規(guī)模時更是會激勵其他人參與到付費(fèi)買地位的有中(中老年為主的直播社區(qū)arppu值約90元+)。

A產(chǎn)品比較有趣的例子是這些付費(fèi)的中老年用戶往往也會開直播,而形成的社交關(guān)系此時就會涌入直播間,通過上麥等方式共同為觀眾打造一個主播沒有才藝,但也能持續(xù)觀看的直播內(nèi)容,此刻秀場類的才藝內(nèi)容就無關(guān)緊要。開直播,就是交個朋友咯~

問題4 直播是否能增加用戶對產(chǎn)品的認(rèn)同歸屬感(用戶融入“直播社區(qū)”并形成新的文化)

說結(jié)論,直播對社區(qū)歸屬感的提示有很強(qiáng)的幫助。直播對短視頻社區(qū)是內(nèi)容的延伸,主播作為社區(qū)的一份子會參與短視頻內(nèi)容的投稿并且粉絲間形成小團(tuán)體也沒有放棄短視頻社區(qū),直播錄屏、截圖等衍生內(nèi)容作為短視頻素材來源之一,運(yùn)營也會刻意做唱歌等視頻活動,幫助直播用戶在社區(qū)擴(kuò)大影響力。

3. 直播的困境

短視頻可以通過社交渠道不斷吸引流量,但直播則是消耗流量的地方,理論上直播是有限時間的生意,主播固定時間表演,觀眾為這個時間價值買單,短視頻社區(qū)則起到直播之外用戶的消費(fèi)場景。

傳統(tǒng)的秀場直播重頭部主播,重付費(fèi)用戶體驗(yàn),新用戶很難在秀場模式下快速融入,平臺則努力將未付費(fèi)轉(zhuǎn)化為付費(fèi),付費(fèi)轉(zhuǎn)化為土豪用戶來提升滲透和arpu值。

A產(chǎn)品理論上在用戶不斷轉(zhuǎn)化直播社區(qū)中,通過服務(wù)更多的用戶就能有更好的營收,但現(xiàn)實(shí)問題中老年社區(qū)在現(xiàn)有玩法下難變大,他們的審美視角無法同移動互聯(lián)網(wǎng)用戶中的大多數(shù)一致,最終結(jié)果短視頻用戶增長緩慢,對于直播這個產(chǎn)品模式如想賺更多錢,必定要逐漸“秀場”化。

在前文提到的三類主播中,中老年社區(qū)kol對“人情債”和自己的社交資本看的很重,不會貿(mào)然消費(fèi)自己的社交貨幣。

社區(qū)用戶則處在中間層,善于互動的中老年會很快掌握直播要領(lǐng),獲得了社交資本外也看見了實(shí)際的收益,但在觀眾固定的情況下收入也會固定,無法滿足企業(yè)的利益最大化。

最后一個是新用戶或沒能掌握短視頻社交貨幣的一群人,他們可能因直播或工具而來,賺錢目的明顯,但最大的問題他們沒有歸屬感,他們是主播中最不穩(wěn)的一群人,但也是直播里唯一能帶來新鮮血液的一群人。

今天再看產(chǎn)品信息流的排序基本可推測直播的調(diào)性,需要新鮮主播的注入帶來新的營收,在盈利和社區(qū)化此刻最好的選擇可能也是前者……

三、最后聊聊自己

前四年的運(yùn)營工作給我?guī)淼木褪撬急?、靈活、快速嘗試,認(rèn)識到運(yùn)營的執(zhí)行力的重要,不去嘗試所想終究無用。思考社區(qū)會想看大家在網(wǎng)絡(luò)上交流的變化,了解競品會把已知所有目標(biāo)用戶產(chǎn)品都去體驗(yàn)包括這個行業(yè)的優(yōu)秀產(chǎn)品。工作第五年的自己內(nèi)心變得迷茫,執(zhí)行力也變差,處于焦慮之中,希望盡快調(diào)整狀態(tài),找到合適的工作方式,另外也在努力的系統(tǒng)學(xué)習(xí)中~


文章來源:人人都是產(chǎn)品經(jīng)理  作者:馬丘

藍(lán)藍(lán)設(shè)計www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

日歷

鏈接

個人資料

存檔