無線時代,視覺設計的“豎屏思維”你懂嗎?


無線端毋庸置疑已是大勢所趨,但許多商家在無線端進行視覺設計時仍沒有跟上“豎屏思維”的步伐,萬堂書院大婧將從6個角度,教大家系統學習豎屏思維,從視覺營銷角度告訴你無線端的最新玩法。


一、為什麼要講豎屏思維,什麼是豎屏思維?

數據顯示,90後平均91%的時間在使用手機端,手機端已經是很穩固的瀏覽渠道,手機端的購買率已經遠超過電腦端,2016年雙11,85%的業績的達成來自手機端,所有的電商幾乎都由手機端展開,而我們的思維也正是從橫屏思維轉化為豎屏思維。


豎屏思維並不是一個新概念,但並不是所有電商人士都已理解和執行了,及時執行也未必能夠得其要義和收到很好的效果。(大家可以去看看淘寶上的店鋪能有多少家是用的豎屏思維去做的)

二、重新理解什麼叫“無線端的豎屏思維”

豎屏為什麼跟常規的橫屏不一樣呢,為什麼要提豎屏思維?

橫置寬屏的30寸電腦顯示器VS豎置的5到6寸手機屏幕:從展示內容量到視覺範圍、從點擊操作到觸摸滑動、從信息轟炸到濃縮精華、從固定地點觀看到隨地查閱、從一對一用戶交互到隨時轉發分享,豎屏引發的用戶習慣遷移和信息傳遞方式已經極大的發生了改變。怎樣能把5到6寸的豎屏展示頁面做的震撼力、有衝擊力是非常重要的一件事情。


如上圖,在電腦上看看的清的,在手機端已經無法實現和用戶交互。所以直接把pc端的頁面搬到手機端來用,已經完全喪失了詳情頁的能力。即使專門為手機端做一個詳情頁,如果不用豎屏思維來規劃,用很多字,很多圖,在這個很窄分區的屏幕是看不到的。很多賣家的詳情頁都沒有做對。所以我們要重新理解什麼叫豎屏思維下的詳情頁,無線端頁面怎樣做到'輕視覺'“輕賣點”和“輕邏輯”。


電腦橫屏的內容,在手機上至少2/3的量是廢掉了。在電腦上做的頁面很震撼,

在手機上做的頁面就未必震撼;但如果在手機上的頁面很震撼,那麼在電腦上的頁面就必然震撼。對比如下兩張圖:



震撼力非常充分,而且是真正的豎屏思維,它完全展示了什麼叫“輕視覺”、“輕賣點”這種豎著的感覺和震撼力是很多賣家所思考的東西。


減輕眼睛負擔,用最短、最快、最迅速的方式傳遞你想表達的東西,快速的被吸引和決策,一眼看見心儀之處,秒懂賣家在講什麼,它的賣點是什麼,這就是輕視覺。


輕視覺的方法論:一屏論,②分離論,③釘子論,④微觀論,⑤切割論等。輕視覺的概念就是比別人更輕鬆的、更快更好的賣產品。


舉個例子:

一屏論:一眼看見,一目了然,一語擊中(一句話說中要害),一屏表達一個重點思想。用最短的時間讓別人知道你在講什麼。那麼輕視覺具體如何落地?這個是我們要思考的。

那麼接下來就是5張主圖,這是核心。


5張主圖中首圖的點擊率直接影響轉化率. 怎樣做才能有很高的轉化率呢?我們需要有“文案殺手”“視覺殺手”這兩套邏輯來幫你做,快速的提高轉化率。


5張主圖就是一個小小的詳情頁,它就是一個微詳情,很多賣家並未充分發揮5張主圖的價值,而很多客戶是看完5張主圖就做出了是否購買的決定,不符合客戶期待的,馬上跳失掉。

很多人是怎樣做的(反面教材):






後四張圖基本重複,傳達不了更多更全面的信息,徹徹底底的浪費了主圖資源。如下案例也是一樣:



後面的第6篇會給大介紹優秀店舖的5張主圖是如何佈局以及做到高點擊高轉化的。

5張主圖的設計點的邏輯:

功能功效性產品和款式風格來產品的主圖做法是不同的,所以5張主圖怎樣去做,有5個設計點:①點擊點②出賣點③不同點④促銷點⑤細節點。


除了主圖之外還會跟大家講第一屏的詳情頁怎樣做,手機端真正只有第一屏是閱讀屏,第1屏價值大於後面的10屏,怎樣做好第一屏,把第一屏做的很有逼格,很有調性,做好第一屏就是做好詳情頁!




以上圖例,用第一屏的時間去告訴大家最大的賣點、和最核心的競爭力是什麼,這個就是豎屏思維,用第一時間展示出來的第一屏,展示它的賣點是什麼,我們也願意去買他們家產品,

除以上內容外,豎屏思維繫列文章將會從六個方面深入擴展,詳細分析豎屏思維的各個方面,力求深入淺出,相信一定會讓大家受益。許多商家學完學完豎屏思維,整個頁面轉化率有很大提升,出現百分之十幾的增長,甚至好幾倍的增長。

#設覺設計 #無限時代

0 次瀏覽