預計閱讀時長：13m 34s（4050 字；13 圖）
配圖制作工具：Figma、XMind
在體驗有車以後 APP 的過程中，我們發現，應用中存在著大量各種類型的列表頁，例如資訊列表、帖子列表、口碑列表、評論列表等等，而這些列表頁都給我們同壹個感覺：亂，密密麻麻都是字兒。我們將這些界面拿給其他同事體驗後得到的反饋是：看上去很亂，不知道看哪裏。
通過將這句話轉化成設計上的語言，我們可以發現，這些界面存在的最大問題是， 信息層級混亂，沒有形成良好的視覺流。
而這樣的界面現狀給用戶造成的影響是， 無法定位界面的第壹視覺焦點，瀏覽過程比較費力，關鍵信息及內容的獲取效率低下，理解起來比較困難。
我們再進壹步思考，是現有的哪些設計細節導致了這樣的問題，從而產生了相應的體驗問題。同時，找到相應的優化方案。
以上主要是從 視覺表現手法 的角度，去思考界面中存在的細節問題及相應的優化方案。例如，通過元素的大小、色彩、位置、距離等方法對視覺元素進行組織，為用戶提供清晰的視覺信息結構。
但在此之前，更重要的是，我們需要 對界面中的信息進行歸納組織，明確信息層級 。否則，有可能導致無法準確傳達信息。下面，我們就以資訊列表為例，梳理頁面信息層級，輸出優化方案。
用戶在資訊列表頁的核心行為是 「瀏覽」 ，發現感興趣的內容，之後才產生下壹步行為（進入詳情頁查看文章，或跳轉至相關資訊欄目）。我們的體驗目標是幫助用戶 快速獲取和理解有用、感興趣的信息。
頁面中的信息比較簡單，我們從「是否必須」和「重要程度」兩個維度進行逐壹分析。我們需要思考每個信息的展示目的是什麽，起什麽作用，能不能去掉，去掉會造成什麽影響，影響有多大等等，以此進行衡量和評判。
綜合以上所有分析，我們可以得出以下幾點優化思路。
在效果圖上，我將熱評的「火」和背景結合起來，背景框左上角既是「火」的形狀，代表熱評，同時也指向評論數，加強其與評論數的邏輯聯系。但是，由於顏色是灰色，元素尺寸過小，整體效果不太好，需要調整優化。
以下效果圖並非最終版設計，僅供參考。
此次頁面信息層級的優化嘗試還是遵循以往的思路，先了解現狀，發現問題，然後找到相應優化方案。在具體的頁面裏，則是先明確頁面定位和設計目標，梳理信息層級，總結優化點，最後輸出視覺效果圖。
以往我們在進行界面的設計優化時，總是以「體驗不好」為由，以「界面改版」為解決方案，然後吭哧吭哧就開始設計視覺效果圖。這次嘗試 把「體驗不好」拆解成各個體驗細節 ，總結出壹些經驗、方法，希望可以在之後的設計中得以應用，並不斷優化、進步。