恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
面试问题,视频横屏与竖屏的设计差异?我是这样回答的
0.0°
2020-12-08 原创文章 经验/观点 举报 15840 145 283 9

Hi,我是彩云。最近在群里看到一位同学提问,在面试的时候被问到视频横屏与竖屏的设计差异,讨论还挺火热。正好我之前做过一个从竖屏到横屏转型的短视频App项目,有一些设计思考,当时把这些思考发在了我的知识星球,反馈还不错。所以我也把它分享在公众号上,跟大家一起探讨学习。 


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

1、横竖屏设计的源头

2、横竖屏设计的差异

3、横竖屏对内容生产的影响

4、小结


1.横屏竖屏设计的源头

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

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


2.横竖屏设计的差异

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


横屏的优势:


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

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


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



2)横屏阅读效率更高

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



3)横屏更偏向于看内容

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


4)横屏短视频体验新奇

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


5)保护视力

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


竖屏的优势:


1)竖屏更偏看人及互动

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


2)便于碎片化场景

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


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

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

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


3.横竖屏对内容生产的影响


大家平时看的电影和电视一般都是16:9的宽屏设计,是因为这种宽幅的视觉比例有利于利用景深镜头打造画面的空间感,有利于通过前后景的融合营造更多想象空间,从而使故事内容更富有深意。而要理解这种深意,观众往往需要投入很多精力,也就更加获得更好的沉浸感。



如今短视频时代,人们的耐心变得非常稀缺,更希望看到的内容简单直接,这就要求短视频制作要尽量前置主体,使传达的信息更加明确、直接。相比擅长沉浸感更强,需要更多思考的横屏内容,竖屏视频内容更能迎合这一要求,它能更多聚焦在主体人物本身,从而更适合以人为主体的直播等内容。



总结

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

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

一句话总结横竖屏差异,横屏是存量的人类精华,竖屏是现实时刻的生活和百日梦。

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





Powered by Froala Editor

微信公众号:彩云译设计

更新:2020-12-08

收藏

145人已收藏

彩云Sky

腾讯ISUX高级视觉设计师

  • 177

    作品

  • 1.3w

    粉丝

  • 13

    关注

  • 实战案例!如何从0到1为Apple Vision Pro设计
  • 苹果Vision Pro上到底有哪些设计亮点?| 视觉篇
  • 抢先体验苹果visionOS的方法
  • 深度解读VisionOS设计原则,掌握下一代设计趋势!

    猜你喜欢

      2020-12-08 原创文章 经验/观点 举报 15840 145 283 9

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

      0.0°

      你确定要举报面试问题,视频横屏与竖屏的设计差异?我是这样回答的

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2020年12月08日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      283
      145
      9

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录