APP UI 设计规范.pptxVIP

IOS ＆ Android APP UI设计规范 iOS 篇 点击添加文本 点击添加文本 点击添加文本 点击添加文本 iOS 界面尺寸 设备 分辨率 PPI 状态栏高度 导航栏高度 标签栏高度 Iphone6 plus 1080x1920 px 401 ppi 54 px 132 px 146 px Iphone6/6s 750x1334 px 326 ppi 40 px 88 px 98 px Iphone5/5c/5s 640x1136 px 326 ppi 40 px 88 px 98 px Iphone4/4s 640x960 px 326 ppi 40 px 88 px 98 px ppi（pixels per inch）即每英寸像素，也叫像素密度。 图标尺寸 设备 APP store 程序应用 主屏幕 Spotlight 搜索 标签栏 工具栏/导航栏 Iphone6 plus 1024x1024px 180x180 px 114x114 px 87x87 px 75x75 px 66x66 px Iphone6/6s 1024x1024 px 120x120 px 114x114 px 58x58 px 75x75 px 44x44 px Iphone5/5c/5s 1024x1024 px 120x120 px 114x114 px 58x58 px 75x75 px 44x44 px Iphone4/4s 1024x1024 px 120x120 px 114x114 px 58x58 px 75x75 px 44x44 px Iphone6 图例 状态栏规范 用户依赖于状态栏的重要信息，如信号，时间和电池。文本和图标可以是白色或黑色，但背景可以被设计成任何颜色，并与导航栏合并。 pt（point）是印刷业上长使用的单位，磅的意思，是一种固定的长度单位，可以用测量设备测量的单位。pt=px*3/4 1pt=1/72英寸 导航栏规范 导航栏是用于屏幕的快速信息。左边部分可用于配置文件，菜单按钮，而右边的部分是一般用于动作按钮，如添加，编辑，完成。请注意，如果您使用这些系统图标，您不需要为它们单独设计。 搜索栏 工具栏 Stepper控件 提示框 提示对话框是用于输送关键信息和提示快速操作。提示应保持最少文字，退出一定是明显。 分段控制框 滑块 开关 布局标准控件 布局原理（8px原理由来） 由于ios技术开发是以320x640px为标准开发的，所以此设定尺寸为1，算出各个尺寸的比例，然后乘以4，各个尺寸都能满足是整数，可以保证开发时不会模糊。@2px（视网膜屏的到来）切图设计稿尺寸是640x960px，所以设计时最小的单位尺寸是8px。 使用8px原理的目的 保证在双平台上大部分机型开发中不会出现模糊的变形的问题；而且只需设计一套设计稿，减少设计师的工作量，提高工作效率。 ios 1334x750 px Iphone6/6s 点击添加文本 点击添加文本 点击添加文本 点击添加文本 图标网络 Apple使用黄金分割在它们的一些图标上。这让图标保持良好的比例，同时确保了美感。虽然这是一个很好的规范，但它不是严格要求。甚至Apple在很多图标上也省略了它。 点击添加文本 点击添加文本 点击添加文本 点击添加文本 标准色 点击添加文本 点击添加文本 点击添加文本 点击添加文本 字体大小、规格 一般的规范是按钮用44pt、小文字用12pt、正文文本用17pt和标题用20pt+。 IOS 9 中文字体：苹方/PingFang SC IOS 8 中文字体：常州华文的黑体-简，在mac os x 系统中选择 黑体-简 IOS 英文、数字：Helvetial 点击添加文本 点击添加文本 点击添加文本 点击添加文本 间距和对齐方式 一般的规范最低要求8pt空白或边距。这将有足够留白空间，使得布局更容易扫描和文本更具可读性。而且在此基础上，UI元素应对齐，文本应该有相同的基线位置。  点击添加文本 点击添加文本 点击添加文本 点击添加文本 Android篇 点击添加文本 点击添加文本 点击添加文本 点击添加文本 Android 界面尺寸 点击添加文本 点击添加文本 点击添加文本 点击添加文本 界面尺寸（1280x720px） 状态栏高度：50 px导航栏高度：96 px标签栏高度：96 pxAndroid最近出的手机都几乎去掉了实体键，把功能键移到了屏幕中，当然高度也是和标签栏一样的：96 px内容区域高度为：1038 px （1280-50-96-96=1038） 常用尺寸 一般把