文章開頭：本文是衛(wèi)夕老師發(fā)表在產(chǎn)品壹佰的文章（http://www.chanpin100.com/article/105745 ）轉(zhuǎn)載文章僅供大家習(xí)碟嘴，不作任何商業(yè)用途。

如果我說老羅的錘子科技在某些設(shè)計(jì)方面也犯過業(yè)余的錯(cuò)誤囊卜，你肯定會(huì)反駁娜扇，不著急，請(qǐng)戳文栅组。

【說明】：嚴(yán)格意義上說雀瓢，標(biāo)題中的“錯(cuò)誤”用“瑕疵”表述更加準(zhǔn)確，我對(duì)取這樣標(biāo)題可能給錘子科技帶來的負(fù)面效應(yīng)表達(dá)誠(chéng)摯歉意玉掸，同時(shí)錘科作為一家以優(yōu)秀工業(yè)設(shè)計(jì)和軟件設(shè)計(jì)見長(zhǎng)的科技公司刃麸，公眾對(duì)其設(shè)計(jì)水準(zhǔn)的期望的確會(huì)苛刻一些。

一司浪、從錘子科技的一張配圖說起

如果我說老羅的錘子科技在某些設(shè)計(jì)方面也犯過業(yè)余的錯(cuò)誤你肯定會(huì)反駁泊业，不著急，請(qǐng)接著往下看啊易，下面是一條錘子科技今年5月重要手機(jī)產(chǎn)品——堅(jiān)果Pro發(fā)布時(shí)吁伺，官方微博的主配圖：

沒錯(cuò)，這張圖是堅(jiān)果Pro在微博客戶端里呈現(xiàn)的效果租谈，這張橫版圖只占據(jù)了屏幕不到的三分之一面積篮奄，它孤單地站在手機(jī)的中央，顯得有些怯弱割去，并不能將堅(jiān)果Pro優(yōu)秀的工業(yè)設(shè)計(jì)完全表現(xiàn)出來窟却，至少第一眼是這樣的。

而這本是可以避免的呻逆，假如把這張圖換成豎版設(shè)計(jì)夸赫，效果就會(huì)立馬變得不一樣，如果只看手機(jī)呈現(xiàn)的面積咖城，足足是橫版圖片的六倍憔足，其視覺沖擊感用一個(gè)天上一個(gè)地下來形容也不為過。

同樣的疏忽延續(xù)到了剛剛發(fā)布的堅(jiān)果Pro2酒繁，展示堅(jiān)果Pro2全面屏是的主配圖是下面這張滓彰，當(dāng)時(shí)我看一邊看發(fā)布會(huì)一邊刷微博刷到這張圖的時(shí)候，總感覺到了一絲說不出的別扭：一款主打全面屏手機(jī)第一次在網(wǎng)絡(luò)上出現(xiàn)的時(shí)候并沒有占據(jù)屏幕的全部州袒。

很顯然揭绑，錘子科技微博其實(shí)是直接拿著發(fā)布會(huì)的演示幻燈圖片發(fā)出來的，我們可以理解老羅為排期緊張的發(fā)布會(huì)殫精竭力的同時(shí)并沒有時(shí)間將幻燈片重新設(shè)計(jì)成豎版，但這是一款工業(yè)設(shè)計(jì)優(yōu)秀的手機(jī)在老羅1400萬微博粉絲中第一次亮相他匪，本可以做的更驚艷一些菇存。

作為一家初創(chuàng)企業(yè)，老羅是如此重視微博這一傳播陣地（從他購(gòu)買微博的粉絲頭條的頻率可以看出來）邦蜜，然而在對(duì)發(fā)布會(huì)傳播起重要作用的微博圖片卻留下這樣的瑕疵依鸥，不得不說是一個(gè)遺憾。

不僅僅錘子悼沈，衛(wèi)夕查看了小米贱迟、華為等無數(shù)在這個(gè)時(shí)代領(lǐng)先的公司在發(fā)布會(huì)微博配圖也都是橫版圖片，由此引發(fā)一個(gè)值得所有市場(chǎng)推廣人思考的問題：為什么即使是業(yè)內(nèi)最出色的公司都會(huì)忽視橫豎屏的問題絮供？

小米MIX2和華為Mate10發(fā)布會(huì)官微的配圖

很多互聯(lián)網(wǎng)人并沒有意識(shí)到橫豎屏問題的重要性衣吠，有些人會(huì)下意識(shí)的反駁：你把手機(jī)橫過來不就完了嘛！看完下面的分析你或許就不會(huì)這么認(rèn)為了：

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

要解答這個(gè)問題，我們先看來人眼是如何工作的贮乳？由于生理結(jié)構(gòu)的原因忧换，人的雙眼在大腦前呈橫向排列，這樣導(dǎo)致的結(jié)果就是我們的視場(chǎng)角橫向要大于豎向向拆，科學(xué)家曾對(duì)人類視場(chǎng)角做了一項(xiàng)著名研究亚茬，研究結(jié)果顯示人類的視野大致如下：可以明顯看到，整個(gè)人類的視場(chǎng)角明顯呈橫向分布亲铡。

即使是單眼才写，我們眼珠的左右活動(dòng)范圍也要大于上下活動(dòng)范圍葡兑，因此注定了我們一眼看過去左右的視場(chǎng)角要大于上下的視場(chǎng)角奖蔓，為了適應(yīng)人眼的生理結(jié)構(gòu)。

幾乎我們能看到的所有視覺場(chǎng)景的設(shè)計(jì)都是橫版的：從古代的劇場(chǎng)到現(xiàn)代的電影讹堤，從客廳的電視機(jī)到臺(tái)式個(gè)人電腦吆鹤，這樣的設(shè)計(jì)的確能更符合我們的視覺直覺，橫屏無疑能讓我們的眼睛更舒服洲守。

眼睛是橫的這一點(diǎn)毫無疑問疑务，然而我們會(huì)發(fā)現(xiàn)一個(gè)明顯的悖論：為什么從東方到西方的書籍都是豎版的呢，從畢昇的印刷術(shù)產(chǎn)生的《資治通鑒》到古騰堡印出的《圣經(jīng)》都是清一色的豎版梗醇，這只是一種巧合嗎知允？

不，這恰恰說明了一個(gè)重要的人體工程學(xué)原則：當(dāng)我們雙手的舒適性和雙眼的舒適性出現(xiàn)沖突的時(shí)候叙谨，雙手的舒適性的優(yōu)先級(jí)要高于雙眼温鸽，即首先要保證我們拿著舒服，然后才是我們看的舒服。

這也解釋了同屬微軟office的辦公軟件涤垫，為什么Word默認(rèn)是豎版排列而PPT是橫版排列姑尺，因?yàn)閛ffice剛誕生的時(shí)候，PC和互聯(lián)網(wǎng)還遠(yuǎn)沒有今天普及蝠猬，電腦從某種意義上就是一臺(tái)打字機(jī)切蟋，Word文件的典型使用場(chǎng)景是：用電腦輸入、用打印機(jī)打印出來雙手查看榆芦，PPT就不存在這個(gè)問題柄粹。

手機(jī)的出現(xiàn)讓這一趨勢(shì)迅速加劇，準(zhǔn)確地說是智能手機(jī)的出現(xiàn)歧杏，功能機(jī)時(shí)代很多屏幕都是橫版的镰惦，智能機(jī)是人類增長(zhǎng)最迅速的豎版設(shè)備，當(dāng)手機(jī)成為人們一個(gè)器官的今天犬绒，我們隨時(shí)隨地能消費(fèi)信息的前提是我們能拿住它旺入，因此單手操作的豎版就成為我們和手機(jī)日常接觸最符合人體工程學(xué)的姿勢(shì)。

當(dāng)我們豎版拿著手機(jī)但出現(xiàn)了橫版的構(gòu)圖的時(shí)候凯力，就出現(xiàn)了錘子科技堅(jiān)果Pro那樣感覺別扭的構(gòu)圖茵瘾。這種現(xiàn)象屢見不鮮，從微博配圖到電商著陸頁咐鹤，從廣告投放到應(yīng)用設(shè)計(jì)拗秘，毫不夸張地說，如今移動(dòng)設(shè)計(jì)的基本矛盾就是：顯而易見的豎版手機(jī)和汗牛充棟的橫版構(gòu)圖之間的矛盾祈惶。

有些人一定會(huì)反駁：你把手機(jī)橫過來不就完了嘛雕旨！沒錯(cuò)，我們的確是可以把手機(jī)橫過來捧请，然而我們忽略了使用頻率的問題凡涩，我們看電影或玩大型游戲的時(shí)候的共同特征是橫過來頻率很低，我們橫過來可以看一個(gè)小時(shí)疹蛉，但讓我們一分鐘橫過來五次我們就瘋了活箕。

當(dāng)一個(gè)電商產(chǎn)品在第一眼沒有用充滿整個(gè)屏幕的豎版構(gòu)圖吸引用戶的時(shí)候，用戶為什么要橫過來可款？拜托育韩！大家都很忙滴！你以為你是TFBOYS肮刖ā筋讨！

數(shù)據(jù)說明了一切：英國(guó)一家調(diào)研機(jī)構(gòu)Unruly的一項(xiàng)調(diào)查顯示，52% 的手機(jī)用戶習(xí)慣將屏幕方向鎖定為豎向摸恍；MOVR Mobile的報(bào)告也顯示：智能手機(jī)用戶有94%的時(shí)間將手機(jī)豎版持握而非橫版悉罕。

記住：用智能手機(jī)的這一代是人類發(fā)展到今天最懶惰的一代人：“橫過來，太TM費(fèi)勁了蛮粮！”益缎，如果說互聯(lián)網(wǎng)行業(yè)有一條必須遵循的鐵律，那么這條鐵律八成是：縱容人類的懶惰然想，而不是改變它莺奔！

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

微博故事变泄、微信小視頻升級(jí)成豎版令哟、Facebook快拍、Snapchat的發(fā)現(xiàn)頻道妨蛹、Instagram的Story功能.......它們有神馬共同特征屏富？

答案是他們都是中美互聯(lián)網(wǎng)市場(chǎng)上的國(guó)民應(yīng)用在過去兩年推出的最重要的功能，而這些功能有一個(gè)共同的特征——豎版視頻蛙卤，在整個(gè)移動(dòng)互聯(lián)網(wǎng)的內(nèi)容都在不可避免地視頻化的大背景下狠半，從長(zhǎng)視頻到短視頻的進(jìn)化是一個(gè)明顯的趨勢(shì)，從橫版視頻向豎版視頻的轉(zhuǎn)變卻很少有人注意到颤难，而這恰恰是一個(gè)勢(shì)不可擋的歷史潮流神年。

當(dāng)我們橫版拿著手機(jī)看一個(gè)小時(shí)的《權(quán)利的游戲》一點(diǎn)問題都沒有，然而當(dāng)你一分鐘內(nèi)看四個(gè)小視頻行嗤，你不可能把手機(jī)橫過來四次已日，從長(zhǎng)視頻到短視頻，從橫版視頻到豎版視頻栅屏，背后的邏輯是統(tǒng)一的飘千。

敏銳感知到這一潮流的APP已經(jīng)嘗到了甜頭，比如中美短視頻領(lǐng)域近年迅速崛起的新貴快手和Snapchat：Snapchat在視頻領(lǐng)域提出了3V原則：即video栈雳、Vertical护奈、View，即視頻化甫恩、豎屏化及可看性逆济，即你如果不是豎版的視頻素材酌予，那么你就無法在這個(gè)全球風(fēng)頭正勁的應(yīng)用上投放廣告磺箕。

無獨(dú)有偶，快手合伙人曾光明也對(duì)媒體說：“快手的大數(shù)據(jù)系統(tǒng)對(duì)每天6000萬用戶的每一個(gè)行為進(jìn)行判斷歸納抛虫，在當(dāng)前的用戶行為松靡、技術(shù)和市場(chǎng)下，“豎屏建椰、57秒”可能是短視頻行業(yè)的工業(yè)標(biāo)準(zhǔn)雕欺。”

然而，當(dāng)整個(gè)短視頻內(nèi)容都在向移動(dòng)轉(zhuǎn)型的時(shí)候屠列，我們很多內(nèi)容提供商和廣告主卻還沒有迅速轉(zhuǎn)變過來啦逆，到Instagram的故事頁看一看，會(huì)發(fā)現(xiàn)我們很多熟悉的知名媒體并沒有那么多豎版的視頻填充笛洛，于是他們只能用橫版視頻拼湊或者豎版的圖片拼接成一個(gè)幻燈在放映夏志，下面是美國(guó)著名的脫口秀節(jié)目艾倫秀的官方賬號(hào)在Instagram的豎屏頁面的表現(xiàn)。

我們?cè)賮砜匆粋€(gè)典型的例子苛让，下圖是六神花露水投放的應(yīng)用開屏廣告沟蔑，直接把一個(gè)視頻放到了素材的頂部，我不知道大家看到這個(gè)創(chuàng)意是神馬感受狱杰，我的感覺是好像在無數(shù)跑車飛馳的高速公路上一輛精致的馬車在緩緩蠕動(dòng)瘦材，這顯然是直接把它在電視上的橫版視頻素材直接搬到了開屏廣告上，六神這個(gè)廣告從某種意義上就是國(guó)內(nèi)品牌營(yíng)銷觀念滯后的一個(gè)典型縮影仿畸。

在這個(gè)問題上食棕，OPPO顯然敏銳地走在時(shí)代的前列，在微博推出故事后错沽，OPPO就請(qǐng)TFBOYS的三小只在微博故事上進(jìn)行了廣告投放宣蠕，當(dāng)王俊凱用豎屏視頻透過整個(gè)手機(jī)屏幕向你介紹R11的時(shí)候，OPPO早已在營(yíng)銷理念的前瞻性上將其他品牌遠(yuǎn)遠(yuǎn)拋在身后甥捺∏朗矗“比你們不知高到哪里去了！”

四镰禾、用戶已經(jīng)變了：橫版設(shè)計(jì)后果很嚴(yán)重

這本質(zhì)上是一個(gè)理念滯后的問題皿曲，移動(dòng)互聯(lián)網(wǎng)這個(gè)偉大的進(jìn)程推進(jìn)的是如此迅速，以至于我們很難再短時(shí)間之內(nèi)轉(zhuǎn)變理念吴侦、更新思維屋休，因?yàn)镻C工業(yè)的烙印深深地刻在了我們的腦中，橫版構(gòu)圖本質(zhì)上就是一個(gè)PC思維备韧。

我們的用戶已經(jīng)發(fā)生了深刻的變化劫樟，主要體現(xiàn)在：

1、閱讀時(shí)間和場(chǎng)景的碎片化织堂，用戶在看頁面的時(shí)候可能在地鐵叠艳、餐廳，也可能是在馬桶上易阳，它的注意力被嚴(yán)重分散附较。

2、用戶閱讀體驗(yàn)走向淺閱讀潦俺，兩秒鐘內(nèi)不抓住用戶的眼球他就走了拒课，他還有很多的朋友圈徐勃、頭條、微博要刷早像，爭(zhēng)取注意力成為一場(chǎng)更加殘酷的戰(zhàn)爭(zhēng)僻肖。

信息的消費(fèi)者早已發(fā)生了變化，然而信息的生產(chǎn)者卻沒有轉(zhuǎn)變思維卢鹦，由于過去我們?cè)赑C上投了太多資源與精力檐涝，我們的設(shè)計(jì)師都是從PC時(shí)代過來的，而且即使是在今天法挨，設(shè)計(jì)師使用的電腦依然是橫版電腦谁榜，他們沒辦法把漂亮的蘋果iMac電腦豎過來。

如果依然用PC的橫版思維來作圖凡纳，后果非常嚴(yán)重窃植，特別是對(duì)投入產(chǎn)品要求特別高的廣告行業(yè)來說，橫版和豎版的的效果可能千差萬別荐糜，Snapchat的副總裁在戛納創(chuàng)意節(jié)上告訴媒體巷怜，經(jīng)過他們測(cè)試，橫版視頻廣告的播放完成率是豎版廣告的1/9暴氏。正因?yàn)樨Q版效果立竿見影延塑，微信的朋友圈采用豎版視頻的廣告在2016年增長(zhǎng)了46%。

橫版構(gòu)圖對(duì)于內(nèi)容生產(chǎn)者來說是一個(gè)表現(xiàn)力的問題答渔，對(duì)于商家和廣告主而言來說就是ROI的問題了：一家每天流水10萬的電商店鋪关带，如果利用豎版構(gòu)圖去做信息流廣告提升20%的轉(zhuǎn)化，每天的營(yíng)收就能增加2萬沼撕，電商從業(yè)者會(huì)明白我說這句話的意義宋雏。

五、我們應(yīng)該如何做务豺？

明白了豎屏是趨勢(shì)以及它的重要意義之后我們能做神馬呢磨总？

“能做神馬？當(dāng)然是以后用豎版圖片發(fā)朋友圈啦笼沥！終于明白我朋友圈曬新買的一雙耐克為什么點(diǎn)贊那么少了蚪燕，原來我犯了和錘子科技一樣的錯(cuò)誤！”

哈哈哈奔浅，能明白這一點(diǎn)其實(shí)悟性非常高馆纳，我并木有開玩笑（認(rèn)真狀.......）

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

首先乘凸，從“道”層面厕诡，我們需要從理念上認(rèn)識(shí)到豎屏的意義累榜，從思想上徹底和PC時(shí)代說拜拜营勤，重新梳理我們對(duì)于手機(jī)頻幕和手機(jī)用戶的認(rèn)識(shí)灵嫌，這需要整個(gè)團(tuán)隊(duì)一起轉(zhuǎn)變思維：如果你是運(yùn)營(yíng)，請(qǐng)將這篇文章發(fā)給你們產(chǎn)品葛作；如果你是產(chǎn)品寿羞，請(qǐng)轉(zhuǎn)給技術(shù)和設(shè)計(jì)；如果你是老板赂蠢，請(qǐng)轉(zhuǎn)給你的員工绪穆。

其次，從“術(shù)”的層面：

1）學(xué)習(xí)豎版構(gòu)圖虱岂，橫屏更適合全局性玖院，大場(chǎng)面的敘事方式，豎屏更適合去表達(dá)個(gè)體第岖，專注于人物和事件本身等等难菌，基于這一點(diǎn)，豎屏制作中需要重新考慮內(nèi)容的重點(diǎn)蔑滓、畫面的構(gòu)圖等等郊酒，比如PC時(shí)代常見的圖片和文字的左右結(jié)構(gòu)可以修改成上下結(jié)構(gòu)，本來是橫著擺放的拍攝可以豎著排放键袱。

錘子科技的PC網(wǎng)站和移動(dòng)網(wǎng)站其實(shí)已經(jīng)注意到了這個(gè)問題

2）對(duì)自己所負(fù)責(zé)的業(yè)務(wù)做一個(gè)全面的檢查燎窘。把你負(fù)責(zé)的所有頁面進(jìn)行了一個(gè)全面的檢查，不管是常規(guī)內(nèi)容素材還是廣告素材褐健，不管是公司官方還是廣告落地頁，不管是公司微博還是微信铝量。在注意力成為稀有資源的今天银亲，誰的圖有沖擊力誰就能獲得更多的展現(xiàn)機(jī)會(huì)慢叨。

3）重視視頻的豎屏化，整個(gè)內(nèi)容趨勢(shì)都在向視頻轉(zhuǎn)型务蝠，我們需要對(duì)這個(gè)趨勢(shì)保持敬畏，不管你是做內(nèi)容還是做廣告轩拨，豎版的視頻都能更好地在移動(dòng)設(shè)備上展示。當(dāng)相機(jī)廠商和視頻剪輯軟件還沒有轉(zhuǎn)過灣來的時(shí)候你可以從手機(jī)拍攝開始院喜，手機(jī)天然是一個(gè)豎屏拍攝工具亡蓉，你做電商，可以讓你的模特拍兩個(gè)豎版視頻砍濒；你做APP，直接上錄屏應(yīng)用的操作界面爸邢。事實(shí)上杠河，F(xiàn)acebook上超過三分之一以上的應(yīng)用廣告都是直接放應(yīng)用錄屏畫面。同時(shí)豎屏構(gòu)圖的一個(gè)簡(jiǎn)單實(shí)用的技巧就是把鏡頭對(duì)準(zhǔn)單一的個(gè)人券敌，哪怕你只對(duì)準(zhǔn)他的頭部，移動(dòng)直播如此火爆不是沒有原因滴颈走。

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

人是任何產(chǎn)業(yè)的核心锐膜，而人恰好是豎版的弛房，這是一種巧合還是一種宿命？

文章結(jié)尾：再次申明所有轉(zhuǎn)載文章僅供學(xué)習(xí)荷逞，感謝衛(wèi)夕老師的分享粹排，如果喜歡我們的文章點(diǎn)關(guān)注??吧咕娄！比心呦！