首先，你的產(chǎn)品文案不僅僅是一句友好的問(wèn)候，它還解釋了這個(gè)網(wǎng)站的性質(zhì)。其次，無(wú)論是建議注冊(cè)，或者直接跳轉(zhuǎn)到能夠吸引用戶(hù)的內(nèi)容，文案還起到了引導(dǎo)用戶(hù)第一步操作的作用。如同我們經(jīng)常說(shuō)的，交互設(shè)計(jì)需要被當(dāng)做一次交談來(lái)對(duì)待，所以這是你創(chuàng)造人性化體驗(yàn)的第一次機(jī)會(huì)。

下圖是旅行租房網(wǎng)站 AirBnB 的案例，文案極簡(jiǎn)，但同時(shí)深入人心。標(biāo)題 Just for the Weekend 和 Explore the World 讓用戶(hù)在去往特定目的地之前看到 AirBnB能夠帶來(lái)的體驗(yàn)。這個(gè)交互很微妙，通過(guò)文字的暗示，它構(gòu)建了產(chǎn)品體驗(yàn)的框架 – 讓用戶(hù)距離一 次愉快的旅程更近一步。

從實(shí)習(xí)的第一天起，我就數(shù)著日子在過(guò)，時(shí)間走的太快攔也攔不住，要做要學(xué)的事情又太多。轉(zhuǎn)眼七月已經(jīng)過(guò)去，總覺(jué)得還是有點(diǎn)后知后覺(jué)，花了一個(gè)月的時(shí)間去適應(yīng)新環(huán)境和新工作，慢慢才知道尋求突破點(diǎn)的重要性，所以今天來(lái)聊聊我所理解的交互設(shè)計(jì)師的核心競(jìng)爭(zhēng)力。

格式塔原理解釋了人們?nèi)绾我砸曈X(jué)方式感覺(jué)物體，以及圖像的結(jié)構(gòu)，視角，大小等要素是如何影響我們的視覺(jué)的。

在下面這篇文章中，我們首先會(huì)簡(jiǎn)單介紹一下格式塔原理中的基本概念，然后再詳細(xì)探討一下如何將它們應(yīng)用于今日的UI設(shè)計(jì)中。

在設(shè)計(jì)網(wǎng)站的時(shí)候，圖片資源會(huì)在很大程度上幫助你設(shè)置站點(diǎn)，以及顏色，排版或者更多內(nèi)容的基調(diào)。如果圖片視覺(jué)元素沒(méi)有和設(shè)計(jì)正確的結(jié)合，他很可能會(huì)破壞你原本想呈現(xiàn)的感覺(jué)。

移動(dòng)應(yīng)用的設(shè)計(jì)中，最容易被忽視的地方就是空白或者異常情況的設(shè)計(jì)。從傳統(tǒng)PC時(shí)代web的異常頁(yè)面如404，502等頁(yè)面的設(shè)計(jì)體驗(yàn)遷移過(guò)來(lái)，移動(dòng)應(yīng)用的空頁(yè)面，網(wǎng)絡(luò)故障頁(yè)面等展示也有相似的設(shè)計(jì)模式。從以前的純文本的排版設(shè)計(jì)，到后來(lái)404成為設(shè)計(jì)師們
展示圖形創(chuàng)意的舞臺(tái)，移動(dòng)應(yīng)用的空白情況頁(yè)面的設(shè)計(jì)也從純文本提示到后來(lái)精彩紛呈。然而在移動(dòng)應(yīng)用的設(shè)計(jì)中，空白頁(yè)面的的作用不僅僅在于給用戶(hù)以溫柔或者
精彩的提醒，安撫用戶(hù)焦急或是疑惑的情緒，更重要的是，空白情況頁(yè)面可以引導(dǎo)用戶(hù)去填補(bǔ)“空白”。人都是害怕空虛寂寞冷的，當(dāng)你面對(duì)一個(gè)空虛寂寞冷的頁(yè)面
的時(shí)候，善意的指點(diǎn)迷津的一些語(yǔ)言和畫(huà)面告訴你咱們還是可以有方法來(lái)填補(bǔ)你的寂寞空虛冷，這時(shí)候，用戶(hù)的操作行為就會(huì)被觸發(fā)，潛移默化中指引用戶(hù)完成填補(bǔ)
空白的工作，那么，無(wú)論從用戶(hù)個(gè)體的活躍度上還是整體的留存率，活躍度上，你設(shè)計(jì)的空白頁(yè)面做到了拉升的作用，對(duì)電商產(chǎn)品和社交產(chǎn)品等來(lái)說(shuō)，這些頁(yè)面可謂
是自己展示產(chǎn)品調(diào)性，曝光功能，加深引導(dǎo)的黃金地段。

1. 用戶(hù)不同，數(shù)據(jù)不同

任何時(shí)候設(shè)計(jì)一套復(fù)雜的系統(tǒng)，都不可避免要為很多用戶(hù)和角色進(jìn)行設(shè)計(jì)。總裁、經(jīng)理和分析師是幾個(gè)常見(jiàn)角色，每個(gè)都有自己的工作流程和對(duì)數(shù)據(jù)的需求。

定義好角色，產(chǎn)生不同視角，這本身就是一種藝術(shù)。我就不在此詳細(xì)解釋了。如果你對(duì)此有興趣，請(qǐng)看Cooper的這篇有用的文章。

關(guān)于角色，重要的一點(diǎn)是預(yù)先確定好，圍繞它們來(lái)組織信息結(jié)構(gòu)與線(xiàn)框圖。

下面是我們?nèi)ツ曜龅囊豢罱】祱?bào)告應(yīng)用的最終成品。這套系統(tǒng)有著不同的用戶(hù)群，他們各自都需要不同的數(shù)據(jù)管理。創(chuàng)建了關(guān)鍵角色后，我們每次評(píng)審會(huì)將它們放在旁邊。

4. All wireframe 全部界面線(xiàn)框圖

主要負(fù)責(zé)人：交互設(shè)計(jì)師

此環(huán)節(jié)交互設(shè)計(jì)師要完成全部界面的線(xiàn)框圖（1:1的）設(shè)計(jì)并且團(tuán)隊(duì)確認(rèn)。

*做完全部的線(xiàn)框圖，一般會(huì)出一個(gè)總結(jié)構(gòu)圖。如果有足夠大的場(chǎng)地，也可以逐頁(yè)打印出來(lái)貼到一面墻上。方便團(tuán)隊(duì)隨時(shí)參考。

譯者紀(jì)：本片文中包含大量的動(dòng)態(tài)頁(yè)面（原網(wǎng)站是視頻鏈接，本網(wǎng)站上傳視頻不能排序，故人工轉(zhuǎn)為動(dòng)圖），加載較緩慢，請(qǐng)各位多點(diǎn)耐心，么么噠

---

一個(gè)好的交互設(shè)計(jì)師可以很容易的解釋設(shè)計(jì)里面的決定背后的邏輯。這包含著信息架構(gòu)，頁(yè)面內(nèi)容的層次結(jié)構(gòu)，流程和所做的解釋。

遲早，動(dòng)效將會(huì)應(yīng)用到線(xiàn)框圖原型中，這個(gè)時(shí)候，再去對(duì)設(shè)計(jì)做決定或者是解釋?zhuān)瑢?huì)變的難一些。例如一些這樣的理由：太狂拽酷炫了……太潮了……太雞凍了……這將是設(shè)計(jì)失去其力度的領(lǐng)域（Reasons such as “It will be cool!” or “It’s trendy” or ”exciting” are exactly the areas where a design starts to lose its strength.）在我們的設(shè)計(jì)中，動(dòng)效理應(yīng)占到更多的比重。我們應(yīng)該去定義動(dòng)效，并且闡述他們的目的——像我們闡述一個(gè)設(shè)計(jì)中其他的元素一樣。

什么是功能動(dòng)效？

一個(gè)好的用戶(hù)界面具有較高的轉(zhuǎn)化率和易用性。換句話(huà)說(shuō)，它既能滿(mǎn)足商業(yè)用途也便于使用。以下是我們發(fā)現(xiàn)的一些想法清單。

上一篇：交互設(shè)計(jì)技巧：創(chuàng)造好的用戶(hù)體驗(yàn)（1）(翻譯)

21. 嘗試平滑過(guò)渡而不是突兀呈現(xiàn)

當(dāng)用戶(hù)進(jìn)行操作的時(shí)候，界面元素經(jīng)常會(huì)有出現(xiàn)、隱藏、移動(dòng)、轉(zhuǎn)換以及大小調(diào)整的動(dòng)作。作為對(duì)操作的回應(yīng)，為元素變化適當(dāng)添加時(shí)間延遲有時(shí)候讓用戶(hù)更容易理解剛剛發(fā)生了什么。以動(dòng)畫(huà)或者過(guò)渡的形式刻意制造的延時(shí)，給了用戶(hù)理解元素大小或者位置變化的必要的反應(yīng)時(shí)間。當(dāng)然了，你也要記住，我們應(yīng)該將過(guò)渡的時(shí)間控制在0.5s之內(nèi)，時(shí)間太久的話(huà)，用戶(hù)可能就會(huì)感到不適。對(duì)于那些只想快點(diǎn)完成任務(wù)的用戶(hù)，太長(zhǎng)時(shí)間的延時(shí)當(dāng)然會(huì)成為一種負(fù)擔(dān)。

 22. 嘗試循序漸進(jìn)的引導(dǎo)而不是草率地讓用戶(hù)注冊(cè)

與其要求用戶(hù)立馬注冊(cè)，何不讓用戶(hù)先體驗(yàn)一些已示范的有價(jià)值的操作呢？在最初的交互過(guò)程中，不僅能展現(xiàn)產(chǎn)品的價(jià)值，也能顯示出產(chǎn)品的個(gè)性。一旦用戶(hù)開(kāi)始看到你的產(chǎn)品的價(jià)值，了解產(chǎn)品對(duì)自己的用處，他們將更樂(lè)于與你分享更多的信息。這種循序漸進(jìn)的引導(dǎo)是一種盡可能推遲注冊(cè)過(guò)程的方法，同時(shí)還可以讓用戶(hù)使用和自定義你的應(yīng)用或產(chǎn)品。

一個(gè)好的用戶(hù)界面具有較高的轉(zhuǎn)化率和易用性。換句話(huà)說(shuō)，它既能滿(mǎn)足商業(yè)用途也便于使用。以下是我們發(fā)現(xiàn)的一些想法清單。

  1. 嘗試使用一列布局代替多列

一列布局會(huì)讓你對(duì)全局有更好的掌控。它也能讓你的用戶(hù)預(yù)先對(duì)整體的內(nèi)容從上到下有一個(gè)大致的了解。然而多列布局則會(huì)讓用戶(hù)從頁(yè)面的核心內(nèi)容上分散注意力從而增加額外的風(fēng)險(xiǎn)。最好的方法是用一個(gè)有邏輯的敘述然后在文末加上一個(gè)行動(dòng)的口號(hào)來(lái)引導(dǎo)用戶(hù)。 

  2. 嘗試用禮物代替直接銷(xiāo)售