Facebook 產(chǎn)品設計師:如何提高自己的設計審美?

我剛剛進入設計這個行業(yè)時,非常差勁。曾經(jīng)有一段時間,我沉迷于模仿 Dribbble 上流行的設計元素,卻不知道該如何把它們和諧地統(tǒng)一起來。

如果你看到我的那些作品——糟糕的陰影和冗雜的、完全不必要的裝飾,只會稱贊三個字:辣眼睛。

我不是設計天才,但有一套「如何快速掌握所有設計技能」的方法。現(xiàn)在我想把其中一些經(jīng)驗分享給你們,無論你是否是設計師,這些經(jīng)驗都可以幫助你提高對產(chǎn)品的感知和對設計的審美

一、別單純使用 App,要學習這些 App

如果你是一位產(chǎn)品設計師,那么你需要通過思考來鍛煉你的設計眼光。

打開一個你經(jīng)常使用的 App,遏制住去刷它的欲望,專注于它呈現(xiàn)在你眼前的那個頁面。

你需要注意以下這些東西:

1. 層級結構

  • 這個 App 是如何通過設計來引導你的注意力的?
  • 哪些內容是突出顯示的?
  • 那些特定元素是如何通過顏色和文本樣式達到恰如其分的效果的?

2. 內容

  • 這篇經(jīng)驗的關鍵詞是什么?
  • 哪些內容是抓人眼球的或者是十分有趣的?哪些內容正好與之相反?
  • 行間距、字間距、段間距等這些格式是怎樣的?

3. 意圖

  • 人們?yōu)槭裁磿蜷_這個 app 呢?
  • 它解決了哪些問題?
  • 這個 App 是通過什么方法解決了這些問題?
  • 為什么它解決得很巧妙?

4. 用戶

  • 都是哪些人在使用這個 app?
  • 他們使用的習慣和你可能有哪些不同?
  • 這個App 的設計是如何為那些不同的習慣服務的?

二、分解這個App

下面這個 gif,是我曾經(jīng)分解的一個 App。

分解 App 有助于我們把注意力分別放在這個 app 的每個版塊。你可以跟隨這個 gif 去預測下一個版塊即將出現(xiàn)的內容,這樣一來,你可以觀測到很多之前沒有察覺到的細節(jié)。在觀察一組又一組依次出現(xiàn)的組件,保持你的好奇心,去觀察、去思考這個產(chǎn)品選擇的每一個元素。

Facebook 產(chǎn)品設計師:如何提高自己的設計審美?

△ Airbnb App 分解

針對 Airbnb 的一些觀察心得:

  • 搜索欄里的占位符,寫的不是「用這里搜索」,而是寫著城市的名稱「倫敦」。這樣一來,即使我并沒有想去倫敦,但是我看到這個城市也會感到很興奮。
  • 我不知道「Date」和「Guests」這兩個按鈕迭代了多少個版本,現(xiàn)在是直接放在搜索框下面。我相信很多設計是這樣的:「日期」這類選擇信息只有在你選擇了「目的地」后才會出現(xiàn)。這就讓我非常好奇了:用戶的搜索習慣是什么樣的?他們是如何評價過濾后的結果的?

Facebook 產(chǎn)品設計師:如何提高自己的設計審美?

△ Twitter App 分解

針對 Twitter 的一些觀察心得:

  • 注意:轉發(fā)(Retweets)和喜歡(Likes)的數(shù)字是加粗的。
  • 時間標簽不止包括了日期,還包括了確切的時間。為什么要這樣設計呢?另外,也要注意一下這個 app 縮短了的時間標簽(比如:在小寫頁面,使用「5h」,在介紹頁面則使用「4/14/18」)。考慮每一種用法的不同用意。
  • 在添加「tweet」的輸入框里有一句特別好的文案「填寫另一條 tweet」,而不是「添加一條 tweet」。

Facebook 產(chǎn)品設計師:如何提高自己的設計審美?

△ Spotify App 分解

針對 Spotify App 的一些觀察心得:

  • 注意觀察 Spotify 是如何讓歌曲不停播放的。
  • 新碟頁面的展示,包括新歌單和新專輯/單曲。
  • 我們可以看到「New Music Friday」后面有關注人數(shù),但是歌單「Release Radar」并沒有。究其原因,是因為「Release Radar」是用戶的定制歌單。

三、了解規(guī)則,你才能打破規(guī)則

坐在出租車里,或者等一個朋友時,你都可以打開一個 app,去分版塊分析這個 app 的設計師為什么要這樣設計它,用意是什么。這樣細致且大量地分析其他的 app,可以鍛煉并提高你的產(chǎn)品思維能力,幫你更好地設計自己的產(chǎn)品。

原文鏈接:《How to develop an eye for Design》? Kathleen Warner

歡迎關注譯者的微信公眾號:「藍湖設計協(xié)作」

Facebook 產(chǎn)品設計師:如何提高自己的設計審美?

圖片素材作者:Lina Leusenko

「作品太平庸?如何提高審美能力」

================明星欄目推薦================

優(yōu)優(yōu)教程網(wǎng) UiiiUiii.com 是優(yōu)設旗下優(yōu)質中文教程網(wǎng)站,分享了大量PS、AE、AI、C4D等中文教程,為零基礎設計愛好者也準備了貼心的知識樹專欄。開啟免費自學新篇章,按照我們的專欄一步步學習,一定可以迅速上手并制作出酷炫的視覺效果。

設計導航:國內人氣最高的設計網(wǎng)址導航,設計師必備: http://hao.uisdc.com

收藏 26
點贊

復制本文鏈接 文章為作者獨立觀點不代表優(yōu)設網(wǎng)立場,未經(jīng)允許不得轉載。