鎚子科技犯過的設計錯誤你一定也犯過

【說明】：嚴格意義上說，標題中的「錯誤」用「瑕疵」表述更加準確，我對取這樣標題可能給鎚子科技帶來的負面效應表達誠摯歉意，同時錘科作為一家以優秀工業設計和軟體設計見長的科技公司，公眾對其設計水準的期望的確會苛刻一些，也請老羅理解。

一、從鎚子科技的一張配圖說起

如果我說老羅的鎚子科技在某些設計方面也犯過業餘的錯誤你肯定會反駁，不著急，請接著往下看，下面是一條鎚子科技今年5月重要手機產品——堅果Pro發布時，官方微博的主配圖：

沒錯，這張圖是堅果Pro在微博客戶端里呈現的效果，這張橫版圖只佔據了屏幕不到的三分之一面積，它孤單地站在手機的中央，顯得有些怯弱，並不能將堅果Pro優秀的工業設計完全表現出來，至少第一眼是這樣的。

而這本是可以避免的，假如把這張圖換成豎版設計，效果就會立馬變得不一樣，如果只看手機呈現的面積，足足是橫版圖片的六倍，其視覺衝擊感用一個天上一個地下來形容也不為過。

同樣的疏忽延續到了剛剛發布的堅果Pro2，展示堅果Pro2全面屏是的主配圖是下面這張，當時我看一邊看發布會一邊刷微博刷到這張圖的時候，總感覺到了一絲說不出的彆扭：一款主打全面屏手機第一次在網路上出現的時候並沒有佔據屏幕的全部。

很顯然，鎚子科技微博其實是直接拿著發布會的演示幻燈圖片發出來的，我們可以理解老羅為排期緊張的發布會殫精竭力的同時並沒有時間將幻燈片重新設計成豎版，但這是一款工業設計優秀的手機在老羅1400萬微博粉絲中第一次亮相，本可以做的更驚艷一些。

作為一家初創企業，老羅是如此重視微博這一傳播陣地（從他購買微博的粉絲頭條的頻率可以看出來），然而在對發布會傳播起重要作用的微博圖片卻留下這樣的瑕疵，不得不說是一個遺憾。

不僅僅鎚子，衛夕查看了小米、華為等無數在這個時代領先的公司在發布會微博配圖也都是橫版圖片，由此引發一個值得所有市場推廣人思考的問題：為什麼即使是業內最出色的公司都會忽視橫豎屏的問題？

小米MIX2和華為Mate10發布會官微的配圖

很多互聯網人並沒有意識到橫豎屏問題的重要性，有些人會下意識的反駁：你把手機橫過來不就完了嘛！看完下面的分析你或許就不會這麼認為了：

二、從橫屏到豎屏：潮水的方向是如何改變的？

要解答這個問題，我們先看來人眼是如何工作的？由於生理結構的原因，人的雙眼在大腦前呈橫向排列，這樣導致的結果就是我們的視場角橫向要大於豎向，科學家曾對人類視場角做了一項著名研究，研究結果顯示人類的視野大致如下：可以明顯看到，整個人類的視場角明顯呈橫向分布。

即使是單眼，我們眼珠的左右活動範圍也要大於上下活動範圍，因此註定了我們一眼看過去左右的視場角要大於上下的視場角，為了適應人眼的生理結構。

幾乎我們能看到的所有視覺場景的設計都是橫版的：從古代的劇場到現代的電影，從客廳的電視機到台式個人電腦，這樣的設計的確能更符合我們的視覺直覺，橫屏無疑能讓我們的眼睛更舒服。

眼睛是橫的這一點毫無疑問，然而我們會發現一個明顯的悖論：為什麼從東方到西方的書籍都是豎版的呢，從畢昇的印刷術產生的《資治通鑒》到古騰堡印出的《聖經》都是清一色的豎版，這只是一種巧合嗎？

不，這恰恰說明了一個重要的人體工程學原則：當我們雙手的舒適性和雙眼的舒適性出現衝突的時候，雙手的舒適性的優先順序要高於雙眼，即首先要保證我們拿著舒服，然後才是我們看的舒服。

這也解釋了同屬微軟office的辦公軟體，為什麼Word默認是豎版排列而PPT是橫版排列，因為office剛誕生的時候，PC和互聯網還遠沒有今天普及，電腦從某種意義上就是一台打字機，Word文件的典型使用場景是：用電腦輸入、用印表機列印出來雙手查看，PPT就不存在這個問題。

手機的出現讓這一趨勢迅速加劇，準確地說是智能手機的出現，功能機時代很多屏幕都是橫版的，智能機是人類增長最迅速的豎版設備，當手機成為人們一個器官的今天，我們隨時隨地能消費信息的前提是我們能拿住它，因此單手操作的豎版就成為我們和手機日常接觸最符合人體工程學的姿勢。

當我們豎版拿著手機但出現了橫版的構圖的時候，就出現了鎚子科技堅果Pro那樣感覺彆扭的構圖。這種現象屢見不鮮，從微博配圖到電商著陸頁，從廣告投放到應用設計，毫不誇張地說，如今移動設計的基本矛盾就是：顯而易見的豎版手機和應接不暇的橫版構圖之間的矛盾。

有些人一定會反駁：你把手機橫過來不就完了嘛！沒錯，我們的確是可以把手機橫過來，然而我們忽略了使用頻率的問題，我們看電影或玩大型遊戲的時候的共同特徵是橫過來頻率很低，我們橫過來可以看一個小時，但讓我們一分鐘橫過來五次我們就瘋了。

當一個電商產品在第一眼沒有用充滿整個屏幕的豎版構圖吸引用戶的時候，用戶為什麼要橫過來？拜託！大家都很忙滴！你以為你是TFBOYS啊！

數據說明了一切：英國一家調研機構Unruly的一項調查顯示，52% 的手機用戶習慣將屏幕方向鎖定為豎向；MOVR Mobile的報告也顯示：智能手機用戶有94%的時間將手機豎版持握而非橫版。

記住：用智能手機的這一代是人類發展到今天最懶惰的一代人：「橫過來，太TM費勁了！」，如果說互聯網行業有一條必須遵循的鐵律，那麼這條鐵律八成是：縱容人類的懶惰，而不是改變它！

三、視頻的情況也好不到哪裡去

微博故事、微信小視頻升級成豎版、Facebook快拍、Snapchat的發現頻道、Instagram的Story功能.......它們有神馬共同特徵？

答案是他們都是中美互聯網市場上的國民應用在過去兩年推出的最重要的功能，而這些功能有一個共同的特徵——豎版視頻，在整個移動互聯網的內容都在不可避免地視頻化的大背景下，從長視頻到短視頻的進化是一個明顯的趨勢，從橫版視頻向豎版視頻的轉變卻很少有人注意到，而這恰恰是一個勢不可擋的歷史潮流。

當我們橫版拿著手機看一個小時的《權利的遊戲》一點問題都沒有，然而當你一分鐘內看四個小視頻，你不可能把手機橫過來四次，從長視頻到短視頻，從橫版視頻到豎版視頻，背後的邏輯是統一的。

敏銳感知到這一潮流的APP已經嘗到了甜頭，比如中美短視頻領域近年迅速崛起的新貴快手和Snapchat：Snapchat在視頻領域提出了3V原則：即video、Vertical、View，即視頻化、豎屏化及可看性，即你如果不是豎版的視頻素材，那麼你就無法在這個全球風頭正勁的應用上投放廣告。

無獨有偶，快手合伙人曾光明也對媒體說：「快手的大數據系統對每天6000萬用戶的每一個行為進行判斷歸納，在當前的用戶行為、技術和市場下，「豎屏、57秒」可能是短視頻行業的工業標準。」

然而，當整個短視頻內容都在向移動轉型的時候，我們很多內容提供商和廣告主卻還沒有迅速轉變過來，到Instagram的故事頁看一看，會發現我們很多熟悉的知名媒體並沒有那麼多豎版的視頻填充，於是他們只能用橫版視頻拼湊或者豎版的圖片拼接成一個幻燈在放映，下面是美國著名的脫口秀節目艾倫秀的官方賬號在Instagram的豎屏頁面的表現。

我們再來看一個典型的例子，下圖是六神花露水投放的應用開屏廣告，直接把一個視頻放到了素材的頂部，我不知道大家看到這個創意是神馬感受，我的感覺是好像在無數跑車飛馳的高速公路上一輛精緻的馬車在緩緩蠕動，這顯然是直接把它在電視上的橫版視頻素材直接搬到了開屏廣告上，六神這個廣告從某種意義上就是國內品牌營銷觀念滯後的一個典型縮影。

在這個問題上，OPPO顯然敏銳地走在時代的前列，在微博推出故事後，OPPO就請TFBOYS的三小只在微博故事上進行了廣告投放，當王源用豎屏視頻透過整個手機屏幕向你介紹R11的時候，OPPO早已在營銷理念的前瞻性上將其他品牌遠遠拋在身後。「比你們不知高到哪裡去了！」

四、用戶已經變了：橫版設計後果很嚴重

這本質上是一個理念滯後的問題，移動互聯網這個偉大的進程推進的是如此迅速，以至於我們很難再短時間之內轉變理念、更新思維，因為PC工業的烙印深深地刻在了我們的腦中，橫版構圖本質上就是一個PC思維。

我們的用戶已經發生了深刻的變化，主要體現在：

• 閱讀時間和場景的碎片化，用戶在看頁面的時候可能在地鐵、餐廳，也可能是在馬桶上，它的注意力被嚴重分散。
• 用戶閱讀體驗走向淺閱讀，兩秒鐘內不抓住用戶的眼球他就走了，他還有很多的朋友圈、頭條、微博要刷，爭取注意力成為一場更加殘酷的戰爭。

信息的消費者早已發生了變化，然而信息的生產者卻沒有轉變思維，由於過去我們在PC上投了太多資源與精力，我們的設計師都是從PC時代過來的，而且即使是在今天，設計師使用的電腦依然是橫版電腦，他們沒辦法把漂亮的蘋果iMac電腦豎過來。

如果依然用PC的橫版思維來作圖，後果非常嚴重，特別是對投入產品要求特別高的廣告行業來說，橫版和豎版的的效果可能千差萬別，Snapchat的副總裁在戛納創意節上告訴媒體，經過他們測試，橫版視頻廣告的播放完成率是豎版廣告的1/9。正因為豎版效果立竿見影，微信的朋友圈採用豎版視頻的廣告在2016年增長了46%。

橫版構圖對於內容生產者來說是一個表現力的問題，對於商家和廣告主而言來說就是ROI的問題了：一家每天流水10萬的電商店鋪，如果利用豎版構圖去做信息流廣告提升20%的轉化，每天的營收就能增加2萬，電商從業者會明白我說這句話的意義。

五、我們應該如何做？

明白了豎屏是趨勢以及它的重要意義之後我們能做神馬呢？

「能做神馬？當然是以後用豎版圖片發朋友圈啦！終於明白我朋友圈曬新買的一雙耐克為什麼點贊那麼少了，原來我犯了和鎚子科技一樣的錯誤！」

哈哈哈，能明白這一點其實悟性非常高，我並木有開玩笑（認真狀.......）

更進一步，我們可以從以下方面重視橫豎屏的問題：

首先，從「道」層面，我們需要從理念上認識到豎屏的意義，從思想上徹底和PC時代說拜拜，重新梳理我們對於手機頻幕和手機用戶的認識，這需要整個團隊一起轉變思維：如果你是運營，請將這篇文章發給你們產品；如果你是產品，請轉給技術和設計；如果你是老闆，請轉給你的員工。

其次，從「術」的層面：

1）.學習豎版構圖，橫屏更適合全局性，大場面的敘事方式，豎屏更適合去表達個體，專註於人物和事件本身等等，基於這一點，豎屏製作中需要重新考慮內容的重點、畫面的構圖等等，比如PC時代常見的圖片和文字的左右結構可以修改成上下結構，本來是橫著擺放的拍攝可以豎著排放。

鎚子科技的PC網站和移動網站其實已經注意到了這個問題

2）.對自己所負責的業務做一個全面的檢查。把你負責的所有頁面進行了一個全面的檢查，不管是常規內容素材還是廣告素材，不管是公司官方還是廣告落地頁，不管是公司微博還是微信。在注意力成為稀有資源的今天，誰的圖有衝擊力誰就能獲得更多的展現機會。

3）.重視視頻的豎屏化，整個內容趨勢都在向視頻轉型，我們需要對這個趨勢保持敬畏，不管你是做內容還是做廣告，豎版的視頻都能更好地在移動設備上展示。當相機廠商和視頻剪輯軟體還沒有轉過灣來的時候你可以從手機拍攝開始，手機天然是一個豎屏拍攝工具，你做電商，可以讓你的模特拍兩個豎版視頻；你做APP，直接上錄屏應用的操作界面。事實上，Facebook上超過三分之一以上的應用廣告都是直接放應用錄屏畫面。同時豎屏構圖的一個簡單實用的技巧就是把鏡頭對準單一的個人，哪怕你只對準他的頭部，移動直播如此火爆不是沒有原因滴。

不要怕增加成本，這些成本將以更多倍的方式返回。

人是任何產業的核心，而人恰好是豎版的，這是一種巧合還是一種宿命？

本專欄的其他熱門文章：細思極恐的YouTube可跳過廣告

推薦閱讀：