譯者序
本文圍繞勸導式設計(persuasive design)而展開，介紹了移動終端上banner廣告、push信息等典型的勸服失敗案例，并從用戶與移動設備之間的情感聯系出發，探討了移動勸導策略的幾個切入點。所謂勸導式設計，是指通過說服和社會影響，而非通過強制的方式，以達到改變和引導用戶態度或行為的技術。這種技術常被應用于銷售、外交、政治、宗教、軍事訓練、公共衛生和管理等領域。近年來，大多數勸導式技術的研究主要集中在計算機交互領域，包括臺式電腦、互聯網服務、視屏游戲和移動設備。勸導技術可以看成是對用戶意圖的設計。

作者： Amber Krishan 譯者：曉千 秦封
譯文

【Tips：消費者不會僅僅因為導航很容易而為你的產品買單。】

為移動設備而設計時,設計師要考慮移動設備間的差異，努力提供統一的體驗。他們致力于減少點擊的次數，使架構更扁平；并根據觸摸屏的特點而設計, 在較小屏上規劃合理的布局等。這些重點都在通過方便的使用、流暢的導航和簡潔的呈現，來確保的最佳的產品可用性。

為確保你的用戶“可以做”你想讓他們做的事情，較高的可用性是一個很好的開始。但它并不能保證用戶“會來做”這些事情。因為，用戶不會僅僅因為導航容易使用而來買你的產品。

我們對音樂的渴求，一刻都不曾減少。現在無論上班途中、休息還是工作，我們總習慣先享受一下聽覺的盛宴。毫不夸張地說，音樂已成為了我們生活的一部分。

有很多熱情澎湃的設計師也在努力地為音樂的移動端界面創造一個富有創意的，吸引人的精致界面設計。比如這一系列，它們中既有仿古的設計風格，也有現代簡約優雅的。你會欣賞到厚重感十足的黑膠唱機，可能也會驚嘆于用色大膽的視覺沖擊風格。

希望今天的作品能帶給各位設計師們靈感！盡情享用吧：）

1. Music App UI (iPhone) by Piotr Kwiatkowski

UI（用戶界面）與UX（用戶體驗）是密切聯系的，優秀的UI界面首先就能從視覺上給用戶極好的體驗，今天我們從Drrible和Behance上挑選了50套用戶體驗超棒的UI界面，包括了睡眠APP、天氣APP等等，還有對Facebook、Instagram、Ebay等應用的扁平化再設計，都非常棒呦！如果你正在設計UI界面，那么可得好好借鑒學習一下，希望能給你帶來靈感 : ）

以前的進度條設計以擬物化為主，現在扁平化風格流行，連進度條也改變咯。藍藍設計推薦您看看40款收集的進度條設計，很多是Dribble上的作品，應潮流而生，想瞧瞧扁平化風格的進度條是怎樣的，就來看看吧。如果你對擬物化的創意進度條更加有興趣，那么來這里瞧瞧《18個讀取進度條的優秀設計案例》

Loading 也是一門學問，如何讓用戶等待加載時不煩還高興，藍藍設計推薦您可以看看這篇：《談談加載(LOADING)的那點事》，絕對從細節處提升用戶體驗 ^_^

Progress by yasir wadood

Circular progress bar by Alexandr Ivanov

界面設計包括哪些細節、如何深入？
我們常說“細節決定成敗”，有些界面會讓人覺得不精致，缺細節，而這些細節又包括哪些呢？如何去深入呢？

不妨來看本文作者，百度用戶界面設計師@JJ-Ying 為您娓娓道來：

• 界面元素的對齊，我見過很多同學對齊是永遠靠眼睛的。確實在布局的時候經常需要做到視覺上的對齊，而不是機械的對齊，但這不是界面元素可以隨意擺放的借口，該對齊的內容需要對齊，有時候只是舉手之勞，養成好習慣很重要，有點強迫癥也不是壞事情。
• 像素，雖然現在的分辨率越來越高，但是很多圖標、按鈕的邊緣還是最好都檢查一遍保證垂直和水平邊緣不會被虛化。
• 界面光源的一致性，一致性是個很大的課題，應該能寫一篇論文那么長，細節方面的一致性應該包括界面元素、文字陰影、圖標等的光源。假設深色的標題文字用了向下的淡色投影表現內凹效果，那正文就應該避免用深色的文字向上投深色的陰影
• 圖標面積的一致性，這也是一個一直難以避免的問題，而且有很多主觀成分，最好的方法是設計的時候放到實際屏幕上以較遠的距離查看，是不是有哪些會特別輕或特別重，然后再去調整尺寸
• 文案，雖然這不是直接的界面設計元素，但是嚴謹、完整的文案也是給所有設計加分的。常見的問題有中文錯別字、英文該大寫的沒大寫、拼寫錯誤等等
• 別直接使用 Windows 自帶宋體 / 黑體里的英文！！！這個不解釋
• 謹慎地使用高飽和度顏色、大差別漸變，我們 GUI 設計師總喜歡把自己當做藝術家，即使 GUI 真算藝術那也是限制最大的一門藝術（天朝的電影、電視劇不算。。。），大家大部分情況下遇到的設計場景沒有非常大的顏色空間去發揮，所以一些醒目出跳的顏 色和漸變使用起來要比較小心，否則很容易產生“俗氣”的感覺

什么是扁平化設計？

簡單的說就是拋棄那些已經流行多年的漸變、陰影、高光等擬真視覺效果，使用一些簡單的純色塊，從而打造出一種看上去更“平”的界面設計。扁平風格的一個優勢就在于它可以更加簡單直接的將信息和事物的工作方式展示出來，減少認知障礙的產生。

下面是列舉一些國外網站的例子：

Squarespace

新版的Squarespace幾乎完全采用了扁平化的視覺風格，只在一些細節當中使用了相對傳統的方式突出了重要的交互元素。試用一下你就會發現，其實他們的產品在功能邏輯上還是蠻復雜的，但這一切都隱含在簡約直白的界面背后，你真的可以從中隱約感受到其設計團隊付出的心血。

Facebook

Facebook是扁平化界面設計的絕佳案例。除了幾個主要的動作按鈕當中使用了輕微的斜面效果以外，其他界面元素全部采用扁平風格。鑒于他們多年來在這方面一直保持著這樣的特色，至少我們可以說這種設計風格對于Facebook來說是完全適用的。

扁平化設計是指舍棄漸變、陰影、高光等擬物化的視覺效果，從而打造出一種看上去更加平面的界面設計風格。扁平化的網頁設計更適合用于需要同時支持多種屏幕尺寸的響應式設計技術中。今天，我給大家帶來35套用于扁平化設計的圖標設計和網頁設計元素，記得分享和推薦啊！

Flat Free UI Kit

我要下載

Apple devices – Flat icons (PSD)

我要下載

Mobile Flagships with PSD

本帖收集了50套設計精美，并可設計師自行編輯的界面PSD源文件。內容大致包含banner切換，MP3/視頻播放器，日歷，表單（登錄，注冊，搜索…），進度條，提示框，按鈕，導航，面包屑等等…不管是應用在小需求還是大項目，相信都可為你帶來幫助。

Simple UI Elements

Apple Styled UI Elements

Grayness UI Kit

一個干貨推薦啦：25個定價界面網頁欣賞！沒錯！你沒有看錯，足足25個哦！啊？你問我有木有酬勞，呃！藍藍設計說是要給，但我肯定不會要的，雖然很想要，呃，出來混，后來還是木有要。。。）

價格界面是網頁中常見的，但容易被忽視的一個部分。想想看，你什么時候見過這些界面呢？本工第一反應就是迅雷、QQ之類的會員充值界面。這種不是經常可以看見，但是又具有明確目的性的界面，如何讓它和主題頁面匹配、同時又突出重點信息呢？這是個問題！今天就讓我們欣賞25個外國網站的定價界面，從中學習經驗吧；）

1. Freshdesk

成為dA（deviantart）的忠實用戶有很多理由——dA是最大的藝術社區；成為dA用戶簡直是設計新手的必經之路。但是，這些都不妨礙你加入其他專業的網站來展現你的才華。

創立于12年前的dA現在擁有最多的藝術愛好者受眾。然而，最近有人說dA有太多的作品只有在你腦補能力超強的時候才能稱之為”藝術”。用戶太多了，所以各種批評的聲音也紛至沓來！不管怎樣，不管你喜歡與否，dA是一個很棒的藝術社區，不過，加入其他藝術網站也會讓你受益良多。

今天，我們來了解七個主要的可作為dA替補的藝術社區來激勵設計師和有創意的藝術家。

1.Behance

與dA不同，Behance是為那些專業藝術家，那些以藝術謀生或者將藝術作為一個非常嚴肅的愛好的人建立的。由于嚴格規定和高標準，Behance正在成為一個高級的專業網站。

Behance的網站看上去很直觀，很有條理：作品按小組，類別，甚至國家來分類。用戶可以根據愛好，專業水平或者正在一起做的項目來建立朋友圈或合作伙伴圈。如果你想找這個網站的亮點，那就看看招聘版塊和交互系統吧。在Behance，藝術家們能得到一致的作品集系統來按照步驟展示工作流程和項目進度。雖然一堆大手的名字會嚇到新手，但是Behance可能是唯一能與藝術家和設計師分享你的經驗和知識并且獲得專業反饋的地方。