界面设计规范

1、IOS界面设计规范对于普遍的屏幕密度标准版本尺寸(像素表示)分类低密度屏幕(ldpi)中密度屏幕(mdpi)高密度屏幕(hdpi)启动器36 x 36 px48 x 48 px72 x 72 px菜单36 x 36 px48 x 48 px72 x 72 px状态栏24 x 24 px32 x 32 px48 x 48 px标签24 x 24 px32 x 32 px48 x 48 px对话24 x 24 px32 x 32 px48 x 48 px列表视图24 x 24 px32 x 32 px48 x 48 px一.字体颜色和字号：每个界面的字体颜色和字号不得超出3种（字体颜色可根据底色适

2、配）1.导航：字号40（20）2.一级标题：字号32（16）（黑#464646）3.二级标题和内容：字号28（14）（深灰#a7a7a7）二.图标：（样式和大小统一：分为两种）1.导航栏工具栏和标签栏2.界面中间部分的一些图标三.按钮形状和高度1.按钮分两种：椭圆（半径70）、圆角（半径10），2.按钮高度设为90或70（一般在登录或主界面的按钮要比内页的按钮要高）四.列表、线条1.列表高度分两种：一种是只显示一排文字，一种是显示两排文字的2.线条颜色分为两种：列表分隔线：深文字分隔线：浅IOS界面细节调整首先定一个主色调出来。一、 登录分为3个部分： Logo、中间登录文字内容、背景图1.检

3、查logo是否变形2.底部灰色背景图颜色调浅往下移一点3.中间内容稍微排得紧凑一点（现有点散乱）整体下移点，登录按钮的文字小了二、 首页1.首页选中状态改样式如图：2.首页下方工具栏为渐变效果，统一扁平效果3.图标底色与字体颜色应不一致三、 界面三部分1.导航栏高度应按照标准高度2.导航栏背景图片要提亮3.导航栏、工具栏：文字、图标大小等统一一个大小，样式统一4.内容栏：统一一个大小，样式统一（首页中图标为线条样式 空间中图标为普通样式）四、 列表1. 列表高度：一排的高度要统一，两排的高度应统一如：两排高度的有消息、通讯录、群聊、同事圈、签名等高度应统一 五、 分割线1. 分割线应一样的高度

4、与一样的颜色，需统一如：首页、空间、设置、个人信息、消息设置、通讯录、同事圈中分割线高度样式统一六、 线条样式1. 线条有列表的和文字，颜色应区分开，文字线条浅，列表线条深2.线条从图标后的文字开始，拉到结尾，如下图样式如：首页、设置、空间七、 字体字号1. 每个界面应按照导航、一级、二级标题区分，字体颜色根据色调配颜色如：消息、通讯录、公众号、消息设置、功能介绍、个人信息八、 按钮1. 根据主色调统一按钮颜色：登录、退出登录、进入公众号、删除并退出群、申请加群等2. 按钮统一文字大小样式九、 背景颜色1.详情、问题反馈等界面背景为灰色，消息背景为白色。白色不好，应统一为很浅很浅的灰。（问题反馈界面中的灰较深）十、 消息1. 修改线条颜色2. 修改导航栏、一二级标题字体十一、 聊天1.聊天下方菜单不应该渐变，可扁平加边2.聊天内容背景浅灰，下面菜单应比内容深3.聊天对话框改样式，淡蓝或淡绿，或者加边框不要有阴影十二、 二维码1.二维码较大，线条粗2.可按照微信摆放：上方个人头像，中间二维码，下方加我，丰富界面十三、 问题反馈1.输入框应按照IOS的样式，上下线条到尾，没有左右边框十四、 功能介绍1. 导航栏与一二级标题字体，文字太小，按照字体标准统一2. 框太明显较粗十五、 设置密码1.下面设置密码字体不好