設(shè)計是門邏輯學(xué)，然后才是美學(xué)

Part 1. 我有個好朋友，叫框框

曾有人問我：為什么你們設(shè)計師都喜歡戴黑框？
我說：因?yàn)槠綍r畫圖第一步總是畫個框框，手機(jī)是個框，電腦是個框，紙也是個框，所以眼里的世界也必須加個框~

其實(shí)當(dāng)時，我就這么一說。現(xiàn)在想起來，大概冥冥之中注定要幾年后我才能領(lǐng)會當(dāng)時這話的深意。這叫自己挖的坑，自己跳。

至于這個框框，有很多種解釋的方法，歸納成兩個字就是：約束。

說約束的具體內(nèi)容之前，先叨一下故事背景。許多人，包括我從小對設(shè)計的幻想，就是充滿美感的藝術(shù)家做著天馬行空的夢，然后用巧奪天工的手，做出一件件嘆為觀止的藝術(shù)品。直到我本科畢業(yè)之前，我都這么天真的以為（高中搞著物理競賽，本科學(xué)著通信工程，從小我都教育自己，你是只理工女漢子，不要做少女的夢。然而事實(shí)證明我是一只文藝的女漢子，終究逃不過人文藝術(shù)的吸引）。好在研究生靈魂得到解放，奔到美帝學(xué)人機(jī)交互，把我一直遠(yuǎn)遠(yuǎn)憧憬的藝術(shù)、莫名累積的技術(shù)、和悠遠(yuǎn)深刻的人文興趣（星座學(xué)和心理測驗(yàn)呵呵）完美的合在了一起。然而沒有一點(diǎn)點(diǎn)防備，開篇老師就強(qiáng)調(diào) “設(shè)計不是藝術(shù)”！所以，漂洋過海的來填補(bǔ)內(nèi)心對藝術(shù)的渴望，還沒開始就結(jié)束了嗎？

接著的話我一輩子都記得：

設(shè)計是實(shí)現(xiàn)別人的需要，藝術(shù)是自我表達(dá)的需要。

請看我的超現(xiàn)實(shí)主義圖解：

在后來的學(xué)習(xí)和工作中，這個 “別人” 的定義在不斷地豐富著：設(shè)計的東西給誰用，誰拍腦子想主意，誰搬磚，誰拍板，誰買單，誰背黑鍋（亂入，這個還是默認(rèn)自己吧，在決策過程中會更有使命感）。。。是的，你的設(shè)計都是為了服務(wù)這些 “別人”。設(shè)計師要無我，超脫自己，忘記私人恩怨和個人喜好，做出客觀公正的最大化滿足所有 “別人” 的需求。并且時刻記著，這些需求隨時會變，所以面對不斷更迭的設(shè)計稿，不用玻璃心。設(shè)計只有更好，沒有最好。

現(xiàn)在再來說約束。既然有這么多的 “別人” 這么多的需求，自然就形成了各種各樣的約束。設(shè)計是在各種框框里找最優(yōu)解的過程。用戶的年齡、性別、習(xí)慣、興趣、教育、文化、地域、信仰 bla bla bla 的分布，是個框框，決定了我們的第一個問題：who’s your user / audience（用戶是誰）。他們面臨的問題和需求是我們的核心框框 ：what problem we are solving（解決他們的什么問題/滿足他們的什么需求，從而帶來什么價值）。團(tuán)隊和資源的需求又畫上了 timeline（項目時間表）和 staffing（項目成員）的框框。東西做多大，全套系統(tǒng)還是小功能翻新，改流程還是做視覺/文字游戲，是 scoping（確定項目范圍）的框框。東西做不做得出來是 feasibility（可行性）的框框。有多少錢是budgeting（預(yù)算）的框框。公司的形象認(rèn)知度再來個 branding（品牌）的框框。等等等等。而這些都是在一張大白紙上畫框框，接著就在最后規(guī)劃出來的小小空間里做設(shè)計。

啊摔！這么狹小的空間怎么馳騁我們天馬行空的想象力？這個問題我有一個非（no）常（zuo）科（no）學(xué)（die）的解釋：要把框框們想象成很高維的東西，這樣把他們的重疊處展開成低維（UI算二-三維，UX算四維）的時候就會非常非常宏大！宇宙會閃爍呢！（此處水很深，不懂的請回家看《三體》）

就是這些條條框框構(gòu)成了shaping the product（給產(chǎn)品定型）的基礎(chǔ)。然而這一切都還沒開始做設(shè)計呢，然而這一切又都是在做設(shè)計哦。

Part 2. 設(shè)計是門邏輯學(xué)

解釋了這么久框框，終于可以點(diǎn)題啦。如此復(fù)雜的條件下，要判斷情勢，權(quán)衡利弊，揣測人心，給出多種解決辦法，還要隨機(jī)應(yīng)變，口吐蓮花。做設(shè)計很大部分的時間和腦力都是在許多噪音（哦不，PM和程序員你們有最美妙的聲音）中迂回尋找一個答案，用思辨的邏輯，不是憑空想象或東搬西湊。然后在強(qiáng)大的邏輯支撐下，妙筆生花即可。

這就是為什么考察設(shè)計師的一個重要因素是他們是否能 justify design decisions（辯解設(shè)計決定）。當(dāng)開會時有非設(shè)計人員問你“為什么不用。。。/你有沒有考慮。。?！钡臅r候，潛臺詞也許是“你智商在線嗎”，這時候你就可以搬出理由123，試過的其他123，利弊123，然后對方大寫的服；要是不服，那么請在理由充分的時候?yàn)t灑的甩出一句 thank you for your feedback, we can follow up on that（謝謝你的建議，我們可以私聊），潛臺詞是 you’ll never see me again（走好不見）。所以如何在被圍攻的時候逆襲是設(shè)計師的必備生存技能。本例是夸張修辭的玩笑話，認(rèn)真的孩子不要當(dāng)真。

突然想起之前有人問我，面試遇到 “當(dāng)你和工程師或者產(chǎn)品經(jīng)理意見不合的時候，要怎么辯護(hù)自己的設(shè)計？” 是不是把上面的過程描述一遍就好了？我私以為這還不夠，陳述了自己的理念就揚(yáng)長而去，有沒有種自我為中心的感覺？不要忘了，那些 “別人”！想的再周到的設(shè)計師依然只是個人的經(jīng)歷累積，而其他部門的人通常能帶入全新的視角。所以除了解釋“我”的設(shè)計思想，那 “你” 的考慮是什么呢？如果的你的考慮意義重大，那我虛心接受你的意見。這樣既可以學(xué)習(xí)到新的知識，讓未來思考問題的版圖立體化一點(diǎn)，又可以照顧到同事的使命感，促進(jìn)健康的團(tuán)隊氣氛。別和他們翻船，要升華成合作伙伴的巨輪。

每次和優(yōu)秀設(shè)計師的共事，真的分分鐘提醒我自己：智商，智商，不要下線！他們邏輯清晰，條理清楚，思考全面，論證充分；對其他部門的運(yùn)作有充分理解，有對用戶的忠貞理想，也有對企業(yè)的利益責(zé)任；思維的整體性很強(qiáng)，有上帝視角的感覺（這是在說我老板星星眼）。他們提的問題總是直中要害，語言溫婉得體又針針見血。他們總能一眼看穿問題的本質(zhì)，而不是淺顯的被視覺上的細(xì)枝末節(jié)迷惑。設(shè)計的不是產(chǎn)品，是體驗(yàn)，用戶在他們腦海里規(guī)劃的世界里一步步打怪升級，盡在掌握之中。他們很多的時間在思考問題和價值，跟人交談深入了解需求，作信息架構(gòu)，畫 user story，鋪一墻的便利貼。等一切明朗了畫起界面流程什么的行云流水。當(dāng)然也免不了反復(fù)完善，但他們深知這是過程，不是抓瞎。

所以下次見到一個玉樹臨風(fēng)的設(shè)計師的時候，請把他想象成何以琛，不要跟他辯論，因?yàn)槟憧倳?。就算辯論不輸，顏值也輸。

Part 3. 感受用戶體驗(yàn)，不只是眼睛

說了這么多寬泛的設(shè)計，再來小談一下我的領(lǐng)域，用戶體驗(yàn)設(shè)計。

用戶體驗(yàn)，聽著多玄妙啊。這得是怎樣的體驗(yàn)呀。歪果仁稱之為 User Experience，簡稱 UX，業(yè)界有很多不同的定義。有的把 UX design 分為 visual design（視覺設(shè)計）和 interaction design（交互設(shè)計）；有的按 UI 和 UX 分，UI 是畫界面，UX 是畫界面之外的流程/功能規(guī)劃；有的大 UX 概念除了視覺和交互，還包括了 motion design（動效設(shè)計）、user research （用戶研究）、content strategy（文案）、production design（畫 redlines 或者素材庫）。一千個 UXer 簡直有一千種解釋 UX 的方式。所以當(dāng)我們聽到“哦，畫界面的”，“你是設(shè)計師嘛，幫我畫個 logo 唄” 的反應(yīng)時，內(nèi)心是萬馬奔騰的。將心比心，就跟 “你是程序員呀，幫我修個電腦好嗎”，“你是攝影師嘛，給我美圖秀秀一個啦”，“北郵畢業(yè)的，去哪家當(dāng)郵遞員啊”，“大廚呀，是不是碗洗的特別干凈”之類相通。因?yàn)檫@樣的對話不僅不理解我們的辛苦腦力活動，更不理解我們每小時的收費(fèi)標(biāo)準(zhǔn)哈哈。

跟沒接觸過設(shè)計的或者剛接觸設(shè)計的人，要糾正設(shè)計跟視覺的直接聯(lián)系這個誤區(qū)。我覺得，體驗(yàn)是各種感知在時間上的集合，看到的，說出的，摸到的，感覺到的，聽到的，想到的。如下圖：

以我們互聯(lián)網(wǎng)行業(yè)的體驗(yàn)為例，眼睛看的是界面的樣子，摸的是輸入設(shè)備，嘴巴說的是用戶對產(chǎn)品的評價（或者語音類產(chǎn)品作為輸入），耳朵聽的是別人的評價和推薦（或產(chǎn)品的聲音輸出），想的是對功能的理解和操作選擇，心里感受的是用產(chǎn)品的愉悅，上癮，困惑，或惱怒。不敢說用戶體驗(yàn)設(shè)計師能操控所有的這些體驗(yàn)，只是說在做一個設(shè)計的時候最開始會考慮這些方面，作為另一種框框。

不僅體驗(yàn)有方方面面，用戶也有多面性。以 Airbnb 為例，做 marketplace 就有市場的兩面，房東和房客；Airbnb 滋生了第三方的產(chǎn)業(yè)鏈，于是他們也是我們的用戶；客服人員也需要很復(fù)雜的一套體系；內(nèi)部員工平時的日常也需要一些效率/人力/文化傳承的工具。當(dāng)在為某一類用戶設(shè)計的時候，有時候也要抽離一下看看全局，或許會獲得不一樣的靈感。

一些對設(shè)計不了解的人包括每日相處的非設(shè)計師同事，都可能覺得我們總是在畫UI，其實(shí)那是在激烈的框框大戰(zhàn)和群雄舌戰(zhàn)的空隙，全套界面出來之后還有反復(fù)用戶測試和修改的過程。界面只是冰山一角，這一點(diǎn)希望能給需要給產(chǎn)品項目預(yù)算時間成本的人一些啟發(fā)。

Part 4. 但人還是視覺動物

說了這么多，應(yīng)該不會再問我是不是搞藝術(shù)的了吧。但有了金玉其中，也不好敗絮其外吧？畢竟在互聯(lián)網(wǎng)，眼睛看到的直接關(guān)系到對這個虛擬世界的感官。道理如同只有懶女人，沒有丑女人。不求驚艷，至少要得體。有多少人是因?yàn)?App Store 的截屏美嘗試新 App 的？雖然下了發(fā)現(xiàn)不太實(shí)用，不多久就刪了。但要是看著太凄慘，直接不會下哦。就好像遇到長得美的產(chǎn)品談個戀愛，實(shí)用又貼心就結(jié)婚吧！之前說的一切是為了讓產(chǎn)品伴人長久，而視覺的包裝是為了“讓你在人群中多看我一眼”。

這里又插播一條面經(jīng)，常聽要面試的人問交互設(shè)計師需不需要視覺很好？官方說法可能是 “有一定的視覺品味”，不代表可以忽略視覺。因?yàn)橐曈X真的是無處不在：界面本身的美感，交互動畫，產(chǎn)品的包裝和推廣，presentation 的風(fēng)格和細(xì)節(jié)，面試者的品貌氣質(zhì)衣著，眼神的交流…… 別忘了這是看臉的世界。交互設(shè)計師的確不需要在視覺上有多大造詣，但不會做包子也得知道包子好不好吃吧？

再說，美感是個比較主觀的東西。跟之前強(qiáng)調(diào)的邏輯性是對立面。一些人覺得好看的另一些人很可能會無感或者反感，反之亦然。設(shè)計師辨識時代的潮流，然后創(chuàng)造新的潮流。過多追求好看也可能在功能上碰壁。最后都是各種力量的權(quán)衡和折中。所謂美感度強(qiáng)的設(shè)計也就是獲得更多人欣賞的幾率高一點(diǎn)，沒什么正確答案。大概這就是設(shè)計師永遠(yuǎn)不會失業(yè)的原因吧，需求在變審美也在不斷刷新，所以永遠(yuǎn)可以有下一個版本。

因個人興趣，我最近在做一個小小的一百天項目，畫一百條我認(rèn)為很美的裙子。滿足一下少女心和對時裝插畫的興趣，訓(xùn)練一下手感并熟悉不同畫材，同時也從新的角度找點(diǎn)靈感。覺得在這個過程中，不說對衣服的品味有多少升級，至少對線條、層次、結(jié)構(gòu)、和整體輪廓有了更高的敏感度。讓我想起剛開始做設(shè)計，從糾結(jié)于字體、顏色、可交互元素的樣式，到空間的層次和布局，到有意圖的導(dǎo)航人眼看的位置，到留白的設(shè)計；從炫技到做減法；不斷嘗試、學(xué)習(xí)、吸收，逐漸形成自己的風(fēng)格但又能適應(yīng)不同場景的需要。這是一場永無止境的修行啊。

Part 5. 尾記

這是一篇非典型意識流的設(shè)計工作小感悟。自大學(xué)畢業(yè)就沒有寫過中文的文章了，平時在英文環(huán)境中漢語記憶被沖刷了不少。若語句不通或比喻不當(dāng)，請多多包涵不吝指正。

最后特別感謝我們鎮(zhèn)司女神安姐約稿！我都不知道自己對設(shè)計工作有這么多可扯的。想法不分享就遺忘了，寫出來留個紀(jì)念也好。感謝閱讀！

Sunny Wang
Experience Designer @ Airbnb
http://iamsunnywang.com
Dribbble, Instagram: @yingsunnywang