Keynote是Mac用戶使用的幻燈片軟件，我們平?？吹降奶O果發(fā)布會，國內(nèi)手機發(fā)布會基本都用的是Keynote。當然Mac系統(tǒng)也兼容PPT。Keynote因為其簡約而高級的動效而備受青睞，很多企業(yè)開發(fā)布會首選就是Keynote。我做了幾張動效圖來示意一下發(fā)布會的高級效果。

演示設計這個概念，包含了上述PPT，Keynote發(fā)布會。常見的PPT商業(yè)定制項目包含： 企業(yè)介紹PPT、產(chǎn)品型發(fā)布會PPT、白皮書、商業(yè)計劃書等等。我們今天討論的不是這兩款軟件跟平面設計PS AI的區(qū)別， 我們要討論的是平面設計和演示設計的區(qū)別，所以下文的闡述中，我有可能一會兒講PPT，一會兒講Keynote，講的都是一碼事，都叫（幻燈片）演示設計。

對PPT感到非常詫異

在沒有接觸演示設計之前， 我一直是做平面設計（這些年做過UI，平面海報，電商類，游戲視覺，官網(wǎng)）。這兩年才剛接觸PPT，算是一個跨界選手了。當我第一次聽到PPT居然還需要設計，我感到十分詫異。我不是很能理解一款毫不起眼的Microsoft PowerPoint，我意思是說，一款職場人士的常用的幻燈片演示軟件，一款根本算不上是設計軟件的PowerPoint，能跟設計有什么掛鉤的呢？有什么沾邊呢？

讓我感到更詫異的是，還有專門PPT設計師這種職業(yè)的嗎？他們的日常工作是怎么樣的？PPT設計師跟平面設計師有什么區(qū)別呢？如果說設計是為了解決問題，優(yōu)化體驗。那么，PPT設計需要解決的是什么樣的問題呢？什么樣的客戶，有這類需求呢？有多少這樣的群體，愿意為毫不起眼的PPT而付費呢？我剛接觸PPT那會兒，我實在是太多的疑惑了。

第一直覺，好丑，好Low.

作為一個資深平面設計師，當?shù)谝淮慰吹揭恍┧^很“不錯”的PPT作品，我第一反應真的是看吐了。感覺好丑好low??！這就是我的第一直覺。有一些配色，一些陰影，很多細節(jié)，簡直完全侮辱我這么多年的審美。這也更加加深了我對PPT的疑惑：

· 就這玩意，這么土的效果，以我的技術不是隨便降維碾壓這些人么？
· 為什么會有這么丑的PPT？
· PPT設計不遵循平面的規(guī)則嗎（透視，顏色，投影等）？
· 要是我來做的話，肯定能做的更好。
· 就這些東西，居然還有那么多人說好？

發(fā)布會，不就是大圖疊字么？簡單！

在沒有跨入這個行業(yè)之前，如果你問我對PPT和發(fā)布會的第一直覺，我會這么回答你：不就是大圖配文字嗎？如果說讓我來操刀發(fā)布會， 我所認為的演示設計，難道不應該是高逼格大圖加簡約而且少的文字么？發(fā)布會不應該就是這樣的嗎？是的，我的第一直覺沒有錯。我們現(xiàn)在看到的比如小米、華為、OV、蘋果，汽車發(fā)布會等等，都是大圖配字。

這樣的設計，背后的邏輯是什么呢？設計看起來很簡單，真的做起來很容易嗎？

演示設計的邏輯

回想一下，我們是什么時候開始接觸PPT這款軟件？我想大部分人基本都是從學生時代開始吧。老師講課都會用到PPT。在學生時代如果老師講課講得無聊，那臺下的學生肯定就打瞌睡了，要么就在竊竊私語或者玩手機，總而言之，注意力肯定被分散了。無聊的老師講課，PPT大片大片的文字，丑陋的配色，臺下學生總是不愛聽，講課生動的老師往往更受歡迎。

同樣道理，教室的場景換成了發(fā)布會現(xiàn)場，老師角色換成了演講人，黑板換成了演示大屏幕。人依然還是從學生時代過來的人。

一切都沒有變。

發(fā)布會演示設計，如果你不能抓住觀眾的眼球，那臺下就沒人聽你講了，場面也會逐漸失控，臺下的人玩手機的玩手機，交流的交流，甚至還會有人覺得浪費時間直接走了。就像看一部乏味的電影，繼續(xù)看下去也是在浪費時間。還不如睡覺。這種情況的出現(xiàn)，對于臺上演講人來講，也是一種巨大的壓力。

所以，演示設計要考慮一個非常重要的問題就是，如何讓每一頁的呈現(xiàn)，深入人心，抓人眼球。這就是為什么發(fā)布會，總是用無比震撼的大圖或者視頻，簡約的大字文案來呈現(xiàn)。因為精彩的內(nèi)容（圖片和視頻）可以吸引觀眾的注意力，再配合演講人高超的演講技巧，把要傳遞的信息，借著幻燈片傳遞出去。發(fā)布會的主體是人?；脽羝禽o助演講人的工具。你不會見到有人會把一大堆的文字放巨大的屏幕上吧？那坐后排的觀眾看著多費勁。那觀眾到底是自己閱讀大屏幕上面的字呢，還是聽人（演講人）講呢？

請記住，最沒吸引力的當然是枯燥乏味的文字，而且是大段大段的文字。這里我做一個案例展示你感受一下你就明白了。假設你現(xiàn)在正在觀看一場蘋果發(fā)布會，這一個頁面密密麻麻排滿了iPhone 14的相關參數(shù)和文字介紹。這里無意冒犯 ， 只是想通過一個錯誤的案例展示來表達我自己的觀點。

抓住觀眾的注意力

不管是平面設計還是演示設計，有一條永恒不變的設計規(guī)則，那就是觀眾的注意力特別容易走神。我就拿官網(wǎng)舉例子。做過官網(wǎng)的同學應該有所體會，首頁Banner區(qū)域的位置，一般不會超過5張Banner圖，每一張圖片的輪播時間，一般不會超過3秒。你的Banner如果不能第一時間吸引用戶注意力，逗留時間再長也沒用。并且，如果第一張Banner停留時間過長，將影響用戶注意后面幾張banner。用戶的注意力非常有限。同理，偌大的會場，巨大的屏幕， 臺下成千上萬的觀眾，發(fā)布會如何能吸引用戶的注意力？按照設計的邏輯，要想吸引觀眾的注意力，畫面視覺呈現(xiàn)上能用動態(tài)元素優(yōu)先用動態(tài)（視頻、三維），其次是圖片（吸引眼球的圖片），最后才是文字（盡量少而精簡）。當然一整場發(fā)布會下來不可能全是視頻，這樣也會造成視覺疲勞，仿佛看了一場兩三小時的電影。 這樣源文件也會超負荷過大，硬件設備也未必跟得上。所以一場發(fā)布會，是需要控制好視頻，圖片，占總頁數(shù)的比例。

演示設計，就是推演+視覺展示。

說到這里，我給演示設計下一個定義。平面設計是用符號，文字，圖形等一系列的元素進行排列組合成視覺呈現(xiàn)出去給受眾群體。演示設計則是，通過符號，文字，形象，圖形，動畫等等，運用合理的視覺化，用復合邏輯的手段去推演，去展示，把關鍵的point，有力power地傳達出去給臺下受眾。

演示演示，就是推演+視覺展示。和平面設計不同的是，幻燈片演示，不適合在一頁內(nèi)容上去表達過多的信息，要保持簡約和克制。所以你會看到尤其是手機發(fā)布會，演講的文字內(nèi)容一大段一大段，但是畫面上字少卻鏗鏘有力，圖片大氣且震撼。

當我第一次動手實戰(zhàn)的時候，我錯了。

前面說到我剛開始接觸演示設計的時候，我的認知就是，做PPT不就找符合文案意境的圖，然后把字擺上去嘛。比如講企業(yè)愿景，大概率就是配高山，大海，攀登，地球等等元素。比如講醫(yī)療的時候，就是配醫(yī)生，實驗室等等配圖。這樣的認知也沒錯。

當我第一次做項目實戰(zhàn)的時候，我也是這么干的。 然而我又犯錯了，我對PPT又有了新的認知。

首先是用途。用途上分為 閱讀型PPT 和 講解型PPT。

| 閱讀型PPT

如果PPT是用作商業(yè)計劃書，項目提案，品牌介紹，白皮書等等這類場景，這一類型的PPT稱為閱讀型PPT。 閱讀型PPT頁面上承載了很多的信息，頁面布局整整齊齊，板塊分明。這一類型的PPT一般是發(fā)給其他受眾去仔細閱讀的，尺寸一般為16:9,4:3，或者2:1 , 3：1。

| 講解型PPT

如果PPT是用在大型發(fā)布會現(xiàn)場這類場景，這一類的PPT稱為講解型的PPT。 這一類PPT，上面也提到過，演講的主體是人，PPT只是輔助的工具，整場發(fā)布會下來主要靠演講人把PPT的內(nèi)容給講清楚，所以發(fā)布會級別的PPT，一般字少，大圖，大背景，配合動畫，三維去演繹。

我第一次動手做商業(yè)項目的時候，我錯就錯在我的需求是閱讀型PPT，我卻按照講解型的思路去做。每一頁PPT把內(nèi)容大部分都刪了， 只留下部分重要的信息，再配以大圖。下面這個就是一個反面教材，隨便找個圖片胡糊過去，No Way。

當我再次實戰(zhàn)做發(fā)布會時， 我又犯錯了。

犯了一次錯，我弄明白了什么是講解型的PPT，什么是閱讀型PPT。在我第二次接到發(fā)布會需求的時候，我記得當時是給一個醫(yī)療項目做發(fā)布會，我配了一張水珠的超高清大圖。我當時認為這個圖片非常匹配畫面要表達的場景，但現(xiàn)實又再一次給我打臉。

我記得客戶的反饋就是這個圖過于素材化，一看就是免費攝影圖庫，不符合他們企業(yè)的調(diào)性。我這才意識到原來我們平?？吹降陌l(fā)布會級別的演示，一張大圖配的一些剪短而有力的文案，這個圖片的來由不是網(wǎng)絡上找張圖貼上去，或者請攝影師拍一張那么簡單。反過來想，找個合適的圖或者付費買一張合適的圖然后直接打文字上去，真有那么容易，那發(fā)布會也太容易做了，錢哪有那么好賺呢，對吧。

最合適的圖片來自哪里？

那如果圖片不是找一張匹配的圖就能完成演示設計的工作，那最合適的圖片從哪里找呢？他們大廠發(fā)布會的圖從哪里來呢？答案是，網(wǎng)絡上從來就不存在100%合適匹配的圖片，如果你隨便找一張圖就能糊弄甲方過稿，說明你的甲方好忽悠，或者說要求并不高。

我們拿蘋果來舉例子。你去看蘋果的每一次新品發(fā)布會，你去看蘋果的官網(wǎng)上面的圖，他們的選圖絕對不會是隨便在網(wǎng)絡上找合適的圖片，他們的圖片，視頻，一定是團隊親力親為拍攝的。尤其是在展示自己的大樓，車間，生產(chǎn)線，員工，企業(yè)文化等等，網(wǎng)絡上怎么可能存在匹配合適的圖片呢？最優(yōu)質(zhì)，最合適的圖片一定是請專業(yè)攝影團隊拍攝。這是解決商業(yè)需求首選的方案。

下圖為 蘋果官網(wǎng)截圖

大多數(shù)客戶沒有這個預算，要求咱去網(wǎng)絡找圖。預算充足的甲方能讓設計師用上付費高質(zhì)圖片。預算不足的，設計師只能靠免費圖庫。這里我拿一個我之前做過的商業(yè)案例來給大家展示，這是一頁飛機稿，由于涉及商業(yè)，所以畫面所有信息都去除，我們只看畫面視覺。

這一頁客戶要表達的是企業(yè)文化，不畏險阻，勇攀高峰。于是我找了一座高山來表達這個意象。當然這座山不能直接拿來用，于是我對這個照片進行了處理。

圖片壓縮有摩爾紋

這個效果很不錯了對吧。我發(fā)過去給客戶，盡管已經(jīng)對圖片進行了二次處理符合這一次的意象，但是客戶仍然對圖片提出質(zhì)疑，認為這座山光禿禿，而且沒有生命力，攀登起來感覺像是探險運動，很危險的感覺。當然客戶的顧慮是對的。后面經(jīng)過了溝通，我把山峰換成了綠油油的有樹林的山，然后才過稿。

你看，哪怕是精心處理過的圖片，它依然沒法100%匹配客戶的要求。PPT商業(yè)定制，著重在定制兩個字，這就是為什么我每次對客戶介紹自己的時候，我給自己的title都是【PPT商業(yè)定制設計師】。如果你還不是很明白我在講什么，我用兩件T恤來告訴你，什么叫定制。

左邊是一件純白T恤，是工廠批量生產(chǎn)的類型。價格也比較親民，大概幾十塊錢左右。那什么叫定制化呢？ 右邊的T恤就是定制，根據(jù)客戶的要求私人定制。價格能翻好幾倍。很多年前就聽聞過某位設計大師說過一個非常經(jīng)典的比喻： 設計就好比裁縫做衣服。

作為設計師，需要在每一次的項目中傾聽客戶的內(nèi)心需求，再運用手里的素材給客戶定制匹配的圖片，對于反映企業(yè)文化的意象圖片，客戶自然有他自己心中的考量。

字給我再放大點！

有一次做國內(nèi)某知名游戲工作室的發(fā)布會PPT。 主辦方會場有3個屏幕，一個主屏，兩個副屏。副屏上基本是放字，來輔助大屏的有獎問答。我當時在設計副屏的時候，我認為字已經(jīng)放得足夠大了，再大就破壞了畫面的平衡和比例，至少在平面領域來講，畫面的字傻大粗，完全沒有美感比例可言。我已經(jīng)調(diào)了五六版了老板還是不滿意，最后老板自己調(diào)了一版超級大的字，我才意識到原來我做不好PPT是思維上沒有扭過來，不是因為技法的問題。平面講究的字體大小比例均衡，不適合用在演示項目，尤其是發(fā)布會項目。為什么呢？我們要從用戶的維度去思考，設想一下在會場，如果你的字放得不夠大，那么后排的觀眾可能無法閱讀到文字。給觀眾體驗感不是很好。所以，為什么發(fā)布會一般不會放很多的文字？因為確實閱讀起來很費勁。這就是平面設計跟演示設計的區(qū)別。

那問題來了， 到底發(fā)布會現(xiàn)場，用多大的字才合適呢？業(yè)內(nèi)有這么一個公式，可以大概推算出字體用多少號，能夠讓發(fā)布會現(xiàn)場最后一排的觀眾也能清楚的看見。

A是指現(xiàn)場最后一排座位到大屏幕的距離，

B是發(fā)布會大屏幕的寬度，

Pa是指人到電腦屏幕的距離，

Pb是指你制作幻燈片時，你電腦屏幕的寬度。

假設A是16m， 也就是說最后一排到大屏幕的距離大約是16米，B（發(fā)布會屏幕）的寬度大約是4米，你再用尺子測量一下你的電腦屏幕寬度（Pb值），假設Pb值是80cm，那我們可以算出Pa，人到電腦屏幕的距離是320cm. 也就是3.2m. 為什么要推算這個3.2m這個數(shù)值呢？ 這個數(shù)值至關重要，得到3.2m這個數(shù)值之后，你就站在距離你電腦3.2m的位置，去看你電腦上面的字，能不能看清，如果不能看清就把文字調(diào)試到 你站在3m外還能看清的字號大小。

我再強調(diào)一遍。此時在電腦桌前做PPT的你，就站在距離你電腦3.2米的位置，然后去調(diào)試你PPT中的字體，這個時候就做個測試，字號大概放多小，仍然能被你自己看得清。那么，這一份PPT在發(fā)布會現(xiàn)場就能被最后排的觀眾看清。 當然允許的話 ，還是盡量把字調(diào)大一點點。

業(yè)內(nèi)這個粗略的測試方法， 有點類似于我們小學數(shù)學知識里面的比例尺。這個方法不是萬能的，如果條件允許的話，最好就是帶著你的電腦去現(xiàn)場控臺測試，這是最直觀的方法。因為發(fā)布會屏幕亮度，現(xiàn)場燈光等等，各方面很多不可控的因素都有可能影響到你的PPT閱讀性。

平面設計或許不需要對文案進行提煉。但是演示設計需要！

上一篇文章我有提到，演示設計師的第一重任，就是要對客戶想要傳達的信息進行提煉處理。化繁為簡，有所取舍。但是平面設計尤其是版式設計，是允許畫面上大片大片文字的存在的。

那么問題來了，客戶如果給了你很多的文字內(nèi)容，都想塞在PPT里面，怎么辦？

答案是，做刪減或者分頁。我們要針對內(nèi)容和客戶溝通，讓客戶做取舍，刪減提煉。一頁PPT保持言簡意賅的表達。 如果很多內(nèi)容實在都想保留，那就拆頁，分開好幾頁來講。記住，就因為你是設計師，所以你更應該引導甲方（牽著甲方走）。而不是讓自己陷入被動，在設計的時候左右為難，寸步難行不知道該怎么辦。大膽告訴甲方，這一頁內(nèi)容實在太多了，放不了那么多，影響閱讀。

演示設計也遵循平面設計排版四大基本準則

如果要說平面設計和演示設計，有什么共同的點。那我一定要講，從排版上他們都遵循四大基本準則。從本質(zhì)出發(fā)，如果一份設計稿，畫面信息排布凌亂不堪，那還不如直接閱讀文字。四大準則：對比，對齊，重復，親密性。這個已經(jīng)是老生常談的話題了，這里不展開闡述。同樣的，演示設計也是需要對畫面進行信息處理，把重要的信息區(qū)分開來。

問題來了： 平面的排版技法用在ppt里面合不合適？

不合適。 前面有提到，PPT最重要的是簡單，直接，生動。如果平面的技法用在PPT上面，很顯然閱讀起來是很費勁的。 不信你看下面這兩個案例。就拿我日常最愛喝的楊枝甘露做一個例子 左邊是我找的一個平面案例。很不錯對吧。 但是如果我用這個排版遷移到發(fā)布會大屏上，或者16比9的PPT里面，我也不多說了，你就自己對比一下吧。

你會發(fā)現(xiàn)，在現(xiàn)場大屏幕下，閱讀如此多的信息，會感到非常費勁，

這就是平面設計和演示設計的區(qū)別。

工作流程的異同之處

做了將近快3年的演示項目，很多流程已經(jīng)算是爛熟于心。今天趁著這個機會，把自己心中的方法論，系統(tǒng)地寫下來，方便給各位入行的新人設計師指明一條道路。寫，是為了查漏補缺，是為了讓知識更加系統(tǒng)化，縫合進自己的知識體系。對自己對他人都是一件有利的行為。

這里我重點說說，演示設計的工作流程。請看下圖：

首先第一步是提煉文稿。甲方會給你演講人的講稿，大篇的word文字，需要你摘錄分頁放在PPT里。提取關鍵信息，梳理清楚表達邏輯。也有一些甲方，會提前把內(nèi)容已經(jīng)放在PPT里了，對于內(nèi)容多的閱讀型PPT例如白皮書，需要把布局擺整齊。對于內(nèi)容少的，需要用圖片來撐整個畫面，有一些還需要進行尺寸遷移，比如客戶提供的是16比9， 但是我們要改成發(fā)布會的超寬屏尺寸。

第二步是看分頁。我們把內(nèi)容分好頁數(shù)之后，需要發(fā)給客戶確認，客戶可能會因為預算不夠，讓設計師刪減頁面。因為PPT是按頁數(shù)來算錢的，比方說一場發(fā)布會，1頁報價1000元，客戶預算1萬5.但是你卻分頁分出了20頁內(nèi)容，這無疑超出了客戶的預算，如果乙方這邊不肯讓步的話，甲方只能刪減內(nèi)容了。疫情大環(huán)境下，大家都得勒緊褲腰帶過日子。甲方也不好過。

第三步是溝通風格。每一個行業(yè)其實風格大體上是固定的，比方說黨政風，水墨風，地產(chǎn)有地產(chǎn)的風格，保險金融也有保險金融的風格。國內(nèi)手機大廠發(fā)布會風格，都以簡約風格為主。國內(nèi)新能源汽車發(fā)布會，一律向國外BBA，特斯拉等明星企業(yè)看齊。所以平時看發(fā)布會，就應該多看國外的東西，畢竟很多東西都是借鑒回來的。顏色方面萬變不離其宗。來來去去也就那些。我把定風格這件事情說的如此的輕松，是因為我已經(jīng)參與了大大小小數(shù)百個商業(yè)定制項目，所以很多風格已經(jīng)爛熟于心。

第四步出風格稿。風格稿一般出3頁就夠了。分好頁之后，選比較能出效果的頁面做風格稿，不要選簡單好做的，尤其是一頁只有一句話，或者只有幾個詞的，這種頁面無法作為風格稿的代表。

第五步定規(guī)范。規(guī)范主要包含以下幾種東西，布局規(guī)范、顏色規(guī)范、字體字號規(guī)范、元素運用規(guī)范、通底。

首先是布局規(guī)范，每一頁PPT都應該設定參考線，我們應當把內(nèi)容規(guī)定在參考線之內(nèi)，這樣看起來每一頁都是統(tǒng)一美觀的，這一點對于閱讀型的PPT尤為重要。布局規(guī)范類似于版式（畫冊、DM、白皮書）的設計規(guī)范。

不管是平面設計還是演示設計，我們都應該設定顏色規(guī)范。主色，次主色，輔助色，顏色一般不要超過三種，這是一句老生常談的話了。字體字號規(guī)范也是平面設計和演示設計項目都需要指定的規(guī)范。在演示項目中，需要制定大標題、副標題、內(nèi)頁標題、正文規(guī)范，還有主題字體。

元素規(guī)范是指，通篇設計稿中不斷復用的元素，比如圓圈，三角形，或者某一些光效，標題修飾等等。

通底是指每一頁PPT的背景。背景通常根據(jù)KV元素色調(diào)，或者通用元素來指定，通用背景也是為了讓整套PPT看起來更加規(guī)整。

這里我做了一個表格，寫了平面設計和演示設計的工作流程的區(qū)別。當然，平面設計下面有很多細分的領域，我這里一個表格可能沒法闡述全部， 我只挑其中一兩個范疇來講，大家可以進行知識遷移，舉一反三來對比一下平面設計和演示設計的區(qū)別。

設計中的設計

大家有沒有讀過原研哉的這本書？建議入行幾年的朋友，對設計行業(yè)有一定了解的人，可以讀一下這本非常有深度的書。這里我為什么起這個標題 - 設計中的設計。設計中的設計，是你看不見的設計心思。一場發(fā)布會，除了臺前幕后的策劃以外，其實有很多甲方的小心思在里頭。

比如，甲方為了讓觀眾能夠好理解一些復雜的概念，可能會提供一些動畫視頻讓演示設計師放在畫面里。甲方也會糾結(jié)一些頁面的字眼描述是不是夠嚴謹，會不會誤導觀眾引起爭議，他們經(jīng)常會在現(xiàn)場修改文案；甲方會針對整套PPT進行一個全局的梳理，先說哪個，后說哪幾個點，這里的環(huán)節(jié)應該說多少分鐘，那個賣點要讓誰上臺來講；現(xiàn)場的提詞器需要反復校對文稿；怎么樣控制這個節(jié)奏，才不會讓觀眾打瞌睡。在哪里穿插亮點，或者提問題，能夠和臺下一起互動？哪里需要增加動畫？一切策劃細節(jié)，都是人為的設計。不要以為設計只是呈現(xiàn)在屏幕上。設計環(huán)節(jié)，也算是設計。這些背后的東西，都是設計小心思，我把它稱為，設計中的設計。

此時，優(yōu)秀的設計師不僅善用設計工具，更擅于選擇合適的設計工具。

調(diào)研過程中通常會涉及到三張非常重要的地圖：利益相關者地圖、同理心地圖、用戶旅程地圖。

有經(jīng)驗的設計師或許都知道他們對于項目管理、用戶洞察、設計的關鍵性決策起著至關重要的作用。但大多數(shù)人都存在很多疑問：

·這三張地圖的區(qū)別是什么？

·分別該在什么階段使用？

·分別適用于哪些行業(yè)？

·有使用順序嗎？

·我該如何使用？

本期內(nèi)容fabrie就帶大家好好解答一下這些問題，并附上三張地圖的模板，感興趣的朋友可以去我們的模板市場獲取。

01

利益相關者地圖

適用行業(yè)：服務設計、產(chǎn)品設計、交互設計
適用階段：項目調(diào)研、項目分析
使用目的：梳理和標記關鍵的利益沖突者，助力項目規(guī)劃

在服務設計中，利益相關者地圖是一個比較常見的工具。

與其他設計行業(yè)不同，服務設計涉及到的是一個系統(tǒng)。其中會有大量且復雜的利益相關者，包括用戶、供應商、公司員工、第三方機構(gòu)等等。

當我們遇到一個問題，需要構(gòu)思解決辦法或是做出一個決策的時候，利益相關者地圖就可以幫助我們視覺化地將項目相關人員之間的關系呈現(xiàn)出來，以此來明確每個人的訴求、目標以及對于項目造成的影響大小。

為什么要視覺化？

一個清晰而有邏輯性的mapping可以幫助我們把腦海里的所有碎片化信息集中和串聯(lián)起來，確保信息沒有遺漏。當相關角色的需求和痛點都被充分展示，更能幫助我們發(fā)現(xiàn)潛在的人物關系以及不易被察覺的風險和機會點。

當然，這可以是我們制作任何mapping的共同原因和好處。

一般來說，在項目初期階段，我們就需要進行利益相關者的分析，有兩點好處：

一是有助于我們在調(diào)研階段，就更全面地掌握項目的內(nèi)外環(huán)境，了解到不同利益相關者的關注點、體驗和期望，這對整個設計方向有決定性作用。

二是如果項目周期較長，很多相關者的信息會發(fā)生改變，在項目推進過程中需要不斷更新和調(diào)整。如果中途再去分析，會讓我們的判斷產(chǎn)生偏差。

此外，我們使用利益相關者地圖，其實更多是為了解決具體的問題。所以我們在使用時，應該是帶著問題找答案。

比如：你發(fā)現(xiàn)投資人提出的需求與用戶的利益相沖突時，就可以通過利益相關者地圖來分析他們的權(quán)益，推理出對應決策會帶來的影響或是回報，從而幫助你把控風險，做出更好的決定。

這其實也是為什么要在fabrie中制作利益相關者地圖的主要原因。它為設計師提供了一個便于上手和制作的模板，但也可以隨時根據(jù)自己的需求自由調(diào)整，成為一個實現(xiàn)高效的捷徑。

制作利益相關者地圖大致分三步：

1. 頭腦風暴

首先頭腦風暴出所有跟項目相關的個人、群體、組織公司，可以有意識地用不同顏色的便利貼區(qū)分不同的群體。

建議將文檔一鍵分享給已知的stakeholder，邀請他們加入頭腦風暴，不同的思考維度會幫助你分析出更多潛在相關的身份。

2. 分類分級

對所有識別出來的相關者進行分類，根據(jù)對項目的影響程度大致分為核心團隊、強相關部門、弱相關部門三個等級，填入地圖模板中。

不同的分類標準可以根據(jù)自己實際需要研究的問題自由調(diào)整，靈活運用。

3. 建立聯(lián)系

利益相關者之間往往會存在相應的聯(lián)系，可以用線條將他們關聯(lián)起來，并描述他們的關系。

設計項目中會不斷產(chǎn)生問題，所以將利益相關者地圖放在項目文檔中，讓每一個團隊成員都能隨時看到和參考，成為設計師溝通項目時的重要幫手，也是它的使命之一。

02

評審中組織

適用行業(yè)：服務設計、產(chǎn)品設計、交互設計、工業(yè)設計
適用階段：用戶研究
使用目的：深入特定角色的特定場景，理解其行為和需求背后的真正動機

利益相關者地圖涉及到項目中的每一個群體，同理心地圖研究的則是用戶，或者說是一組用戶群的想法與需求。

同理心地圖≠用戶畫像，而是制作用戶畫像的必要準備。

因此我們會在進行某項服務或產(chǎn)品設計之前，就開始使用同理心地圖。它的兩個主要任務是：

1. 共情用戶的所思所想，提取真正的用戶需求

2. 建立團隊以及各個部門的共識，確保對用戶需求的理解和設計方向達成一致。

很大程度上，同理心地圖的制作離不開協(xié)作。它需要各方共同努力，根據(jù)各自對用戶的觀察，以及研究收集的數(shù)據(jù)，共享對于目標用戶的理解，一起挖掘用戶的行為、動機和關注點。

fabrie的同理心地圖模板，為團隊節(jié)省了很多前期的繪制準備，并且讓所有人實時在線協(xié)作。

在協(xié)作之前，建議各方成員將自己對研究用戶的已有調(diào)研資料或者訪談記錄放在模板旁邊。大家可以一起花十分鐘的時間互通信息，再開始一起創(chuàng)建同理心地圖：

1. 確定目標

確定我們在和誰共情？他們面臨什么處境？需要做出什么決定？

2. 共情用戶

潛入目標用戶的大腦，觀察和思考他們的所看、所說、所做、所聞、所想（包括痛點和收獲）。

3. 分析回顧

整理mapping，思考我們還缺哪方面的調(diào)研，我們可以做什么來改變他們的想法和感受。

同理心地圖最后可視化地為我們解釋了用戶行為背后的動機，同時幫助我們?nèi)ジ兄胶芏嗖蝗菀妆话l(fā)現(xiàn)的深層需求。

這既能幫助設計師做出可提升用戶體驗的解決方案，也會在某種程度上引導我們走向更有意義的創(chuàng)新。

03

用戶旅程地圖

適用行業(yè)：工業(yè)設計、產(chǎn)品設計、交互設計
適用階段：對于已有產(chǎn)品的用戶體驗研究或想要了解預期產(chǎn)品的用戶體驗過程
使用目的：描繪特定用戶與產(chǎn)品或服務之間的交互過程，找出用戶痛點和產(chǎn)品機會點

用戶旅程地圖的核心更偏向于研究人與產(chǎn)品的交互過程，最終優(yōu)化用戶體驗。相對來說，它的必要性和通用性會更高一些。

我們既可以研究目標用戶與已有產(chǎn)品的交互過程，發(fā)現(xiàn)用戶痛點以此來優(yōu)化產(chǎn)品；也可以用來假設預期產(chǎn)品與用戶的交互過程，驗證自己想要研究的問題，找出產(chǎn)品機會點。

用戶旅程地圖通過可視化的方式整理用戶和產(chǎn)品體驗的每個階段，一般需要包括用戶在產(chǎn)品體驗階段的目標、行為、觸點、想法、情緒、痛點和機會點。

相對來說，用戶旅程地圖需要考慮的細節(jié)和維度比較多，需要專門繪制，比較麻煩。

fabrie的模板直接給予設計師一個可編輯的框架與思路的引導，讓設計師更聚焦于思維發(fā)散本身，而不用去關注排版等細枝末節(jié)的問題。

當然，除了常規(guī)的視角，還可以結(jié)合自己業(yè)務需求，插入或調(diào)整更多相關度高的維度。這也是fabrie模板的靈活性，它引導你思考，但不禁錮你的發(fā)散。

然后我們可以按四步走：

1. 確定目標人群和旅程目標

不同用戶經(jīng)歷的旅程可能天差地別，因此確定好目標用戶以及這個旅程中你想研究的主要問題尤其重要。

2. 描述具體使用步驟

標出在對應的語境下，每個步驟意味著什么，也就是開始研究用戶行為。根據(jù)模板上方的提示，修改成對應我們自己的用戶旅程階段。

3. 完成每個步驟的多維度描述

在完成用戶旅程階段后，探索每個階段用戶使用產(chǎn)品時的體驗感受，思考對應的目標、行為、觸點、想法、情緒、痛點和機會點。

4. 提煉關鍵洞察

根據(jù)整個梳理，提煉出關鍵洞察，也就是我們做這個用戶旅程地圖的最終目的。

寫在最后

設計師在提升設計能力的同時，需要慢慢開始主導設計項目。這幾個地圖都是強有力的輔助工具，能幫助我們?nèi)グl(fā)現(xiàn)問題和解決問題。

fabrie模板的意義，就是希望大家不被形式所困擾，而是更自由更聚焦地去思考。

在不斷使用這些設計工具的過程中，我們會形成更科學完善的設計思維，從而做出更好的設計決策，提升設計格局。

fabrie的模板市場，提供了數(shù)十款設計相關的專業(yè)模板。如果你是一個設計新手，它可以幫你更快地上手操作；如果你是一個有經(jīng)驗的設計師，模板則可以幫助你提高效率，聚焦于思考本身，不被格式等問題困擾。

原文地址：站酷

藍藍設計建立了UI設計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設計，如果有興趣的話，可以進入一起成長學習，請加藍小助，微信號:ben_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯(lián)系01063334945。

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍藍設計( sillybuy.com )是一家專注而深入的界面設計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數(shù)據(jù)可視化設計公司、UI交互設計公司、高端網(wǎng)站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司

現(xiàn)在很多公司面試UI都會面試交互能力，問你設計方案的推導、怎么量化、怎么分析、怎么做深度的設計思考等等，所以呢大部分設計師在本身視覺能力沒那么強的情況下，無奈在作品包裝中加入了推導分析的文字部分，結(jié)果，問題又來了，這些分析過程和推導其實是經(jīng)不起推敲的，因為往往在實際工作中，大部分設計師沒有真的運用過這些方法、數(shù)據(jù)，靠的是參考市面上的作品集從而包裝出來，也就經(jīng)不起面試官的深問。最后作品集也成為了四不像的結(jié)果。

那么如果我們的設計基本功沒那么強，但又想展示自己的思維能力該怎么做呢？我在這里并不是教大家怎么去編和套設計流程的框架和理論，而是希望大家能明白，如果要放你的思維過程，應該怎么正確的去放，如果真的沒做過，我建議不要去硬套，很容易漏洞百出。

設計師的定位和價值

一個項目的推導過程首先要明確，你在項目中扮演的是什么角色，你在整個項目中的價值是什么，是獨立負責？還是某一個環(huán)節(jié)的執(zhí)行者？我相信很多同學都想把自己包裝成一個獨立負責人，恨不得整個產(chǎn)品從立項到調(diào)研到分析到執(zhí)行都一個人包攬，但你越這樣去包裝，作品集內(nèi)容就越零散。

作品集主要展示的是你個人的能力，而不是讓你去描述和介紹你的產(chǎn)品。很多同學都變成了后者，比如先描述項目背景、產(chǎn)品的用戶群體是什么、每個功能模塊分別是什么功能…..這樣的方式去包裝作品真的味同嚼蠟，沒體現(xiàn)能力不說，還很枯燥。

講故事

其實我們可以用講故事的框架，來整理項目流程以及展示你在項目中的價值。在上學的時候老師會跟我們說，要講清楚一件事，需要分別理清楚三個階段，分別是：起因、經(jīng)過、結(jié)果。所以我們現(xiàn)在要講一件什么事呢？我們要講的是，你是如何通過設計手段幫助產(chǎn)品/用戶解決問題的。

那么我們就可以用起因、經(jīng)過、結(jié)果三個階段來闡述我們是怎么解決問題的，把這個邏輯給梳理出來。

1.起因

起因包含了

1.有哪些問題/機會

2.你是怎么發(fā)現(xiàn)問題的（為什么要做這個項目）

3.導致問題出現(xiàn)的原因是什么

比如我舉個例子，我發(fā)現(xiàn)我家?guī)鈮﹂_始掉粉脫落，甚至時不時的浴室柜下方會流出一些水，所以我懷疑是不是哪里漏水了，在這里我用的是觀察法，用觀察法很直觀的看到了問題。接下來我要去找到問題的原因，到底是什么原因?qū)е铝送鈮Φ舴勖撀湟约皾B水的問題。于是我先自己做了一個假設，是不是埋在地下的水管破了？因為之前有用過腐蝕性很強的通下水道的藥劑，但是這個原因被我排除了，因為如果水管漏水那么就會一直漏，而不是間歇性的出水。那還有可能是什么原因呢？浴室柜中下水管堵塞導致水流到了沒做美縫的縫隙中嗎？還是樓上漏水滲下來了？

最后經(jīng)過多個原因的排除，問題找到了，是由于樓上確實漏水以及淋浴間下水不暢長期積水導致水從下水管口子邊上的縫隙流了過去，兩個原因。

所以我們再回過頭來看，作品包裝中起因應該說明哪些事項：

1.1和2可以合并在一起寫，比如通過xx方法我們找到了目前產(chǎn)品中存在的問題，也可以寫我們找到了xxx問題，是由于我們用了xxx方法。

2.你是怎么發(fā)現(xiàn)你產(chǎn)品中存在的問題的？是自我經(jīng)驗的觀察判斷？還是通過數(shù)據(jù)分析找到的某個現(xiàn)象（比如一個板塊的點擊率在逐月下降）還是通過對用戶訪談或者體驗地圖找到了某些體驗問題？你得采用一些方法，越客觀越好，比如很多同學在找問題的時候總會用一些比較寬泛的修辭來描述：首頁結(jié)構(gòu)不合理、層次不清晰、體驗較差，所以看到這樣的描述，我就想問，那么具體不合理、不清晰、體驗較差的點在哪里呢？為什么你覺得不合理、不清晰、體驗較差？是你的主觀感受？還是數(shù)據(jù)表現(xiàn)？還是客戶的體驗？你得證明出來。所以問題的來源是很多的，有的是你專業(yè)經(jīng)驗的判斷，有的是用戶的反饋，有的是數(shù)據(jù)的表現(xiàn)，都不一樣。

3.導致問題出現(xiàn)的原因是什么？比如很多同學做改版，改版原因他們就寫：結(jié)構(gòu)不合理、層次不清晰、體驗較差…..這個是不對的，改版原因應該是，由什么具體事件，導致的結(jié)構(gòu)不合理、層次不清晰、體驗較差，比如通過對用戶在支付任務流程中的數(shù)據(jù)表現(xiàn)，我發(fā)現(xiàn)經(jīng)常有用戶在支付流程中跳失，導致轉(zhuǎn)化率下降，因此我們調(diào)研訪談了10個在支付流程中跳失的用戶，其中8個用戶在準備支付的時候找不到編輯收貨地址的功能，于是他們放棄了這次支付，這個問題凸顯的就是核心功能沒有滿足用戶預期，有效性差。至于樣本量的問題我就不展開了。

很多同學在第一階段會放很多產(chǎn)品的一些市場研究、定位，這些其實一點用也沒有，雷聲大雨點小，一開始切入點很大，結(jié)果這些點對描述你的設計能力沒有任何幫助，并且在后面的設計方案和策略中也完全不能體現(xiàn)出來有什么關聯(lián)。不如聚焦一點，針對問題直接進行展開。

小結(jié)一下，起因包含了3個問題，這三個問題可以通過幾種方法來解答：

1.你是怎么發(fā)現(xiàn)問題的（經(jīng)驗判斷法、渠道反饋法、用戶調(diào)研法、數(shù)據(jù)分析法、可用性測試…..）

2.有哪些問題（卡片分類法、kano模型、價值分析法……）

3.導致問題出現(xiàn)的原因是什么（經(jīng)驗判斷法、用戶訪談、觀察推測…...）

2.經(jīng)過

這個階段就是用來體現(xiàn)你是怎么解決問題的，這里我們就要來講到解決問題的策略和邏輯了。諸葛亮草船借箭大家都聽說過吧，這個事件的問題在于缺箭，為什么會缺箭呢？原因是沒有足夠的時間和材料來制作那么多箭矢，要解決這個問題怎么辦呢？招募更多的士兵？收集更多的材料？采用緩和之計爭取時間？顯然這些策略是無效的，那怎么辦？內(nèi)部不行，只能靠外部來解決，于是就有了草船借箭。

再舉個例子，這兩天有點頭痛（問題），醫(yī)生說頭痛可能有多種因素造成的，例如睡眠不好、頸椎有問題、受涼、壓力大等等（原因），所以為了解決這個問題，我就可以有幾個不同的策略，如果是睡眠導致的，那么我就通過改善睡眠質(zhì)量來解決，如果是頸椎導致的，那么我可以去找中醫(yī)做一下推拿，這些都是解決問題的策略。

所以在經(jīng)過階段你必須講明白你是怎么選擇一種合適的策略的。舉個例子，比如有一個新的電商產(chǎn)品上線了，并合作了一些大品牌，但是我們發(fā)現(xiàn)這個品牌的銷量還不如一些不知名的品牌來的高（問題），于是我們通過第一步的研究起因，發(fā)現(xiàn)用戶之所以不買單，是因為他們覺得這些大品牌在你們平臺賣的是不是假貨（原因）。那么為了解決這個問題，我們就要研究一下具體的策略，怎么樣能夠讓用戶對該品牌產(chǎn)生信賴，而我們又如何才能讓用戶知道這個品牌是正品呢？

策略1:透出品牌資質(zhì)和曝光度：告知用戶我們有品牌授權(quán)的資質(zhì)

策略2:給予用戶更多保障：給用戶產(chǎn)品質(zhì)量的售后保障和檢測權(quán)利

策略3:讓用戶提前進行體驗：可以給部分用戶試用

經(jīng)過分析以及成本權(quán)衡，策略2和3實施起來較為困難，成本高，于是策略1是一個比較好的選擇。那么具體的方案就要到第三階段來呈現(xiàn)了。

再舉個例子，抖音大家都有用過吧，在之前的老本版中，有用戶想查看當前視頻的上下集，非常不方便（問題），因為需要點擊或者側(cè)滑進入作者首頁，然后經(jīng)過滑動才能找到當前視頻的位置（原因）。所以為了解決這個問題，如果你是抖音的設計師，你會有哪些策略呢？

策略1.提高用戶查看視頻的效率：直接給用戶定位到當前視頻

策略2.提高作者制作系列視頻的便捷性：可以讓用戶不用進入主頁也能看到上下集

所以，小結(jié)一下，“經(jīng)過”這個階段中找策略我們依然也可以用到一些方法：上癮模型、aarrr模型…..但是這些模型我是不建議大家在作品集里寫的，太形式化了，在大廠的設計流程中，設計策略基本上是通過產(chǎn)品和設計的經(jīng)驗判斷給出的，不會真的說是靠這個模型工具而產(chǎn)生輸出的策略，比如像我們說“給用戶一種溫暖的感覺”，這是一個設計目標也可以是一個策略，但它很難說是由哪個方法論或者工具提煉出來的。

3.結(jié)果

結(jié)果，也就是我們通過設計目標和策略，選擇具體的設計方案。在作品集中，設計方案給面試官展示，這其實沒那么重要。面試官想看的是什么呢？是你雖然最后給出了a方案，但是在設計過程中，有沒有b方案和c方案，最后讓你選擇a方案的理由是什么，你是怎么思考的，也就是方案的由來。

這個才是我們展示能力的最好表現(xiàn)。以上面的抖音為例，通過策略1，用戶點擊主頁可以直接定位到當前視頻的區(qū)域以便用戶查看上下集，如果直接根據(jù)這個策略設計方案是很簡單和直觀的，只要定好位，并給用戶一個當前正在播放哪個視頻的狀態(tài)，做個標簽即可。

但是最終方案并不是這樣的，而是當用戶側(cè)滑或者點擊頭像后先定位到的是用戶主頁的頭部區(qū)域，而在右下方給了一個“剛剛看過”的按鈕，點擊按鈕才會定位到剛剛正在看的視頻。

這兩個方案顯然是有區(qū)別的，為什么不直接定位，而要多給出一個“按鈕”呢？原因就在于抖音更希望觀看者和作者能夠更多的產(chǎn)生互動和鏈接，提高作者的關注率，讓觀看者先看到作者的主頁，再去查看剛才的視頻，因為只有你關注了作者，作者才有更多動力去制作視頻，同時關注作者也會為你個人的偏好附上一個大的權(quán)重，以便于做更精準的推薦。

這是對于兩種方案的解讀，所以方案a和方案b，為什么選b不選a，這就是理由。當你的方案呈現(xiàn)在作品集中，面試官就會這么問。

通常在做方案的時候，大家也總會用到競品分析，競品分析是一把雙刃劍，它可以讓你的方案至少不會出大錯，也可以讓你的方案沒有特點，所以這也很考驗設計師是怎么將產(chǎn)品業(yè)務的定位、用戶屬性、業(yè)務目標的差異化結(jié)合到方案中去的。競品分析大家也很喜歡單獨拿出一個板塊放在作品集里，咱先不論有沒有真實操作過，放在作品集里的內(nèi)容，一定要有目的性，大家仔細品一下這句話。你想要通過放這塊內(nèi)容告訴面試官什么？是你拿了一堆競品做了比較和描述，還是說你能夠結(jié)合自己業(yè)務和用戶的特性，找到和其他競品設計差異化的點，最后應用或指導到你的設計方案中去？

結(jié)果階段除了方案的探索、權(quán)衡外，還需要進行驗證和復盤。雖然咱們花了很大的力氣，從發(fā)現(xiàn)問題到找到原因，再到定義目標和策略，最后選擇方案，但并不意味著最后的結(jié)果是好的，因為我們不知道我們的方案到底有沒有解決最一開始的問題，你原來頭痛，最后選擇了吃藥，結(jié)果吃了一個月，還是沒好，那就說明：1.問題原因不對 2.策略有問題 3.藥吃錯了。所以如果你要以結(jié)果為導向，那么最后的驗證和復盤不可缺少。那有同學說，我們公司沒有數(shù)據(jù)，沒有用戶，那我要怎么驗證呢？那我勸你好好跟產(chǎn)品或者老板去談一談，雖然你想操這個心，但是老板都不在意那也沒有辦法，但是你在面試的時候需要表達出這樣的思維。

總結(jié)一下

再說一下，分析推理部分，不是UI/UX作品集必備，你想做純視覺包裝作品集也可以，但我們要清楚，你應聘的崗位要求是什么，而你的作品集和崗位要求是否能對應起來?，F(xiàn)在的一些公司要求都很高，UI和UX都成為了標配要求，所以我們盡可能要把這兩塊都在作品集里展示出來。有人說，我實在沒做過這些東西，讓我編也編不出來怎么辦？那就從今天起試著開始主動找找產(chǎn)品存在什么問題，然后去解決它，試著走一遍：起因、經(jīng)過、結(jié)果三個階段，我相信你一定會有收獲。

原文地址：站酷

作者：應駿

藍藍設計建立了UI設計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設計，如果有興趣的話，可以進入一起成長學習，請加藍小助，微信號:ben_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯(lián)系01063334945。

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍藍設計( sillybuy.com )是一家專注而深入的界面設計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數(shù)據(jù)可視化設計公司、UI交互設計公司、高端網(wǎng)站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司

如果需要做動畫，那不妨使用AE來制作毛玻璃咯。

本次除了圖文教程之外，還有視頻教程哦

1080P高清帶字幕版視頻教程觀看地址：

https://www.bilibili.com/video/BV1Ke4y1v76P/?spm_id_from=333.999.0.0

首先繪制好基本圖形，如下圖：

這里的模糊度沒有說一定要設置多少哈，大家根據(jù)實際情況來調(diào)整，教程里調(diào)的是 100，感覺效果是我想要的了。

繼續(xù)給調(diào)整圖層添加分形雜色，增加畫面顆粒感，變換里的縮放屬性調(diào)到 1 ，不透明度調(diào)到10%(這里大家可以酌情調(diào)節(jié)哈，數(shù)值越大，效果越明顯)，混合模式為 疊加。

使用卡片給調(diào)整圖層進行軌道遮罩，這樣模糊的背景就只顯示在卡片的范圍內(nèi)了。

為了增加卡片的立體感，給卡片圖層復制一層，去掉填充屬性，添加漸變描邊，描邊顏色根據(jù)背景色來調(diào)節(jié)，因為描邊受到環(huán)境顏色的影響。

漸變色的不透明度大概在20%-40%左右比較合適。

新建攝像機，給卡片以及卡片上的元素開啟3D圖層，把這些元素都綁定父子級到空對象，方便整體控制做動畫。

然后給空對象做XYZ三個軸向的旋轉(zhuǎn)，以及Y軸的位移動畫。

因為是要做循環(huán)動畫，所有最后一組關鍵幀可以直接復制粘貼開始的關鍵幀，即可形成循環(huán)。

最終效果如下圖：

好了，這個簡單的毛玻璃動效教程就到這里咯，如果對你有幫助，請點贊支持一波，咱們下次再見~~~

原文地址：站酷

作者：墨染ART

藍藍設計建立了UI設計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設計，如果有興趣的話，可以進入一起成長學習，請加藍小助，微信號:ben_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯(lián)系01063334945。

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍藍設計( sillybuy.com )是一家專注而深入的界面設計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數(shù)據(jù)可視化設計公司、UI交互設計公司、高端網(wǎng)站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司

原文地址：站酷

作者：卡洛設計鋪

藍藍設計建立了UI設計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設計，如果有興趣的話，可以進入一起成長學習，請加藍小助，微信號:ben_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯(lián)系01063334945。

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍藍設計( sillybuy.com )是一家專注而深入的界面設計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數(shù)據(jù)可視化設計公司、UI交互設計公司、高端網(wǎng)站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司

五彩斑斕的印度設計

每幅都是配色模板

眾所周知，印度是一個五彩斑斕的國家，在印度無論是哪一個角落都隨處可見各種色彩，人們身上的服裝、不同的廟宇、裝飾物，甚至是運貨的大卡車也是五顏六色相互交織。雖然人們每每是將眾多顏色組合在一起，可是看起來卻不會讓人覺得雜亂，這就是印度色彩的奇妙之處。

Diwali Playing Cards Gift Box

印度色彩為何強烈？

不全是宗教因素！

色彩與人類的生活息息相關，不同的色彩選擇主要取決于地理環(huán)境和宗教文化的影響，而最初色彩的選擇似乎受到自然地理環(huán)境的影響更大。20世紀70年代，法國色彩學家讓·菲利浦·郎科羅（J.P.Lenclos）認為不同的地理環(huán)境直接影響到人類、習俗、文化等方面的形成和發(fā)展，這些因素又共同導致了不同的色彩表現(xiàn)。

一般認為，地理位置位于低緯度的熱帶地區(qū)的民族，喜好顏色鮮艷、偏亮且純度高的顏色。因為熱帶地區(qū)紫外線強烈，亮色衣服則能起到一定的防曬作用。而印度大部分位于熱帶地區(qū)，氣候環(huán)境比較炎熱干旱。因此，印度的多彩也可以理解了。

印度紗麗裝置藝術展

不僅是服飾，連建筑也五彩斑斕。比如拉賈斯坦幾乎是印度旅游的名片，這個國王之地擁有豐富的歷史文化遺產(chǎn)和人文景觀，而四座色彩之城——杰伊瑟爾梅爾、焦代布爾、烏代布爾、齋普爾——則是拉賈斯坦最有特色、最富魅力、最容易讓人流連忘返的城池。

黃金之城——杰伊瑟爾梅爾

藍色之城——焦特布爾

白色之城——烏代布爾

粉色之城——齋普爾

五種印度色彩的含義

如何在設計中呈現(xiàn)

對印度人來說，在宗教和文化中，顏色承擔著很重要的角色，蘊含著非常深刻的寓意，有著超越裝飾價值的意義。印度的藝術家以神袛及其著裝的顏色來表征其品性。顏色的合理使用可以營造一種氛圍，置人于一種歡愉的心境。印度的五種代表顏色有什么寓意，又如何在設計中體現(xiàn)呢？往下看你就知道！

藍色：勇敢、剛毅、堅定

印度人認為，造物主創(chuàng)造自然的時候用得最多的就是藍色，天空、大海、河流湖泊，因此藍色代表著勇敢，剛毅，堅定。藍色也是能應對復雜事件、冷靜的神袛象征顏色，羅摩神（Lord Rama）和克利須那神（Krishna）畢生致力于保護人類和打擊邪惡，正因他們的勇敢精神令人們欽佩不已，因此藍色也成為象征他們的代表顏色，也代表著人們對兩位神明的尊敬之意。

Lord Ram Wallpaper

01

印度卡車藝術日歷 2023

Yukta Gupta（印度）

印度的卡車是集有趣的標語、五彩斑斕的顏色和無數(shù)令人眼花繚亂的裝飾品于一身的迷幻展示。在印度，卡車融合了藝術和商業(yè)，卡車司機在車上花費的時間和精力，是他們把卡車當作自己的家和禮拜場所的原因，他們把卡車裝飾得像個新婚的印度新娘。

因此，設計師Yukta Gupta決定將印度傳統(tǒng)圖騰與卡車結(jié)合成一個年日歷，主色調(diào)為藍色，也是表達了對卡車司機和印度傳統(tǒng)習俗的敬仰，寄托了印度人民美好祝愿。

02

Spotify Mural Design

Mechi Co. Design（印度）

壁畫是為辦公室的安靜空間或者重點區(qū)域定制設計的作品——工作人員如果需要一些“獨處空間”，他們可以專注在這個區(qū)域。這個項目是印度設計工作室Mechi Co. Design與Spotify合作，為印度孟買的Spotify辦公室繪制壁畫。

壁畫設計概念是“包裹在音樂中”，工作室認為通過音樂進入思想，即是進入我們自己的焦點空間。 壁畫主要視覺元素是一個人進入音樂世界的剪影。

綠色：

和平和歡愉

綠色代表著和平和歡愉，它可以使人內(nèi)心平靜。這種顏色乍一看起來可能是冷色調(diào)，但卻又讓人感覺舒服，同時它也是自然的象征。對于印度人來說，首飾是日常生活中不可或缺的裝飾品，印度婦女們特別喜歡用綠色，紅色，珊瑚色這些艷麗的色彩做飾品。

abstract art tri color of India flag

個人3D作品

Khyati Trehan（印度）

網(wǎng)站：https://khyatitrehan.com/

在BranD NO.62《畢業(yè)之后：設計師成長計劃》中，我們很榮幸采訪到這位來自印度的女性設計師兼3D視覺藝術家，Khyati Trehan認為印度的獨特在于其多樣性，因為每天都會遇到與她有著完全不同人生的人，才會進而促使她在設計中終生踐行同理心。她也會經(jīng)常在ins上把生活中的思考創(chuàng)作出來。

Khyati的作品力圖使無形的概念變得具體，注重質(zhì)感的呈現(xiàn)，富有感情又不失俏皮，經(jīng)常在事物的邊緣探索視覺的可能性。

PAPER FLOWERS

PALMWOOD: CO-CREATE & CONNECT

TRASH

3D視覺藝術作品：Ecotherapy

02

Forestscaping Identity

Pratyush Gupta（印度）

網(wǎng)站：https://swarpeti.com/

植樹造林有助于將貧瘠的土地開發(fā)成美麗的自然景觀，有助于實現(xiàn)生態(tài)保護目標。土地被恢復到自然狀態(tài)，便可以作為一個原始森林，一個鳥類棲息地，一個開花的奇跡，一個冥想的荒野或一個私人自然保護區(qū)。

Forestscaping視覺識別的核心是一個自信和優(yōu)雅的葉子標識。一片小小的葉子從logo的G中發(fā)芽——微妙地提到了森林和葉子的最初的聯(lián)系。靈感來自印度部落藝術，一個動態(tài)的插圖語言融合了森林，動物和人，創(chuàng)造出各種各樣的森林景觀。

黃色：

知識、冥想、秩序

黃色是知識和學習的標志。它象征著冥想、能力和心智的發(fā)展。印度有不少人信奉毗濕奴，他是天的“維護”之神。依照印度教說法，毗濕奴（Vi??u）以迷惑羅剎等惡鬼神，維護世界的秩序。而毗濕奴身穿的則是黃衣，象征著他為知識的化身。

art vi??u via.Marina Diulina

01

Fresty

Rhea Jain（印度）

印度平面設計師Rhea Jain為飲料品牌Fresty創(chuàng)造了概念性包裝設計，這是一種將傳統(tǒng)飲品變?yōu)樗谔嵘窨谖镀姆椒ǎ荚诘钟谉岬南募?。從?jīng)典生姜到濃郁芒果的口味，這五款蘇打汽水飲料所帶來的驚喜是無與倫比的。然而，雖然飲料本身的口味呈現(xiàn)出相當奇妙的感覺，但包裝風格卻是偏傳統(tǒng)和懷舊。包裝正面的幾何元素設計簡約而醒目，這樣盡管整體使用了柔和色調(diào)，并不會因此而削弱產(chǎn)品口味的興奮感。

02

Alikemom Brochure Design

Parth Gupta（印度）

網(wǎng)站：https://builtbydezine.github.io/portfolio/

Alikemom是印度班加羅爾的一家創(chuàng)新食品公司，專注于向遠離家鄉(xiāng)的年輕人提供有媽媽味道的食物。Alikemom需要一本宣傳冊來宣傳他們品牌和提供的服務，同時強調(diào)其背后的價值。設計保持簡單而有吸引力，注重品牌價值，使用亮眼的色彩和醒目的字體。

白色：

純粹、睿智

作為七色的混合——白色，它不同程度地象征了每一種顏色的品性。白色則是純粹、整潔、睿智的象征，印度亦隨處可見粉刷白色外墻的廟宇。

01

Pune Design Festival Rebrand

Atharv Kotkar（印度）

來自印度的設計師Atharv Kotkar將匯集了一群塑造全球設計生態(tài)系統(tǒng)的優(yōu)秀設計師的普納設計節(jié)作為案例研究分析。這是每個人都不可錯過的設計盛典。設計師用黑白色調(diào)作為主視覺，混合了不同領域和專業(yè)的邊界，在此尋找超越自己的機會。

02

二次創(chuàng)作知名品牌

Kunel Gaur（印度）

Kunel Gaur是一位來自印度的藝術家，同時他也是Animal advertising agency的創(chuàng)始人，他決定將一些知名的全球品牌，轉(zhuǎn)變?yōu)橐环N看起來原始且未經(jīng)修飾的樣子。Kunel Gaur試圖通過這樣的嘗試，來傳達這種極簡主義的品牌傳播方式。

當中包括的都是我們熟悉的品牌：可樂和KFC的包裝設計由鮮艷的紅色換成黑白設計，薯片、巧克力和雪糕等令人垂涎的零食也由原本吸引人的顏色轉(zhuǎn)為黑白設計。跟我們?nèi)粘Ｒ姷降拇笙鄰酵?，同時色調(diào)也調(diào)配得十分好，宛然一件藝術品。

紅色：

生命、活力、熱情

藏紅色代表著生命、活力、朝氣和熱情，它是火的象征，由于不純潔之物一般以火焚燒，所以這種顏色同樣亦是純潔的標志，也象征著宗教上的節(jié)制。它是圣者和退隱的苦行者的顏色，紅色表達了對光明的祈求。

REALITY BEHIND INCREDIBILITY

01

KICKIN

Yash Tambe（印度）

INS@tambe.psd

Yash Tambe是一名來自印度的建筑系學生，但他對平面設計也十分有興趣，KICKIN是他的個人項目，兩年前深受希臘雕像和雕塑的影響，他設計了這組海報。Yash Tambe故意破壞畫面平衡感，制造出緊張感，還融合文字與視覺圖像進行版式設計，通過撞色和文字排版，展現(xiàn)平面的動感。

02

Gift Box of Indian Spices

Meno Melo Studio（印度）

盒子的印花圖案來自古印度藝術，如Gond、Pichwai和微型印刷藝術。這些藝術形式在平面的設計中具有平衡感和對稱感。它還以裝飾形式描繪了自然元素，紅色等亮眼色彩的印度藝術圖案總是有節(jié)日的氛圍。

印度人愛好和平、熱情善良，他們喜歡將所有美好的東西都與人分享，他們用豐富的色彩贈予對方祝福，希望每個人在印度設計師的作品里能看到不一樣的印度。

編輯 | 馬君琳   

圖片 | 源自設計師網(wǎng)站及網(wǎng)絡

原文地址：站酷

作者：BranD雜志

藍藍設計建立了UI設計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設計，如果有興趣的話，可以進入一起成長學習，請加藍小助，微信號:ben_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯(lián)系01063334945。

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍藍設計( sillybuy.com )是一家專注而深入的界面設計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數(shù)據(jù)可視化設計公司、UI交互設計公司、高端網(wǎng)站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司

交互設計的驚喜，是什么？

之前的文章，有簡單定義過交互設計的“驚喜”，即為：超出用戶預期，并讓用戶開心。

具體而言有兩類，分別是：小驚喜、大驚喜。

1 小驚喜

所謂小驚喜，是指一些頗具趣味性或人文屬性的交互設計小細節(jié)。

先說趣味性。常見的有兩類，第一類是比較好玩的動效，第二類是一些小功能。第二類有時也會包含第一類。

動效這塊，大家比較熟悉的，有 iPhone 上刪除應用前圖標的抖動，仿佛是嚇的發(fā)抖，也可能是在搖頭求饒；還有移動端登錄 B 站、輸入密碼時，動畫人物的捂眼捂臉動作。

(B 站登錄頁面)

小功能這塊，也可以分成兩類。一類是隱藏的小功能，一類是有趣的小功能。

很多隱藏功能，頭幾次用的時候，多少會有一些驚喜之感。

比如在訂閱號消息列表頁，某個公眾號你已經(jīng)幾個月沒看過，對它失去了興趣和信任。這時，嘗試長按這個公眾號的頭像或名稱，會呼出一個包含“刪除消息”和“取關”功能的彈窗。

(訂閱號消息列表)

還有些隱藏功能，既能讓用戶覺得驚喜和方便，又能引發(fā)用戶思考。這種思考，可能會讓用戶感嘆設計之妙，也可能也會給用戶一種猜對謎語的欣喜之感。

比如用墨刀的時候，嘗試按數(shù)字鍵 1，會呼出“內(nèi)置組件”這個使用頻率非常高的功能，會讓人覺得墨刀很聰明。

如果再仔細看一下，會發(fā)現(xiàn)，“內(nèi)置組件”的縮略圖標，和其他 4 個諸如“我的組件”、“圖標”等功能的縮略圖標，并成一列。這 5 個縮略圖標的排列順序（上到下），和它們快捷鍵（"、"鍵和數(shù)字鍵1、2、3、4）的排列順序（左到右），是完全一致的。不得不說，這是一個簡單又巧妙的設計。

再比如朋友圈里，某個不熟的好友每天都發(fā)集贊的小廣告，搞的我們不勝其煩。長按其頭像，會呼出設置權(quán)限（屏蔽等）的功能。

有意思的是，長按好友名字，則不會呼出這個功能。要知道點擊頭像或名字是都能進入好友主頁的；另外剛才那個例子，長按公眾號頭像或名字，也都能呼出取關的彈窗。

個人的理解，生活中，我們用力長按一個人，通常是表達強烈不滿，比如打架時。比起長按名字，長按頭像更像是長按真人，所以也更能表達我們的不滿。

說完隱藏的小功能，再說下有趣的小功能。比如微信聊天里的扔骰子、石頭剪刀布，微信給朋友發(fā)生日快樂后漫天飄落的蛋糕，拍照軟件里的貼紙，等等。

最后說下帶有人文屬性的交互設計小細節(jié)。常見的有如下類型：幫助弱勢、關照情緒、表達情感、保護隱私。

幫助弱勢這塊，比如 iPhone 的輔助功能，里面有針對視力障礙的放大鏡功能、有針對不識字群體的旁白功能。

關照情緒這塊，很重要的一點，就是避免引起用戶的負面情緒。比如微信的刪好友是單方面刪除，被刪時我們很難察覺到，而且微信也不會通知我們。個人覺得，微信之所以不通知我們，其中一點，就是不給我們添堵。類似的還有，微信消息沒有“已讀”功能，這就大大減輕了接收者的回復壓力。

表達情感這塊，比較為人所知的例子，5 月 20 號這天，微信紅包的限額，從 200 元升到了 520 元。還有一個例子，在微信聊天里發(fā)一個“ohh”，長按并點翻譯，結(jié)果也是一個驚喜。

保護隱私這塊，比如借助 iPhone 的“引導式訪問”功能，可以讓小朋友只能訪問你的某個視頻應用來看動畫片。再比如別人用你電腦的時候，如果你不想讓對方看到你的微信，就可以通過手機微信來鎖定或退出電腦版微信。

2 大驚喜

所謂大驚喜，是指那些系統(tǒng)性大創(chuàng)新，并且能夠引領潮流、代表未來的交互設計。通常而言，這些大驚喜，最開始給用戶的感覺，就是酷。

iPhone 就是典型例子之一 。

2007 年的初代 iPhone，帶來了當時的大屏幕：3.5 寸屏幕，以及純觸摸屏，和極為靈敏的觸控體驗。

2011 年，Siri 同 iPhone 4S 一起問世，為我們帶來了語音交互。如今，在 100 元就能買到品牌類智能音響的情況下，依靠語音交互的智能音響也在慢慢走入尋常百姓家。

也許后喬布斯時代的 iPhone 創(chuàng)新不如以前，但不可否認的是，時至今日，iPhone 依然在引領潮流，在給我們大驚喜。比如這幾年流行的手機無線充電和以 AirPods 為代表的極簡的無線耳機。

以上是比較廣為人知的交互設計，還有一些不太為人所知的設計。比如在家里網(wǎng)購一條床單，但是不知道床的尺寸，家里又沒有尺子。這時，打開 iPhone 里的測距儀這款 App，就可以量出床的尺寸，會不會覺得有點酷。

(測距儀 App)

微信在引領潮流方面也有一些建樹，比如極大的普及了二維碼和掃一掃。小程序作為一種體驗接近原生 App、同時又不用下載的產(chǎn)品，也正在引領新一輪的潮流。

還有一個比較酷的功能，就是以圖搜圖。筆者最早用過百度和谷歌的相關功能，主要是在電腦上搜索相似的圖片，使用頻率極低。

假設一個場景，比如在路上看到一個陌生人的外套很好看，但又不好意思上前問，就可以拿起手機，利用淘寶的拍立淘功能，拍張照就能馬上看到相同或相似的商品。

如果淘寶上沒有搜到類似商品，還可以用微信的掃一掃識物。和拍立淘相比，區(qū)別之處有兩點。第一，不用拍，直接能識別，不過通常得等 1-3 秒；第二，識物結(jié)果里面，除了商品，可能還會有百科詞條和資訊。

02

交互設計：如何做到驚喜？

個人覺得，有 4 個要點：既要有好奇心，又要有卓越心；既要天馬行空，又要保持自然。

聽起來可能有點亂，且聽筆者一一道來。

1 保持好奇心

筆者觀察身邊讀小學的小孩，發(fā)現(xiàn)，當大人聊天時，特別是談正事時，小孩特別喜歡坐在旁邊聽，而且聽的很認真。小孩有時也會說兩句，或是問問題，或是發(fā)表自己的看法。

看得出來，小孩對成年人的世界，懷有極大的好奇心。實際上，不止于成年人的世界，小孩對周遭世界都有比較強烈的好奇心。

整體而言，成年人對周遭世界的好奇心，遠不如小孩。我們互聯(lián)網(wǎng)從業(yè)者也不例外。

好奇心和交互設計，有什么關系？

交互設計，某種程度上，也是一種創(chuàng)作。好的創(chuàng)作，一定來自生活。這就需要我們?nèi)ビ^察生活。

觀察生活，非常重要的一點，就是好奇心，對周遭人、事、物要有足夠的好奇心。

比如上文提到的例子，在 iPhone 上刪除應用前，應用圖標會抖。這種抖是一種趣味隱喻，既可以理解成嚇的發(fā)抖，也可以理解成搖頭求生。如果對生活沒有足夠的好奇心，是很難留意到這種生活細節(jié)，并把它們作為一種隱喻運用到交互設計中的。

以上是關于好奇心，還有一種特質(zhì)，也是在小孩身上表現(xiàn)突出，同時也和本文主題有關，那就是：童趣。

還是上文的例子，在 B 站 App 上輸入登錄密碼時，動畫人物會捂眼睛。這個設計，可能不會打動所有用戶，但至少一部分用戶會覺得比較有趣。如果我們內(nèi)心沒有一點童趣，可能也會覺得，這個設計，沒啥意思。

玩是人的天性。對于比較好玩的交互設計，大部分人是比較容易產(chǎn)生共鳴的。實際上，據(jù)筆者觀察，我們大部分從業(yè)者是有童趣的。我們比較缺的，是好奇心。

那么，怎樣判斷自己是否擁有足夠的好奇心，其標志是什么？

個人觀點，有兩個標志。第一，是對與個人利益無關的生活小事的關注，遠多于對個人利益本身的關注。第二，觀察和思考，遠多于評價和自大；追本和溯源，遠多于偏見和傲慢。

為什么會提到個人利益？

因為，通常而言，個人利益，尤其是短期利益(比如少花時間設計和修改原型)，往往會和用戶體驗存在一個此消彼長的關系。

如果過于關注個人利益，不僅很難照顧到用戶體驗，甚至會傷害用戶體驗。至于給用戶帶來驚喜，就更無從談起了。

回到現(xiàn)實當中。在時代洪流面前，好奇心的兩個標志，顯得很難，該如何實現(xiàn)？

關鍵在于找到背后的源動力。這個源動力，在筆者看來，有兩點，分別是：求知若渴、淡泊寧靜。

求知若渴，可以源源不斷的驅(qū)動我們?nèi)ビ^察、去思考萬事萬物的規(guī)律和聯(lián)系。

淡泊寧靜，正如諸葛亮在《誡子書》中所說，“非淡泊無以明志，非寧靜無以致遠”。人的心力和精力終歸是有限的，如果我們沉迷名利、物欲、享樂，就難有興趣和精力去琢磨萬事萬物了。

所以，只要找回自己童年的那種求知若渴，同時修身養(yǎng)性到淡泊寧靜，這份好奇心，就會回來。

2 巧妙融合

某種程度上，很多帶給我們驚喜的交互設計，都是一種巧妙融合。

筆者把這種巧妙融合，初步分成了三類，分別是：簡單融合、直接融合、委婉融合。

簡單融合，最常見的就是隱藏功能。把一個較為簡單的操作動作，比如長按、雙擊、下拉、左滑等，和一個合適的功能，融合在一起。用電腦時我們常說的快捷鍵，也屬于這一類。

通常而言，操作對應什么功能，講究的是合適，并無固定章法束縛。比如在微信朋友圈，發(fā)表文字的功能可以靠長按（相機圖標）喚起，設置權(quán)限的功能也可以靠長按（好友頭像）喚起。所以，簡單融合這塊，可供我們發(fā)揮的空間很大。

另外，簡單融合最常見的形式——隱藏功能，既實現(xiàn)了界面的簡潔，又帶來了一定驚喜。

簡單融合，既簡單，又實用。建議大家充分開發(fā)這一塊。

直接融合，是指將生活中的趣味性，直接搬到軟件中，搬到交互設計中。比如微信聊天中的扔骰子、石頭剪刀布，以及漂流瓶、抽獎等。

這一類融合，有點像商場里的電玩城，雖然我們不會經(jīng)常去玩，但確實比較好玩。

委婉融合，是指用明喻或隱喻的手法，將生活中微不足道的一些細節(jié)，移植到交互設計中。

這種移植，有時是直白的。比如 Mac 上打開應用時，其圖標會在 dock 欄里有規(guī)律的彈跳，這會讓我們聯(lián)想到皮球的彈跳。

這種移植，有時是隱晦的。比如 iPhone 上刪除應用前，其圖標會抖。這種抖，是害怕還是求饒，任憑我們想象。

這種移植，有時是無聲的。比如在朋友圈，要想呼出隱藏的設置權(quán)限功能，只能長按頭像，長按名字則不行。這個設計，不乏想象空間。如果不嘗試長按名字，則不會發(fā)現(xiàn)這個細節(jié)。

委婉融合，有時會帶一些趣味性。更為重要的是，它能夠引發(fā)我們的思考和想象，所以是一種很出彩的融合。這種融合，也會賦予交互設計，一種禪的味道。

整體而言，筆者非常推薦委婉融合。

3 追求卓越

如果目標是小驚喜，則保持好奇心、并做到巧妙融合，基本足矣。

如果目標是大驚喜，則需要雄心壯志，需要舍我其誰，需要追求卓越。

日常工作中，可能會有這樣的對話?！斑@個動效/功能，實現(xiàn)不了”。

大驚喜里的幾個例子，比如初代 iPhone 的觸控體驗，iPhone 里的測距儀，微信的掃一掃識物。這種設計，意味著要修一條最好的長城，背后往往有很多技術難題要攻克，有很多臟活累活要做。

如果團隊文化就是做出最優(yōu)秀的交互設計，那么，“實現(xiàn)不了”這句話，估計就聽不到了。取而代之的，可能是：“還在研究中”，“下個大版本能上”。

4 自然而然

提到驚喜，還有一款值得研究和學習的產(chǎn)品，那就是錘子手機的 Smartisan OS。

個人觀點，在小驚喜方面，Smartisan OS 頗有建樹。在大驚喜方面，Smartisan OS 也進行了一些值得學習的探索。

先說小驚喜，比如華麗而細膩的桌面翻頁動畫，比如四指橫劃桌面可以切換桌面背景。還有一些貼心的小功能，比如靜音可以設置時間，比如方便的長截屏。

(靜音可設置時間)

(長截屏)

再說大驚喜。2016 年 10 月發(fā)布的一步和大爆炸，是比較大比較系統(tǒng)的功能，在當時也很新。錘子公司也一直有宣傳這兩個功能。所以相對而言，這兩個功能是 Smartisan OS 的大驚喜。

筆者的備用機是錘子手機，身邊也有朋友在用錘子手機。以一步為例，這個功能，筆者體驗過很多次。但平常很少用，身邊朋友的情況也類似。

(一步)

根據(jù)使用情況和主觀感受，個人覺得，一步這個大驚喜，還存在進步空間，主要有兩個方面。

第一，宏觀層面。一步作為新生事物，好比一顆新種子。種子破土而出時，是一顆嫩芽，而不是一棵大樹。新生的一步功能繁多，猶如一棵破土而出的大樹，一方面有違自然規(guī)律，另一面因為功能繁多，很多用戶無法一下子看懂，看不懂可能就不想用了。

第二，微觀層面。一步這棵新大樹，結(jié)了很多不同的果子，比如拖拽圖片到其他應用、切換后臺應用、展示最近圖片/文件等。這些果子，是用戶真正需要的嗎？這個是要存疑的。

比如拖拽圖片到朋友圈就能發(fā)朋友圈這個設計。通常而言，我們發(fā)到朋友圈的圖片都是精挑細選的，會占用一定量的時間，比如旅游或聚會結(jié)束后發(fā)的照片。一步解決的是效率問題。發(fā)朋友圈的時候，少點幾下這種效率問題，優(yōu)先級是比較靠后的，我們沒那么在乎。

還有拖拽圖片/文件這個交互動作，大家通常在電腦上用的比較多，在手機上是沒有這個習慣的，實際上應用場景也少。在手機上，大家一般只習慣拖拽應用圖標。

還有切換后臺應用這塊，大家第一個想到的，一定是系統(tǒng)自帶的，已經(jīng)用慣了。而且喚起速度比一步快，點擊面積也比一步大。

總的來說，微觀層面上，比較缺讓大家能馬上想到一步的功能點。

最后，總結(jié)一下。對于領先時代、引領潮流的交互設計，需要做到自然。

具體而言，就是，大驚喜是一種系統(tǒng)性的大功能，好比一棵大樹。這棵大樹，最好有一個從種子到果子的生長過程，這樣最自然，生命力也會最旺盛。

因為，從破土而出的嫩芽階段，就可以通過用戶反饋和數(shù)據(jù)來檢驗，這種嫩芽，是不是真的對用戶有價值。如果價值不大或沒有價值，還可以再調(diào)整。如果長成大樹結(jié)滿果子，再去調(diào)整，就很難了。

結(jié)語

交互設計小細節(jié)，如果有一定的趣味性或人文屬性，則是小驚喜。

系統(tǒng)性工程的交互設計，如果最初感覺很酷，而且能引領潮流、代表未來，則是大驚喜。

始終保持孩童身上那種非功利的好奇心，用心觀察并思考生活中的小事；

將生活小事和交互設計巧妙融合起來；

以上兩點，可以幫我們做出小驚喜類的交互設計。

追求卓越，獨立思考，做最酷最好的交互設計；

酷是結(jié)果也好，是目標也好，都不是最重要的。最重要的是，避免刻意和心切。醞釀大驚喜，猶如培養(yǎng)一個新生的孩子，需要投入極大耐心和精力，需要讓孩子自然成長。沒有家長會教半歲的孩子唱歌、把 3 歲的孩子送到高中念書。

再加上以上兩點，可以幫我們做出大驚喜類的交互設計。

最后，用愛因斯坦的一句話來共勉。

想象力比知識更重要。

原文地址：站酷

作者：snowdesign

藍藍設計建立了UI設計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設計，如果有興趣的話，可以進入一起成長學習，請加藍小助，微信號:ben_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯(lián)系01063334945。

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍藍設計( sillybuy.com )是一家專注而深入的界面設計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數(shù)據(jù)可視化設計公司、UI交互設計公司、高端網(wǎng)站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司