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

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

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

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

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

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

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

…………

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

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

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

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

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

圖一

圖二

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

案例

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

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

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

翻譯后是，想要傳達的信息則是這些：

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

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

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

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

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

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

下面是我個人比較常用的技巧（素材來自網絡）：

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

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

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

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

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