知识分享

  • 首页
  • 市场分析
  • 需求分析
  • UI设计
  • 产品运营
  • 产品设计
  • 项目管理
  • 新玩意儿
不积跬步无以至千里
不要停留,欣赏沿途的风景
  1. 首页
  2. 产品设计
  3. 正文

面试问题,视频横屏与竖屏的设计差异?我是这样回答的

2020年12月24日 331点热度 0人点赞 0条评论

编辑导读:视频竖屏和横屏是一个很常见的交互操作,那你有想过这两种设计有什么区别吗?当面试时候被问到这个问题,你会怎么回答?本文作者从自身工作实践出发,对这个问题进行了了梳理分析,并分享了他的几点看法,希望对大家有所帮助。

最近在群里看到一位同学提问,在面试的时候被问到视频横屏与竖屏的设计差异,讨论还挺火热。正好我之前做过一个从竖屏到横屏转型的短视频App项目,有一些设计思考,我把它分享出来,跟大家一起探讨学习。

视频竖屏和横屏是一个很常见的交互操作,那大家有没有想过:为什么会有横竖屏的设计以及背后会有怎样的逻辑呢?我想从以下几点来分析:

  1. 横竖屏设计的源头
  2. 横竖屏设计的差异
  3. 横竖屏对内容生产的影响
  4. 小结

01 横屏竖屏设计的源头

横竖屏切换策略最早应用于QWERTY侧滑全键盘按键设计的手机上(早期塞班S60与Windows Mobile等智能操作平台),用户在使用键盘输入时须把手机转90度来使用,因而屏幕内容也要随之切换。

从这里可以看出,早期的横竖屏设计是为了适应硬件的变化。但如今随着硬件的升级,外置键盘的设计早已不成为主流,现在的横竖屏选择更多的是为了服务于内容。

02 横竖屏设计的差异

先给大家来一张我做的思维导图,横屏与竖屏的差异对比,

1. 横屏的优势

1)横屏具有更强的沉浸感

大家平时用的电脑,电视,基本上都是横屏的设计,为啥会设计成横屏也是有原因的,因为人眼在生理上的视野范围跟平时见到的横屏设计的比例是比较相符的。所以,横屏相较于竖屏来说,能有更好的沉浸感体验,这就是为什么一些长视频应用,比如腾讯视频,优酷之类的,一般会设计成横屏的原因。

如果在这个视野范围内都是屏幕,那么就会给我们一种身临其境的感觉。这就是为什么角色扮演类游戏需要做横屏设计,电影的荧幕是21:9的原因。

2)横屏阅读效率更高

水平方向阅读更符合人体生理,眼球横向来回扫视比较方便,所用时间也较短。如果是竖屏的,可能会需要低头才能扫视完整块屏幕。从所用时间和角度来看,横屏的阅读效率相对较高。

3)横屏更偏向于看内容

由于具有很强的沉浸感,也就意味着需要观看者接受更高密度的信息量,使得横屏下更适合深度看内容,更适合PGC内容形态。当时我们想要做的是知识型短视频内容,横屏状态可以让用户有更高的专注度。

4)横屏短视频体验新奇

想要获得比较好的传播,亮点很重要。目前市面上大多数短视频应用都是基于竖屏来做的,横屏短视频设计相对较少,做成横屏会比较有特点,能让人产生记忆点。

5)保护视力

横屏下的内容其实跟书本宽度比较接近,阅读屏幕内容时眼珠子会横向扫动,而在竖屏下眼球基本上不动。所以,还能起到一定的保护视力作用。

2. 竖屏的优势

1)竖屏更偏看人及互动

因为竖屏的构图关系,竖屏视频相较于横屏视频画面中容纳的人数更少,所以它更容易给人带来一对一的交流感,具有很强的互动性。在你来我往的互动过程中所带来的信息密度一般相对较低,内容属性更偏娱乐化,浅知识,所以可以看到在很多的直播设计中,都是采用的竖屏设计。

2)便于碎片化场景

竖屏下单手持握更加方便,同时因为没有太强的沉浸感,目光容易发散,所以更适合碎片化场景。

3)竖屏能使得拍摄重点更为突出

由于尺寸和人眼视野的问题,竖屏会让画面重点更为聚焦。

这里稍微介绍下理论依据:人眼视度即指人的肉眼可视角度的度数。人类通常是124度,当集中注意力时约为五分之一,即25度。人两眼重合视域为124度,单眼舒适视域为60度。所以在小角度视野下,画面的重点会更加突出。

03 横竖屏对内容生产的影响

大家平时看的电影和电视一般都是16:9的宽屏设计,是因为这种宽幅的视觉比例有利于利用景深镜头打造画面的空间感,有利于通过前后景的融合营造更多想象空间,从而使故事内容更富有深意。

而要理解这种深意,观众往往需要投入很多精力,也就更加获得更好的沉浸感。

如今短视频时代,人们的耐心变得非常稀缺,更希望看到的内容简单直接,这就要求短视频制作要尽量前置主体,使传达的信息更加明确、直接。

相比擅长沉浸感更强,需要更多思考的横屏内容,竖屏视频内容更能迎合这一要求,它能更多聚焦在主体人物本身,从而更适合以人为主体的直播等内容。

总结

横屏和竖屏是我们日常见到的最普遍的一种交互形式了,因为见惯了,所以我们很多时候对这些设计会觉得理所当然,却忽视了背后的设计逻辑。

为什么短视频会以竖屏居多,为什么长视频大多数都是横屏展现,为什么电视和电影的设计比例是宽屏而非竖屏等等。很多优秀的设计背后都是有原因的,没有无缘无故的成功。

多一点思考,再小的点也有大的学问。

以上内容,就是彩云关于横竖屏设计问题的思考,不一定都对,大家参考看看,有不同见解,欢迎沟通讨论。

#专栏作家#

彩云sky,公众号:彩云译设计

本文原创发布于人人都是产品经理。未经许可,禁止转载

题图来自Unsplash,基于CC0协议

给作者打赏,鼓励TA抓紧创作!

标签: 暂无
最后更新:2020年12月24日

小虾米

同理心,洞察力!

点赞
< 上一篇
下一篇 >

文章评论

razz evil exclaim smile redface biggrin eek confused idea lol mad twisted rolleyes wink cool arrow neutral cry mrgreen drooling persevering
取消回复
最新 热点 随机
最新 热点 随机
爽剧依然很香,阅文知乎都来了 2023年底,云计算“水逆” 从线索到订单LTO:传统汽车销售在哪些步骤可以数字化? 沉浸式空间娱乐连锁门店小程序产品设计方案 【大模型】企业内部如何快速应用GPT为我们提效——产品经理视角 产品猎人(一)丨带你探索更多体验案例 抖音心晴、百度万话上线,大厂押注AI社交能跑出下一个微信吗? 民宿市场@2023,木鸟途家美团翻红战背后 中台列表如何设计,才能兼具实用性与多样性? 产品周报276期 | Google发布AI大模型Gemini,腾讯NOW直播宣布12月26日停止运营 Axure高保真教程:树筛选中继器表格 猫狗拼「斜杠」微短剧:毒药还是解药? AI 产品经理和 AIGC 产品经理有什么区别,怎么选择? 2023 年度热词,只能是它 B 站更新:把抖音当做方法 腾讯 TDesignFlutter 组件库开源啦🎉🎉🎉 推荐策略在图库行业的应用 平台多商家如何进行到家服务产品设计? 短剧付费,一场抖音快手和小程序的“不对称战争” 消费金融数字化专题研究(二):消费金融行业发展PEST分析
OpenAI CEO总裁联合声明透露被罢免经过:在线会议中被解雇;事件几大原因分析为什么受伤的,总是数据管理部门?Sam Altman卸任CEO的几点猜想供应链系统中的编码和条码,你真的懂了吗?OpenAI不感谢Altman消费金融数字化专题研究(二):消费金融行业发展PEST分析啊这,以后刷抖音可能要付费了?短剧付费,一场抖音快手和小程序的“不对称战争”抖音神曲,消失了?平台多商家如何进行到家服务产品设计?【颠覆小红书】:未来的发展关键在哪些功能上?推荐策略在图库行业的应用揭秘产品经理必备的核心思维能力腾讯 TDesignFlutter 组件库开源啦🎉🎉🎉智能电视操作设计得这么复杂,真的合理吗?B 站更新:把抖音当做方法爽文短剧到底有多赚?到了横店我差点想入伙2023 年度热词,只能是它HubSpot 如何做到 20 亿美金 ARRAI 产品经理和 AIGC 产品经理有什么区别,怎么选择?
存储行业的变革时刻,分布式能否破解元宇宙存储密码 你的系统定位是什么? 深度解析字节跳动文化:让效率起舞,全面数字化在线协同办公的最佳实践? 以包容性设计看金融产品的惠农设计 一文讲透SPU和SKU 跨过野蛮生长的直播电商下一步该走向何方? Instagram 的进化之路 当代设计已经失去了它的灵魂 搜索功能分析:一个好的搜索功能有哪些结构? 2019年,小程序如何做好冷启动? 蜜雪冰城给“茶饮文学”加了一把火 轮到淘宝直播“守擂”了 产品经理启示录(一):产品经理的职业观 9.9元的AI芭比写真,会抢走摄影师的饭碗? 订阅制的后台设计应该怎么做? 设计自驱是伪命题? 信息流那些事儿 需求分析|产品经理应避开的三大指南 干货分享:定制食谱+社区团购APP设计 让设计更有价值:设计流程指南

COPYRIGHT © 2023 知识分享. ALL RIGHTS RESERVED.

Theme Kratos Made By Seaton Jiang