PM高級技能:如何調整UI設計作品

3 評論 12870 瀏覽 64 收藏 7 分鐘

你的設計師搭檔沒有辦法做出你想要的效果?總覺得有問題,但不知道什么地方出了問題?是不是總讓設計師認為你在質疑他的審美?

視覺調整是產品經理必須要具備的能力之一,但實際上掌握這個技能的PM還是比較罕見的。

視覺調整并不是以審美為目的進行調整,在審美這個環節,我們需要充分相信設計師,他們比我們更加權威和專業。

因此,請PM們特別注意一個誤區:我們在調整視覺時,不要過分關注審美。

視覺調整,實質是調整信息元素的層級關系

  1. 將你最希望用戶使用和發現的元素放在最好的位置
  2. 將你不希望用戶使用和發現的元素放在最壞的位置
  3. 將用戶常用的元素放在最好的位置
  4. 將特定場景下使用的元素放在不起眼的位置

…………

我們不妨將手機界面當做一個封閉的三圍空間,除了長寬以外,還有深度的含義。

人們的視覺是一種立體的感知系統,除了長度和寬度以外,更重要的是有深度。

我們在“看”的時候,一定會產生物體的前后關系,先看到什么,再看到什么.

視覺深度

合理的利用層次,一方面會增進產品的易用性,降低大量信息產生的視覺壓力,一方面也是將產品的核心價值以更加突出的方式傳達給用戶。

視覺的層次,是將1-3秒的視覺時間,拆解成3到5個階段,每個階段只消耗0.3秒的閱讀時間,由此產生閱讀的順序,減輕視覺壓力及不必要的干擾。

視覺深度1

圖一

視覺深度2

圖二

相較于將頁面的所有元素一次性呈現給用戶而言,圖二的做法是一種循循漸進的策略,在層級的影響下,用戶很清晰的感受到我應該先看什么再看什么。

案例

產品的一個頁面內的元素,往往并不是都很重要,就拿登陸頁面而言,我們通過視覺,很容易感知到作者想要傳達的信息。

他的視覺層次按照從高到低依次是

地址導航–>輸入賬號密碼–>登陸–>第三方賬號登陸->注冊–返回

登陸案例

翻譯后是,想要傳達的信息則是這些:

  1. 你需要讓用戶知道正在登陸什么應用
  2. 你認為登陸使用的頻次比注冊高很多,注冊是一次性功能,因此你將注冊放的很弱,強調登陸。
  3. 似乎你不是很希望用戶采用第三方系統登陸,因此你并沒有去讓第三方登陸做的很顯眼。

如果說設計師決定了配色,布局,最終決定的是作品的審美以及視覺的實現,那么作為PM而言,你需要反復的去體會一瞬間的視覺感受,需要你對信息非常敏感,尤其是對你的視覺軌跡。

我們在看待一個頁面時,并不完全是一個平面感官,在沒有任何調整的前提下,也任然會遵從 自上而下,從左到右的視覺軌跡。

視覺的調整,則是在這個基礎上加強,有意識的去控制用戶的視線軌跡,將信息的傳遞做到極致。

為什么所好的產品經理必須要具備一顆七竅玲瓏的工匠之心呢,就從視覺調整這個環節而言,你要做的是將原本1秒的閱讀時間,通過層級和軌跡的繪制壓縮到0.5秒,并且要讓用戶閱讀的舒服,順暢。

如何將1秒的視覺平面,抽象成1個深度為1秒的視覺空間,也是高級產品經理必備技能之一。

下面是我個人比較常用的技巧(素材來自網絡):

背景色

背景色的使用:背景色是現在運用非常廣闊的設計思路,重點在于視覺上展現除了“底層面板”的感官,再加上元素之間的間隔透露出的縫隙,形成了排列。

留白

留白的設計,是非常簡潔的調整方法,重點在于承托出文字內容。留白運用的巧妙,會極大壓縮閱讀時間。

大面積占位

元素大面積占位,以視覺面積產生對比意識

 

作者:枯葉,微信:zengdbw,微信公眾號:枯葉咖啡館。曾就職camera360、去哪兒網高級產品經理。擅長領域:社交,社區,細分群體挖掘

本文由 @枯葉 原創發布于人人都是產品經理。未經許可,禁止轉載。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 做產品的登錄寫成“登陸”就別再說了

    來自安徽 回復
    1. 頂。。。這個我也忍不了

      來自山東 回復
    2. 大兄弟好嚴格啊

      來自廣東 回復