應用設計:單列

本文總結單列設計與雙列設計的差異,以及這些差異對產品的影響。

应用设计:单列/双列设计的差异

單列指『Instagram』這類展示每列展示單張大圖的展示方式。

雙列指『小紅書』這類展示兩列大圖的圖片展示方式。

同類型的應用也常常會看到有些應用採用單列,有些採用雙列,像小紅書和instagram,快手和抖音。

所以作為一個患有職業病的設計師,刷手機的時候常常會冒出這些腦洞:

  • 小紅書為什麼採用雙列設計,如果用單列設計會怎樣?
  • 抖音和快手一個全屏一個雙列瀑布流,哪種方式更好?這種差異給產品帶來了哪些影響?
  • 如果你來重新設計一個圖片社區或者一個短視頻APP,你會選擇哪種方式?

所以就寫了這篇文章來幫自己盤點,希望在工作中碰到這樣的抉擇之前能清楚地下判斷。希望對你也有所幫助。

一、單列設計

好處一:降低信息密度,不用思考

單列可以儘量減少讓用戶選擇。對於沒有明確目的,只是用戶拿來填充碎片化時間的產品來說,可以減少用戶思考的成本,看到一個內容感興趣快速點進去看了,不需要在大量信息中篩選自己感興趣的東西。非常適合Kill Time類型的產品。

例如:懶飯 VS 下廚房

应用设计:单列/双列设计的差异

作為一個下廚小白,我在打開下廚軟件前大部分情況下的心理活動是這樣的:今天在家做飯吧——不知道做什麼——上APP看一下吧。

『下廚房』是雙列設計,默認進入是個性化推薦列表,每次打開都能看到四五個做的非常美味的菜品,每次都成功讓我陷入了選擇糾結症。

而『懶飯』是大圖單列設計,默認進入的是今日推薦列表,所有菜譜是編輯精選出來大多數情況下可能我覺得這個黃瓜炒蝦仁看起來很不錯就開始看視頻動手了。

對於下廚APP,我覺得大多數廚房小白用戶的訴求分兩類,一類是明確需求,希望快速找到某個明確菜品的菜譜,比如怎麼做紅燒肉,一類是模糊需求,希望能快速找到一個還不錯的菜譜開始下廚。

對於兩個應用設計上的不同選擇,我覺得是產品定位上有比較大的差異,『下廚房』可能希望做成一個廚藝愛好者社區,上面的菜譜基本都是UGC的內容,雙列設計能讓更多用戶的作品被曝光,但同樣帶來的風險就是選擇菜譜變得更困難了,讓下廚這件本來就很難的事情斷絕在了開頭…

『懶飯』是下廚房今年推出的新APP,整個應用像是一個教你做飯的老師傅,上面的菜譜均由官方出品,配有精美的下廚視頻教程,決定下廚——走進廚房可能是所有小白下廚裡最艱難的一步,懶飯的所有設計都讓這一步變得更加簡單了。

不得不說,下廚房的這一步做的太明智太聰明瞭。

如果你的產品也是主推官方精品,面向廣大小白用戶,單列大圖的設計可能會更適合,可以減少用戶思考成本,儘快上手。

例如:抖音 VS 快手

应用设计:单列/双列设计的差异

我一直覺得『抖音』在讓用戶上癮這件事上做的很極致很聰明,上癮式的設計之一就是用單列設計,打造完全沉浸式的體驗,用戶打開抖音視頻自動播放,不知不覺就開始看下去了,不感興趣立即划走,就像一個快樂的魔盒,永遠沒有盡頭,你永遠不知道你劃了多少下。

在短視頻這個領域裡,我覺得自動播放+單列設計要明顯優於雙列瀑布流。

雙列瀑布流決定了短視頻不能自動播放,因此你可以看到快手上的短視頻封面會做的很用心,要麼放明星美女要麼放吸引眼球的標題,總之吸引點擊轉化的關鍵全都集中在視頻封面上。

而單列設計+自動播放可以儘量發揮視頻的優勢,決定用戶留存的戰線被拉長了,變成開頭的那幾秒。

所以我覺得如果你的產品是幫用戶Kill Time的,你也希望用戶對你的產品上癮,單列設計會更契合當下用戶不想動腦只想“哈哈哈”的需求,當然前提是算法做的好。

最後多說一點減少讓用戶思考這件事,我碰到很多情況是業務上不太注重減少用戶思考這件事,很多時候希望每屏能儘量多展示一些信息,留白能少則少,但我覺得『Don‘t make me think 』在信息爆炸,用戶注意力匱乏的時代變得越來越重要了,尤其是移動端碎片化的使用場景下,一個簡潔清晰沒有那麼多幹擾信息的界面變得更難能可貴了。

好處二:提高單個內容的轉化

適合偏媒體型產品,通過提高版面佔比,更多內容的透出,提高單個精品內容的點擊轉化。在廣告變現上,單列要遠遠高過雙列。

例如:App Store 2017 VS Old App Store

应用设计:单列/双列设计的差异

個人認為2017 Apple Store的顛覆性改版是非常非常成功的改版,直接將當時有些疲軟的軟件應用市場重新變得充滿活力,是一次通過提升用戶體驗達到商業目標的一次非常好的案例。

如果對此有興趣可以看下這篇:App Store顛覆性改版,對用戶和開發者的影響 深度剖析了Apple Store的發展歷程。

回到設計上來講,新版Apple Store的採用的設計策略之一就是內容外顯,在首頁Today裡大膽採用了單列超大圖的設計方式,第一屏基本只能看到1.5張卡片,帶來的差異就是App的開發者們終於可以不用憑小小的圖標分勝負了,他們可以用比原來更豐富的一張精美大圖去吸引用戶點擊下載,對於用戶來說,點開Apple Store看到的終於不是一排排五顏六色的小圖標,而是一張製作精美吸引你點擊的圖片和一段可能正好切中你訴求的標題。總而言之,更好“逛”了。

非常好理解的是,當你展示的更多,越可能吸引到別人。Apple Store改版的設計聰明程度也顯示在此,數據顯示,原先通過瀏覽下載的數據量也從10%上升到15%以上。

应用设计:单列/双列设计的差异

因此如果你希望用戶在你的產品裡完成“種草——轉化”的行為,與其百花齊放地提供給用戶更多平均的選擇,不如加大猛料在一個選擇裡,用每天一個精品選擇讓每天上這個APP都充滿驚喜和收穫。

二、雙列設計

好處一:總有你喜歡的

單列設計對頭部內容容錯率很低,頭部內容質量極大影響用戶留存,用戶刷兩屏不感興趣立馬就走了。而雙列對內容的容錯率較高,用戶刷兩屏能看到更多內容,因此可以允許產品展示更多元化的內容。

例如:小紅書;毒

我理解『小紅書』是一個UGC圖片種草社區,用戶每天都會在上面發佈大量的筆記,從服裝到養生,內容涵蓋領域非常廣泛。因此我理解有兩點原因讓小紅書選擇雙列瀑布流的展示方式:

  • UGC內容的質量不能完全把控,只能用更多的內容留住用戶,總有你喜歡的。
  • 一次性能讓更多作品被曝光,有助於提升社區內容創作者的活力。
  • 觀看者的目的性不明確,可能想看護膚可能想看搭配,需求精準匹配的可能性較低。

並且對於社區來說,雙列設計的長期好處可能要遠超單列設計。一個社區的健康發展非常依靠內容創作者,而單列設計會讓頭部的內容獲得更多關注,而腰部尾部的關注相應就少很多,長期以來不利於社區的健康發展。

所以如果你的產品是一個泛品類的UGC社區,不能保證每個內容都能精準地吸引到用戶,用雙列設計是一種又保險又健康的選擇。

好處二:“找”的效率更高

非常好理解的是,雙列比單列能展示更多的信息。這個優勢在帶有較強目的性的產品裡就非常重要,能極大提升用戶“找”的效率。比如淘寶的猜你喜歡,用戶本身有模糊的購物意向,逛淘寶跟逛街類似,可能不是為了買某個具體品牌的某個東西,而是想看看有沒有什麼可以買的。這個時候雙列設計如同一排排商品貨架能夠快速地在一屏瀏覽更多到寶貝,更容易在裡面發現自己心儀的物品。

例如:淘寶的猜你喜歡;Pinterest

所以如果你的產品使用場景是用戶帶有比較明確目的的,建議使用雙列設計,讓用戶能更快速地找到自己想要的東西。

總結

逛單列和雙列設計的產品有點像吃一家不提供菜單的高級餐廳和一家奢華自助餐,單列設計是我提供給你最可能喜歡的菜品給你,你只要安心坐著一道道吃下去就好了,雙列設計是我不確定你喜歡什麼,所以我提供更多選擇給你,這麼多菜品裡總有你愛吃的。

單雙列不是一個絕對的選擇,但卻是一個影響深遠值得細細斟酌的選擇。

從個人盤點來看,有兩類產品的選擇比較清晰:

  • 偏媒體型的產品——單列能讓用戶更不費力地讀到更精品的內容
  • 社區平臺類的產品——雙列更容易讓社區呈現百花齊放的發展

同時在做選擇時,可以從以下的好處去判斷,哪些優勢是你的產品更看重的。

單列設計的好處:

  1. 減少用戶思考
  2. 提升單個內容的轉化

雙列設計的好處:

  1. 展示更多元的內容,總有你喜歡的
  2. “找”的效率更高

拓展閱讀

亂翻書-單列和雙列會帶來廣告變現上的哪些不同?

App Store顛覆性改版,對用戶和開發者的影響

題圖來自Unsplash,基於CC0協議


分享到:


相關文章: