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

頁面打開方式作為鏈接產品路徑的基礎，在設計的過程中，或多或少都會遇到選擇的困擾，尤其是產品功能復雜，層級較多時，如何讓用戶按照自己的意愿清晰的瀏覽信息，保持操作連貫性，是值得體驗設計仔細思考與分析的。

近期在所負責的設計項目中，團隊對鏈接操作的打開方式產生了分歧，借此機會整理了一些案例與資料，就這個問題進行分析探討，也給遇到同樣問題的同行一些參考意見。

一、頁面打開方式的類型

網頁中可操作的鏈接，主要有按鈕、icon 以及文字鏈接，設計中常用的打開方式則主要有以下三種：

1. 當前頁打開

點擊操作鏈接后，在當前的瀏覽器頁面中進行內容顯示與操作。

2. 新開頁面

點擊操作鏈接后，在瀏覽器中新開一個獨立的標簽頁面，進行內容顯示與操作。

3. 彈出框

點擊操作鏈接后，在當前的瀏覽器頁面中，彈出一個小尺寸的對話框，進行內容顯示與操作。

二、當前頁打開 & 新開頁面

首先來說說最具爭議的新開頁面&當前頁打開。在 HTML語言中，target目標有「target=_blank」和「target=_self」兩種屬性，分別代表「新窗口打開」和「當前窗口打開」，下圖是這兩個參數的屬性描述。

從這兩個參數的屬性上來看，「當前窗口打開」是系統默認的處理方式。這個打開方式在國外的網站中實現方式比較統一，用戶也形成了一致的習慣，但國內的形式則不盡相同，以至于一直頗具爭議，不同類型網站之間、同一網站不同場景之間也沒有一個明確的規則標準可供大家學習和參照。

針對這個問題的討論，可以聽到兩種不同的用戶聲音，并且都站在各自的角度闡述其道理。

舉個例子，我們以同類型網站（淘寶和亞馬遜）的打開處理方式進行對比，來看一下用戶習慣、功能場景對鏈接打開方式選擇的影響。

首先，我們確定一致的功能場景：用戶從首頁中根據各種篩選條件，查找到心儀的商品。來看一下兩個網站的處理方式：

可以看出基本是兩個極端，差異非常明顯，再來看個有意思的現象，亞馬遜中國的商品搜索方式竟然又和淘寶一致了，難道鏈接打開方式的差異竟是中外用戶習慣的差異？

這確實占了很大一部分原因，那么造成這種差異的原因主要有：

• 早期的 W3C標準不支持 target=”_blank”（HTML語言中，在新窗口中打開鏈接）的屬性，國外互聯網普及也比國內早，于是用戶慢慢養成了習慣。
• 默認當前頁面打開讓國外用戶覺得更有「禮貌」。如果用戶想新開頁面，可以鼠標中鍵、按住ctrl點擊鏈接或者右鍵新窗口打開，此時用戶更有選擇權，可以自己決定打開方式；如果默認新開頁面，則讓用戶失去了選擇權。
• 早期國內互聯網發展較為浮躁，網站想通過新標簽頁打開方式，提高PV。
• 國內網絡普及晚，部分用戶尤其很多老年人不習慣甚至或許不知道，頁中有個后退前進按鈕、面包屑可用，新開頁面便于他們的操作。

那么，淘寶中所有的頁面打開方式都是新開嗎？不是。像「我的收藏」、「已買到的商品」、「購物車」等功能頁面就是當前頁打開。

同一個產品內部，如此區別設計的原因我認為有：

• 用戶的目的較為明確，查找對象確定。（用戶想要查看的對象是確定的，如購物車中的產品，用戶有明確的目標，找到鏈接打開頁面即可，不像搜索查找商品，需要一步步縮小范圍甚至比對查看）
• 鏈接入口常駐在網站的信息欄，用戶可以隨時切換，操作方便，且不存在重新輸入的成本。

關于這兩種打開方式，到底哪種操作更順暢，確實難分高下，就跟「確定和取消哪個在左，哪個在右」是一種性質的問題，沒有好壞之分，關鍵是要看在哪種場景下使用更合適。

新頁面打開適用的場景：

• 頁面內容沒有關聯性，且從邏輯上沒有從屬關系，相對獨立。如：產品中的外鏈。
• 存在多頁面「比較」的操作，需要經常切換。如：淘寶商品詳情。
• 需要保留住前一頁的操作不丟失。如：知乎上過濾出來的結果列表。
• 功能分支存在穿插，當路徑發生交叉時，最好新開頁面。如：產品內部的跳轉鏈接，導致信息關聯的層級發生改變。
• 具有輔助功能的操作。如：使用文檔（PDF、圖片等）需要來回參照。

當前頁打開適用的場景：

• 流程性的功能頁面，前后操作存在關聯和影響。如：下單支付、按步驟新增。
• 同一層級內容間的操作。如：tab欄的切換。
• 同一路徑中的操作，用戶當前的操作會對主頁的內容產生影響。如：編輯一個配置，用戶操作完，會回到當前頁查看結果。
• 用戶具有明確目的性的操作，當前頁有利于鎖定用戶注意力。如：淘寶中「我的收藏」。

以上是結合功能場景進行的選擇側重，如果就「用戶體驗」一定要分出個高下，我個人還是比較支持默認「當前頁打開」，從體驗角度分析，「當前頁打開」略勝一籌的主要原因有以下兩個：

• 尊重用戶的決定。當前頁打開，將更多選擇機會留給用戶（鼠標中鍵、按住ctrl點擊鏈接或者可以右鍵新窗口打開），一個具有良好用戶體驗的產品，在用戶做操作的時候，總是能讓他們按自己的意志做出決定。網站對每個鏈接強制打開新頁面則剝奪了用戶的選擇權，因為不同的人有不同的瀏覽習慣和使用需求。
• 體驗一致。保持一致體驗的設計才能讓用戶產生信任感與安全感。當用戶在操作界面元素的時候，可以順暢的知道、理解，并且能預料到將會發生什么，不會被分神，也不會被打斷。任何違反這個原則的設計都將會演變成一種「以設計方意志為導向」的設計，而不是「以用戶為中心」的設計。

小結

當我們不知道兩種方式如何選擇時，或許「不強制用戶」才是最好的體驗。因為我們面臨的用戶多樣，電腦操作熟悉程度多樣，因此不同用戶對于打開方式的習慣也具有多樣性，這個是設計者無法揣測和調查清楚的。

在「兩害取其輕」的情況下，在當前窗口打開鏈接，不失為一個選擇，尊重用戶自己的決定，讓用戶對交互界面自主可控。

三、彈出框

彈出框（彈層）又叫模態對話框，是指在用戶想要對當前對話框以外的應用程序或內容進行操作時的提示方式。它一般覆蓋在整體頁面之上，避免了頁面跳轉。

彈出框通常是為了顯示一個單獨的內容，在不離開整體頁面的情況下有一些互動，提供信息和交互。

如下圖知乎中的「寫想法」，用戶可以快速的在彈出框中記錄個人想法，記錄發布后，很順暢的回到之前的路徑上繼續操作，便捷，操作思路清晰。

△ https://www.zhihu.com/

現在很多產品中的新增、創建，也都會采用彈出框的交互方式，當然前提是在彈出框中編輯的內容不是很多，此時彈出框不僅承載了信息編輯的功能，還可以作為上下文的跳轉，幫助用戶銜接路徑。

如 iconfont 中的新建項目，用戶新增后，頁面會直接跳轉到新的項目空間。

△ http://www.iconfont.cn

彈出框適用的場景：

• 內容簡單，沒有復雜的操作，且具有臨時性。如：新增一個收貨地址，進行簡要的輸入編輯。
• 更為詳細的輔助說明，是對當前內容的快速擴展。如：縮略圖，點擊放大查看。

因此，彈出框可以較好的實現上下內容層疊的感知，不打擾用戶的主路徑，同時作為頁面承載元素和用戶操作的補充，起到承前啟后的作用。

總結

本文結合這三種鏈接打開方式的頁面交互關系，進行適用場景舉例，并總結每種方式的優缺點，方便在設計中更好的根據不同的場景選擇合適的頁面打開方式。

當然，以上總結也是基于我個人的理解與經驗，沒有統一的用法和標準，在具體設計實踐中，仍要靠設計者的直覺和經驗來進行綜合考量與判斷。

作為體驗設計師，如何規劃用戶瀏覽路徑，是個需要嚴肅對待的命題。沒有絕對的好與壞，但一定要結合產品類型、場景、目標用戶等進行具體問題具體分析。

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

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

但是，每個人對「高級感」定義不同，它會受到個人審美、教育水平、成長環境、文化價值等因素影響。那么，這個被人們天天掛在嘴邊兒的「高級感」到底如何定義，標準又是什么呢？

今天就跟大家分享下，我最近的相關思考。

一、什么是高級感？

關于「高級感」，百度百科上并沒有這個詞條，在一定程度上可以說明，這個詞本身就是很難定義的。

我嘗試著換個思維方式，看看什么是低級？低級意味著：多欲求的、簡單的、盲目的。那么，反過來看「高級感」，大概可以解讀為：克制的、的、特立獨行的。

1. 克制的

說到克制，我想到了德國工業設計師 Dieter Rams，他的「設計十戒」中有提到「好的設計是盡可能的無設計」，體現出簡潔、克制的重要性。

比如：無印良品，在「性冷淡風」的背后充滿了對欲望的克制。

產品設計以更親近自然的棉、麻、羊毛的材質配上木本、黑、白、灰色。不管是從造型，還是從用色上都極度的克制，但是給人高品質，很舒服的感受。

反而下圖，高飽和度和純度的配色設計，給人有一種反自然的，人工造的顏色的感覺，顯得服裝比較廉價。

那么，品及時尚圈的設計，又是怎么考慮呢？

可以看出，他們服裝從簡單利索的剪裁，到高級灰（莫蘭迪色）的配色，正是我們所說的「克制」，給人一種奢華且高級的感受。

為什么克制的用色，給你高級的感受呢？因為，這樣會削弱色彩對人情緒的影響，反而有治愈的能量，有一種頹廢的性感。

下面這幅畫，是意大利20世紀著名的版畫家，油畫家喬治莫蘭迪的（莫蘭迪色也是根據他的名字而來）。在他的畫里，所有的色彩都滲入了灰色和白色調，失去了原本或艷麗或凝重的本色，柔和優雅，而又統一的混合在一起。用現在的話來說就是：克制、留白、極簡。

目前很多服裝設計、室內設計都在效仿這種配色方式，顯得更有品質。

比如，今年熱播的《延禧攻略》，一改以往流量電視劇那種高飽和度，艷麗的配色，猶如一股清流，讓人眼前一亮，感覺把整部劇都帶的高級了很多。

以上可以看出，克制的造型及用色、適當的留白、極簡的畫風，反而顯得更加自信，從而給人傳遞出高級的視覺感受。

2. 的

人們常說，細節決定成敗。其實，讓人們感到「高級」的事物，都有一個共性：對細節追求。

比如，前段時間看快樂大本營，里面對《延禧攻略》中演員服飾的刺繡細節進行講解，當時何炅用「很高級」夸贊。

我就在想，是什么觸發了他評價「高級」。

后來發現，是因為劇中人物服裝上的刺繡全是純手工的。針法多樣，包括復雜的手推繡、打籽繡、磐金繡、珠繡……而且，團隊都是曾經參加過故宮文物翻修的匠人們。

為了無條件的貼近歷史，這一件皇上的衣服花費了8個工人半年的時間進行制作。

因此，讓何炅潛意識里感到「很高級」的，正是因為僅僅為了一部電視劇，在演員服裝上耗費這么大的功夫，這種對細節的追求。

再拿科技產品舉例，比如：iPhone，由于「對稱設計」可能是人們能感知到的最原始的美，很多情況下手機受限于內部設計，很難在表面做到對稱。

但是 iPhone 為了遵循「對稱式」設計，投入非常多的人力去解決（上面），而對比三星Galaxy S6 的設計（下面），看起來就略顯尷尬。

它們對產品每一個方面都精雕細琢，盡管用戶不一定能注意到，這種工匠精神，讓人們覺得蘋果手機不僅僅是一款產品，更像是一件藝術品，同樣給人高級的感覺。

3. 特立獨行的

人類本能習慣于盲目追隨、容易妥協。因此，獨立思考、特立獨行且自信的人或事物，常給人很感級的感覺。

比如，在網紅臉盛行的今天，隨便逛個街，都充滿了濃濃的玻尿酸和歐式平行大雙眼皮的味道。雖然并不丑，但是總覺得不夠高級。比如，柳巖就評價過自己屬于「低級臉」。

為什么超模那樣高冷的臉蛋會給人一種高級感呢？

因為，她們有特色的五官長相，意味著不向大眾主流審美屈服和妥協，而且非常自信。同時，高級感也意味著，在 TA身上看不到欲望、諂媚和討好。

再比如，日本的服裝設計大師——山本耀司。在人們都追求時尚和潮流，偏愛女性婀娜的曲線和靚麗的色澤的時候，他卻以反時尚設計而著稱。

他大膽發展日本傳統服飾文化的精華，具有獨立思考，形成一種反時尚風格。這種與西方主流背道而馳的新著裝理念，不但在時裝界站穩了腳跟，還反過來影響了西方的設計師。

總的來說，高級感是克制的，它極簡、低調、且優雅；高級感是的，對細節的完美追求、具有匠心精神；高級感是特立獨行且自信的，不盲目追逐潮流、不討好、不妥協。

二、高級感的接受度？

雖然我們認為「克制的」、「的」、「特立獨行的」給人以高級的感受。但是，真的是所有人都能接受嗎？

不可否認，有的人就是覺得花里胡哨的東西很高級，比如：在美甲上鑲一些比吊燈上還大的鉆；穿一雙松糕鞋，鞋底恨不得比自己小腿肚還高。

因此，我就在思考兩個問題：影響審美的因素；大眾對「高級感」的接受度。

1. 影響審美的因素

不管是個人審美、教育水平、成長環境，還是價值觀，我覺得決定審美的背后，是「經濟」這只無形的手。

不知道你有沒有發現一個規律，越落后貧窮的國家，卻喜歡艷麗的、繁雜的設計。

而相反，越發達的國家，反而更青睞簡約、淡色。

原因是經濟落后的國家，人們缺少的是「豐富」，想要的更多色彩，更多花樣。

而經濟發達的地方，人們已經擁有足夠多，因此，內心中追求更多的是：我需要什么？我是誰？什么對我不重要？

人們對過于爆炸多樣的商品會感到「焦慮」，「害怕」因為選擇的太多，反而想要抽離。

因此，像無印良品這類克制的、做減法的、回歸本質的物品，反而受到人們喜愛。

2. 大眾對「高級感」的接受度

這里的「大眾」就先指我們中國大眾吧，他們能接受「高級感」的克制，極簡嗎？

我們從消費時代進行分析，目前日本處于第四消費時代，它的特征就是上面所說的，不再盲目的追求品帶來的滿足感，而是追求除了物質以外什么才能讓人變得幸福。

而中國呢？

大多數人認為，中國正處于第二、第三、第四消費時代共存期。在偏遠的農村，處于第二消費時代，他們的觀念是「大的就是好的」，「繁瑣是好的」；三四線城市，處于第三消費時代，他們的觀念是「個性化、品牌化」追求與眾不同，喜歡名牌貨；一二線城市，處于第四消費時代，更加崇尚無品牌，休閑傾向，整個社會趨于共享。

但是，我認為，隨著中國經濟近幾年迅猛發展，互聯網的快速普及，大家接受信息的程度慢慢趨同，就算非一二線城市，大家的消費觀念及審美水平也在隨之改變。

比如：抖音里，很多四五線城市的小姐姐們，穿衣及化妝風格都很ins風；同時，越來越多不因為取悅男性，而是突顯獨立女性的打扮。

越來越多的北歐極簡裝修風的流行……

總的來說，大眾的審美水平和消費觀念會受經濟的影響，而中國大眾的消費觀念正在往第四消費時代慢慢轉變，對真正「高級感」的事物，接受度越來越高。

三、互聯網產品中高級感設計

上面舉了很多傳統行業案例，其實互聯網產品設計中，也在往「高級感」方向走，踐行著「極簡」和「克制」的理念。

比如：年初的谷歌「ALL-White」風。眾所周知，谷歌的設計師是極簡主義界面的忠實粉絲。

下面是優化前后對比，移除大面積的色塊，采用大面積留白，體現現代、簡約的感覺。

移除多彩的圖標，采用極簡的線性表現方式。

再比如，百度的設計，一年前也在「高級感」的設計理念上進行深挖和落地。

從以下兩個維度可以看出：克制的配色；的細節。

1. 克制的配色

拿「簡單搜索」舉例，它是百度的一款搜索APP，以簡潔清爽的視覺體驗，簡單的操作交互，吸引了大量用戶，而且零廣告。

在界面的用色上，非?？酥?，采用以「黑、白、灰」為主，目的是為了讓用戶聚焦內容本身，而不是為了設計而設計。

包括 icon 的處理，以純色的線性為主，更加現代、簡約。

2. 的細節

大家都知道，黃金分割是最普遍也是最能引起人美感的。我們所熟知的蒙娜麗莎的臉、雅典的帕特農神廟等都應用了該比例設計。

其實，在看似普通的百度搜索首頁，同樣遵循著這個比例，讓有規則的美，嚴謹的融入其中。

包括柵格系統在設計中運用，這種來源于數學的美學，將有助于用戶，更有效和愉悅的閱讀及獲取內容。

以上可以看出，不管是傳統行業還是互聯網行業，亦或者是未來的人工智能的設計，都在往「克制」、「」的方向發展，讓人人都能享用到優質、高級的設計。

總結

總的來說，「高級感」意味著對設計保持克制的、對細節追求、擁有獨立思考的產物，而且，隨著經濟的發展，人們的審美和接受程度也發生著改變，追求真正高品質的設計。同時，不僅傳統行業在踐行「高級感」的設計，互聯網的產品設計也在朝著這個方向發展。

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

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

所以，視覺語言也是規范化的，標準化的，它足夠自由，也保有約束。視覺語言本身也可以具備足夠明顯清晰的特色，就像每個人的表達方式和口音一樣，這使得視覺語言本身可以強化和凸顯品牌特色。那么想要創建一套屬于自己的視覺語言，可以從下面的9個方面入手。

1. 構建品牌獨有的配色方案

我們總是說，色彩和形體是用戶第一眼最快注意到的東西。配色方案的視覺表現力最強，這使得配色方案成為視覺語言中辨識度最高的組成部分。配色方案本身需要具備一定的獨特性，確保它整體上能夠讓人記住，區別于其他，品牌不至于在繁雜的互聯網世界中迷失，也不會讓用戶無法記住。

另一方面，配色方案應該具備良好的兼容性，能夠調和品牌不同模塊，比如網站、APP、社交媒體、包裝、名片等。

配色也應該體現品牌的價值。想想麥當勞的配色吧，黃色和紅色為主。這兩種色彩本身能夠觸發幸福（黃色）和饑餓（紅色）的感覺，兩者搭配加上經典的金拱門的LOGO，麥當勞的視覺識別度可以說是相當高的。此外，麥當勞旗下的許多其他的設計，也是在這個配色的基礎上構建的。

2. 構建排版的層次結構

排版層次結構的構建，和選擇字體同樣重要。不同的排版層次，能夠給人截然不同的感受，清晰還是粗糙，雅致還是有趣。在排版的層次結構上，并不存在對錯，更多需要考慮的是合適不合適，風格和感受上的一致性。

當然，不同層級的信息，在排版層級上還是要有比較清晰的體現的，大小疏密對比度不足，會難以讓用戶感知到內容之間的重要性的差異。

以 Airbnb 為例，網站的排版有著清晰的層次結構，字體的大小、字重、間距和配色都已經標準化了。相應的，給人的體驗也始終保持著應有的一貫性。

3. 建立柵格來規范內容之間的空間關系

視覺元素之間的位置關系，和它們本身的設計是同等重要的。如果你希望整個設計在細節上是清晰明確的，那么柵格會給你想要的。

FreeCodeCamp 對此有很明確的描述：

柵格賦予了UI界面元素以模塊化的清晰結構，這使得整個設計團隊能在此基礎上更好地合作。這使得產品能夠快速清晰地輸出到不同的平臺上。如果你是基于某個想法來構建概念設計，那么這種方法更加實用有效。

簡而言之，柵格讓視覺呈現的復雜度降低了。

4. 創建組件庫

從按鈕、圖標再到卡片，你應當創建出一整套可用的、風格一致的UI組件庫。

同樣功能的控件，在頁面不同的地方、或者不同的頁面上有著截然不同的風格，是讓人迷惑而糟心的。一個好的組件庫，應當包含全部常用的UI組件，以及針對 iOS 和 Android 平臺所適配之后的UI組件。雖然構建組件庫本身的工作量并不小，但是在完成之后，能讓后續的工作事半功倍。

5. 強調圖片的風格和特征

在諸多圖形化的元素當中，圖片和插畫是視覺性最突出的元素，這也是整個視覺語言當中最重要的因素之一，因為它從某種意義上是和品牌關系最緊密的素材。

構成視覺語言涉及到圖片素材的方方面面，構圖，色彩，濾鏡，甚至相關動效的細節。

下面是 Smashmallow 中的網頁設計，即使它們并不是同期設計也不是服務于相同的功能，但是很明顯插畫所采用的視覺風格是一致的，并且每幅插畫當中都使用了共同的元素：熱氣球。這一元素和品牌本身是有著緊密關聯的，而用戶也可以從這些插畫圖片的內容，迅速意識到品牌本身的一些概念。

6. 為動效設定規則

動畫效果同樣是要遵循一些規則的。是快速移動還是慢速移動，是懸停觸發還是自動運行？這些動效的運動規則其實是有著明顯的視覺識別度的，就像日漫和美漫在視覺和運動規則上存在差別一樣。

就像下面這個來自Dribbble 的動效，它大體上做著勻速的圓周運動，速度適中，其中有些元素并沒有完全按照圓周運動。那么想想看，是否所有的做圓周運動的物體都和它一樣呢？它們是否會帶來不一樣的視覺觀感呢？

7. 讓視覺和文本內容匹配起來

視覺語言并不是只涉及到視覺元素，文本并不是與之割裂的，在設計的時候，兩者需要合理地配合，在體驗上達成一致，傳達一致的信息。

在下面的 Steffany 這個網站當中，整體設計呈現出非常明顯的女性化的特征，文本內容在表達方式和調性上和整體的視覺語言保持著一致，并沒有出現兩者沖突或者競爭的狀況。

8. 可信且可靠

視覺語言只有在用戶接納的情況下，才會地發揮作用，它要給人可靠的感覺。所以，整個視覺語言需要和你的品牌定位、氣質表里合一，而不能讓設計和產品、企業的氣質割裂開來。

你能想象沒有主角的芝麻街會是怎樣的一種氣場么？

整個品牌和視覺形象都是圍繞著 Big Bird 和 Elmo 等角色建立起來的，每一個細節的設計都是圍繞著這些角色來創建的。注意網站中角色和其他視覺元素之間的映射關系，它們讓用戶清晰地感知到角色和整體設計之間的關系是表里如一的，這使得整個網站的設計更容易為用戶所接受，視覺語言在此發揮了作用。

9. 落實到具體標準文檔當中

整個視覺語言在構建起來之后，需要保持各方面的一致性，在具體設計的時候，則得有一份詳實具體的設計文檔供整個設計團隊和利益相關人員，作為參考。所以，完成整個設計之后，將整個視覺語言相關的內容和素材制作成設計風格指南，和整個品牌的設計規范統一到一起。

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

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

在數字化變革時代，更好地理解和分析數字消費者成為每個企業的核心要務。同時，如何將分析結果轉化為創新的產品和服務——更是為決策者提出了新的挑戰。“設計思維”作為一套完整的“以用戶為中心”的方法論和工具包，為企業重塑“客戶價值”、實現服務創新，提供了切實的方法指引，而這一切的終極目標是成就企業價值。

1、什么是設計思維？

簡單來說，設計思維來自“設計師思維”，是一套基于“以用戶為中心”的創新方法論。

在數字時代，消費者的使用動機和行為模式更復雜多樣，企業競爭環境也更加復雜多變。對于決策者而言，客戶體驗、場景、觸點、旅程優化等詞匯已經不再新鮮。

擺在企業戰略制定者們面前的問題是，如何以一種全局視角去理解客戶，并讓組織運作回歸“創造客戶價值”，不斷創新。埃森哲《2017年技術展望》通過針對全球企業領袖的一項調研發現，79%的受訪者認為，組織進化的目標就是——更好地研究消費者使用行為和動機，并提供行業領先的客戶體驗。

與此同時，面對產品服務創新面臨的內外部不確定性，企業決策者往往陷入兩難困境：即一方面，鼓勵組織內部大膽試錯、大膽創新；另一方面，又希望創新過程管理有序，并能量化創新結果。

于是諸多企業領導者重新思考創新模式，并在設計師們那里找到了創新靈感。

企業進一步把設計師的工作模式抽象提煉出來，逐步形成了設計思維——這套結構化地理解消費者習慣、行為、喜好和需求，并產生設計機會的方法論，希望從中找到在數字時代突圍的機會。

比起科學研究人員或者銷售人員，“設計師”面臨的問題、合作對象和產出方式有不同特點，甚至更加復雜。不論什么類型的產品，設計師的思考模式往往是，從不斷變化的用戶或者市場需要開始，兼顧生產水平和工藝限制，以可執行的產品方案結束。設計過程通常都會融入反復的內部討論、看似混亂的草圖、無情的推翻和修改和某個必要的“靈感爆發”時刻。

創新思維本身也是在不斷迭代，我們姑且將其定義為1.0、2.0和3.0版本（見圖一）。

2、當設計思維遇到傳統企業

對于傳統企業而言，創新更是當務之急。而設計思維的成功運用，無疑能夠為傳統企業插上創新的翅膀。

《哈佛商業評論》就曾以百事公司為例，分析這家傳統快消業巨頭，如何通過設立首席設計官，將設計思維融入公司文化，并在做任何重要決定時都要考慮設計的因素，完成從新產品、包裝、陳列到品牌體驗的成功創新。隨著諸多傳統企業將創新思維應用在各自的創新領域，“設計思維”已經在過去的十幾年，從產品規劃方法，發展成為了一套系統化的創新方法論。

在新的語境下，設計思維已經發展成為一系列“以用戶為中心”的工具和方法集合，這里既包含產品設計模式，也包含組織協作模式；不僅從內涵上，在外延上，這種思維方式也從產品優化，進一步拓展到服務重構、流程設計，乃至實現突破性的商業模式創新。

設計思維3.0作為系統化的創新方法體系（見圖二）可以看做以下三項模式及其工具方法的合集：

1. 以用戶需求導向的分析模式：倡導從市場和消費者的需求中挖掘尚未被滿足的服務機會，通過調研真實用戶獲得設計洞察，尋找彌補需求斷層的機會；
2. 創新式的組織內協作模式：設計過程應由跨團隊共同碰撞、討論完成；過程中采取共創（Co-creation）模式，鼓勵引入專家用戶直接參與設計。
3. 產品化的問題解決模式：設計過程的實質是解決問題，而交付的結果應是可不斷迭代的產品。

3、像設計師那樣工作

要實現“設計思維”：

第一步需要轉換思考角度，理解分析“用戶是誰”、“用戶想要什么”，發現有價值的設計機會在哪里；

第二步結合技術的可實現性，篩選可以被技術解決的機會，并拼搭出未來的產品藍圖；

第三步基于實現的需求，做出分步規劃，從框架到細節逐步交付。

從產品藍圖來看，前面一個階段屬于需求的匯集；后一個階段屬于需求的延展（見圖三）。

以下按照三個步驟，列舉設計思維倡導的核心方法：

第一步 理解發現：基于用戶需求的分析模式

成功的產品始于對用戶需求的發現和理解（見圖四）。

顛覆了酒店住宿行業的Airbnb在創立初期，新用戶和預定量增長停滯不前，創始人之一同時也是設計師背景的布賴恩·切斯科（Brian Chesky）通過深入對種子用戶的理解，發現這些嘗試租賃共享房屋的用戶最為關心房源狀態和特色。

基于這一認知，切斯科和創始團隊做出了可能是Airbnb初創期最重要的決定，將最后的預算用于租賃專業攝影設備，并按照用戶關注的維度去重新拍攝房源照片，從色彩、角度和細節等方面，去強化共享房屋和酒店的差異，最終這批照片上線后為Airbnb帶來了100%的預定量增長。而Airbnb更強化了圖片優先的整體策略，時刻關注用戶體驗，成為這家估值超過300億美元的共享經濟巨頭持續增長的基石之一。

設計思維強調把消費者當做立體的“人”來看，了解“人”的習慣經驗如何對其購買、使用產品產生影響，分析其在服務各階段的感受是什么，情緒如何變化。那么，如何了解如此復雜的“人”呢？

設計師們從心理學和人類學家那里借鑒了一些常用的方法，如采取實地觀察、跟蹤和訪談等方式，記錄用戶行為的“人種志”研究；又比如場景分析，提倡對產品的使用環境（自然與社會環境）進行記錄和分析。

第二步 藍圖定義：創新式的組織內協作模式

面對數字時代消費者不斷變化的需求，面對數字化觸點大爆炸的現狀，在規劃設計的初始階段，企業迫切需要對用戶場景進行梳理，采取全局視角去發現待滿足的創新機會點（見圖五）。

從組織內部看，也需要更為有效的溝通和協作方式。設計思維倡導通過系統化的方式去尋找這些創新機會，其核心思想是：對全局信息的可視化表達，以及跨領域的相互激發。

設計思維鼓勵在團隊協作中使用創新手法，如頭腦風暴進行窮舉（Brainstorming）、可視化的方式表現、角色轉換（Body Storming）以體會用戶感受等，甚至在藍圖規劃過程中直接邀請客戶或者最終用戶參與，以共同設計的方式充分交流和激發，目的是打破團隊壁壘，共同以用戶視角進行問題定義和討論，形成統一認識。

埃森哲在幫助某國有銀行進行數字化體驗再造項目時，發現由傳統的業務部門“提出需求”到技術部門“執行需求”的工作模式不僅沒有提升效率，反而由于高昂的溝通成本，減少了各方對創新的意愿和投入。

在埃森哲的建議下，將傳統的單向需求匯報模式，改為周期性設計創新工作坊。通過系統化的梳理金融類消費者的使用習慣和需求，將未來藍圖的規劃與企業整體目標有機結合，找到了適合該企業的創新設計方向。而持續的跨部門合作，也提前統一了創新方向并確保結果落地。

第三步 迭代交付：產品化的問題解決模式

有一種理解認為，設計思維中對于結果的迭代交付訴求是“提早犯錯（Fail Early）”，然而更完整的說法應該是“提早評估”。設計思維中使用大量工具從用戶角度描述需求，或者搭建原型，這一過程更多是描繪“產品的中間態”，即產品概念由抽象到具體，核心目的是更早完成評估和修正（見圖六）。

通過搭建原型并測試的方法，不僅限應用于手機或者網站，也包括線下服務。一個著名的案例喜達屋集團旗下雅樂軒（Aloft）酒店。

作為面向20-30歲年輕人群的品牌，雅樂軒酒店的設計團隊在規劃階段，就將真實的設計方案制作成3D模型放置在虛擬線上游戲中，以測試目標用戶的反應，整個測試過程持續9個月，并包括了多次基于用戶意見的修改。

最終，大量基于“虛擬模型”的測試結果，如酒店大堂色彩選擇、屋內布局、影音設備位置等，被有選擇地應用在實際酒店設計中?！渡虡I周刊》評論喜達屋這種模型測試，不論從速度或者成本來講，都非常有參考價值。

4、如何擴大設計思維的價值？

領先的企業決策者們已經認識到，設計不僅僅停留在產品的 “外在美”，而應該聚焦在更具商業價值的“內在美”。那么，如何實現通過“內在美”創造價值呢？答案在于如何利用“設計思維”讓內部組織和員工重新回到 “客戶價值” 思維方式上去，并密切協作。這里有四條建議：

4.1 讓設計思維常態化

首先應在新產品設計研發團隊中，將設計思維方法常態化、步驟流程完整化?？煽紤]通過設立標桿項目、打造標桿產品的形式，完整地應用設計思維方法，在若干輪反復應用之后找到適合本企業的流程方法。

同時，借鑒互聯網企業的方式，周期性組織一日黑客馬拉松（Hackathon） 類活動，在組織內部擴大影響。

4.2 基于用戶需求劃分MVP模式路標

MVP即Minimum Viable Product（最小可行產品），是與敏捷產品開發模式密切相關的產品交付模式，由埃里克·萊斯（Eric Ries）在《精益創業》中提出，核心原則是，首先聚焦在滿足用戶單一需求的功能（所謂“最小可行”），之后不斷迭代增加功能，最終形成完整的產品或系統。對待企業核心服務的數字化提升乃至變革時，MVP是一種行之有效的產品交付理念。

4.3 形成創新機制

創新并不意味著一味鼓勵犯錯，也不意味著無法量化評估。

圍繞用戶進行產品和服務優化，是一個循序漸進的螺旋式上升過程，這要求對設計結果的評判機制能有效適應這種敏捷迭代。如，將銷售結果導向的KPI要求，拆解為若干可以測量的用戶行為的KPI。

同時，在定義階段，將這些用戶行為KPI用到產品設計的輸入中，聚焦在提升這些用戶KPI上，后續不斷優化提升。在方案設計中考慮，如何形成反饋機制，預設用戶行為的KPI和監測方法，在下一輪優化中不斷迭代。

4.4 創新需要融合設計與技術

“技術實驗室”是諸多領先企業在進行研發領域創新，特別是構建前沿領域技術創新能力時，常常考慮的戰略舉措。同樣，要進一步推進數字化領域的客戶導向創新，建立“創新設計中心”可以從戰略的高度推進“設計思維”在數字化轉型中的作用。

ERP領域的巨頭SAP公司也在持續增加其對設計團隊的投入，在2012年就開始著手組建新的設計中心；素以創新和多元化產品著稱的3M公司，在2016年將總部設計中心擴容了四倍面積，可容納150名設計師工作，并在其中進行協作創新、產品展示和客戶洽淡。埃森哲大中華區也于2016年底，在香港構建了“設計工作室”，作為分布全球的設計網絡的一環，在這個超過3700平米的空間中，集中不同專長的數字化設計能力，與客戶共同創新。

可以預見，“創新設計中心”將會越來越多地出現，成為從市場端洞察用戶需求、挖掘商業機會的強大雙擎之一。

結語

設計思維3.0作為一種全局化的創新方法論，能帶給企業一種全新視角，即如何圍繞客戶價值，構建可持續的產品和服務？

在數字時代，企業需要兩手抓：一方面，能夠從用戶視角分析梳理需求斷層和服務機會；從另一個方面，能夠為組織的協作方式找到新的模式，以強化效率和有效性。如同設計結果需要漸進式上升，工作方法和協作形式都需要不斷進化迭代，才能最終尋找到適合發展階段的轉型切入點，支撐企業數字化時代實現全面創新。

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

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

當我們每周深入探討一個問題時，可以向這二十位經驗豐富的設計師學習。本周，設計師們講述了從他們設計過的一款失敗產品中學到了什么。

Simon Pan（谷歌高級交互設計師 ，美國三藩市，國籍：澳大利亞）

2000年在美國佛羅里達州棕櫚灘縣的總統選舉中，蝶形選票就是一個兇殘設計的突出代表。

蝶形選票的設計將候選人與中間一列打孔交織排列在一起。這種設計讓很多選民感到困惑，結果使他們不小心將本想投給阿爾·戈爾(Al Gore)的選票錯投給了帕特里克·布坎南(Patrick Buchanan)，或戈爾(Gore)與布坎南(Buchanan)兩個人。“棕櫚灘郵報”的一項研究推測，被蝴蝶選票搞糊涂的選民，讓阿爾·戈爾(AlGore)失去了總統職位。

之所以稱這是一個失敗的設計并不是因為其結果導致喬治·布什(George Bush)贏得了選舉，而是因為許多選民在投票后的當天認為自己投給了阿爾·戈爾(Al Gore)。更糟糕的是，因同樣原因導致的一模一樣的問題早在1996年棕櫚灘縣的選舉中就已經發生過了。任何有能力的設計師只要看一看選票表格，就會發現這當中的可用性問題。任何業余的設計師，都本可以讓用戶提前測試選票表格的設計并指出問題。

相比選票的設計，當今的設計挑戰與實際生活聯系更加緊密、更加復雜和全球化。看上去大大小小的決定在我們的世界中承擔著重要的結果，我認為，現在是時候讓設計成為一個執證上崗的職業了。（閱讀 Mike Monteiro的《Designs lost generation》）。

Andrew Doherty（Another.ai的CEO，德國柏林；前谷歌產品設計經理；國籍：澳大利亞）

老實講，我們所做的幾乎每個項目都以這樣或那樣的方式失敗了。每次讓我失望的是時間本身時間有限，我們的動作太慢了。我們必須砍掉一些需求和基本功能以滿足商業上的訴求。我在媒體上寫了一篇關于這件事的文章，結果在當時的設計圈中迅速傳播開來。因為我認為在我們的整個職業生涯中，大家都感受到了這種痛苦：即優秀的UX設計師必須是戰士，妥協的設計不是好的設計。

“我覺得設計是探索發現，而不是創造?？赡芤驗槲抑笆强脊艑W家的原因，我認為設計像是恐龍，掩埋在地下的遺跡。作為設計師，我們的任務是仔細清除污垢和糞便，使遺跡被發現，復原，可重新被使用，然后把它們在博物館展出供人們體驗。”(Andrew)

作為設計師，我們也必須用我們的想象力和想法來填補空白和缺失的部分。但業務目標，研發資源，時間和資金總會與我們的理想情況產生矛盾。如果我們不注意的話，他們會試圖改變恐龍的本質，把它的骨頭碾碎成粉末，而之后他們會奇怪為什么人們不想參觀博物館展出的遺跡了。最好的設計師是那些在限制下溝通，爭取，并協調所有不斷變化的（通常也存在相互矛盾的）各方利益，來主張設計使命的初衷的設計師。但設計永遠不會是完美的。完美的設計不是設計，是藝術。而我們不是藝術家，我們是溝通者。而溝通者總面臨溝通失敗。但這就是溝通。不斷失敗，但不斷嘗試，永遠嘗試去贏。

Adham Dannaway（高級UI/UX設計師，合同/自由職業，澳大利亞悉尼，國籍：澳大利亞）

當我剛從事設計工作時，我為一家面向小型企業，提供DIY建站工具的初創公司工作（是的，又是一款建站工具）。這款產品最酷的地方在于：一個業主只需輸入他的企業名稱、行業和品牌色，一個充滿相關內容和圖片的網站就會在他的眼前自動生成。可以說是真正的一鍵生成網站。

我負責設計和構建網站的框架模板，使以后的網站可自動生成。我需要找到一個基于企業名稱，所在行業和品牌色就可自動創建出一個像樣的網站的方法。我接受了這個挑戰。經過大量的摸索和研究，我決定用一個簡單的屬性列表來代表每一個網站，包括：模板（定義網站布局）、內容模塊（內容類型包括圖像、文本和視頻的內容類型）、品牌色（最多2種）和主題（字體和樣式）。我設置了多種可替換的屬性以確?？山ňW站類型的多種多樣。不幸的是，公司在我們完成產品開發之前就倒閉了。這是一個非常有趣且富有挑戰性的項目，我學到了很多關于如何分解一個網站架構的知識。如果你在一件失敗的事情中學到點什么，那說明還不算完全失敗。

Ben Huggins（YouTube高級交互設計師，美國三藩市，國籍：美國）

我的一部分愿意去相信，精心打造的產品將永遠是最成功的產品。這想法很好，但隨著我在一路跌打碰撞中的學習，我意識到，這部分的我需要閉嘴了。

在我讀研時，我和朋友Noah合作開發了一款應用，名為“捕捉亮點?”，——一個幫助人們在他們的視頻片段中找到并分享那些亮點時刻的應用。我們知道對于任何一個從GoPro相機，孩子的體育運動，家庭活動等場合中留下數小時未觀看視頻的人來說，這是一個巨大的難題。

因為我們做了一個可靠的應用來幫助解決這個問題，于是我確信用戶們會發現這個應用的。

但他們沒有。后來我們的錢都花光了，最終決定開放應用的源代碼。我意識到，即使人們被某個問題所困擾，想出解決方案僅僅是個開始。引導人們使用解決方案仍需要做大量的工作，更別說讓人們為之付費了。

有無數名言強調過，未曾實踐過的想法毫無價值。但即使是實踐過的想法也仍需能觸及分發到用戶。所以是的，我們學到了很多（像Noah寫的那樣），但不得不停止開發。那還有一線希嗎？現在GoPro相機上有個叫做“HilightTag”的按鈕。這讓我們受寵若驚。

Nick Babich（Ring Central開發團隊經理，俄羅斯，國籍：俄羅斯）

我要給你們講個十多年前的故事，是我做過的第一個真正的項目。任務是建立一套控制船只進出的系統。我們的客戶是一個港口運輸公司，他們想在自己的網站上使用這個系統。

我為正在開發的系統感到興奮，因為這個系統將使數百人的生活變得更好，所以我決定做一個擁有進技術和豐富的視覺體驗的系統。我試著盡可能多地增加功能。例如，為管理員提供了一個強大的界面，允許從多個數據庫直接導入和導出數據，同步事項，監控及修改重復的信息。

經過一個月的緊鑼密鼓的設計、編碼和調試工作之后，我向客戶演示了該系統。這是一個功能齊全的系統，隨時可以上線。。。至少我覺得是這樣。但演示不太順利，我受到了很多批評。

主要問題是：我所做的系統并不是我的客戶想要的。他們需要的是一個帶有WYSIWYG編輯器的簡單表格，以便于即使是不太熟練計算機技術的管理員也可以學會添加新事項或更改表中的現有事項。這和我最初的設想（一個熟練的管理員將使用的系統）相去甚遠。

但我學到了一些重要的東西：

1. 明確目標。
   你應該永遠非常清楚地知道你要解決的是什么問題，以及你的客戶對即將搭建的系統有哪些期望。
2. 你不是用戶/客戶。
   不要在沒有任何研究或者需求說明的情況下去假設人們將如何使用你的產品。
3. 功能不等于價值。
   更多的功能不會自動轉化為更多的價值。最好的產品是那些能滿足用戶需求的產品。
4. 迭代，迭代，再迭代。
   不要試圖一次性做出一個完整的產品，要永遠不斷地在每次迭代之后在進行迭代和測試

Kymberlee Ide?（副總裁，FCV交互體驗設計師，加拿大人）

(*Kymberlee剛從McCann的體驗設計副總監崗位辭職)。

回想我當乙方的時候，我在加拿大一家很大的銀行帶領團隊負責一個數百萬美元項目的數字化戰略及部署。我是在項目進行到中途加入的，當時的項目進度有點曲折（項目缺乏原型，只用線框圖）。

當我們終于要去做這個網站的主要（且非常復雜）的部分時，發現網站流程的設計真的非常差。

我記得當時我指出了這一點并建議團隊不能再繼續使用這樣的方法和設計。老板對我說，如果我在領導團隊和督導委員會中提出這個建議的話我將是自毀前程。但現實是，無論我怎樣選擇都是在賭上自己的一切。

最后發現結果還不錯。我做了正確的事，在委員會中提出了建議，并申請項目排期延長5個月來修正這一部分的問題。講這個故事的寓意是：做正確的事。

Alessandro Floridi?（德勤公司UX經理，目前在澳大利亞悉尼，意大利人）

“沒有失敗，只有反饋”——Richard Bandler

我每天都收到“反饋”，但這仍是不愉快的體驗。我最大的失敗，即使發生在十多年前，仍如昨日般記憶猶新。我當時住在中國并經常和科技打交道。一位客戶曾像我咨詢關于數字廣告系統的解覺方案，我想到了一個讓我非常自豪的想法，利用一個我朋友正在開發的軟件來監測觀看者的性別，并針對性地播放廣告。

你可能能猜到后面故事的發展了，而我曾認為我曾有過的最好的想法就是它了。這個產品很棒，很簡單。大型顯示器、照相機和實驗軟件，基本上就是在這里等著事故的發生。災難發生在當產品被投放到一個法國的著名機場之后。在那之后不久，很快我收到一個精美的文件夾，里面是來自一個著名律師的關于隱私問題的300頁來信。我沒想過會是這樣的結果！我應該提前測試產品，不應該盲目愛上我的想法。這就是我在這個項目中得到的教訓。

Leslie Chicoine（體驗設計及產品管理顧問，目前在美國丹佛，美國人）

我很早就了解到測試的價值，所以我還沒有經歷過那么多產品的失敗。當然，不排除有些產品在測試或原型設計中表現得并不好，但我把這稱為學習，而不是失敗。我所看到的真正失敗是發生在團隊氛圍中的。因此，在團隊內部建立良好的溝通模式和共同創造出色的產品同樣重要。

Buzz Usborne?（Help Scout的?產品設計師，目前在澳大利亞悉尼，英國人）

很多事情都沒有按照我的計劃進行，而這正是重點，不是嗎？失敗使我成為一個更好的人和更好的設計師。不過我想到一個特別的失敗案例，，那是我為自己的產品prevue.it所做的事情。在Prevue的內部有一個文件夾庫，每個文件夾都包含你與客戶共享的設計工作。有一天，一位朋友建議，如果我讓用戶把他們的資料庫公之于眾，Prevue就可以作為一個制作作品集的工具。主意聽起來不錯，所以我去做這件事情。

在幾個月的時間里，成千上萬的人因為這個特別的功能成為了注冊用戶。事實證明，投資工具的主意，作品集工具服務是門大生意！但這些新用戶中沒有一個愿意付費的，他們還要求額外增加一些我們的競品所提供的功能。與此同時，現有的用戶被“新”的產品方向搞糊涂了，感到困惑。可以說，我制造了一個爛攤子，花了好幾年的時間才恢復，這過程中損失了大量的客戶。

我在挫折與失敗中，

1. 我明白了，一件事情很容易做或看起來很有趣，并不意味著它是值得做的。
2. 我明白了，新功能需要適應現有客戶的需求，以及長期秉持的商業策略，而不僅僅是讓產品看起來更好，或者更容易使用。
3. 我明白了，通過簡單地與客戶交談，我能更好地了解哪些功能應該優先考慮，哪些功能不能真正解決任何現有的痛點。
4. 我明白了，有時候，成千上萬的新用戶并不總是一件好事。

Kylie Timpani?（Humaan高級設計師，目前在澳大利亞珀斯，澳大利亞人）

實際上我沒有機會足夠深入地參與到一個產品中直至需要判斷成功與否的階段，更不用說我也沒有參與過重要到需要一個成功/失敗矩陣來衡量是否成功的產品了。我所設計的，大多是面向公眾的網站，這其中的很多設計都經歷過一些嚴重的失敗。最常出現的失敗，特別是在我早期職業生涯中出現的，是當我交付設計方案時，發現方案在很多方面都完全沒有達到預期目標。也許風格不對，也許用戶體驗不好，也許頁面布局沒有與用戶習慣相匹配，也許沒有體現出品牌，也許用戶就是不喜歡。

要克服這些失敗是很難的，因為這意味著你在這個過程中漏掉了一些東西，或更糟的是，你忽視或省略了重要的信息。這種失敗有點像炸彈可能隨時引爆。但也意味著還有很大的成長空間。成長就在于我們從失敗中學到的東西。我學到三種簡單且快速的方法來幫助項目取得成功，也減少了出現失敗設計的概率：

1. 關注和我所設計的主題相關的所有信息和我要解決的問題。
2. 如果有不確定的或需要更多詳情時，盡可能多地問問題。我不擔心這樣顯得無知或愚蠢。我告訴自己，我是用心投入的。
3. 盡量摒棄個人偏見，從而盡可能多地考慮項目的問題和背景。

我發現采用以上方法，會讓工作更有效，更深思熟慮，同時失敗的可能性更少。最重要的是，客戶會看到，你在努力理解他們的項目和使命，因此能培養雙方的信任和健康的合作，免于項目中的阻撓和意料之外的反饋。

Graeme Fulton—?riter的程序員和設計師，目前在英國直布羅陀，英國人）

我有過很多失敗的產品和想法，舉兩個例子：

1.Lostgrad社區

在我畢業那時，每個人都在為尋找工作而煩惱，所以我想，應該建立一個社區網站來幫助他們：

（http://graemefulton.com/projects/post/lostgrad-jobs-website）

幾年前，我在這里寫下了關于整個項目的失敗歷程，這是早期快速失敗教會我的最好的一課。

2. Slappy Face

我真的想不通這個項目為什么沒有成功：

你可以在這里體驗。

從這次的經驗中學習到（創造這個產品很有趣！），你不可能單靠優秀的設計來獲得產品成功。盡管它可能是世界上最好的產品，但如果你不把它拿出來，圍繞它建立社區，打造優秀的銷售團隊，你就不會收獲太大的成功。

現在，我正在開發一款關于電子郵件模板的應用，名為Tamarin Templates。

Kaiting Huang?（谷歌交互設計師，目前在美國西雅圖，中國臺灣人）

要回答這個問題，我們首先要定義成功的標準。谷歌有一套易于操作的評判標準，稱為HEARTS?？梢杂脕砗饬慨a品的用戶體驗：

• 好感度：用戶滿意度。
• 參與度：使用頻率。
• 接受度：新用戶對產品或功能的接受程度或者意愿。
• 留存：在一定時間內再次使用產品或功能的用戶。
• 任務成功率：完成某一任務的時間和達成率。

老實講，在加入谷歌前，我不清楚我的大部分設計是成功的還是糟糕的，因為設計公司的項目效果并不能被長期跟蹤。如果用“HEARTS”來衡量的話，我的大多數項目可能是“失敗的”，因為根本沒有資源或計劃來繼續跟進、迭代和優化。在沒有測試的情況下，是不可能第一次就把一切都設計好的。但對我而言，只要能從項目中學到一些新的東西，就是取得了小小的勝利。無論是了解一個新的行業，例如設計運河調度的應用；學習如何與開發人員合作，例如學習編碼和用開發語言進行交流；掌握一款設計工具，例如如何在Sketch中使用“符號”功能，還是結識有趣的同事，等等。

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

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

前幾天我在體驗一款產品注冊輸入驗證碼的時候發現，鍵盤能夠自動獲取到手機的短信，這真的是解救我這種每次輸入驗證碼要記兩遍的人。后來通過了解才知道是 iPhone手機更新 iOS12以后，系統鍵盤增加的提醒功能。

于是我又去研究了經常使用的京東金融，首先我測試了忘記密碼頁面，輸入驗證碼時他采用的系統鍵盤樣式，同樣系統鍵盤獲取到了短信驗證碼，直接點擊驗證碼即可輸入，簡單快捷。

同時我又測試了支付界面的短信驗證，京東金融為了安全考慮，并沒有采用系統鍵盤而是自己開發的安全鍵盤，并沒有獲取短信驗證碼信息，但是作為用戶的我并沒有感到不好用，畢竟以安全為主。

我想這個例子就可以回答我上面問的幾個問題。什么是用戶體驗？對于一個成熟的產品來說，你的用戶愛用、經常用就可以說他用戶體驗做得比較好。

如何才能讓用戶愛用呢？首先需要保證基本功能滿足；其次交互流程合理、最后在前兩個都做好的情況下，我們還可以從交互的小細節來提升產品體驗，從而讓用戶愛用。以下是我整理的8大交互小細節：

• 小操作也要及時反饋
• 讓用戶操作更方便
• 強調產品希望用戶注意的地方
• 激勵用戶進行下一步操作
• 新功能，引導用戶關注點
• 加入品牌基因
• 不經意時制造驚喜
• 點贊狀態跟隨

一、小操作也要及時反饋

反饋不單單是在大的功能頁面才用，小操作也需要提供及時反饋，讓用戶知道正在發生什么，從而有掌控感。這個反饋可以是聽覺、觸覺、視覺。

以愛奇藝安卓版V9.9.5視頻詳情頁為例，它就是加入了觸感反饋，當你點擊點贊或收藏時，手機會進行震動（目前iPhone版還未更新），當我發現這個小交互的時候就被吸引到了。當你點贊的時候，就像你剛戀愛時，你男朋友牽你手觸電的感覺，加入觸感之后讓整個交互更加情感化了。同時當你點贊或收藏成功之后，也會及時反饋當前所處的狀態，提示成功，從而增強用戶的把控感。

二、讓用戶操作更方便

讓用戶操作更方便，這也是我們在做交互細節時需要考慮的，這樣可以盡可能的縮短用戶操作時間，同時也可以減輕用戶的認知負擔，促進用戶下單。

以天貓購物車為例，購物車單個列表可以左滑進行發現、移入收藏夾、刪除等功能，而我們長按列表，同樣可以展示這三個操作。

我們知道側滑操作是 iOS 才有的，而安卓版大多數編輯操作都是采用長按，天貓 iPhone版2種方式都有加入，可以照顧到更多人的習慣。

三、強調產品希望用戶注意點

產品不單單只是為了用戶體驗，其最終目的也是為了盈利，因此通過一些小交互也可強調產品希望用戶注意的地方。

左圖：以大眾點評為例，大眾點評詳情頁不斷上滑時，頂部會將個人信息和關注按鈕進行置頂操作，這樣就可方便用戶在瀏覽過程中隨時進行關注操作。

右圖：以掌上生活為例，在精選欄目界面向下滑動過程中，底部會出現一個產品的氣泡提示，點擊氣泡會下滑至相關位置的產品。

四、激勵用戶進行下一步操作

激勵用戶進行下一步操作，在一定誘因趨勢下，讓用戶自愿做產品期望他們做的事情，從而激勵用戶進行下一步操作。

以天貓雙11活動為例，從天貓首頁界面加入搶666紅包為誘導，作為用戶看到這樣的內容還是很想點進去看看的，當然進入之后也不負眾望確實讓我搶了紅包，領取到了80塊的福利，同時下方還有各種任務列表，一步步引導用戶去操作，從而達到產品想讓用戶操作的目的。

五、新功能，引導用戶關注

引導用戶關注，通過外力引導可以引導用戶做產品想讓他們做的事情，雖然我們說好的產品會自己說話，但是對于某些新操作，是有必要提醒用戶的。

以愛奇藝為例，在首頁你看到有一個長按試試的手型引導，這個是新加的操作，在初期長按操作優先在安卓版才有，但是很多人都不知道這個功能，我也是無意中發現的。在 iPhone版上線后，他們在第一張視頻圖上加入引導，可以更明確的讓用戶知道有該功能，長按封面后可對視頻進行預覽、收藏、直接看正片等操作。

六、加入品牌基因

在產品中合理的加入品牌基因，可以讓用戶一眼看出這是你的產品，從而提升產品的識別度。下面我找了兩款交互小細節中運用品牌基因的案例。如下圖：

以轉轉為例，它在底部標簽欄舵峰發布按鈕處，剛進頁面加載時，會有一個裝有發條的小熊在那轉啊轉，在如今趨同的產品中，很容易就能夠知道是轉轉的吉祥物。

以美團外賣為例，下拉刷新時，顯示一個袋鼠快遞員送餐的小動畫，看到它我們很容易就能夠知道是美團外賣。

七、不經意時，制造驚喜

不經意時，在一些小細節處制造驚喜，從功能上來說并沒有什么幫助，但是這個驚喜提供了超出了用戶預期的體驗，就會讓用戶對產品產生好感。

以騰訊視頻為例，在 doki明星詳情中，為明星打榜后可以繼續沖榜，點擊沖榜就有很多小愛心從天而降，為用戶營造浪漫溫馨的氛圍，提高用戶的幸福感。

八、點贊狀態跟隨

當某個功能比較重要時，可能會在多個地方出現，這時候就需要做好狀態的數據跟隨了，如下圖:

以騰訊視頻為例，騰訊doki詳情頁面在文章底部有一個大的點贊按鈕，提示用戶看完內容后進行點贊操作，但是如果用戶并沒有滑動到底部想點贊怎么辦，所以騰訊在詳情頁的底部固定有評論和點贊，在交互上就需要做到，點擊其中一個，另外一個效果要進行跟隨。

總結

作為設計師，我們在設計時除了考慮實現基本功能外，同時還可以考慮如何設計才能夠抓住用戶，讓用戶為你的產品買單。以上八個交互小細節其實仔細看，你會發現總結起來就是反饋、提醒、引導、激勵這些交互方式，在做交互設計時需要我們落實到細節，加強產品與用戶之間的互動，從而提升產品體驗的交互細節。

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

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

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

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

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

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

但是有需求就有市場，想一想為什么你討厭拼多多，是假貨、是山寨、還是其他什么，究其原因是飽漢不知餓漢饑。而飽漢只是很少一部分人群而已，我們自然不是他的目標用戶，隨你拉黑也無所謂，所以社交電商的崛起是必然，并且有他獨特的優勢：

• 在移動場景下的購物場景更加豐富，勢必為社交電商打下了更好的基礎；
• 社交電商在發展政策上逐步完善，將是一片潛力巨大的市場；
• 獲客成本低，下線城市發展空間大；
• 電商巨頭排兵布陣，準備構建社交電商生態。

目前社交電商的形式主要分為兩種，一種是拼團，如拼多多，這種模式通常發起者是不收益的，只是所有拼團者可以享受更低的價格購買商品，算是一種利人利己，裂變質量更好的一種行為。另一種是微商，這種模式的裂變范圍更廣，但是裂變質量較差。微商被冠以惡名刷屏大家都明白，而經我們研究發現，其實發圈的推薦購物是效率的分銷行為。還有這樣的熟人賣貨邏輯是否可行？

社交是最好做的，也是最難做的。購物從本質上來說都是發現有需求才購物，但逐漸的變成了逛／別人推薦想起來自己有需求，再購物的變化。前者我們可以通過廣告、營銷、產品的優化來讓用戶轉化，而后者正是現階段我們需要考慮的事情，如何讓用戶買單那些可能有需求的東西，滿足用戶其他更深層次的需求。

2017年艾瑞咨詢的移動社交用戶在應用內購物驅動因素分析，我們能發現社交關系鏈的價值還是非常值得挖掘的呢。

俗話說的好，詳情頁乃兵家必爭之地，得詳情頁者得天下。首先我們來看看詳情頁的首屏?？芍^是百花齊放了，業務、用戶、場景決定了功能與信息架構。電商詳情之所以復雜就是因為它需要承載很多復雜的場景，所以很多時候并不是所有的信息都是有用而你又無法簡化。這顯然不僅僅是普通的電商所呈現出來的商詳，而是擁有「社交背景的商詳頁?！?

那么下面我們分別從功能結構、以及細節來剖析這四款電商產品的商詳。

一、拼多多

1. 功能結構

從信息結構上看頁面信息層級還是比較清晰的，也確實很像3，4線城市大賣場的感覺，各種活動優惠的標簽也是很排斥奧卡姆的剃刀了。但是各種活動標簽依然讓人有些眼花繚亂，視覺上頁面缺少一些品牌特征。

其實我之前有做過物流的產品，當時也很糾結好用和好看的平衡點到底在哪里，后來我發現了如果為了要用而要舍棄好看，請不要猶豫，一定要選擇好用。而你一旦絞盡腦汁想辦法折中，對不起，那會變的既不好看又不好用。所以拼多多的視覺、圖片風格我還是很能理解的。

然后首屏的上半部分依然是幫助用戶建立認知的信息介紹區域，同樣也是大圖置頂的方式，但是細心的小伙伴在對比的時候能發現拼多多其實把全場包郵、假一賠十等特色信息放在了第一梯隊的板塊，很明顯，它想告訴大家我們的服務是一流的，不會有假貨，因為全是山寨。

2. 細節

比較特殊的地方是，在左下角有一個更多的按鈕，收納了歷史瀏覽、回到首頁和幫助3個功能，通常「更多」的按鈕會放置在右上角，這里的設計和大部分用戶的認知可能不太一致。還有一個比較有意思的是，價格最右側顯示的是已拼而不是已售，所以從細節能看出來拼多多是有多么強調拼團這個屬性了。

然后我們熟悉的購物車功能沒有，因為拼多多也是限時拼團電商，要拼團先支付，所以沒有購物車的場景。而大家看到的單獨購買這個錨定效應也是運用的很直接了，應該沒有人會用更高的價格還死命的加購物車吧？

錨定效應（Anchoring effect）是指當人們需要對某個事件做定量估測時，會將某些特定數值作為起始值，起始值像錨一樣制約著估測值。在做決策的時候，會不自覺地給予最初獲得的信息過多的重視。

二、云集

1. 功能結構

云集首先是一家會員制電商，其次才以社交的手段來進行分銷的電商。大部分以微商形式存在的電商都會面臨店主同時可以買或者賣的場景。然而很有趣的是，這樣的 s2b2c的模式，商詳究竟要如何做呢？其實你能發現，優秀的電商產品總有自己的核心關鍵詞，比如拼多多是拼團，云集是批發價。所以當我們要滿足買的場景時告訴用戶自購可以享受批發價，而賣的場景則可以賺利潤。雖然買的場景多，但是為了業務考慮，我們依然要把賣的場景做足。

在商品詳情中，和其他產品不同的是多了這幾個功能：

• 任務獎勵，通過完成銷售筆數和金額達成任務。
• 品牌授權，對擁有被授權資格的商品透出品牌授權背書入口，增加用戶的品牌信任度。
• 發圈素材，不是自用推薦的商品，一般很難賣，別人的發圈素材能夠幫助店主更快的賣貨。
• 大家都在賣，賣也要賣好賣賺得多的商品。

以上的功能都是刺激以及幫助這些小b去推薦及銷售商品。從而整個商詳頁都是為了形成一種賣的氛圍同時兼顧著買的功能。

其實我們都知道，社交電商（微商）都是有組織有紀律的，只有散戶才會自己挑商品找素材去賣貨，而擁有社群的店主只需要一個商品的二維碼即可。

2. 細節

用過云集的買家都知道，云集和環球捕手一樣是沒有和其他電商一樣的評價功能的，會有人問為什么那么重要的評價功能不放呢，別人如何建立信任呢？其實我們有在收集評論但并沒有公開，而且我們側重的是推薦購買，別人推薦你之后其實評論的意義就不大了。所以既然我們在收集評論那在供應商的選擇上也會一直更新。

另一個原因就是評論這個功能在去中心化的小b店主為中心的產品中并不合適，可以想一想，社交電商和傳統電商不同，傳統電商會有商家入駐，商家和小b店主的區別在于商家除了需要銷售商品時，還需要維持店鋪的信譽和好評率，所以評論對于商家來說特別重要。但是以平臺為背景的店主只需要分享商品賣貨就行，評論的好壞并不是特別重要。

所以說到這里大家就會覺得社交電商真的是一個偽命題，你到底是為了別人好還是純粹想賺錢。所以大家發現在這樣的場景下，評論好那么都OK，如果出現大批量的差評，這個差評給的是商品，并不是某一個小b店主，在這里商品和服務就不像傳統電商那樣捆綁在一起而是區分開了。

三、環球捕手

1. 功能結構

信息整體強調了價格和限時特賣，弱化了標題和介紹。再早些時候所有 app 都還把標題放在價格的上面，并以大字體風格為驕傲?，F在反而都把價格放在了標題上面，而環捕把價格元素做的更加明顯。

2. 細節

標題和介紹字號變小我認為可以理解，在同樣以推薦消費的背景下，我已經知道是什么商品了，不管是從別人推薦而來還是自己從列表點進來都已經對該物品有詳細的了解，商品標題和介紹并不是特別重要。不過既然如此，介紹放一行也應該足夠了，既要弱化為什么又要放多行。排名和最近銷量筆數的視覺呈現有待改進，一個直角一個圓角不太和諧，最近銷量不可點擊卻做成按鈕的形狀。

四、洋蔥海外倉

1. 功能結構

大家可能對洋蔥跨境電商比較陌生。它同樣也是一個線上的分銷平臺。它的模式和其他兩個稍有區別，用戶如果想賣貨可以選擇兩種方式，一種是成為代理商，代理商可以招募店主，同時可以獲得下面店主銷售利潤的30%。而店主不可以招募店主。而另一種就是直接成為店主，可以獲得銷售額利潤的70%。

說完模式，我們來看看它商詳的信息展示。首先我們會發現在商品大圖上方展示的是相關的8件好貨，那么我們能想到的是：

• 為了提高客單價，
• 跨境電商的郵費國際物流和清關費較貴。

所以能一次性買足夠的商品自然是比較劃算，所以在這里更明顯的位置放置了相關的商品供買家和賣家挑選。

你會發現洋蔥在詳情中加入了評價功能，但這里的評價并不是所有的用戶的評價都能夠被顯示出來，而是經過官方審核以及店主上傳的評價才能夠被顯示的。

2. 細節

洋蔥將利益點和賣點放在了圖片中沉底，這也能夠讓商品與文案的關聯性更強，缺點是容易被忽略。

產品介紹上方會出現一個頭像，但是新手用戶會很疑惑這個頭像到底是誰？官方還是店主不得而知。而該產品的介紹文案過多也會影響首屏的展示效率。

洋蔥將返回首頁、以及底部標簽導航的功能集合在了一個 fab上，令人不太理解的是懸浮按鈕中和底部均有購物車功能，然而二級頁面也沒有存在這個 fab，所以懸浮按鈕中的購物車功能有點雞肋。

所有的「社交電商」在應用內放置互動聊天的功能都特別雞肋。店主與買家的社交紐帶依然是微信，而平臺對于買家來說只有在逛和買的時候才會使用，即使做了IM也無法在應用中植入社交場景，更不用說讓用戶養成習慣了。所以做社交要有背景。

底部只有加入購物車，沒有立即購買按鈕。一個是希望提高客單價，同時幫助用戶節省物流費。另一個是 b2c電商的產品都由平臺物流統一發貨，他和 c2c 的淘寶不同的是淘寶購物都是根據不同的商家進行物流運輸，所以不同的業務模式形成的功能也是不同的。

總結

廣告營銷的電商模式未必能滿足喜歡個性化需求的用戶，我們購物或許會逐漸的變成你覺得我適合買什么而不是我看看你有什么。徐志斌老師在《社交紅利》中提出社交紅利能夠從人與人之間的關系，互動中產出更多的價值，那么基于電商背景是否可以將電商價值最大化。

而我們今天討論的社交電商商詳，它能夠幫助小b用戶與c端用戶更的鏈接，不同業務模式下的商詳所呈現出來的功能、框架、視覺表現都是有很大區別的，而我們要做的是讓買賣雙方的關系鏈更結實。

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