怎麼用隱喻設計引導用戶？

12-15

謝邀

- 以下內容多圖，手機用戶慎入 -

設計的本質是解決問題，而不是形式大於內容的表達。

這句話我在知乎上說了快兩年，但每次回答設計類問題時，我還是要再反覆強調一下，所以，請別嫌我羅嗦。

我們先來拋開所謂的「隱喻」。就單說如何做引導用戶的設計。

咱們先來思考一下，為什麼要引導客戶？咱們到底要引導客戶的什麼？

一則長文，用戶沒耐心看下去，但是，我們在視覺上，對文字的行距、字間距、字體字型大小做一些人為處理，讓客戶看起來不吃力，並且願意看下去。這算引導對不對？（大家可以注意一下我所有答案的分段，還有加粗，其實都是為了讓人看著不累的，知乎上有很多好答案，其實都是被格式給毀了）

再比如說，一大段文字，密密麻麻，咱們為了讓用戶們在最短的時間裡知道這段文字到底想表達什麼意思，我們刻意的將其中一些關鍵部分，關鍵詞用特異的色彩，或者字型大小加粗的方式來表達，從而突出重點，這也算引導對不對？

所以說，說到對用戶的引導，其實，最根本的，是設計方需要明白你的目的是什麼。這，才是最關鍵，最核心的，你說對不對？

前幾天，走親戚。

親戚家的孩子，熟練的用ipad玩一個算是有點點複雜的小遊戲。親戚說，這孩子可真是聰明啊。

知道我心裡在想什麼嗎？

我把ipad拿來看了一下，我明白了。其實並不見得是孩子有多聰明，而是那界面的設計實在太人性化，就連一個3歲的孩子都能看得明白其中的操作步驟。我想，這，其實就是用隱喻的方式來引導用戶的最好的例子。

其實，只要留意觀察生活周遭，並細心體會，我們會發現，我們很多行為方式都是在被一些設計引導，這些例子，我就不再具體的多做說明了。

這個問題有些寬泛，由於版面關係，我無法窮盡的把每個例子都列舉出來。所以，我只列舉一些我曾經幫助我一些朋友們的例子。

用設計引導用戶。有以下兩個關鍵的方面。

第一：想ta所想，替ta著想，把ta當個孩子般看待，用圖形去告訴ta你想讓ta知道的事情。

案例一：

我一個朋友，做天貓。很多店鋪首頁都有那種輪播的廣告圖，大家應該都有印象吧。就是下圖這樣的。

他的店鋪，首屏有4幅廣告輪播圖，可是第四幅圖基本沒有點擊。說實話，4幅圖的數量確實有點點多，但絕對不至於多到後面的圖沒人點。

我只看了一眼，就發現問題出現在哪了。於是，朋友按照我的意見將圖做了修改，結果效果立竿見影。

大家仔細看看我到底讓他做了哪些改變？其實很簡單對不對？就是暗示性的告知用戶，這個輪播共有幾張，以及你在看第幾張。

案例二：

還是我的這個朋友，還是他的店鋪，依舊是點擊率的問題。

在他的店鋪內，消費者可以先領取代金券，再拿代金券去消費。可他店鋪代金券的領取率非常低，由於很少人領券，所以導致客戶覺得不划算，又進而直接的影響到店內的銷售情況。所以，這個看似很細節的小問題，讓我那朋友很頭痛。

大家仔細看看我到底讓他做了哪些改變？其實很簡單對不對？就是告知用戶，這張圖片是可以點擊的。

接下來，其實我們可以將這種暗示做的更細化一些。

通過擬物的方式，告知用戶，這代金券可以像遊戲機的獎券一樣，是可以被撕去，領取的。

以上第一個方面的內容其實很簡單對不對？

可是越簡單的東西其實卻是最難的。

因為越是基礎的，反而越容易被人忽略。

恩，好了，接下來，就是有關引導客戶設計的第二個方面了。

第二：不要以為設計就是玩玩圖形與色彩的把戲，心理學在其中也是很重要的。

同樣，我還是以我這位朋友來舉例。怎麼樣，當我朋友好處很多吧！

這次，我幫他解決的問題，是頁面停留時間的問題。

買家在頁面的停留時間會影響產品的轉化率，這一點我相信大家都明白。不是說要你把頁面做的有多麼長，而是要你做的說的每一句話，消費者都看完了，這才是最關鍵的。那麼，如何引導用戶耐心仔細的看完頁面呢？

我幫他做了這樣幾件事。

第一件事：

上圖，是他店內原有的標籤欄，很中規中矩的，對不對？很多店鋪都是這樣的。

而下圖，是我幫他調整過後的標籤欄。不要小看這細微的改動，修改後的頁面，買家的停留時間直線上升。

或許會有很多人看不懂我這樣做的目的。

在常規的傳統紙質的平面設計中，很多設計師習慣偏上的構圖方式，的確，偏上的構圖方式會讓畫面更加的充滿積極向上的情緒，而且也更加符合人的視覺習慣。但是，人，要懂得因地制宜和變通。

在此處，我刻意的用向下的箭頭來暗示訪問者，向下拉動可以看到更多的內容。

第二件事：

我讓他的頁面變的更有節奏。

上圖，是他原有頁面布局。中規中矩。不犯錯。但缺點是容易產生視覺疲勞，讓人覺得乏味。

而下圖，是我幫他調整過後的頁面。你們一定不會知道，為了每一個頁面，甚至每一張圖的尺寸、間距，我和我的團隊會做多少次的情景演練。我們會測試不同瀏覽速度，用戶會看到哪些內容，會首先看到什麼，然後再做反覆的修改和調整。

問題是「怎樣用」，而不是「有哪些」，所以就不做更多舉例說明了，希望對你有幫助。

總結：

一：不要忽視最基礎的細節，把用戶當作一個無知的孩子去對待，別讓ta們動腦子，在ta們動腦子前，就把ta們想知道的告訴給ta們。

二：用空杯的心態學習心理學，不要以為自己什麼都懂，不要以為別人都和你一樣，拋棄所有簡單粗暴對事物用美與丑的評價。潤物細無聲的引導ta們。

為便於查看，所有答案都在個人收藏夾內（ ENO［觀點與成長］ENO［美學與穿搭］），希望幫到需要的人。

在界面設計中我們需要通過心理學的知識，了解什麼樣的設計會潛移默化地影響用戶。而隱喻設計存在著多種設計形態——擬物、線索、環境。這幾種形態給用戶的直觀感受度是不同的，它們對用戶的引導依次降低。但相反的，越低的引導提示越能讓用戶沉浸在使用場景當中，專註於自己的任務。

擬物化降低用戶認知。在擬物的界面中，用戶能通過一些熟悉的元素產生相應的通感，他們在生活中是怎樣的感覺，就會在界面中有所映射。好的擬物界面會讓用戶覺得很精緻，有熟悉的感覺，這樣的話用戶的理解成本就會足夠低。擬物可以從形狀、材質、顏色等方面入手。例如顏色在不同的社會、文化背景下，被賦予了特定的內涵。它在用戶心裡，可能是一種情緒，可能是一段聯想，或者是一個故事。在設計時應該仔細琢磨顏色的使用對用戶心理所產生的影響。

用線索搭建隱喻系統。線索式的隱喻通常會比較抽象，無法直接用現實中的事物表現，而是通過對事物規律進行總結後再設計。通常應用了線索式設計的功能並非主流程的操作，更多的是可以讓部分用戶更方便完成快捷操作。為了突出界面的核心內容，線索的表現一般需要用戶進行一定的探索，所以在設計時應該考慮更多的引導而不是直接表意。

營造環境的隱喻。越好的隱喻設計其表現形式越是自然，通過營造一個使用環境甚至可以讓用戶在不知不覺中被引導到我們所希望的狀態。產品中的隱喻設計能否帶動用戶，不僅和人們的潛意識有關，還與用戶的社會、文化背景、習慣和經驗有所關聯。在移動界面的設計中，屏幕內的空間只是設計的一部分，我們常常會將屏幕外的空間利用起來，以擴展屏幕內的內容。

首先引用《快捷酒店》APP的實例。
這是一個隱喻的例子。

結合現實生活中相關元素，進行行為的隱喻。咖啡豆、磁帶、出票+鋼印。隱喻讓用戶使用過程中感覺到產品的情感，設計者的情感元素。
可以是動態效果、視覺效果。
1比如打開任何一個蘋果APP的張開效果都是從這個APP為出發點放大。
2編輯簡訊右移，返回左移。
隱喻視覺效果比如圖標、色彩、形狀、光等等
垃圾桶表示回收站或者刪除，來源於生活用之於生活，大概就是這個意思了。
想要做好隱喻設計，多多觀察生活和觀摩產品會得到較大的收益，豐富自己經驗。
相信會做得越來越好，將隱喻表達得恰到好處，讓用戶更加舒服，方便認知，這就是我們做隱喻的目的。切記不要做過

目前的答案並沒有很好地從正面回答設計中的「隱喻」。

首先看下「隱喻」這個詞，「隱」字就直接表達出了核心，即所表達的意思和形式沒有直接的關係。
然後再看「喻」，其實是類比，同理的意思。

我這裡用一篇Medium上剛發表的文章舉例，說明一下設計中的「隱喻」：

插畫設計師（ Illustrator Designer ）Thomas Danthony被委任設計Medium（Twitter創始人之一創建的一個著名博客）的4張插畫，表達以下4中對應行為：

創建賬戶 Create an account
關注人 Follow people
分享故事 Share your story
參與對話 Engage the conversation

然後Thomas Danthony 設計了以下4張插畫，不用說，這就是最經典的「隱喻」了。

創建賬戶

關注人

分享你的故事

參與對話

原文：Illustrating for Medium

完。

謝謝大家的回答、贊和感謝，雖然不多。但是非常開心。再來更新乾貨。
某知名手機app有一個很好的例子，如下。

這是該軟體裡面查看訪客記錄的界面，當你查看訪客的時候，下面那個黃鑽廣告看著很礙眼對不對！！！

影響視覺感受對不對！！！

你也是強迫症患者對不對！！！

想給它抹掉對不對！！！

哇塞，廣告右邊有個小?對不對！！！

貌似可以抹掉對不對！！！

好高興好激動！！！！

就在右下角！！！點擊！！！

於是成了下圖這樣子 =_=

這個時候有個稍微長的時間載入圖像，點物理按鍵都不太管用。大家通常有點楞！

我覺得這是軟體開發者們有意的。

丫的就是給你們反應過來的時間！！！

反應過來後就成了醬紫！

尼瑪！！！！！！

我只是想抹點它！！

點個?而已！！！

為毛成了這樣！！！

後來我發現了，尼瑪?和開通黃鑽這幾個字那麼近！

開通黃鑽那麼黃那麼大！！

?那麼小！

勢不兩立的哥倆還那麼近！！！

天真如我以為入的是?，結果卻讓開通黃鑽懷上了。

我不信吶！！！

後面拚命的試！！！

手指頭盡量靠右下角，甚至用小拇指！！

結果還是開通黃鑽！！！

騰訊，你贏了！！！！

後來我開通了黃鑽，成為了黃鑽貴族。

=_==_==_==_==_==_==_==_==_==_==_==_=更新了

每次登陸app的軟體更新提示，以某訂餐app為例:

你看，它不會設置選項為:現在升級和暫不升級（以後升級不升級以後升級返回）之類的。

而是:稍後升級和現在升級，事實上，稍後升級沒什麼其它的意思，就是本次進去app我選擇了不升級而已。

但是給用戶的感覺是:兩個選項，一個是現在升級，一個稍後升級。

稍後給人的感覺是時間距離很近，而且遲早都要升級的，現在升級了算了，免得後面麻煩！

你看，這就是一個語言暗示。

而且「現在升級」按鍵在右邊哦，是不是覺得比「稍後升級」更方便按呢。

意思就是：所謂隱喻式設計，都是幻覺。
另外，top1答得很認真，可惜跑題了，絕大部分例子都是受範式的例子（pliancy），如何讓用戶感覺到你想讓他點擊的區域是可點擊的，而非隱喻式設計（metaphor design)。
然後發現樓里的人幾乎都跑題了....可能因為Metaphor這個單詞中文無法直譯，造成大家對lz題問有理解偏差。

我覺得可以參考格式塔心理學的關於「頓悟原理」的研究，隱喻就是讓人「頓悟」的手段，明白頓悟原理，也就知道如何設置隱喻了

不知道聖經，古蘭經是不是外星文明的隱喻。
神話是藏著隱喻的，因為最近在看沙丘，所以想到

一些界面設計師經常使用合適的隱喻來作為界面設計的基礎，他們認為如果界面充滿用戶熟悉的來自真實世界的物體的圖案，用戶會比較容易學會該界面的使用。
隱喻界面依賴於用戶在界面提示與功能之間建立的直覺聯繫，而不必了解軟體的運營機制。
當我們在交互和用戶界面領域提到隱喻時，我們真正指的是視覺隱喻，即用於描繪事物特徵的圖片和圖形，用戶通過外延理解事物（功能）。

日常見到的界面充滿各種隱喻，以微信界面為例。

「搜索」像一個放大鏡，告訴用戶，這裡可以找東西。
文件是一個文件夾形狀，通知是一個喇叭。訂閱號的隱喻不太容易理解，它可能只是為了與前兩者統一格式。
最下方一排，微信是一個對話氣泡，告訴用戶「這裡可以和別人說話」，通訊錄就像一個人的半身照旁邊寫了幾行他的信息，「發現」是一個指南針，也許象徵著麥哲倫發現新大陸，告訴用戶「這裡可以發現新的好玩的東西」。值得說的是，一些隱喻是全宇宙通用的，例如放大鏡，代表「搜索」，一個人的半身形狀代表「user」或者「me」，齒輪代表設置，幾乎不需要文字說明。
而另一些隱喻，難以理解，例如微信下方的那個指南針，如果不添加文字說明，用戶很難識別。
所以微信在下排統一添加了文字說明，在認不出圖形時還有文字可以參照。

某些軟體論壇的安裝過程就是，不知不覺的就安裝了10幾個垃圾軟體(論壇代理的廣告廣告軟體)

站位待補充……

最近360的啟用新域名好搜，採用的網站標題是"好搜，不做壞事！"，這是典型的通過引起爭議來引導用戶的設計。
相關話題：「好搜，不做壞事！」，那麼是誰在做壞事？