起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識APP信息流內容屬性如何主導UI設計？
不同特征的產品所用的信息流形式都是不一樣的，有用圖片流的、也有用列表流的、也有用Feed流，更有根據場景組合使用的。文中，筆者就介紹了他們的特征以及如何使用。
幾乎所有APP都是信息流的設計形式，通過信息流內容屬性的不一樣，可以分為三種流：圖片流、列表流、Feed流。
之前看到過卡片流，其實卡片流只是一種設計形式，我們今天探討的是根據內容屬性分出來的三種流，所以文章會些許深入。下面我們就開始探討三種信息流的奧秘。
下圖是典型的三種信息流的產品：花瓣（圖片流）、餓了么（列表流）、今日頭條（feed流）。
正式分享前再強調一下本文章的核心觀念！重復三遍～
產品定位影響內容屬性，內容屬性主導設計形式！
產品定位影響內容屬性，內容屬性主導設計形式！
產品定位影響內容屬性，內容屬性主導設計形式！
沒理解沒關系，帶著這句話，let’s go。
案例解析如下：
一、圖片流
顧名思義圖片流更側重圖片的展示，典型案例有花瓣APP：自適應圖片的高度，強調圖片的表現性。
花瓣APP為什么是圖片流，我們先從產品定位分析：
- 產品定位：幫助用戶快速發現和找到喜歡的事物，側重高質量圖片。
- 目標用戶：喜歡收集感興趣的圖片，找素材、找參考提高審美能力的用戶。
產品定位和目標用戶側重點都是圖片，所以強調圖片的表現性是產品的重要屬性。
目標用戶的行為是收集圖片、找素材、找參考，用戶都是基于有目的找的一種狀態，所以設計形式上重點強調圖片，弱化輔助元素。
- A：弱化輔助性的標題文字（字號較小）
- B：沒有“轉采”“喜歡”數據，直接去掉
- C：可以沒有板塊標題
以上等等都是為了弱化輔助元素，減少用戶瀏覽圖片的干擾。
圖片流的設計要點是基于用戶有目的找的狀態，展示更多圖片并且要強調圖片的表現性，弱化干擾元素。
因為花瓣側重UGC模式（用戶產生內容），所以板塊中的用戶頭像可以點擊，引導關注，提高用戶忠實度，這也是很多產品都有社交屬性的重要原因。
分析了圖片流的內容屬性和設計要點，那么下圖500px首頁是圖片流嗎？
根據500px產品內容屬性分析，上圖設計其實并不是圖片流，而是feed流，先不解釋，帶著這個疑問繼續往下看。
二、列表流
列表流對比圖片流，列表流中的圖片不會重點強調，或直接就沒有圖片、列表流用戶的使用狀態帶有明確目的，也是一種找的狀態。
1. 支付寶列表流
開篇我們講到了，卡片流這種物種是不存在，卡片只是一種設計形式，不能以卡片定義一種信息流。
支付寶“服務提醒”板塊目的為用戶快速找到用戶需要的功能入口，設計中強調識別功能的圖標，能夠幫助用戶快速找到功能入口，符合內容屬性的功能需求。
用戶使用中也是一種有明確目的找的狀態，所以根據功能屬性和設計形式，支付寶的“服務提醒”板塊屬于列表流。
列表流的設計形式一般不希望用戶一直往上滑頁面，因為用戶不能快速識別找到需要的板塊，就直接影響用戶體驗。
2. 京東手機商品列表流
京東手機商品的列表流，產品圖片沒有著重強調，而是側重強調了手機價格、品牌、型號、屏幕、內存、評價數量等等，其實這些信息才是用戶產生購買的重要元素。
不同的商品用戶關注的點不一樣，有些商品可能更適合圖片流。
例如購買衣服用戶會更關注衣服的款式和細節，所以要符合用戶的關注點需要強調圖片展示。
京東APP聰明地做到了搜索不同的產品自動使用不同的信息流，搜索衣服京東會自動使用圖片流，注重圖片并縮減標題為一行展示，輔助信息空間占比縮小，搜索手機就會用列表流展示用戶會重點關注的配置元素。
京東APP為了能夠使產品靈活展示，頁面的右上角有列表流和圖片流切換按鈕，其實產品已經為用戶做了最舒適的體驗方式，所以這個按鈕是個不常使用按鈕。
3. 攜程酒店列表流
同樣地，通過對用戶的研究分析，搜索酒店的用戶更看重性價比、位置、價格、品牌，選擇民宿的用戶，關注點一般就不一樣了，所以設計形式也就有差異。
為什么會有這樣的一個結果導向？首先分析一下選擇酒店的用戶和選擇民宿用的心理需求：
（1）酒店用戶關鍵詞：性價比、效率、便捷
選擇酒店人群一般是追求效率和便捷的商旅用戶，他們很大程度上關注性價比，地理位置以及價格。
（2）民宿用戶關鍵詞：體驗、追究個性
選擇民宿用戶多是旅游和年輕追求個性文化的年輕群體，所以更看重居住體驗。
多數人對酒店有清晰的概念，酒店圖片用戶一般不會著重關注，用戶會根據地理位置、性價比而買單，所以酒店選擇適列表流設計形式。
選擇民宿人會更關注房屋的圖片，滿足他的個性需求體驗，一張精美的房屋圖片會大大增加民宿的轉化力，所以民宿適合圖片流設計形式。
細心你的可能看到了上圖酒店里也有民宿，原因是為了推廣民宿，因為攜程的DNA決定了想住民宿的用戶一般不會想到攜程，所以要引流推廣。
三、Feed流
feed流產品現如今大行其道，我們首先來定義下feed流：一般來講，持續更新并呈現內容的信息流，并且用戶操作狀態是沒有明確目的的瀏覽狀態。
feed流內容排列方式，主流的形式分為兩種：一種是時間軸排列，例如微信朋友圈；另外一種是通過智能算法排列，例如今日頭條、抖音產品。
從設計的角度去看智能算法feed流
智能算法feed流一般是一種千人千面形式，通過內容屬性分析大概分為三種：文字feed流、圖片feed流、視頻feed流，其中三者存在相輔相成形式。
例如今日頭條重點要強調標題文字，所以是文字feed流；但是會在重點強調文字的基礎上，增加圖片或視頻輔助元素，圖片feed流和視頻feed流當然也會有文字輔助元素。
feed流設計首先要分析產品強調的是什么、用戶關注點是什么，切不可喧賓奪主，基于用戶沒有目的的瀏覽狀態，交互上要體現更直接快捷的交互方式。
當然技術上的智能算法是非常重要的，之前當朋友用我手機刷抖音時，一會就沒興趣了，原因是還沒有給他的心理模型建立好推薦機制，從而推薦了一些他不感興趣的內容。
結合上文，因為500px首頁設計形式有feed屬性，例如點贊、轉發、評論、分享、引導關注，用戶使用過程是瀏覽狀態，所以他是feed流設計形式產品。
從設計的角度去看時間軸feed流
內容屬性分為兩種：一種具有社交性，一種為實效性。
微信朋友圈具有重社交屬性，用戶刷朋友圈心理上其實會通過發動態的人，來判定是否會著重關注他發的內容。
雖然用戶刷的是內容，但是重社交屬性內容建立在熟人身上。比如一個陌生人發的官宣，你不會刻意關注；如果是你好朋友，你可能會有些許激動，從而點贊評論互動。
所以重社交的產品feed流設計要體現人的重要性。
輕社交產品有微博、西瓜視頻等等，有社交屬性但是設計形式都是輕社交形式，這是跟產品定位有關。輕社交人當然也很重要，但產品的核心是要產生更多好的內容，所以設計中要側重內容的表現。
feed流廣告設計
feed流用戶更多的是瀏覽狀態，平臺是希望用戶能長時間停留在產品上，滿足feed流里面的廣告變現，實現商業目的。
從設計角度將廣告內容加入到feed信息流當中展現給用戶，廣告的展現形式與feed信息流保持了相同的設計格式，較為合理。
這樣feed流廣告能夠提高用戶接受度，提高產品的使用體驗，并且可以讓用戶對廣告感知低的情況下，篩選出能夠商業轉化用戶。
同樣的微信朋友圈一早一晚的廣告形式，與內容保持了相同的設計格式。
四、總結
圖片流：強調圖片的表現性，基于用戶有目的找的一種狀態去設計，設計形式上重點強調圖片，弱化輔助元素。
列表流：強調用戶關注的元素，用戶操作產品中有清晰的目的且找的一種心理狀態，所以設計中要幫助用戶快速完成目的。
feed流：文字、圖片、視頻feed流，需明確用戶的關注點再去設計，用戶操作時是一種沒有明確目的的瀏覽狀態，要體現更直接快捷的交互方式，能夠持續保持更新產出內容。
最后：
三種信息流都是基于產品的定位和滿足用戶需求的不同，而產生的設計形式。
產品定位和用戶需求，需要找到平衡點，例如與內容形式一樣的廣告，這就是平衡點；充分了解產品的用戶就可以找到合適的設計形式。
例如酒店和民宿用戶的心理需求的不一樣，設計形式也隨之改變。
UI設計從來都是從產品出發，助力產品，我認為這是一種更高級的UI設計意識。
最后還是重復本篇文章的核心觀念：產品定位影響內容屬性，內容屬性主導設計形式！
作者：吳星辰，微信公眾號：互聯網設計幫
本文由 @吳星辰 原創發布于人人都是產品經理。未經許可，禁止轉載。
題圖來自Unsplash，基于CC0協議
很好
區別講得很清楚也很有啟發性！
忍不住注冊了個賬號，來討回被浪費的時間。