智能电视界面设计规范_中华文本库
智能电视哪个牌子好,说说微鲸电视全新WUI2 0系统 - 你有没有想过,为什么很多人都偏爱ios系统的iPhone、iPad呢?还不是因为它简洁的界面以及操作速度快。所以在考虑...
智能家电_设计/艺术_人文社科_专业资料。智能家电所谓智能电视,是指像智能手机一...但也有业内人士指出,政策限制较多、用户黏着度低、统一 标准缺乏、应用资源短缺...
微鲸智能电视55英吋PRO详细参数及标准配件_计算机硬件...外观设计 支架 CPU GPU 内存 储存空间 认证要求 ...定制电视界面 支持语音搜索及语音控制 支持 标准模式...
酒店智能电视方案书_信息与通信_工程科技_专业资料。...选择性部署,主要体现为对 主页面的功能模板的要求。...简洁的用户操控体验设计; 可在后台对 EPG 信息、...
Android智能电视APP开发笔记(一)_计算机软件及应用_IT/计算机_专业资料。源于一...界面不对了,遥控器也响应不了了,完全无法使用啊,结论就是手机 APP 和 TV ...
堡仕杰医院智能高清云电视系统解决方案_临床医学_医药...? 标准性原则 系统设计应严格按照国际和国家标准设计...互动系统基本功能模块如下: 页面 开机 首页主栏目 ...
? 标准性? 中航神州酒店智能互动电视方案 热线
系统设计...? ? ? ? 友好的 API 界面,易于集 集成和支持各项 项扩展应用的开 开发 ...
CIBN 互联网电视总编辑王坚平表示,“ CAN UI 智能电视系统通过‘界面设计、 内容汇聚、商业实现、个性关怀、智能互动、安全私密、坚实基础’七个层面的 开发, 使...
IPTV智能电视解决方案-酒店_计算机硬件及网络_IT/...操作界面,中英文配置界面可选 WEB 操作界面权限管理...- 25 - AHD-16 编码器采用 1RU 标准机架式设计...
首先要看外观工艺设计 小米电视 4A 43 英寸在设计上采用窄边框金属设计,延续...微鲸 WUI 为专为智能电视定制的电视界面,纵向瀑布流的布局、内容分类可以让用户...您所在位置： &
&nbsp&&nbsp&nbsp&&nbsp
电视界面设计规范.doc 48页
本文档一共被下载：
次 ,您可全文免费在线阅读后下载本文档。
下载提示
1.本站不保证该用户上传的文档完整性，不预览、不比对内容而直接下载产生的反悔问题本站不予受理。
2.该文档所得收入(下载+内容+预览三)归上传者、原创者。
3.登录后可充值，立即自动返金币，充值渠道很便利
你可能关注的文档：
··········
··········
电视界面设计规范
篇一：数字电视UI设计规范
本章描述了数字电视平台下客户端（包括Web 和应用程序两种）的显示部分的UI 规由于数字电视的目标用户是家庭用户，显示终端是电视机，控制终端是遥控器，所 以UI 规范将满足家庭用户的使用习惯，并符合电视机和遥控器的特点。 请按照如下规范来进行设计您的客户端，以确保在数字电视 上的高质量体验。
1.1 B/S Web UI
1.1.1 主界面及UI 规范 1.1.1.1 界面风格 1.1.1.1.1 字体类型： 1. 请使用黑体，Arial 等标准清晰的字体。
1.1.1.1.2 大标题文字 1. 字体：黑体 2. 字号：50pix 3. 颜色：RGB：189 112 36 4. 字间距：6pix 5. 有投影效果，略有一点浮雕效果 投影： 混合模式：正片叠底，颜色：RGB：3 13 76 不透明度：75% ，角度：120 ，使用全局光 距离：3 ，扩展：10 ，大小：5 ，杂色：0 ， 图层挖空投影 斜面和浮雕： 样式：内斜面，方法：平滑， 深度：41% 方向：上， 大小；0， 软化：0 角度：120，高度：30， 使用全局光 高光模式：滤色，颜色：RGB：228 156 107，不透明度：75% 暗调模式：正片叠底，颜色：RGB：0 0 0，不透明度：75%
1.1.1.1.3 菜单文字
1.1.1.1.1.1 原始状态文字 1. 字体：黑体 2. 字号：32pix 3. 颜色：RGB：210 210 210 4. 描边：RGB：55 47 45，大小：2，位置：外部，混合模式：正常，不透明度： 100% 5. 字间距：1pix 6. 行间距：62pix 7. 位置： i. 196，159 ii. 196，221 iii. 196，283
v. 196，407 vi. 196，469 8．有投影效果，透明度90% 投影： 混合模式：正片叠底，颜色：RGB：246 231 246 不透明度：75% ，角度：120 ，使用全局光 距离：5 ，扩展：49 ，大小：3 ，杂色：0 ， 图层挖空投影
1.1.1.1.3.2 选中状态文字 1. 字体：黑体 2. 字号：32pix 3. 颜色：RGB：193 152 27 4. 字间距：3pix 5. 文字在选中条中的位置：196，8 6. 有投影效果，透明度100% 投影： 混合模式：正片叠底，颜色：RGB：35 17 10 不透明度：100% ，角度：120 ，使用全局光 距离：2 ，扩展：0，大小：0，杂色：0，图层挖空投影
1.1.1.1.3.3 内容文字字体：黑体 1. 字号：28pix ） 6 / 94 2. 颜色：RGB：220 220 0 3. 字间距：3pix 4. 描边：RGB：55 47 45，大小：2，位置：外部，混合模式：正常，不透明度：100% 5. 字间距：1pix 6. 行间距：62pix 有投影效果，透明度90% 投影： 混合模式：正片叠底，颜色：RGB：246 231 246 不透明度：75% ，角度：120 ，使用全局光 距离：5 ，扩展：49 ，大小：3 ，杂色：0 ， 图层挖空投影
1.1.1.1.3.4 输入文字 a) 字体：黑体 2. 字号：32pix 3. 颜色：RGB：180 180 180 4. 字间距：3pix 1.1.1.1.4 其他有关字体的细节： 为了适应人们横向阅读中文的习惯，一列最好不超过25 个字。
中用其他的颜色覆盖文本，或者做一个所有像素的颜色倒转。 1.1.1.1.5 指示箭头位置 1. 上箭头： 2. 下箭头： 3. 确认按钮： 4. 上翻页： 5. 下翻页： 6. 回退箭头：
1.1.1.1.6 一般选中条 1. 选中条为兰底黄边框；底为颜色：RGB：75 106 185， 透明度为70% 2. 框为颜色：RGB：146 140 0 有投影效果，透明度100% 投影： 混合模式：正片叠底，颜色：RGB：0 0 0 不透明度：80%，角度：120 ，使用全局光 距离：3 ，扩展：0，大小：0，杂色：0，图层挖空投影
1.1.1.1.6.1 第二选中条 1. 选中条为兰底兰边框：底为颜色RGB：92 96 107，透明度为70% 2. 框为颜色：RGB：58 79 111，有投影效果，透明度100% 投影： 混合模式：正片叠底，颜色：RGB：0 0 0 不透明度：80%，角度：120 ，使用全局光 距离：3 ，扩展：0，大小：0，杂色：0，图层挖空投影
1.1.1.1.6.2 输入文字条 1. 选中条为兰底黄边框；底为颜色：RGB：42 47 61，透明度为70% 2. 框为颜色：RGB：147 78
正在加载中，请稍后...
36页31页34页364页33页25页22页80页112页51页如何给智能电视设计UI界面？&&
仔细想想，你会发现我们正处于大屏UI设计的一个有趣的阶段。2015年推出的Apple TV&已经是第四代产品了，但是其他的同类型产品尚且处于第一代或者说早期阶段。发布会上吹出的牛逼最终还是要经过市场验证，而实际状况比起大家预期的结果，更加复杂。到底要如何给Apple TV设计APP呢？今天的文章，我将为大家分享一下我们为丹麦最大的内容供应商设计APP的经验和相关的资源，也许能帮大家一窥究竟。
诸如Netflix、Youtube、HBO、Hulu和Plex 等主要的媒体平台，在tvOS 的App Store 中都只有1.0的版本。它们绝大多数都同FireTV、SmartTV等电视中所提供的解决方案非常类似，这些客户端看起来像是老版本的客户端和新系统规范的揉合体。在很大程度上，我们正处于初级阶段，现在没人确知在tvOS上应当如何设计APP。决策者们正在力图保持他们各自平台的特性的同时，兼顾tvOS上的设计规则。
相比之下，内容创作者是更大的群体，他们现在并不知道是否要参与到平台的设计中来，但是如何决定参与的话，他们需要知道怎么去做。他们对于已经固化的平台并没有决策权，同时他们会将新平台视作为尝试新手法和新思路的重要渠道，一个新的试验田。如果你打算在Apple&TV的基础上搭建新的东西，寻求新的方案，那么你有必要读下去。
相比于在其他的设备开发其他平台的系统而言，在Apple&TV上进行设计和开发是一件简单的事情。因为只有一个分辨率，单一设备。你所需要设计的界面分辨率统一为，并且只需要为唯一的终端调试程序。对于今天的设计师和开发者而言，这无疑是一件奢侈的事情。如果你是设计师，打开Photoshop新建一个标准1080P的画布就是你需要做的全部，没有视网膜，不需要考虑其他的比例。一个23英寸的外接显示器可以显示你所设计的全部内容。
如果你想在Apple TV 上创造优秀的用户体验的话，你手下你需要适应焦点引擎这个新概念，并且明白为什么会“始终保持聚焦”。不同于在iOS和桌面端上常见的点击、触摸的操作方式，Apple TV上你需要通过滑动不同的内容区块，并且始终有区块是被选中的。所以你并不能直接控制整个界面或者直接选取你想要的，而是需要通过先选定某个特定的预设置区块，然后进行更细致的操作。下面的许多设计和概念都是基于这一基本设定来进行推断和发展的。
Lu出屏外内容
你需要显示屏外内容的10%~20%的部分，让用户明白还有更多的内容可供浏览。
水平导航更轻松
在Apple TV上，水平滚动给人的感觉比垂直导航更加轻松顺畅，从硬件和实际手势操作上，水平操作都有着先天的便捷性和和谐性，在遥控器上进行水平扫动比上下滑动要方便得多。而屏幕上界面的变动无疑需要同遥控器上的手势对应起来，所以使用水平导航是更直觉有效的设计。
将按钮和内容清晰地区分开
将内容和可导航可交互的操作控件区分开来是用户同界面沟通的重要基础，想必你也不喜欢用户“惊喜地发现”某个元素居然是可交互的控件。
谨慎安放控件
只有当内容可控件都被正确安置，用户才会感到舒适。比如很长的一个文字段落，而文字段落用户又不能直接选取，可交互的按钮又在段落底部，这样的设计就是相当失败的。从某种程度上而言，tvOS中，用户就像树林中的人猿泰山，需要从一棵树上跳到另外一棵树上前进，但是跳到下一棵树的前提是他必须看到下一棵树。所以，用户可操作的按钮，不要隐藏在用户开始就不可见的段落底部，这样太容易让人感到迷惑了。
确保那些被聚焦的区块看起来真的像是被放到聚光灯下一样。那些微妙的设计在此处并不适用，你应当让被聚焦的地方看起来闪亮、变大、夸张，这个时候不应该让这些内容“保持沉默”。
为远距离浏览而设计
和我们日常熟悉的手机、电脑的使用场景不一样，电视的屏幕并不在我们触手可及的地方，通常它都是远在几米之外。物理层面上的远离只是一方面，它同时意味着我们无法触摸，不再具备掌控感。所以，请确保电视中的内容和控件是可以在整个空间内，都可以被清晰阅读和操作的。这基本上就意味着，字体要更大，更容易操控，这样意味着布局要更加规整，动效更加明显清晰，并且更具有引导性。
减少文字输入
在电视上进行文字输入无疑是低效的，用户操作也极其费劲。最好是考虑到使用其他的硬件设备来进行登录、输入等复杂的输入操作。
让应用更生动
下面的图片中所展示的是标准的Apple TV中的UI元素，并且此刻整套UI界面还在不断被完善。不过，我更想在这个基础上加入更多的个人风格。并不需要复杂的设计，想要让应用更加生动，小动效，交互反馈，视差等设计都能达成目的。下面是我的一些成功经验。
让数据呼吸
刚刚打开某个界面的时候，让进度条逐步填满直到接近某个特定的值，这样的设计只需要在原有界面基础上加一层就可以搞定，看起来很简单，但是很有效。
让图片动起来
让之前静态的图片，以缓慢加载的动画的形式动起来，这样用户的视觉会更好地聚焦到这些聚焦元素之上，起到引导操作的作用。
直接呈现内容
让聚焦区域内的流媒体内容展现在用户面前，这样可以增加信息的透明度，从而让用户更好的选择。
为了能能更好的设计Apple TV的UI界面，我制作了一个设计模板，并上传到了appicontemplate.com&供大家下载使用。
当然，你还需要了解苹果官方对于tvOS的界面设计有着怎样的要求，戳这里看苹果官方的HIG。
https://developer.apple.com/tvos/human-interface-guidelines/visual-design/
更好的客厅浏览体验
未来的客厅娱乐体验，应该就落在电视上了，我们也需要为此而设计和开发。想让电视拥有好的体验并不是一件简单的事情，想必大家已经从诸多“电视盒子”上体验到了这一点。我们曾经熟悉的电视已经发生改变，而我们适应的手机、平板和电脑和新的电视还有着巨大的差别，我们需要忘掉之前熟悉的模式，从头开始。塑造下一代的电视体验，是我们需要做的事情，这很重要。
【原文来源——优秀网页设计】
欢迎关注！
&↑长按此二维码可关注 ↑&
任何建议、想法、供稿
都可发送至我的邮箱：
被转藏 : 1次
被转藏 : 1次拒绝访问 | www.colabug.com | 百度云加速
请打开cookies.
此网站 (www.colabug.com) 的管理员禁止了您的访问。原因是您的访问包含了非浏览器特征(437c-ua98).
重新安装浏览器，或使用别的浏览器