如果您想訂閱本博客內容，每天自動發(fā)到您的郵箱中， 請點這里

今年是宮崎駿電影《龍貓》上映的30周年，吉卜力工作室已經(jīng)將電影原版膠片轉換成了高清數(shù)碼，進行了修復與重制，并將于12月14日在內地上映。

近日，龍貓中國版終極海報公布，由我們熟悉的著名設計師黃海設計：

小梅與小月在看似是稻田實則是龍貓毛茸茸的肚子上玩耍。

設計師黃海大家想必已經(jīng)不再陌生，被稱為「天才設計師」的他設計了包括《一代宗師》、《黃金時代》、《大魚海棠》、《我不是藥神》、《小偷家族》、《影》、《邪不壓正》等電影海報，收獲了外界的一致好評。

一、初出茅廬

黃海出身「廣告界的黃埔軍?！箠W美，在這里他遇見了他的恩師——臺灣著名的文案大師劉繼武先生。

在奧美的經(jīng)歷為他打開了創(chuàng)意的大門，之后他加入了一家本土廣告公司擔任美術總監(jiān)，2007年，一次偶然的機會接到姜文的電影《太陽照常升起》的海報設計任務。這是他第一次設計海報，卻在戛納電影節(jié)上一亮相就艷驚四座，從此聲名鵲起。

△ 2007年《太陽照常升起》

在此之后，黃海受到大量知名導演青睞，包括陳凱歌、姜文、馮小剛、馮德倫、徐克、王家衛(wèi)、陳可辛等，在此期間也設計了相當一部分的早期優(yōu)秀電影海報，例如《讓子彈飛》、《唐山大地震》、《太極》、《一代宗師》等等。

他的設計逐漸成熟，風格也十分多變，唯一不變的是讓人驚嘆的創(chuàng)意和構圖。

△ 2008年《梅蘭芳》

△ 2009年《花木蘭》

△ 2009年《白銀帝國》

△ 2010年《讓子彈飛》

△ 2012年《白鹿原》

△ 2012年《太極》

△ 2013年《一代宗師》

△ 2013年《中國合伙人》

二、走進大眾視野

時間來到2014年，一組《黃金時代》的電影海報，黃海從設計界走到了一般群眾的視野中。

這組極具東方色彩和現(xiàn)代美學的海報在微博、微信上被瘋狂轉發(fā)，似乎就是以這為契機，所有人記住了這位天才設計大師的名字——黃海。

海報根據(jù)在不同上映國家的特點，制作的張張樣式都不一樣：

△ 中國大陸

△ 美國

△ 日本

△ 臺灣

△ 韓國

△ 香港

相比于《黃金時代》，同為2014年的作品，《匆匆那年》和《黃飛鴻之英雄有夢》似乎就并不出名。

三、優(yōu)秀作品井噴

2015年，有了之前《黃金時代》的出色表現(xiàn)，黃海更加引人矚目，從這一年開始，他的優(yōu)秀作品呈井噴式地出現(xiàn)在大眾視野中。

△ 2015年《尋龍訣》

△ 2015年《山河故人》

△ 2015年《道士下山》

△ 2015年《念念》

△ 2015年《捉妖記》

2016年，國產電影《大魚海棠》崛起，而黃海和插畫師@sheep卍 共同合作為其設計的海報再次驚艷四座。

跌落水中的椿，和大魚的一眼凝望，開啟了這場奇幻的故事。2016年7月8日，赴你十二年之約。

△ 定檔海報

當海洋與火焰相融，7月8日，我們終將重聚。

△ 終極海報

同年，中國中央電視臺出品的一部三集文物修復類紀錄片《我在故宮修文物》上映。

海報分別以6件國寶級珍貴文物為背景，分別是：元代「剔紅水仙花紋圖盤」、明代「邊景昭 竹鶴圖軸」、清代「黑色綢繡菊花雙蝶圖竹柄團扇」、清晚期「掐絲琺瑯萬壽無疆中碗」、明代「自在觀音像」、宋代「汝窯天青釉弦紋三足樽」。

當然這一年還有喜劇之王周星馳的大爆電影《美人魚》：

黃海更是在這一年操刀第53屆金馬獎海報，他以楊德昌《牯嶺街少年殺人事件》為靈感，設計出男主角拿手電筒探照暗處的身影，除了向經(jīng)典致敬，也帶出「回看來時，照亮前行」的期許。

△ 2016年 第53屆金馬獎

四、作品賞析

時間推進到2018年，今年黃海更是收割了整年大半的優(yōu)秀電影。而他的驚艷的設計風格也逐漸變得讓大眾看到海報的同時就能反應過來「這是黃海老師設計的吧」。

△ 2018年《我不是藥神》

△ 2018年《江湖兒女》

△ 2018年《少年的你》

△ 2018年《犬之島》

△ 2018年《小偷家族》

有人說，黃海把中國電影海報設計拉至了國際水平，他將藝術、靈魂和故事完美地結合在一起，他的魅力在于很多人僅僅因為他設計的海報而去看相關的電影。

如今黃海設計的電影海報作品越來越多，我們不妨開始期待，他的下一份作品會帶來什么樣的驚喜。

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

如果您想訂閱本博客內容，每天自動發(fā)到您的郵箱中， 請點這里

一個優(yōu)秀的設計師可能會滿足以上的所有條件，也可能一條都不符合，這其實都不重要。當你和優(yōu)秀的設計師一起共事的時候，你就會從他們工作和為人處世的方式——獨處方式、思維方式、設計方式——來感受優(yōu)秀的設計師到底是什么樣子的。其實他們都有自己獨特的處事風格，并且各自有著不同的特長和個性。我有幸和一些非常棒的用戶體驗設計師和產品設計師一起共事過，他們有一長串無法數(shù)盡的本領。但我觀察到一些他們共有的特質：

“成為一個優(yōu)秀的設計師的秘訣，就是熱愛設計?！薄?Onur Cobanli

1、他們善于提問（They‘re interrogators）

“有效的提問帶了來洞察力，洞察力滋養(yǎng)了好奇心，好奇心澆灌了智慧”

在設計師的眼里，世界是千變萬化的。優(yōu)秀的設計師經(jīng)常會對事物進行質問。如果有什么是難以理解的，他們就會去問個明白。

2、他們不會“走直線”（They avoid the straight line）

“‘走直線’是走不了太遠的”

探索者將“永遠不去走直線”視作自己的信條。探索的過程中總會伴隨著未知。探索者不知道他們不知道的事情有哪些，他們的目標也不是去尋找有哪些事他們不知道，而是去理解事情的本質是什么。在我看來，優(yōu)秀的設計師會用一種開放的思維來探索他們的項目，因為他們自己也不確定他們最終會發(fā)現(xiàn)什么。

3、他們是“雙重性格者”（They’re ambiverts）

“雙重性格者（同時具有內向和外向性格的人），往往更有創(chuàng)意，因為他們更能適應新環(huán)境”

雙重性格者能很好地應付團體活動和社交場合，當然他們也喜歡有獨處的空間做點自己的事。優(yōu)秀的設計師既需要與團隊通力合作，也要喜歡獨立地想點子。

4、他們是很棒的廢話探測儀（They’re great bullshit detectors）

“開發(fā)一個內置的廢話探測儀”——Ernest Hemingway

當你跟形形色色的人一起共事時，你必須學會把他人的廢話扼殺在搖籃里。優(yōu)秀的設計師知道什么樣的人廢話多，并在工作中杜絕他們說廢話的機會。

5、他們在“累積變化”中工作（They work in ‘cumulative change’）

“聚沙成塔 ”（“Small changes eventually add up to huge results”）

在會計學里，“累積變化”是指所有差異的總和。革命性的變化往往是累積而來的。優(yōu)秀的設計師會抓住讓他們不爽的東西，并且試著去做改善。他們善于把眼光放遠來觀察事物的全貌，并且明白微小變化會引起巨大的轉變。

6、他們善于自我批判（They have a strong disbelief system）

“不要一開始就對自己設計方案的抱有自信，開始的時候應該持有一種好奇和質疑的態(tài)度”——Simon Pan

這條黃金法則是Simon Pan在讀了Marty Neumeier 的《創(chuàng)造力提升的46條天才法則》后提煉出來的。在這本書中， Marty 強調說人的意識形態(tài)對學習新知識是有害的，我們要拋開先入為主的觀念，并思考為什么我們相信我們所做的事情。

7、他們不怕犯錯（They like to be wrong）

“掌聲固然動聽，但禁得起批判更難能可貴””——Paul Arden

優(yōu)秀的設計師并不會特別在意自己的觀點能否成為解決方案，他們更想要的是完美的結果，自尊心被他們扔在一邊。他們的終極目標是：在使用它的用戶和創(chuàng)造它的公司眼中，這款產品是最棒的。

8、他們會有一點點“魔怔”（They’re slightly obsessive）

“用不尋常的眼光來觀察尋常的事物”——Vico Magistretti

“我喜歡和那些有創(chuàng)造力（雄心壯志）并且’魔怔’ （專注）的人一起共事”——Nicole Kidman

設計師在解決問題時會變得非常專注。我見過一些優(yōu)秀的設計師，他們對自己的項目抱有極大的熱枕，并且被它們牢牢地吸引著。當事情不順利的時候就會令他們相當?shù)目鄲馈?

9、他們是善于合作的獨行俠（They’re collaborative loners）

“成為一個獨行俠吧，這樣你就有時間去思考，去探索真理。保持神圣的好奇心，讓自己的人生變得有意義。”——Albert Einstein

優(yōu)秀的設計師既能自得其樂地獨自關在小黑屋里工作，也可以和團隊一起合作，達成他們想要的目標。

10、過程是一切的關鍵

“把你最愛的東西都干掉，從你的想法中走出來，投入到過程中去”——Chirryl-Lee Ryan

過程是一切的關鍵。我們要對過程報以信任。這個過程是帶領設計師通向最終目標的引路牌。在這個錯綜復雜的世界中，過程就是設計的關鍵。

11、他們善于傾聽和觀察（They’re great listeners and watchers）

“要想成為與人交流的大師，首先要學會閉上嘴來傾聽”——Rick Warren

人都有兩個耳朵，兩只眼睛和一張嘴。優(yōu)秀的設計師會遵照這個比例來使用它們（即兩分聽，兩分看，一分說）。大多數(shù)人傾聽是為了做出回應，優(yōu)秀設計師的傾聽則是為了試圖去理解人們的所思所想背后的本質。

12、他們富有同理心（They give a shit）

“即便是簡單的關心也是值得敬重的”——Edward Albert

好的設計師潛意識里是富有同理心的，他們關心人本身，喜歡問“為什么”，同時他們關注人的技能和本質。

“與普世觀點不同的是，設計師并不是藝術家。我們通過藝術的手段將我們的思維和工序可視化，但與藝術家不同的是，我們致力于解決客戶的問題，而不是展示我們自己對世界的看法?！薄狤rik Spiekermann

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

如果您想訂閱本博客內容，每天自動發(fā)到您的郵箱中， 請點這里

一、什么是用戶角色模型（用戶畫像）？

概念&作用

用戶角色模型是真實用戶的虛擬代表，通過一系列的真實數(shù)據(jù)分析，得出的目標用戶模型。模型通過抽象來代表復雜的現(xiàn)象，好的模型強調結構的顯著關系，弱化不太重要的細枝末節(jié)。我們要了解：用戶與用戶，用戶與期望，用戶與環(huán)境，以及用戶與產品之間的關系并且將其視覺化。

這里的視覺化可理解為：海量的數(shù)據(jù)標簽（標簽化、數(shù)據(jù)可視化）。比如我們要統(tǒng)計每個用戶的行為特征，細分到人口基本屬性、社會屬性、生活習慣、消費行為等信息，抽象出各個具體的標簽，賦予名字、照片、一些人口統(tǒng)計學要素、場景描述等，最終形成一個人物原型（personas）。

創(chuàng)建用戶角色模型的好處

· 與利益相關者、產品團隊在研發(fā)中拋開個人喜好，聚集在用戶動機和行為上，了解用戶深層次動機與心理；

（拋開個人喜好：產品團隊容易將自己的目標、動機、技巧代入產品設計中，這就是設計者心理模型）

· 避免設計陷阱，讓產品設計更聚焦，防止走偏，避免把過多的心思花在其他邊緣性功能上

（更聚焦、防止走偏：有人物模型為基準，團隊就能清晰的對功能進行優(yōu)先級排序，以核心功能、解決用戶訴求的功能為主，可避免把注意力放在非核心且次要的功能點上。）

· 有助于為營銷活動、組織架構、客戶支持、戰(zhàn)略規(guī)劃及設計決策 提供有價值的信息。

由什么構成？

顯性畫像：用戶群體的基本信息描述，如目標用戶的年齡、性別、職業(yè)、地域分布、興趣愛好等信息，一般通過客服人員線上交流、用戶賬號數(shù)據(jù)、常關注的內容做判斷，間接獲取數(shù)據(jù)；

隱性畫像：用戶群體深層次的特征描述，如使用產品的目的、解決什么問題、偏好、訴求、場景、愿景、使用頻率等。主要以問卷、訪談、意見反饋等方式直接獲得數(shù)據(jù)。

說到底，用戶畫像就是先對逐個有代表性的用戶進行特征描述，然后對共性特征進行提煉、分類，最終將用戶標簽化、數(shù)據(jù)可視化。

二、用戶畫像構建的基本流程

用戶角色模型不是拿來既用、用完即丟的，而是建立在系統(tǒng)的調研分析、真實的數(shù)據(jù)統(tǒng)計之上得出的有力結論。

這里要考慮用戶畫像的優(yōu)先級，畫像一般會存在多個（多個用戶），通常一個用戶只能有一個，不能為擁有三個以上畫像的用戶設計產品，容易產生需求沖突，要分清楚哪些是核心用戶（既目標用戶、產品的支撐者），哪些是非核心用戶，所以我們的設計目標就是維護、培養(yǎng)、促成核心用戶。

同時要以適合產品團隊和項目需求為出發(fā)點，用戶畫像不是一成不變的，而是根據(jù)現(xiàn)實情況同步更新，現(xiàn)在我們進行四步畫像構成法： 

1、確定分析維度

用戶角色模型是針對特定產品或特定功能的，所以人物角色的分類一般是根據(jù)用戶的目標（用戶需求）、行為和觀點（行為傾向）進行。

舉例：

目標？什么原因促使你使用該產品？解決你什么問題？

觀點？產品中最喜歡的功能？為什么喜歡？是否達到了你的預期？

行為？你最近一次使用產品做了什么？用了多久？

下面以2個維度做參考：

2、基礎數(shù)據(jù)收集

數(shù)據(jù)是有力證據(jù)，是構建用戶畫像的核心依據(jù)，在基礎數(shù)據(jù)收集方面，可以先列舉出構建用戶畫像所需要的基礎數(shù)據(jù)。

具體的思路如下：

上面列舉的數(shù)據(jù)緯度相對比較多，在構建用戶畫像過程中可根據(jù)需求進行篩選。

這些數(shù)據(jù)有三個來源：相關文獻資料和研究報告、產品數(shù)據(jù)后臺、問卷調研和用戶訪談，可以按照以下維度區(qū)分：

（這里涉及到用戶研究中重要的環(huán)節(jié)：用戶訪談、數(shù)據(jù)收集，將歸納為單獨的知識點于下篇文章分享，期待有你~）

3、分析建模

通過以上收集方式并成功采集后，下面開始對不同的角色進行分類（通常采集多個用戶做參考，如單個用戶可直接將其標簽化，然后套入完整模型中）

（1）先確定好產品屬性，按照用戶角色進行分類，比如外賣APP有：商家、消費者、騎手 三種角色，圖例：

（2）然后將角色內的用戶身上觀察到的一些顯著的行為列出不同的幾組行為變量，例如：對產品的積極性、熱情度、學習能力、熟練程度、消費觀等。

（3）將訪談對象和行為變量對應起來

這里就以電商產品為例，將用戶個性（行為變量）做成一個區(qū)間軸，再把訪談對象放到區(qū)間軸上面對應起來，不需要那么，標出相對位置即可

注意：行為變量有兩種情況

· 一種是連續(xù)性，比如使用頻率的描述是：經(jīng)常到從不

· 另一種則是非連續(xù)性，比如使用的平臺：移動端、PC端

對這兩種情況，大家要視情況而定，圖例：

（4）找出重要的行為模式

把對象映射完后，尋找在變量軸上的對象群。如果一組對象聚集在6~8個不同的變量上，這很可能代表一種顯著地行為模式，而這個模式是構角色模型的基礎，圖例：

三、畫像呈現(xiàn)

找出行為模式后，畫像呈現(xiàn)即從顯性畫像、隱性畫像、場景和需求等方面，給用戶打標簽，并且增加一點描述性語言（描述人物行為和痛點，而不是描述解決方案），圖例：

四、總結

（1）確定分析維度：當前產品處于什么階段？需要什么信息？

（2）基礎數(shù)據(jù)收集：對目標用戶進行訪談，收集相關數(shù)據(jù)

（3）分析行為模式：將訪談對象和行為變量對應、找出重要的行為模式

（4）整理并呈現(xiàn)畫像：描述特征和行為，創(chuàng)建人物故事

聊到這里可能有人會問：

Q：用戶模型做出來會不會有人看？它是不是設計者虛構出來的套路？

A：用戶角色模型是設計者通過用戶訪談和觀察得出來的真實用戶行為，是有真實數(shù)據(jù)為依據(jù)的，所以不進行大量的用戶調研，不為用戶建模，不去創(chuàng)建用戶模型，只知道意淫需求，說著“我認為該怎么怎么做”，都是一本正經(jīng)地耍流氓。用戶研究、用戶模型是我們做好產品的基礎和風向標。

Q：用戶角色模型到底什么時候開始做？

A：先確定目標用戶 → 對目標用戶進行訪談 → 訪談后再建立用于模型

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

如果您想訂閱本博客內容，每天自動發(fā)到您的郵箱中， 請點這里

筆者之所以從品牌設計的角度分析這個鵝廠家族新成員，是因為一款新產品的品牌設計在產品從0-1過程中扮演非常重要的角色，它關系到用戶對新產品的認知與心智。

體驗完 MOO音樂，我發(fā)現(xiàn)：移動產品品牌設計不僅要充分考慮視覺表現(xiàn)層，還要綜合考慮戰(zhàn)略、理念、內容、交互等多個方面。

同時，品牌設計是一種「求同存異」，「同」是保持對戰(zhàn)略、內容、用戶習慣的繼承性，而「異」是相比競品作出的差異化設計。本文就從繼承性和差異化，這兩個維度為你分享 MOO音樂的品牌設計。希望這種分析方法能夠為你的品牌設計提供幫助。

一、繼承性

1. 對新形象IP的繼承，培養(yǎng)了用戶心智

從啟動圖標和界面很容易看出，MOO音樂的品牌主色是黃色，背景色及輔助色基本是以黑白灰為主。

MOO音樂之所以采用這種配色方案，不僅是為了突出產品氛圍，讓人眼前一亮，還有可能是對騰訊新形象IP品牌的一種繼承和延續(xù)。

怪奇鵝IPENGOO，騰訊集團新一代形象IP品牌，代表著一種自我突破，不斷創(chuàng)新的精神狀態(tài)。

我們希望能像魔術師一樣，以經(jīng)典企鵝形象上提煉出的極簡鵝臉元素，為大家創(chuàng)造出充滿趣味、創(chuàng)新、時尚和腦洞的產品風格和內容，能喚醒每個用戶自動發(fā)出好感電波是一件很棒的事情！——怪企鵝IPENGOO官微

每位音樂家都不是一顆孤獨的星球，他們保持獨立又彼此相連，在他們的探索下，音樂潮流才不斷推陳出新又一脈相承。

保持探索，對先鋒與經(jīng)典抱以同樣的敬意，所以我們創(chuàng)造了MOO：音樂即自由

MOO Music，Life is MOOO beautiful?！狝PP Store MOO音樂介紹

IPENGOO（怪企鵝）的理念是：

• 優(yōu)質內容連接符號
• 傳遞互聯(lián)網(wǎng)精神
• 代表自我突破
• 不斷創(chuàng)新的精神狀態(tài)

可見，「連接、傳遞、突破、創(chuàng)新」這些新形象IP理念在 MOO音樂的啟動圖標、品牌理念、交互手法、推薦歌單上都有所體現(xiàn)。

因此，MOO音樂很可能是騰訊新形象IP品牌影響力里的一種嘗試。

此外，MOO音樂的品牌色也很有可能是對騰訊旗下年輕娛樂產品品牌色的一種繼承。

2. 對音樂元素的繼承，提升了產品的同理心

Sympathize（體察和同理心），可以幫助我們去理解事物表面背后的本質，得到和理解設計的微妙細節(jié)，這些本質自然的元素不只是邏輯上的，更是可以被感受的。——深澤直人

說到音樂本質、自然的元素（不是曲風），我們會聯(lián)想到黑膠、唱片、專輯、音波、調音臺、樂器、Live、樂譜、Launchpad等。這些音樂元素能拉近 APP 與用戶之間的距離，營造沉浸式的聽歌體驗，從而提升產品的同理心。

比如專輯封面的輕擬物化設計，播放時音波的、背景圖片和短視頻等等。

3. 對用戶行為的繼承，降低了學習成本

當我們在為一款新產品設計交互時，需要充分考慮目標、場景、用戶這些基本因素。我們通常會考慮并兼顧多數(shù)目標用戶的使用行為和習慣，為新產品設計交互方式。

所以當用戶看到熟悉的元素時，會很自然地知道如何去使用，降低了新產品的學習成本，這就是我們所熟悉的「Don’t make me think」。

MOO音樂的首頁PLAY頁，采用的是音樂+短視頻（有時候是圖片）的方式，當很多用戶看到這種熟悉的界面形式時，已經(jīng)本能的去上下翻頁、單擊播放/暫停，左右滑動調整進度更是再熟悉不過。

另外，MOO音樂的歌單在產品初期功能里占據(jù)了很大篇幅，因為最契合用戶聽歌行為場景的是歌單。

二、差異化

說完 MOO音樂在品牌設計方面保持的繼承性，下面來說說它不同于競品的差異化設計，主要表現(xiàn)在品牌理念、視覺氛圍、交互手法。

1. 品牌理念

從 APP 的這4張歡迎頁就可以看出 MOO音樂的品牌理念和調性了：經(jīng)典、創(chuàng)新、前衛(wèi)、獨立。

從目前的版本來看，MOO音樂還是一款滿足小眾口味、專注聽歌的音樂APP，但 APP 通過4張有代表性的歡迎頁，將 APP的「小眾」設計得「出眾」，很好地表達了產品的品牌理念。

2. 視覺氛圍

說到產品品牌的差異化，不得不說視覺層面的設計，畢竟視覺表現(xiàn)層是用戶體驗5要素里最具體的。

MOO音樂提供兩套視覺風格，默認是品牌黃色+BLACK，另一套則是品牌黃色+WHITE，筆者覺得默認的 BLACK 更有特色和沉浸感。

字體風格方面，標題類文字（PLAY、DISCOVER、FEATURELIST、ALBUM、VIDEO、VIDEOLIST）都是大寫的非襯線英文字體，歐美范十足。

3. 交互手法

調整進度的交互

主流音樂APP，是通過一個進度條和一個圓點來調整播放進度，而 MOO音樂將播放頁面下方聲波區(qū)域作為調整進度的熱區(qū)，通過明暗的對比來表現(xiàn)播放進度。

雖然這種交互方式在騰訊自家短視頻微視APP 中也存在，但 MOO音樂還是作了細節(jié)上的處理。

切歌的交互

通常情況下，在音樂APP 播放頁面的其他頁面，都有一個控件讓你隨時可以切歌，甚至是收藏，查看播放列表。

MOO音樂將切歌控件設計成了黑膠+滑塊，切歌時只需向右滑動，而且 iOS系統(tǒng)還會伴隨震動反饋。這個微交互設計得蠻有意思，這讓我聯(lián)想到膠卷相機拍完一張，然后撥動卷片扳手的機械反饋感。

三、幾點建議

目前 MOO音樂在 APP Strore 里才第2個版本，細節(jié)上的體驗不可能一步到位。

筆者借此機會向開發(fā)者提一點個人的建議，僅供參考。

1. 歌曲播放

希望當前播放的歌曲與背景短視頻或圖片有一定的關系，比如系統(tǒng)可以根據(jù)歌曲的曲風、類別等標簽，自動推薦匹配相關短視頻和圖片，讓歌曲與背景環(huán)境更協(xié)調。當然，也可以讓用戶自己設置推薦或隨機。

在 PLAY頁面切下一首歌時，希望顯示歌曲正在加載的狀態(tài)，底部的音波區(qū)域好像可以作一些文章。

2. 視頻評論

（iOS）歌曲評論頁里的評論輸入框常駐在頁面底部，但視頻評論頁的評論輸入框沒有常駐，而且滑到底部時，不太容易滑到頂部，可能是小BUG。

3. 切歌控件

（Android）輕觸切歌控件里的暫停按鈕后，黑膠旋轉的角度被重置了。希望能與 iOS版一樣，暫停后黑膠旋轉的角度不被重置。

4. 開通會員

APP 默認的會員價格是18元/月，若勾選了到期自動續(xù)費，則價格是15元/月。

雖然這2個價格都不便宜，但相對來說，自動續(xù)費的價格更有吸引力，但這個相對有吸引力的價格卻需要用戶主動勾選「自動續(xù)費」才能看到。筆者建議將這2種價格都顯示出來，通過單選按鈕的形式去交互。這樣，用戶很容易就會發(fā)現(xiàn)自動續(xù)費的價格優(yōu)勢，畢竟與18元相比，15元就不怎么貴了。

總結

MOO音樂于11月初發(fā)布在 APP Store，網(wǎng)絡上比較多的評價是「抄抖音、抄樂趣、抄Spotify、鵝廠又抄了……」。

但作為設計師，筆者希望我們將關注點放在設計層面，去客觀的評價一款APP，不要因為別人的評價而忽略了一些有品質的設計。

當我們仔細體驗交互和視覺的細節(jié)后，會發(fā)現(xiàn)鵝廠的設計是有很多地方值得我們學習的。

最后，面對主流音樂APP、短視頻APP、Spotify、Apple Musici、樂趣……MOO音樂既做到了對騰訊新形象IP、音樂元素、用戶習慣的繼承性，又做出了一些不同于競品的差異化設計。這套「組合拳」已經(jīng)打出了這款音樂APP 的品牌形象，希望這些內容對你有啟發(fā)。

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

如果您想訂閱本博客內容，每天自動發(fā)到您的郵箱中， 請點這里

按鈕在UI設計中是一種常用的UI控件，在界面中作為主要的行動點，引導用戶進行相應的操作，它在用戶和產品的交互中承擔著重要的作用。

按鈕設計看似簡單，但是如果想要更好的交互體驗，引導用戶進行相應的操作，提升產品的轉化率這仍是我們需要研究的問題。下面小編將從按鈕功能類型和設計要點兩個方面進行分析。

一、按鈕功能類型

按鈕的功能類型往往決定了一個按鈕的設計方式，是需要強調還是需要弱化；文案是需要強引導，還是直接闡述功能；按鈕上是放圖標還是不放圖標等。按鈕根據(jù)功能的不同，可以分為不同的類型，主要有行為召喚按鈕、表格按鈕、標簽按鈕、命令按鈕、懸浮按鈕、開關按鈕這六大類型。

1.行為召喚按鈕

行為召喚（CTA）按鈕其目的是誘使用戶采取某些操作， 從而提高產品的轉行率。簡單來說就是通過設計誘導或激勵用戶點擊按鈕，例如立即購買、訂閱關注、利益誘導、文字誘導等。

1）誘導購買

當行為召喚的目的是誘導購買時，按鈕的設計不管從顏色、形狀、樣式都需要突出。讓按鈕看上去可點擊，讓用戶進來第一眼就能知道該按鈕的用途。如下圖所示：

以美團外賣為例，該按鈕的顏色采用黑黃對比、形狀采用具有親和力的圓角，在樣式上加入投影同時加入送餐員的元素，配上小紅點，能夠清晰的給用戶傳遞出可點擊部分有去結算、送餐員。另外加入價格誘導，讓你可直觀看到優(yōu)惠了多少錢，促使你進一步操作。

以淘寶詳情為例，該按鈕是一個組合按鈕，由加入購物車和馬上搶以及店鋪、客服、收藏等組成，作為行為召喚按鈕我們可以明確的看到，不管從顏色、形狀、樣式都能夠讓我們快速注意到。

2）訂閱關注

當行為召喚的目的是訂閱關注時，其重要程度相比誘導購買低很多，但是在設計時我們仍然需要考慮一個問題，這個問題可直接決定該按鈕大小、樣式等，這個問題就是需要根據(jù)產品目的判斷是誘導用戶訂閱關注重要還是讓用戶閱讀內容重要。如下圖所示：

當內容重要時，按鈕的設計需要弱化處理，以優(yōu)酷視頻的發(fā)現(xiàn)頁和星球頁為例，這兩個頁面很明顯是以內容為主的界面，在設計時直接弱化了按鈕形式，讓按鈕和整個界面相融合，但是按鈕設計的原則是讓其看上去像按鈕，因此當按鈕只是文字時可以加圖標進行引導比如優(yōu)酷視頻發(fā)現(xiàn)頁，也可以加入弱底紋進行引導還能讓界面看上去整潔，比如優(yōu)酷視頻星球頁面。

當訂閱關注重要時，按鈕的設計需要強化處理，以橘子娛樂和土豆視頻為例，橘子娛樂采用粗描邊漸變按鈕，同時加入圖標進行引導，具有較強的視覺引導作用，很容易喚起用戶的關注。土豆視頻采用黃色填充加圖標引導，在視覺上和產品內容形成強烈對比，明顯的以關注為主的界面。

3）利益誘導

當行為召喚的目的是利益誘導時，該按鈕設計根據(jù)重要程度較高，因此在設計時可以考慮顏色、形狀、加入圖標、誘導文字等設計方法。如下圖所示：

以大眾點評為例，其領獎按鈕明顯比賺積分的層級高，因此為了突出領獎按鈕采用了色塊設計的樣式，同時賺積分按鈕采用描邊設計進行弱化處理。

以騰訊doki為例，其打榜頁面沖榜的重要層級較高，因此在設計時不僅采用了色塊、加入動效圖標、同時還加入了誘導文字，讓按鈕更明顯同時誘導用戶點擊，其他去瀏覽按鈕則采用描邊樣式弱化處理。

4）文字誘導

文字誘導簡單來說就是通過文字，誘導用戶進行下一步操作，多用于空頁面、活動頁面中，因此在設計時采用簡單的色塊填充即可，如果該頁面為活動頁面也可增加漸變或投影樣式，讓按鈕更有空間感，進而突出按鈕。如下圖所示：

以得到為例，當你還沒有學習計劃時，它會對你進行提示“開始制定學習計劃”，同時其按鈕采用重要程度較高的色塊+投影的方式，誘導用戶點擊。

以大眾點評為例，當你還沒有攻略時，它會對你進行提示“我也要創(chuàng)建攻略”，同時其按鈕采用漸變填充的方式，誘導用戶點擊。

2.懸浮按鈕

懸按鈕浮是 Android 應用中最常見的一個控件。不過隨著Android和iOS規(guī)范的不斷融合，在iOS中也經(jīng)常會看到各種各樣的懸浮按鈕。在設計上懸浮按鈕應該采用顯眼的顏色，以抓住用戶的注意力。同時它應該是積極正向的交互，比如創(chuàng)建、分享、探索等，同時并不是所有頁面都需要加懸浮按鈕。如下圖所示：

以UC瀏覽器為例，懸浮按鈕在訂閱頁面的右下角出現(xiàn)，將按鈕和界面結合很容易看出創(chuàng)建內容的意思，同時點擊按鈕還可呼出圖文、視頻等操作圖標。

3.標簽按鈕

標簽按鈕往往呈多個出現(xiàn)，多使用在二級導航或條件篩選下面；以及表單頁面作為切換條件選中。因此在設計樣式上有選中狀態(tài)和默認狀態(tài)，同時其重要程度較低，在設計時不能喧賓奪主，需要弱化處理。如下圖所示：

以支付寶為例，它主要用在投保的表單頁面，其主要目的就是一個切換條件，重要程度遠不及我要投保按鈕，因此在設計時默認用的描邊處理；選中采用淡淡的色塊。

以轉轉為例，它主要用在導航下方，其主要目的也是切換條件，用戶主要操作是看下方篩選出的內容，因此在設計時也進行弱化處理。

4.表格按鈕

表格按鈕也就是由一個白色網(wǎng)格加文字組成的按鈕，從視覺上看和頁面融為一體，特別不突出。因此多用在個人中心中不太重要信息或者不想讓用戶操作的退出登錄界面中。如下圖所示：

以愛奇藝為例，在我的界面中，關于我們和退出登錄都是用的表格按鈕，由于關于我們是不太重要信息，退出登錄又是不想讓用戶操作的內容，因此采用表格按鈕最為合適。

5.命令按鈕

命令按鈕也就是該按鈕具有明確的指令，多出現(xiàn)在彈框中，通常會有一個文字或2個文字出現(xiàn)的情況。其要求是文字語義要明確，盡量不要用確定、好的、要等詞匯，同時根據(jù)用戶右手操作習慣居多，因此將重要的按鈕放在右側。如下圖所示：

以京東金融為例，左圖是京東金融退出的二次確認頁面，右圖是我調整文字之后的頁面。我們說到文字需要表意明確，因此將確定換成退出后表意更加直白，降低用戶理解度。

6.開關按鈕

開關按鈕也是我們很常見的一個組件。表示兩種相互對立的狀態(tài)間的切換，多用于表示功能的開啟和關閉。當按鈕開啟后可能還會帶來其他的相應操作。開關按鈕最常見的就是手機設置中，但是也有很多APP將其用到界面中使用。如下圖所示：

以美團外賣和小豬短租為例，它們在提交訂單頁面時都采用了開關按鈕，同時在小豬短租中，當按鈕打開底部會將“您可再入住完成10天內補全信息”進行展開顯示，提示用戶去填寫。這種點擊展開的操作還可增加更多的功能相關內容。

二、按鈕設計要點

1.根據(jù)產品為按鈕選擇適合的形狀

在按鈕設計時，需要根據(jù)整個界面風格設計合適的按鈕，按鈕樣式主要有直角、小圓角、全圓角三種樣式。

直角的含義：嚴謹、力量、高端。適用于金融類、奢品類產品中，讓產品給人嚴謹安全、高端的感覺。例如寺庫。

半圓角的含義：活潑、年輕、安全。適用于兒童類、年輕化、娛樂類、購物類的產品中，提升親和力，拉近用戶的距離。例如土豆。

小圓角的含義：穩(wěn)定、中性。適用于用戶跨度較大的常規(guī)類產品中，例如微信。

以寺庫、微信、土豆為例，寺庫是品類電商，因此在設計時需要提現(xiàn)高端，因此在按鈕設計時采用直角設計。而微信的用戶群體上到七八十歲，下到幾歲其年齡范圍廣，因此采用穩(wěn)重的小圓角較為穩(wěn)妥。土豆短視頻其用戶群體較為年輕活潑，因此采用全圓角較為適合。

2.使用合適的狀態(tài)

在部分界面設計中需要考慮按鈕的不同狀態(tài)的設計，從而提高用戶操作流暢度。移動端完整的系統(tǒng)按鈕可以分為正常狀態(tài)、按壓狀態(tài)、禁用狀態(tài)。

其中，正常狀態(tài)和加載狀態(tài)展示的是APP的主色；按壓狀態(tài)在正常態(tài)的基礎上疊加不透明度15%的黑色#000；禁用狀態(tài)是設置灰色或者將正常態(tài)設置不透明度45%，該狀態(tài)適用于提交界面中使用，比如登陸注冊、轉賬等。如下圖所示：

以京東金融為例，當未輸入轉賬金額時，按鈕禁用為灰色，當輸入金額時按鈕為正常狀態(tài)。不過隨著互聯(lián)網(wǎng)的發(fā)展，寬帶速度不斷的提高，按壓狀態(tài)慢慢被拋棄，他存在的意義不像以前網(wǎng)絡不發(fā)達的時候，點擊還需要時間反應。

3.提供恰當?shù)姆答?/span>

當用戶點擊按鈕時，他們希望界面可以給些恰當?shù)姆答?。如果沒有任何反饋，用戶會以為系統(tǒng)沒有收到他們的操作，然后就會重復點擊。這種行為常常導致多個不必要的操作。如下圖所示：

以土豆短視頻為例，當點擊關注時為了避免用戶點擊沒有反應的情況，可在按鈕上添加加載狀態(tài)，當關注成功后圖標狀態(tài)改為禁用狀態(tài)，同時文字變?yōu)橐殃P注。

總結

按鈕設計看似簡單，但是如果想要更好的交互體驗，引導用戶進行相應的操作，提升產品的轉化率這仍是我們需要研究的問題。本篇主要將從按鈕功能類型和設計要點兩個方面進行歸納總結。

按鈕功能類型：主要有行為召喚按鈕、表格按鈕、標簽按鈕、命令按鈕、懸浮按鈕、開關按鈕這六大類型。在使用我們需要根據(jù)對應的功能和重要程度選擇適合的設計。

按鈕設計要點：主要有根據(jù)產品為按鈕選擇適合的形狀；使用適合的狀態(tài)；提供恰當?shù)姆答佭@三大注意要點。

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

如果您想訂閱本博客內容，每天自動發(fā)到您的郵箱中， 請點這里

一、xSpace產品背景介紹

CCO-集團客戶體驗事業(yè)群是一個為阿里平臺商家、阿里經(jīng)濟體提供售后服務能力的部門，勵志于賦能阿里電商生態(tài)圈內的售后服務體驗，提升消費者對平臺的滿意度和 NPS指標。xSpace產品是一個幫助客服人員處理消費者咨詢、投訴、維權等場景的一站式售后服務工作臺。現(xiàn)已經(jīng)在阿里生態(tài)圈中多個 BU 中應用，成為平臺服務中不可缺少的 CRM產品。

二、Lazada場景中面對的挑戰(zhàn)

2017年，阿里收購東南亞電商巨頭 lazada 成為阿里商業(yè)生態(tài)的重要組成部分。CCO 作為負責經(jīng)濟體售后服務體驗的部門，需要向外輸出阿里服務的價值和能力。因此，我參與的 xSpace產品海外場景孵化是其中重要的一個能力輸出。

△ 產品功能和業(yè)務覆蓋范圍

三、國際化項目遇到的問題

國內產品出海，都會面對一些通用問題，例如：產品設計開發(fā)都在國內；業(yè)務和真實用戶在國外接觸機會少；文化背景、時間、空間上都或多或少存在差異。

我們熟知很多設計方法，例如 lean UX，design sprint，hook model，lean canvas 等，但是如何在國際化的挑戰(zhàn)中尋找最合適的方法，是我在國際化產品項目中遇到的困惑。

回想項目在推進的過程中出現(xiàn)過的一些困難，例如：

• 解決方案似乎缺乏終端用戶輸入；
• 產品owner太多，設計比較難收口；
• 設計工作的重要性被認為低于功能迭代；
• 調研之后經(jīng)常沒有后續(xù)action；
• 在項目初始階段就被要求產出高保真設計方案。

是否有一種全面的國際產品設計和開發(fā)模式，既可以轉化產品能力又可以科學的度量海外用戶的體驗？

為了解決所面對的困惑，我嘗試將以往經(jīng)驗和項目的實踐相結合，梳理了 B類產品國際化體驗設計實踐模型。

本篇文章，我將以項目的實踐為例子，簡述設計師在面對未知的商業(yè)環(huán)境下怎樣應用「精益創(chuàng)業(yè)」和「設計思維」將設計與商業(yè)結合，實踐設計轉譯和推進落地。我將這次設計實踐稱為「國際化全景設計框架」探索。

△ 設計思維、精益創(chuàng)業(yè)和敏捷開發(fā)之間的關系

四、國際化項目實踐

根據(jù)項目不同時期的側重點，我將把整個項目的實踐拆分為3個時期進行介紹，分別是探索期、實驗期和開發(fā)期?！冈O計框架」中包含的設計方法也將圍繞不同時期的側重點進行展開。

△ 國際化設計實踐項目分期

1. 探索期

當我們對海外場景一無所知的時候需要應用「設計思維」對目標進行分析。在項目啟動初期，由于不清晰、不確定的需求導致產品設計存在很大的阻力。面對這樣的情況，項目團隊決定直接去到客戶現(xiàn)場了解業(yè)務現(xiàn)狀。設計師需要遵循「設計思維」，通過發(fā)現(xiàn)問題 – 定義問題 – 解決問題的思路，幫助項目快速明確目標。

收集用戶輸入，抽象產品場景：可以從「人」和「事」兩個方面入手。

△ 設計思維在設計前期的應用

從「用戶（人）」的維度發(fā)現(xiàn)問題，是為了理解業(yè)務人員組織架構；明確公司內部自上而下對產品期待；以及終端用戶的核心訴求。我們主要是通過訪談和觀察法進行數(shù)據(jù)收集，確保獲得一手的資料。

△ 基于角色的前期調研

通過調研我們發(fā)現(xiàn)：Lazada服務團隊與服務BOP 之間的管理關系并沒有很緊密，在服務指標整體的管理上面相較于淘系平臺要求較簡單。但是也同樣存在客服流動性大，不穩(wěn)定等通用問題。而一線客服在日常使用產品的過程中，則面臨系統(tǒng)割裂操作效率不高等問題。

從「事情（業(yè)務）」的維度發(fā)現(xiàn)問題可以快速理清業(yè)務流程和業(yè)務邊界。

在準備出發(fā)前，我結合國內項目對電商服務流程的理解，簡單設計了業(yè)務調研的框架和范圍。通過訪談的形式進行歸納和補充，有目的有范圍的了解業(yè)務的共性和個性。

△ Lazada商業(yè)畫布，明確業(yè)務目標和范圍

通過「人」和「事」角度的資料收集，我們可以歸納出大部分的產品使用場景。對產品使用場景的抽象理解，可以讓設計師更深入了解業(yè)務，通過對用戶的移情和以往的經(jīng)驗做第一輪體驗判斷。

第一輪體驗判斷：定義問題，明確產品落地思路和節(jié)奏。

通過對訪談和觀察內容的梳理發(fā)現(xiàn)，目前首要解決的問題是系統(tǒng)遷移、信息內容和渠道擴展融合的問題。經(jīng)過評估和判斷，現(xiàn)有產品有50%的功能可以被復用，考慮到效能成本的因素，因此就有了系統(tǒng)整合場景適應的概決思路。

△ MVP功能范圍拆解思路

通過以上業(yè)務方面的調研分析，接下來將進行產品執(zhí)行落地階段的實驗和分析。

2. 實驗期

有了解決問題的思路，就可以根據(jù)預先判斷的方向快速產出概念原型并進行實驗。與此同時，有目的性的針對市場競品進行分級調研，可以輔助加深對產品需求設計的理解。把眾多的競品分為核心競品、重要競品和行業(yè)競品，主要針對3個核心競品進行調研：這些調研可以幫助打磨出更合理的設計策略。

△ 競品分析思路和競品分級

從調研發(fā)現(xiàn)，通常意義上國外的 B端產品似乎看起來相對「簡單」，這可能要歸功于他們在產品商業(yè)化推進過程中使用的策略，使得 B類產品在獲客體驗全流程表現(xiàn)的比較成熟。產品獲客階段的體驗感知也是我們的 B類產品在 PK 商業(yè)化產品的過程中一個重要參考。

研究競品的設計策略，可以幫助項目在之后的實踐中找到最適合的策略應用在具體的設計方案中。

△ 設計策略、設計原則總結

在這個試錯的階段，整個項目團隊需要保有「精益創(chuàng)業(yè)」的思維：接觸并持續(xù)地收集用戶對產品的反饋和意見，用真實聲音去驗證產品方案和設計策略與市場的貼合度，并及時調整項目方向。多給自己試錯的機會，就像「精益創(chuàng)業(yè)」的作者所說的：失敗是學習的先決條件。

3. 開發(fā)期

通過前期的調研和實驗，進入開發(fā)期的項目應該已經(jīng)明確了其目標，在這個階段的主要任務是根據(jù)產品和業(yè)務拆解設計目標，分解設計輸出，度量產品體驗。

拆解設計目標

需要結合產品的生命周期進行設計目標的拆解。我們項目的目標就是成功遷移產品。并且產品目前現(xiàn)有1.0版本已經(jīng)在公司內部運營了2年，基礎功能已經(jīng)覆蓋。但為了結合 Lazada 的業(yè)務場景需要更深一步的功能定制。結合現(xiàn)狀，設計在不同的產品階段有以下如圖所示的策略分層。

△ 根據(jù)產品周期的不同階段進行設計目標的拆解

分解設計輸出

在 MVP 功能覆蓋階段，設計輸出主要包括對設計需求的探索和轉譯。在設計轉譯的拆解思路上，我主要關注通用功能和定制功能之間的融合和落地。抽象來看，從0到1的融合轉譯過程就像是一個由大到小再變大的沙漏。

總匯產品功能→收集國際化產品需求→需求分類→建立映射→提出解決方案→評估成本→設計落地

△ 設計思路抽象

其中有一些關鍵節(jié)點需要著重把握：

• 總匯產品功能：了解現(xiàn)有產品功能大圖，目的是快速理清與新業(yè)務場景建立映射關系。通過業(yè)務分析，明確需求范圍，將需求轉化成產品功能。（前面提到了有多種手段可以收集產品需求）
• 需求分類&建立映射：項目團隊內根據(jù)功能模塊優(yōu)先級，制定設計迭代計劃。與之前的「產品功能大圖」匹配作為建立映射的依據(jù)。
• 提出解決方案&評估成本：這個階段主要的設計行為是做設計的收口決策，需要設計師更好的收口不同功能模塊的產品訴求，達到跨國內國外通用功能保持一致的產品體驗。

△ 交互demo

度量產品體驗

作為 B類國際化產品項目，最大的痛點就是距離。設計團隊與一線用戶存在時間、空間、文化上面多種多樣的差異。而用戶的反饋則是體驗優(yōu)化的重要輸入，如何在項目前期沒有數(shù)據(jù)監(jiān)控的情況下度量產品體驗，是國際化設計中所普遍存在的痛點。

因此，除了常規(guī)的小范圍可用性測試，我在項目實踐過程中還嘗試應用一種適應于國際化產品的體驗度量方式——SUS（system usability scale）。SUS量表的優(yōu)點在于：

• 在樣本量有限時，SUS量表可以得出較可信的數(shù)據(jù)結果。
• SUS分數(shù)可以橫向對比，了解自身產品與行業(yè)競品對產品的差距。
• SUS量表不僅可以衡量「usability」同時也可以衡量「learnability」，對于處在系統(tǒng)遷移場景的產品度量是比較適合的。

用戶UAT→SUS測試準備→量表發(fā)放→量表回收分析→體驗優(yōu)化提案→設計落地

△ 國際化產品SUS量表回收分析

配合產品 UAT 計劃，安排一定數(shù)量的可用性量表的投放和回收，通過計算可以獲得準確性高達95%的 SUS分數(shù)。該分數(shù)可以和行業(yè)的 benchmark進 行比對，評估出現(xiàn)有產品的弱項分數(shù)。這種科學的輕量且快速獲得用戶反饋的方式可幫助體驗設計師找到優(yōu)化提升的方向，進行專門的走查和分析。

五、設計小結

總結一下在遠離客戶的國際化場景中，設計師如何擁有一個全局的視角，科學的推進設計進度和度量產品體驗：

在第一階段——探索期，應該針對項目的側重點選擇科學合理的設計方法，獲取一手的產品需求輸入，抽象出產品的使用場景作為接下來研發(fā)產品的「實驗素材」。

在第二個階段——試驗期，除了對項目競品的全鏈路競對研究之外，設計師和項目團隊都需要有不怕錯的試錯精神，應用「精益創(chuàng)業(yè)」的流程快速驗證方案、圈定項目發(fā)展策略和思路。

在第三個階段——研發(fā)期，設計師需要突破國際化項目普遍存在的時間、空間等等限制，選擇最優(yōu)的設計方法指導設計產出和度量設計方案。

以上就是我在實踐 B類國際化項目中的一些經(jīng)驗總結。歡迎大家多多交流，相信在 B類產品國際化的道路中，還有非常多可以探索的課題等著我們去思考。

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

如果您想訂閱本博客內容，每天自動發(fā)到您的郵箱中， 請點這里

一、配色常見的誤區(qū)

很多人之所以怕配色，或者說配不好色的原因是自己一直深處誤區(qū)中而渾然不知，接下來希望大家不要對號入座。

誤區(qū)一：配色的過程在整體之前。也就是常說的先配色，后設計。

誤區(qū)二：只會配不會選。這是最常見的一種，只會在有基礎色或者主色的前提下配色，而不懂得選一個符合整體的基礎色遠比配色更重要。

誤區(qū)三：被理論所局限。配色的過程是偏感性的，理論雖然沒錯，但是它只是輔助提供一種方向的，而不是完全要依靠理論去配色。

接下來就繼續(xù)今天的主題：色，從哪里來？也就是基礎色應該怎么選？

二、顏色來源 —— 主體

在設計中，主體也就是畫面中最重要的部分，它可以是產品、模特、抽象圖形等等，基礎色來源最常用的方式就是在主體身上提取，可以是主體中比重較大的顏色，這樣有利于主色與主體形成更強烈的呼應關系，也可以是比重相比較小的顏色，這樣在形成呼應關系的同時，拓展性更強，下面舉個例子：

假如我們在這個人物的基礎上去選背景的基礎色，我們就可以用到這里說到的理論：基礎色來源于主體，那么我們可以有哪幾種選色的形式呢？下面我們繼續(xù)看：

配色形式一：將主體整體比例最大的顏色作為主色，整體在色彩上與主體形成很強烈的呼應關系，這樣做的目的在于整體很和諧、舒服，易于接受，畫面更統(tǒng)一，整體視覺沖擊力偏柔軟一些。下面看另外一種形式：

配色形式二：將主體整體比例較小的顏色作為主色，同樣整體在色彩上也與主體形成了一定的呼應關系，而正是因為主色是主體比重較小的顏色，這也使得畫面整體在于主體形成呼應關系的前提下，也拉開了主體與背景的層次，整體視覺沖擊力增強，畫面統(tǒng)一性減弱，整體性并沒有因為主色的改變而降低。下面嘗試將文字的顏色也稍加改動：

不難發(fā)現(xiàn)，無論上面哪種主色的形式，配黃色字都很融合，且都增強了視覺沖擊力。其原因在于畫面整體顏色與主體都形成了呼應關系，使得配色不會給用戶一種很突兀、毫無依據(jù)的感覺。而這種形式的選色在工作中也是用到最多的，比如：

其實，這種通過提取主體色作為配色參考的形式在接受程度上是很高的，通過搭配一些點綴色，整體上也不會給人一種很單調的視覺感受；利用主體選色的配色方式是將原本有可能茫無頭緒、感性的配色工作，轉化為一種可以有所依據(jù)、有所參考的配色技法，同時也能提升一定的工作效率。再舉個例子：

三款牙刷，三種不同的主色方案，但是每一個給人的感覺都很舒服、和諧，呼應明確，這就是提取主體色方式的好處。

三、顏色來源 —— 風格

不管是做海報還是頁面，在最初都要確定一個風格路線，然后圍繞確定好的風格選材、選色、搭配主體等。那么很多情況下，確定風格也就等于間接性的確定了一個選色的區(qū)間，所以結合風格特征選色也是一種很實用的方式，比如我們要做「狂暑季」風格的專題頁，那么在用色方面就要避免大面積暖色調用色，而要著重使用冷色調的顏色，目的很簡單：大面積的暖色會給人一種熱鬧、狂熱、張揚、溫馨的感受，和暑季需要清爽、降溫的感覺不相匹配，所以我們會盡可能采用主色冷色調的用色形式，搭配一些輔助色、點綴色，比如：

這些都是依據(jù)風格最直觀的選色形式，這樣做的目的是將整體用色盡可能的貼合主題風格，同時再結合主體選色的形式，將配色的過程盡可能做到有據(jù)可循。風格選色的形式在日常工作中也是很實用的，比如：促銷，我們會用紅色、藍紫色、黃色的用色形式；春節(jié)，則是以紅、黃為主；七夕，多以紫色、紅色為主；暑期購，多以藍色、青色、綠色為主。比如：

這些海報的配色形式很大程度上是依據(jù)風格來決定的，這樣的選色方式也不會顯得很突兀，且擴展性相對更高。

四、顏色來源 —— 文案

做設計目的是服務于商業(yè)，很多時候我們都要圍繞文案、產品去制定風格、主題，所以選色同樣可以參考文案，從文案中提取關鍵詞，依據(jù)關鍵詞同樣也可以提取相對應的顏色，比如：

文案在一個畫面中的重要性也是很高的，因為用戶在不看文案的前提下理解設計畫面速度是相對緩慢的，所以文案結合畫面的方式能夠大大的提升用戶對整體的理解速度，也就是捕捉信息的速度，將文案與畫面很好的結合在一起也是設計師所必備的技能，這樣做的目的在于讓文案與畫面形成視覺上的呼應，也更利于視覺信息的傳遞。

五、來源 —— 主體反色

前面說的大多都是通過顏色找整體的呼應關系，這樣做的目的是讓畫面整體更和諧、整體性更強。而還有一種選色的形式，即以主體顏色的反色作為主色調，也可以理解為：主體比重較大顏色的對比色或間隔色作為主色。比如：

將主色和主體色通過對比色或間隔色的關系拉開對比，目的是讓主體在整個畫面中的視覺形象更加鮮明，視覺感受更加強烈，但是要注意的是：在選反色時，盡量選用主體色中比重較大顏色的反色，這樣才能起到強烈對比的效果。

再說下點綴色，點綴色的作用很大程度上是豐富畫面整體色感的，它的用色比例只占畫面整體的5%~10%左右，點綴色的選色很多時候是畫面主色的反色，目的是讓畫面整體色感不顯得單調、缺少變化，同時也有豐富畫面的作用，但是要注意不要大面積的使用，起到點綴、打破的作用即可。

總結

總的來說，其實配圖的過程就是在配色，當一個畫面的主體、風格、文案確定時，我們就可以依據(jù)這些進行選整體色，只有主色確定時才有必要進行下面配色的工作，而不是把配色放在所有工作之前。今天主要說的就是選色的幾種常用方式，選色的過程其實也是在配色，配色合不合理要看整體效果，設計的整體感也是很重要的，凡事要做到有所依據(jù)。最后還是那句話，配色是感性的，理論是提供思路和方向的，兩者相互結合才能把配色做的更出彩。

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