起點(diǎn)課堂會(huì)員權(quán)益
職業(yè)體系課特權(quán)
線下行業(yè)大會(huì)特權(quán)
個(gè)人IP打造特權(quán)
30+門(mén)專項(xiàng)技能課
1300+專題課程
12場(chǎng)職場(chǎng)軟技能直播
12場(chǎng)求職輔導(dǎo)直播
12場(chǎng)專業(yè)技能直播
會(huì)員專屬社群
榮耀標(biāo)識(shí)如何打造產(chǎn)品的視覺(jué)錘/品牌符號(hào)？
在如何提高產(chǎn)品競(jìng)爭(zhēng)力這一點(diǎn)上，除了做好產(chǎn)品功能與設(shè)計(jì)外，我們還可以從體驗(yàn)設(shè)計(jì)的角度入手，給產(chǎn)品打造視覺(jué)錘符號(hào)，強(qiáng)化產(chǎn)品在用戶心中的記憶點(diǎn)。
現(xiàn)在對(duì)產(chǎn)品經(jīng)理的要求越來(lái)越高，不但要懂產(chǎn)品，還要懂運(yùn)營(yíng)、數(shù)據(jù)、還要會(huì)看設(shè)計(jì)，給設(shè)計(jì)一些指導(dǎo)。以前討論時(shí)候經(jīng)常聽(tīng)到產(chǎn)品經(jīng)理說(shuō)，我就畫(huà)個(gè)框架，具體的設(shè)計(jì)還得設(shè)計(jì)師來(lái)。就像UX設(shè)計(jì)師也要具備產(chǎn)品思維一樣。如何提高產(chǎn)品的競(jìng)爭(zhēng)力，體驗(yàn)設(shè)計(jì)也是很重要的點(diǎn)。
01 三秒原則
大家會(huì)想下，有哪些品牌你能馬上想到，印在了你的腦海里；有哪些是你從來(lái)沒(méi)有見(jiàn)過(guò)，但是可以馬上記住的。
通常在三秒內(nèi)能夠被人記住的會(huì)被認(rèn)定有品牌認(rèn)知的。比如下圖中的蘋(píng)果，不需要任何文字的介紹，這顆被咬了一口的蘋(píng)果都已經(jīng)深入人心。
還有小伙伴很喜歡的一個(gè)北歐的包品牌：FREITAG包款全部使用的回收集裝箱卡車、防水帆布和汽車安全帶(運(yùn)用在包包背帶)、包包邊緣則使用單車內(nèi)胎包邊做成的，所以每一款包包都有獨(dú)特的紋路，絕對(duì)是獨(dú)一無(wú)二，沒(méi)有人會(huì)和你撞包。很多環(huán)保人都是這個(gè)品牌的擁護(hù)者。一個(gè)好的視覺(jué)符號(hào)不但能提升品牌價(jià)值，同時(shí)也能傳遞一種價(jià)值觀。
02 好產(chǎn)品的基因
品牌基因的維度太寬泛了，今天聊下視覺(jué)的部分。
眼睛接收到圖像區(qū)分出視覺(jué)語(yǔ)言的信息和非視覺(jué)語(yǔ)言的信息。視覺(jué)語(yǔ)言比較好理解就是看到的畫(huà)面，非視覺(jué)語(yǔ)言更多的是看到畫(huà)面后的思維活動(dòng)。
比如，我們看到可口可樂(lè)的logo就會(huì)想到炎熱夏天喝口冰可樂(lè)來(lái)解渴；多次的呈現(xiàn)像視覺(jué)的錘子一樣將品牌符號(hào)打進(jìn)用戶的內(nèi)心。
03 只有l(wèi)ogo就夠了么？
提到視覺(jué)錘，很多人第一個(gè)想到的就是logo，因?yàn)榭梢缘谝谎郾豢吹胶陀涀。侵挥衛(wèi)ogo就夠了么？
舉幾個(gè)例子：
現(xiàn)在看共享單車，黃色的大家肯定知道是美團(tuán)的，青綠色的一定是滴滴的。
再有大街上跑的汽車一眼就能看出甲殼蟲(chóng)和minicooper。
再比如天貓的剪影……
這些都是沒(méi)有l(wèi)ogo的場(chǎng)景，但是為什么還是能做到一眼辨別呢？
再比如muji的海報(bào)，嘗試下遮蓋品牌還是能知道這個(gè)是無(wú)印良品，十分的日系。
04 如何找到自己的視覺(jué)錘/品牌符號(hào)
1. 步驟
- 確定品牌的內(nèi)核（核心價(jià)值，用戶群體、屬性）
- 定義品牌價(jià)值和品牌的獨(dú)特性格
- 尋找適合自己產(chǎn)品屬性的視覺(jué)風(fēng)格
- 衍生出一系列的視覺(jué)符號(hào)
- 讓符號(hào)產(chǎn)生互動(dòng)連接
2. 方法
使用的方法可以分為兩種元素提取法和品牌故事提取法。（用重復(fù)的元素和結(jié)構(gòu)不斷地向用戶灌輸同一個(gè)思想，培養(yǎng)用戶認(rèn)知，用感同身受的故事感染用戶傳達(dá)品牌價(jià)值。）
元素提取法：
元素可以拆分為形狀、色彩、文字、質(zhì)感、結(jié)構(gòu)。把logo、輔助圖形、顏色、特殊的文字拿出來(lái)定義產(chǎn)品調(diào)性。
比如最近窩在家里用的最多的盒馬。從桌面icon-頁(yè)面-動(dòng)效果都用了元素提取的方法。
統(tǒng)一的藍(lán)色貫穿始終，盒馬的ip形象，以及下拉加載和個(gè)人中心頁(yè)面的輔助圖形等等。
元素提取更加的像基本法則，如果讓產(chǎn)品更加有靈魂，還需要故事提取法來(lái)加持。
品牌故事提取法：
大家都喜歡聽(tīng)故事，有故事的產(chǎn)品在使用的過(guò)程中更容易產(chǎn)生親近感。
比如轉(zhuǎn)轉(zhuǎn)，整體的品牌升級(jí)就是一個(gè)很美好的故事：
講述了一個(gè)二手物品流轉(zhuǎn)的世界，在沒(méi)有轉(zhuǎn)轉(zhuǎn)的世界里，大家都是沒(méi)有交集的，所以會(huì)感覺(jué)很冰冷，大家都在尋找自己的自身價(jià)值。
有了轉(zhuǎn)轉(zhuǎn)熊來(lái)轉(zhuǎn)動(dòng)發(fā)條，世界開(kāi)始流轉(zhuǎn)，大家都尋找到了自我，掌控了生活，開(kāi)始享受生活。特別暖心，讓產(chǎn)品有了靈魂。
通過(guò)故事來(lái)尋找一些相關(guān)元素，比如轉(zhuǎn)動(dòng)發(fā)條的動(dòng)作，IP家族的構(gòu)建，孟菲斯風(fēng)格的界面，復(fù)古的海報(bào)、甚至到公眾號(hào)的取名、將品牌立體的呈現(xiàn)給用戶。
05 在哪里用
上邊已經(jīng)講了很多品牌元素作為視覺(jué)錘來(lái)影響用戶的地方了，下邊就說(shuō)下產(chǎn)品中用的比較多的地方以及自己在梳理過(guò)程中的一些方法。
在接觸一款產(chǎn)品之前習(xí)慣把自己當(dāng)小白用戶，從第一次接觸到產(chǎn)品到完成使用的全部過(guò)程先梳理一下做成腦圖，哪些是緊急重要的，哪些是緊急不重要的先劃分出來(lái)。
能夠用到的地方基本上就是如下的幾個(gè)方向：
1. 色彩
顏色的刺激直接影響人的情緒——微信的綠色，支付寶的藍(lán)色，美團(tuán)的黃色，滴滴的橙色，網(wǎng)易的紅色等等。
比如之前云音樂(lè)頭部是紅色的，進(jìn)行了改版后整體頁(yè)面清爽了很多，但是依舊在金剛區(qū)使用了網(wǎng)易的紅色。包括他們?cè)谑褂镁€下的一些活動(dòng)，線上的h5推廣都會(huì)優(yōu)先選擇自己的品牌色。
雖然ofo的退款體驗(yàn)很差，但是他們的視覺(jué)錘做的還是挺好的，之前ofo的小黃人和厲害了我的國(guó)的推廣，無(wú)論是從logo-app-月卡的封面-宣傳圖-車體的變更都在不斷放大品牌色和車輪形狀的圓環(huán)（ofo）。
never的綠色使用的特別精彩，除了logo、線段，數(shù)字的標(biāo)記，icon，連按鈕都使用了這個(gè)綠色，品牌色貫穿了集團(tuán)所有的產(chǎn)品，感興趣的同學(xué)可以下載相關(guān)的產(chǎn)品看看。
2. 排版（字體/布局）
看多了注重屏效比的軟件，覺(jué)得所有產(chǎn)品千篇一律。通過(guò)布局和字體也能體會(huì)到產(chǎn)品傳達(dá)給用戶的信息，告訴用戶“我”是什么樣的。
島讀在排版上沒(méi)有延續(xù)常規(guī)的信息排布，標(biāo)題豎排列，大面積的留白，字體也選用文藝屬性的襯線體，就像一個(gè)文藝的女孩子在向大家講故事。
下邊這款音樂(lè)軟件排版風(fēng)格就更加強(qiáng)烈，無(wú)論從字體的強(qiáng)對(duì)比，還是顏色的搭配，都要更加炫酷一些。（網(wǎng)上沒(méi)有找到桌面icon，所以圖有點(diǎn)虛）
4. 圖形（輔助圖形/icon）
圖形的設(shè)計(jì)在頁(yè)面中的發(fā)揮空間很大，這也是很多設(shè)計(jì)師都喜歡做icon的原因之一。馬蜂窩logo下邊有一條微笑曲線，他們將這條曲線用在了產(chǎn)品的方方面面，比如導(dǎo)航切換的時(shí)和底部的icon設(shè)計(jì)上都有使用。
5. 空白狀態(tài)（空頁(yè)面/缺省圖）
空白狀態(tài)包括了空頁(yè)面還有一些圖片的缺省狀態(tài)，一般是在網(wǎng)絡(luò)異?；蛘邲](méi)有傳輸圖片的情況下才會(huì)出現(xiàn)，好的空白頁(yè)面不但能緩解焦慮情緒，也是宣傳品牌的好時(shí)候。
有ip的大多會(huì)選擇IP融入，沒(méi)有IP的會(huì)選擇特有的圖形或者某一個(gè)能強(qiáng)化用戶心智的點(diǎn)來(lái)進(jìn)行設(shè)計(jì)。
躺平的空白頁(yè)面使用的自己logo的形象，文字描述也很慵懶，很好的傳達(dá)除了品牌的氣質(zhì)，符合這個(gè)氣質(zhì)的人就會(huì)成為重度用戶。
6. 動(dòng)效
動(dòng)態(tài)圖比靜態(tài)圖的情感傳達(dá)更加強(qiáng)烈，在網(wǎng)絡(luò)加載速度越來(lái)越快的今天，動(dòng)態(tài)的使用場(chǎng)景也越來(lái)越多，常見(jiàn)的加載，下拉刷新，頭像甚至空白頁(yè)，都會(huì)加入一些好玩的動(dòng)態(tài)效果，動(dòng)態(tài)圖的張力更大，動(dòng)效的選擇也多種多樣，有的使用IP形象進(jìn)行在設(shè)計(jì)的，也有l(wèi)ogo進(jìn)行變形的，還有一些基本圖形的或者顏色變化（比如抖音和優(yōu)酷的加載）。
雖然動(dòng)效很好玩，代入感也更強(qiáng)，但是使用的時(shí)候要控制度，盡量不要讓過(guò)多的動(dòng)效打擾用戶，舍本逐末。
7. IP
我們似乎進(jìn)入了一個(gè)高度萌化的時(shí)代，從動(dòng)漫，盲盒的大賣，到line friends門(mén)店爆棚，ACGN的興起，讓越來(lái)越多的品牌通過(guò)暖萌的形象來(lái)傳遞品牌價(jià)值，讓品牌更加有溫度（后期會(huì)專門(mén)寫(xiě)一期品牌IP如何設(shè)計(jì)）。幾乎每個(gè)產(chǎn)品都有自己的專屬IP形象，而且家族的情況也越來(lái)越常見(jiàn)，提供了人們多元化的選擇。
8. 圖片（商品圖片/宣發(fā)圖）
圖片包含的很多，比如App store上的下載圖，開(kāi)屏圖片，還有特殊節(jié)日的海報(bào)等等也會(huì)延續(xù)品牌的基因。很多開(kāi)屏是和自己的logo結(jié)合，或者用自己的IP來(lái)做代言人，亦或者是選擇一套專屬的顏色定制的素材。QQ音樂(lè)在特殊節(jié)日的開(kāi)屏使用的logo變形。
是不是有一種終于看完的感覺(jué)，其實(shí)還有很多想說(shuō)的，但是看了下篇幅太長(zhǎng)了，感謝大家能看完。
圖片來(lái)源于網(wǎng)絡(luò)
作者：張咩咩；公眾號(hào)：咩咩設(shè)計(jì)筆記
本文由 @張咩咩? 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止轉(zhuǎn)載
題圖來(lái)自Unsplash，基于CC0協(xié)議
寫(xiě)得很好，受教了！
“不但要懂產(chǎn)品，還要懂運(yùn)營(yíng)、數(shù)據(jù)、還要會(huì)看設(shè)計(jì)，給設(shè)計(jì)一些指導(dǎo)”
指導(dǎo)～誰(shuí)給的你自信