大象学社 · 1年前 Web UI设计规范
画布建立尺寸宽度：1920px
分辨率：72像素/英寸
颜色：RGB
网页内容安全宽度：≤1200px
首屏内容建议高度：800px
网页栅格系统
App UI设计规范（iOS）
屏幕尺寸表：
iOS各设备尺寸
系统默认中文字体：苹方
字体下载连接：苹方字体点击下载
APP ICON尺寸
UI官方组件
状态栏 Status Bar
导航栏 Navigation Bar
搜索栏 Search Bar
标签栏 Tab Bar
列表视图 Table View
App UI设计规范（Android）
Android各设备尺寸：
系统默认中文字体：思源黑体
字体下载连接：思源黑体点击下载
APP ICON尺寸
UI官方组件
Watch UI设计规范
各设备尺寸
智能电视UI设计规范
设计尺寸：
内容安全范围
色彩
与电脑显示器相比，电视屏幕有更高的对比度和饱和度。考虑到这点，在使用纯色的时候要考虑一下准则：
1、谨慎地使用纯白色（#FFFFFF）。纯白色在电视屏幕上会引起振动或图像重影。用#F1F1F1(hex)或者240/240/240(RGB)来代替使用纯白色。
2、避免使用明亮的白色系，红色系和橙色系，因为这些颜色在电视上显示会特别严重的失真。
3、了解不同的电视显示模式，包括标准、锐利、电影/剧场，游戏等等。确保你的应用能适应这些全部的电视模式。
4、避免使用大面积的色彩渐变，因为它们可能会导致色带。
5、如果可能，在低质量的显示器上测试你的应用程序。这些设备可能有较差的伽马值和颜色设置。
文本
对电视来说，避免纤细字体或者有过宽、过窄笔画的字体。使用简单无衬线字体并选用抗锯齿功能来增加易读性。目前，Google TV只支持Droid Serif 字体族，但是你可以使用嵌入字体来创建一个更个性化的外观。然而，牢记嵌入字体会拖慢系统运行。
1、以下是一些提高文本易读性的方法：
2、每个段落限制90个单词。
3、将长句改为几个短句，让用户可以快速浏览。
4、在每行保持5-7个单词，不要少于3个单词，也不要多于12个单词。
5、在电视上，在深色背景上的浅色文字比在浅色背景上的深色文字更容易阅读。
6、使用Android的标准字体尺寸。例如，标准的小字体字号为14sp，在1080p的屏幕上，这相当于28点的字号。
7、为屏幕文本设置比印刷文本更大的行间距。
视觉焦点
应用程序的通行状态包括上下文、选择和焦点。上下文通常是一套分类，而选择是用户已经选中的分类。焦点是在光标下的控件或元素。这些控件或元素都应该有与众不同的高亮状态，而且高亮的机制在整个应用程序中应该保持一致。
举个例子，如果是一个都是影片的屏幕上，应用程序提供一行显示不同类别的上下文标签。例如“全部电影”、“最新发行”、“流行”、“编辑推荐”等等。如果用户选择了其中的一个标签，“选中”状态应该在视觉上与正在变动的“聚焦”状态不同，以此来指出当前屏幕导航所在的位置。
