解讀設計師如何向上司介紹UI作品

很多設計師尤其是初級設計師的第一反應是「好看的呀」 或者是「我分不出好壞」。

UI設計師只負責把它做的好看嗎?沒錯,高顏值的產品確實養眼,但這只是其中的一部分,它不能決定整個產品的整體體驗,設計最終是為人民服務的。著名設計師菲利普·史塔克說過:我們是設計師,不是藝術家。所以我們既要提供視覺上的感受,也要提供體驗上的享受。

那麼,我們需要哪些標準來判斷呢?

風格定位是否準確

每個公司每個產品都有一批精準用戶,有些比較大眾(用戶群比較廣泛),有些比較小眾(垂直到某領域)。如果你知道公司的定位是什麼?你的服務對象是誰?那麼剩下的問題就是,我們該怎麼做可以滿足他/她/它們的需求,解決他們的痛點。

編者註:定位清晰後,接下來該解決用戶的問題了→ 《聚沙成塔!平台型產品從「分散用戶痛點」推導「統一優化方案」的思路總結》

通常意義來講,目標受眾越廣泛,那麼設計就需要越簡潔且偏傳統。這就是你經常會看到一些APP沒什麼特色,缺少了性格色彩方面等元素,但又很實用。另一些設計很炫酷、華麗、或者很奇葩,這些特點適用於小眾群體,卻不適用大眾口味,如果你的受眾數量較少且比較典型,那麼可以投其所好,依靠設計噱頭來吸引他們的注意力,這就是你在設計前需要思考的取捨關係。

設計體現點:頁面氣質(調性)、主色系、字體、交互方式。

△ 圖片來自淘寶、GILT、單讀

圖1淘寶的定位是大而全的網路商城,沒有你買不到,只有你想不到,是一個綜合型的百貨。服務涵蓋吃喝玩樂,輻射到各種各樣的用戶,受眾群很廣泛,因此他們的風格特徵就是熱鬧,選擇橙色作為品牌色,也是襯托熱鬧活力親民等特徵,字體和交互方式都是偏常規,為了更適用於廣泛的受眾群。

圖2GILT是美國的一個奢侈品電商,採用一種非常特殊的模式,會員制的奢侈品折扣模式,主要是銷售一些著名設計師的限量奢侈品或者是從未與大眾見面的產品。由於目標用戶明確,所以風格定位也很清晰,主要突出奢侈感、品質感,採用經典色黑色為主色,白色為輔助,瀑布流模式,字體會有一些襯線字體,商品內容、圖片品質都是極高的,整個頁面中沒有雜亂的其他信息,有助於提高用戶的閱讀體驗。

圖3單讀一個很小眾的閱讀產品,而且還可以聽, 內容是一些作品、書、電影等等。目標用戶明確,內容質量高,每一屏是一個故事的引言和配圖,簡潔精緻,風格定位很文藝,文字是襯線體,精美的配圖,米白的紙色和金色的輔助,使得整個APP散發著一種精緻書本的味道。

吸引力夠不夠

這裡所說的吸引力不單單是說你的設計有多炫酷,多吸眼球,而是你想展現的內容是否第一時間吸引到用戶的目光,從而引導用戶完成目標需求。

A wealth of information leads to a poverty of attention.

大量的信息會導致注意力的分散。——Marty Neumeier

好的設計里是沒有使用阻力的,在龐大的信息架構中篩選你想表達的信息重點是非常重要的。要避免信息超負荷,過多的信息是在給你的設計添加阻力。因此,你需要去切實了解一下你的用戶從你的設計中想要得到什麼,並且在很多情況下,你需要自己提煉信息,做一些加減法,進行重組。

設計體現點:文案、字型大小、字間距、版式、層級關係。

△ 圖片來自ENJOY、PAPER

圖1ENJOY 一個精選美食電商,首頁清新有節奏,從文案、文字、字間距的把控都是很通氣的,瀏覽起來不壓抑。首頁banner作為今日推薦的模式,配圖精美品質高,首屏佔比很大,吸睛度很高,五個分類圖標精緻奪目,很容易吸引用戶做出行動。作為用戶,首屏告訴我這些就足夠了。內容多了會讓用戶視覺焦慮產生煩躁,反而打斷需求目標。

圖2、3paper 作為一個效率類的產品,他的功能點有很多,包括思維導圖、設計圖、筆記、靈感、清單、注釋等。它的首頁非常具有吸引力,它的特點是把不同的功能都展示在一起,就像一個牆面,把所有的創作靈感或是主要記錄以縮略圖的方式展示出來,一目了然。左側抽屜做為分類頁,方便收納查找。而不是像一般的效率類應用,首頁做了很多入口,層級很深。

市面上有些類似應用,會把新手教學、新功能提醒等放在首次開機引導頁,只顯示一次。但是paper巧妙的把新手引導和新功能展示放在首頁的每個縮略圖模塊里,這樣既減少了步驟,又可以強調功能,還可以有效的引導用戶去做操作。

用戶體驗好不好

好的用戶體驗包含很多方面,比如說Whitney Quesenbery提出的5E原則,包含了有用性(Effective)、效率性(Efficient)、易學性(Easy to learn)、容錯性(Error Tolerant)、吸引力(Engaging)。

簡單來說就是,我們設計的產品要對用戶有實際幫助,能一定程度上提高生活的效率,容易理解並快速地知道如何操作。在用戶進行失誤操作後,能夠有挽回措施或者不會造成較大的損失。對用戶是有吸引力的,無論從功能還是造型上。

設計體現點:交互方式、產品思維、表現手法。

△ 圖片來自FUNNEL

新聞APP是日常生活中經常用到的一類APP,普遍是嚴肅的、單色調的設計。Funnel是其中設計感比較強的一款APP,Funnel的界面非常簡潔,功能簡單,設計活潑生動,看不出來是新聞類的APP,Funnel的主要功能是播放新聞,用戶可以根據自己喜好挑選適合自己的新聞。

交互方式也十分簡單,選項設計一目了然,使用不同的色彩和縮寫來表現不同的新聞台。內容實時更新,適合快節奏生活的上班人群,可以在上下班路上,聽自己喜歡的新聞頻道,用耳機或底部控制欄切換播放。不感興趣的內容直接點擊取消,十分方便。整個APP使用流暢,配合悅耳的點擊聲和彈性的動效,體驗感很強。

設計細節有沒有

就算細節不能決定成敗,那也能博得用戶眼球。在琳琅滿目的APP里,各路花色的設計中,怎樣能脫穎而出,怎樣能讓用戶眼前一亮,怎樣能給用戶帶來新鮮感,怎樣讓用戶在使用你的產品會因為一些細節而記住你。好的細節能給產品注入生命力和活力,博得好感,而不是一個呆板冷漠的人機操作。但細節使用不當就是畫蛇添足,帶來體驗上的阻力,所以添加細節也要合理使用,一切要建立在需求和體驗之上。

設計體現點:載入、icon、引導、分割線、音效等各種合理的地方。

△ 圖片來自融360、FANCY

圖1融360在這次全新視覺升級之後,增加了很多小細節。比如底導航在用戶每次切換點擊時,高亮圖標增加了延遲動效,交互流暢,互動感很強,比傳統的切換點亮增加了不少活力。

圖2Fancy 社區是一個可以幫助你發現併購買世界上最具品位的精美產品,Fancy 網站是基於圖片分享的B2C及C2C電商平台,產品偏向於時尚、高端、創意,新奇。它的註冊按鈕很有趣,當你開始輸入內容的第一項時,註冊按鈕就開始點亮25%,有點步驟引導的意思。隨著四項註冊信息的輸入完成,註冊按鈕就被全部點亮,綠色的按鈕也意味著輸入信息完整無誤,用戶可以繼續操作下一步了,整個交互很流暢。

數據反饋怎麼樣

數據反饋是對產品和設計結果的驗證。數據是人類行為的痕迹,通過數據來判斷用戶們的思考,行為和交流方式,了解用戶的動機和痛點,找到對你有價值的數據,創造有意義的產品體驗。所以數據反饋是重要的參考,數據驅動設計,能夠幫助我們在設計中做出決策。

GSM:Goal 目標 、Signal 信號 、Metric 指標五度模型:吸引度、完成度、滿意度、忠誠度、推薦度。

簡單來說就是,我們設計的產品要對用戶有實際幫助,能一定程度上提高生活的效率,容易理解並快速的知道如何操作;在用戶進行失誤操作後,能夠挽回措施或者不會造成較大的損失;對用戶是有吸引力的,無論從功能還是造型上。

設計師可以簡訊發送訪談邀約問卷,進行面對面訪談或可用性測試。

△ 圖片來自融360

我們和交互組同學對融360首頁進行了用戶訪談及可用性測試,目的是了解大首頁改版對用戶的影響,了解用戶主要業務使用的狀況,挖掘用戶的體驗痛點及訴求點。針對吸引度、完成度、滿意度做了用研,得到了一些直觀反饋,因此我們就需要針對這些反饋結果提煉重點,重新再設計。

最後,一個產品的設計是好是壞,不是你的主觀感受,也不是你的一眼之緣。要學會分析產品、分析用戶場景,結合用戶需求和操作體驗,階段性的做總結,才能培養你的判斷能力,不要再做一個只停留在視覺層面的設計師了。

圖文來源於 : 融360RUX ,本文版權歸原作者所有, 所有本文只供學習勿用於商業

親愛的同學們學會了嗎?喜歡的可以點贊關注分享的哦!

如果你還想學習更多的加下面的群哦!


推薦閱讀:

UI 設計進階 3-2:以用戶為中心的設計:兩本書
交互設計和用戶體驗書籍推薦
掃盲貼: 教你如何 6 步快速上手設計師神器 Abstract
人工智慧設計

TAG:交互設計師 | 交互設計 |