响应式布局在视频App界面设计中的运用

论文总字数：10392字

目 录

1. 绪论 6

　　1.1选题背景及意义 6

1.2响应式设计在国内及国外的发展现状 6

1.2.1国内发展现状 6

1.2.2国外发展现状 6

2. 响应式布局的概念和特征 6

2.1响应式布局方式 6

2.1.1 固定布局 6

2.1.2流线布局 7

2.1.7等比缩放 10

2.1.4拓展布局 11

2.1.5分栏布局 13

2.1.6流动布局 14

2.1.7重复布局 15

2.2响应式布局的优缺点 16

2.2.1优点 16

　　2.2.1.1用户体验友好 16

2.2.1.1减少开发成本 17

2.2.2缺点 17

2.3响应式界面的基本规则 17

3.探讨响应式布局在视频软件中呈现的效果 17

3.1视频APP交互用户体验 17

3.1.1用户认知与行为因素 17

3.1.2用户体验要素 17

3.2响应式布局在视频APP中的作用 18

3.3视频软件在各个终端的界面设计探讨 18

3.3.1 智能手机 18

3.3.2 电脑端 18

3.3.3 TV端 18

4.如何更好地布局界面 18

4.1从学习借鉴到改进创新 18

4.2从交互感知到多通道设计 19

5.总结与展望 19

5.1工作总结 19

5.2展望 19

参考文献 19

致谢 20

响应式布局在视频App界面设计中的运用

田今

传媒与艺术学院， 20141379004

摘要：移动互联网的日益普及，在我们的日常生活中，移动设备越来越多，生活中最常见的就有智能手机、智能电视、电脑，它们的显示屏都拥有不同的分辨率，如果软件设计者为各种设备和分辨率，开发适应画面尺寸的页面，这样的设计是非常低效的并且对于软件更新是不方便的。若根据以往的设计方式去设计软件，与越来越多的手机终端和终端下的许多模型对应，每个模型构筑一个界面，然后，等到这些终端被更新，为了适应各种终端，所有的界面都要重新编排，还要创建各种不同的分辨率和大小的版本，不仅耗时，而且非常不符合当前形式，虽然某些特定设备用户会十分认可，但是与此同时，大部分不用这些设备的人就会选择放弃。时代在发展，有困扰我们的地方，就一定有解决的方法，Ethan Marcotte在2010年五月份提出的响应式布局就完美地使上述问题不再成为困扰，它从访问设备的环境中提供数据，然后根据访问设备分辨率适当调整图片的像素以及尺寸大小、位置等，这无疑为用户提供了更舒适的视觉体验，也就是说，不管此时此刻用的是什么型号的智能设备，我们所能看到的界面都是最符合当前设备的最佳适配。总而言之响应式布局是指通过特定技术实现能够兼容多个不同的终端，在移动端中，它能使我们设计的元素在任何大小屏幕中能够灵活适配，保证布局和体验的一致性，毫无疑问的，响应式UI设计对于现今碎片化的屏幕是非常重要的，它能使我们在最小资源的情况下完成设计适配。本文根据响应式布局设计进行认识和研究，区分、探讨各响应式的布局模式及优缺点，并根据各不同终端例如智能手机、pad、电脑、智能电视，融合现今视频软件的优缺点，研究适合现今的视频APP的响应式界面。

关键词：视频APP；界面；响应式

Application of response layout in Video App Interface Design

School of Media and Arts,NUIST,Nanjing 20141379004,TianJin

Abstract:The growing popularity of the mobile Internet, in our daily life, more and more mobile devices, the most common in life are smart phones, smart televisions, computers, their displays have different resolutions, If a software designer develops a page that adapts to screen size for a variety of devices and resolutions, such a design is very inefficient and inconvenient for software updates. If you design the software according to the way you used to design it, it corresponds to more and more mobile phone terminals and many models under them, and each model builds an interface, and then, when these terminals are updated, in order to adapt to a variety of terminals, All interfaces. Rearranging, and creating versions of different resolutions and sizes, is not only time consuming, but also very inconsistent with the current form, although some users of certain devices will be quite approachable, but at the same time, Most people who don't use these devices will choose to give up. The times are evolving, and where we are, there must be a solution. The responsive layout that Ethan Marcotte put forward in May 2010 is the perfect way to make this problem no longer a problem, providing data from the environment in which it accesses the device. Then, according to the resolution of the access device, the pixels of the picture are adjusted appropriately, as well as the size, size, position, etc., This undoubtedly provides a more comfortable visual experience for the users, that is, whatever model smart devices are used at the moment, the interface we can see is the best fit for the current device. In a word, the response layout means that a specific technology can be implemented to be compatible with multiple different terminals, in the mobile end, It enables us to design elements flexibly in any size screen to ensure consistency in layout and experience. There is no doubt that response UI design is very important for today's fragmented screens. It enables us to complete design adaptation in the case of minimal resources. This article is based on response layout. Design to understand and research, distinguish, explore the layout of each response mode and advantages and disadvantages, and according to the different terminals such as smart phones, computers, smart TV, fusion of the advantages and disadvantages of today's video software, The response interface suitable for today's video APP is studied.

Key words:Video app;interface;response

1. 绪论

本章将介绍项目的选题背景、意义和目前响应式设计在国内外的发展状况。

剩余内容已隐藏，请支付后下载全文，论文总字数：10392字