您现在的位置: 首页 > 网站导航收录 > 百科知识百科知识
智能电视UI怎么设计？
电视,焦点,用户智能电视UI怎么设计？
发布时间：2020-12-06加入收藏来源：互联网点击：
要少，你应该提供更少的UI，尽可能的自动化处理某些任务，而不是要求用户去互动。
市面上大多电视的尺寸都具有一定欺骗性。尽管现代电视的屏幕对角线通常大于40英寸，成比例地，观众坐在电视前比坐在电脑显示屏前要远。作为用户的感受到的是，电视屏幕尺寸“似乎”比电脑显示器要小。当你在设
计UI时，你可以用自己的手机连接ps来模拟这种体验.
三、显示器和移动设备的显示分辨率
电脑显示器最大分辨率，通常小于或等于显卡分辨率。显卡决定最大分辨率，显示器决定像素密度。移动设备的分
辨率和像素密度往往是固定的，电脑操作系统能自动处理分辨率和像素密度的问题。
Android系统根据设备屏幕大小和像素密度来按比例缩放UI。此外，你可以提供可替换的UI资源，为不同设备准备最好的UI体验。
电视显示分辨率
电视（即使是最现代化的那些电脑）有基于扫描线的显示分辨率。Google TV 支持3种扫描线值的高清电视：720p，1080i和1080p，这代表720逐行扫描线，1080隔行扫描线和1080逐行扫描线（Android将后两者视作等同）。720值意味着电视可以在屏幕的垂直方向上“寻址”720条不同的线；1080值则意味着电视以在垂直方向上“寻址”1080条线。
这些线有多高，每条线之间的“宽”是多少？也就是说电视的实际像素密度是多少？Android将这些数值抽象显示为与密度无关的像素单位（缩写 dp）。
Android 应用程序得益于Android的缩放技术。总之，你应该为1080p的规格来设计UI，允许Android系统将你的UI缩小到720p的规格，因为缩小图形的效果通常要优于放大的效果。为了得到最好的图片缩放效果，可以给开发提供.9.png切图。
智能电视的设计尺寸
所以建议以1080P作为视觉设计稿尺寸，切图可以使用android 9-patch切图进行低分辨率适配 ，在测试的时候选择用低分辨率测试可以更好的发现问题；确保在TV所有显示模式下经过测试，都不会产生问题。
拿上面的图为例，设计尺寸为1920X1080，因为上面讲到的电视屏幕显示特性，不同厂家甚至还不一样，那么为了避免这些问题的出现，在设计界面的时候，如上图给边缘留10%或以上的外边距，所有内容放在这个容器内去设。
我习惯给上下边距留90个像素，左右边距留120个像素，不一定要按我的数值去设计，具体数值可以自己根据实际情况去协调。
回答于 2019-09-11 08:43:50
智能电视的特性
对于现在家庭智能电视而言，技术在不断的进步，但是其饱和度和对比度有的还是很强，还会遇到大红碰到大紫的色块对比。但是信息变得简约了，都是以 tab 导航为主，下面是几个卡片信息瀑布流显示。语音提示很重要，会随着焦点的移动发出提示声响，提示用户电视焦点的移动状态。
小米电视商城全新改版，在接到需求后，一定要模拟用户来体验一下购物流程还有用电视购物的环境，环境应该是固定的，那就是在家里。电视和手机购物体验是不一样的，电视是要用遥控器来控制，所以每一步的操作流程都很珍贵，如果界面跳转太多，会给用户一种烦躁的感觉，所以尽量同一层级的信息要在同一界面填写完毕，避免二次跳转。
第二点说的就是焦点问题，焦点不能层次不齐，跳动太大会引起视觉不适。以小米电视商城详情为例，焦点尽量在同一水平线上，同行的焦点移动，视觉感受上会舒服很多。
设计尺寸
智能电视的分辨率和大家平常在 app 看电影的时候差不多，如上图所示，目前 1080p 最常见，2k 和 4k 基本都是资源类节目。设计尺寸以小米电视为例，通常做 1920*1080 的视觉稿就可以了，开发会适配比 1920*1080 小的电视屏幕，这样下来，如果小分辨率的电视没问题了，大的分辨率也就没问题了。
我们知道在设计 app 的时候，都有左右间距的控制，移动端一般常见的控制在 28px 或者 32px，电视端因为是大屏设计，所以预留的空间也要大一些，基本左右留出 120px，上面留出 90px 就可以了。一般我设计的时候左右是固定的 120px，上面可以随设计内容来自定义，90px 或者 100px，都是可以的，只要视觉舒服即可。
焦点在电视端 UI 设计里显得尤为重要，因为它就是你的视觉焦点，焦点会随着遥控器上下左右确认而改变。焦点的设计不能是扁平的，因为那样不能够提醒用户焦点状态的位置，焦点的设计应该是放大的、夸张的、可以带边框，也可以使用投影外发光的方式来设计，确保能够给用户足够的清晰位置。
焦点放大我这里建议放大 1.1 倍或者 1.2 倍就可以了，再大就显得过于大了。
交互设计
如上图所示，我在设计焦点的时候，就用了放大+外边框的形式，这样焦点移动起来可以让用户足够看到位置所在。电视端的交互也是很简单的，基本属于十字交互，即自上而下，从左到右的交互方式。红色剪
回答于 2019-09-11 08:43:50
简单实用
回答于 2019-09-11 08:43:50
据说是因为以前电视机成本问题，导致电视画面边缘变形，因此厂家就把边缘部份伸到屏幕外面去，就不太看得出来变形。我家sony电视外接PC好像没有出现过过扫描，不知现在较新的电视是否还存在过扫描现象
上一篇：今年疫情几月份可以结束啊？
下一篇：返回列表
相关链接 |
||
| 网友回复（共有 0 条回复） |