2020-5-18 資深UI設計者
今年已經是 2020 了，各位作為時代的弄潮兒，上網沖浪是生活中的不可或缺，豐富的沖浪生活中必不可少的當然是買買買，面對琳瑯滿目的商品圖與文案，用戶怎樣才能快速抓到重點？或者說，怎么樣才能讓信息出現在合適的位置？
首先我們要了解瀏覽信息這個動作的本質和特征，瀏覽的本質就是大腦通過眼睛去提取信息，是一個傳達→解碼的過程，在這個過程中又存在一些特性，我們可以利用這些特性去進行一些更的信息傳達。
受閱讀習慣影響，人們閱讀的起始端都是在左側，結合依據尼爾森等老前輩發(fā)布的眼球軌跡研究報告可知，視覺瀏覽習慣呈「F」型且是不受控的潛意識習慣；同時可以延伸出例如「E」、「Z」等瀏覽模型，我們可以根據這些視覺模型的特性，結合產品的戰(zhàn)略層目標，將信息放置在合適的位置，已達到信息傳達率的最大化。
了解了基本的視覺瀏覽模型，那我們的地基就已經搭建好了，接下來我們來看看地基搞定之后的結構要怎么去布局。
首先我們需要清晰產品的屬性，電商平臺的本質是物品的交易，因為線上的特殊性，產品中圖片與文案對于平臺的 GMV 就存在最直接的關系。這個時候，單元布局的輪廓就出來了，就是「商品圖+關鍵詞文案」。
同時，不同平臺戰(zhàn)略方向、發(fā)展階段、團隊規(guī)模等因素的不同，所針對的用戶群體、消費階層、心智、審美等各個因素都會大不相同，有時候甚至在同一平臺中針對不同的活動、不同的品類進行細致的場景劃分，產生不同的單元結構以滿足商業(yè)目的上的需要。
720° 全方位了解平臺的屬性特征后，我們就可以開始利用這么信息來搭建基本的單元結構了。
例如平臺主攻下沉市場，用戶群體多為三四線，這個時候用戶吸引點在于商品的價格與賣點關鍵詞，這時候我們就可以拉大關鍵詞文案的占比，縮小圖片的占比，讓他們關注的內容盡可能多的進入他們的眼睛，吸引購買意向模糊的用戶點擊，增加購買意向明確的用戶匹配商品的速度，已達到 GMV 的提升。
簡單來說，過程中需要考慮到平臺因素所產出的圖片尺寸/比例/精致度/是否統(tǒng)一等，與文案搭配所呈現的是否適用當前消費場景及用戶心智，是否可以提升用戶的轉化率，是否可以提升平臺的下單率。
單元的架構是多樣且復雜的，就像一塊七巧板。重點就在于對于產品屬性和用戶行為、場景、心理等特征的分析，需要權衡各個關鍵點的重要性，把用戶需要看到的信息、我們想讓用戶看到的信息、用戶希望看到的信息以合適的結構狀態(tài)呈現給他。
我們將大體架構搭建好之后，剩下的就是要把細節(jié)元素給點亮，讓他們起到一個點睛的效果。
細分一下，其中涉及到的細節(jié)元素大致為活動標簽、折扣標簽、跳轉按鈕等常規(guī)的分子部件，在結構中，圖片、商品名稱、價格是用戶關注的重點，其他的部件則起到輔助刺激的作用。圖片和商品名稱的大體結構我們在上一步已搭建了，剩下來我們看看這些小部件該如何合理歸置。
先從標簽說起。整體框架出來了，用戶所需要了解的商品信息就已經基本呈現了，這個時候用戶心智上更多的主觀意向，尋找合適的商品，而標簽的出現，更像是一劑興奮劑，強烈告訴用戶：「這個品熱度第一！」、「這個品是款！」等我們刺激用戶的聲音，增強用戶查看的欲望。
這個時候疑問來了，那放哪里合適呢？
活動標簽，多為顯示該商品的熱度、促銷主題、排名等一些大的狀態(tài)性的信息，為的是在用戶心理層面給這個商品帶來更多的好感度，放置的位置可以結合具體場景去分析，可以考慮與商品圖進行結合放置。
遵循由上而下滑動的交互原理，我們可知在每個單元的頂部會是滑動瀏覽時第一被眼睛識別的信息，而且可以利用這個心理去給還沒看到具體商品的用戶進行一個心理鋪墊，比如商品的品質、權威性等，先入為主的進行心理建設，再結合視覺瀏覽模型，合適的位置就出來了。
次要信息比如倒計時、商品折扣、商品特點等輔助信息，結合布局場景考慮，有的可與圖片一起放置增強品質感，有的可與文案一起放置增加決策信息，有的可與價格一起放置，刺激用戶進行決策，是很有靈性的一個點睛之筆。
最后是按鈕，在這里的按鈕可以理解為瀏覽過程的一個閉環(huán)節(jié)點，也是一個操作的終結點，是最后的臨門一腳。位置當然是在右側最為合適，降低操作難度，同時也是整個單元的一個視覺終結點，瀏覽完流程之后決定是否點擊跳轉。當然，你可以利用你的方式去引導或刺激用戶點擊，你可以的。
文章來源：優(yōu)設 作者：阿類雜碎面