Android和ios设计规范

1.Andriod

A：界面尺寸：480*800,720*1280,1080*1920【单位：像素】

      建议取用720*1280

B：APP界面和iphone的基本相同：状态栏，导航栏，主菜单，内容区域

C：使用720*1280时：

      状态栏高度为：50px

      导航栏高度为：96px

      主菜单栏高度为：96px

      内容高度为：1038px

      Andriod最近几乎去掉了实体键，把功能键移到了屏幕中，当然高度也是一样的96

D：图标尺寸

      屏幕：720*1280px

      启动图标：48*48dp

      操作栏图标：32*32dp

      上下文图标：16*16dp

      系统通知图标（白色）：24*24dp

      最细画笔：不小于2dp

      1dp=1px

      320*480 像素密度为160  

      1dp*像素密度/160=实际像素

E：Android上的字体

      Droid sans fallback，是谷歌自己的字体，与微软雅黑很像。

2.IOS

A:尺寸及分辨率

   4/4s:     640*960px

   5/5c/5c:640*1136px

   6/6s:     750*1334px

   6/6sp:   1242*2208px

   状态栏：40px

   顶部导航：88px

   底部菜单：98px

   图标（icon）：40*40px，48*48px，80*80px，128*128px

B：界面基本组成元素

iphone的APP界面一般由四个元素组成：

状态栏（status bar）

导航栏（navigation）

主菜单栏（submenu）

内容区域（content）

状态栏：40px

顶部导航：88px

底部菜单：98px

图标：40*40px，48*48px，80*80px，128*128px

C：图标尺寸

D：字体大小

iphone上的字体英文为：HelveticaNeue。至于中文Mac下用的是黑体，Win下则为华文黑体（最新字体成为黑体-简）

3.关于UI

A:UI的控件概述：

框架UI的元素分为4类：

a：栏：状态栏目和导航栏的结合体。

b：内容视图：应用显示的内容信息，包括相关的交互行为，例如：滚屏，插入，删除等操作进行排序。

c：控制元素：产品行为或显示的信息。

d：临时视图：临时向用户提供重要的信息，或提供额外的功能和选项。

B:UI的布局概述：

1.可点击对象的区域：尺寸不要小于44*44px

2.将重要的内容和功能放在权重高的位置，将重要的元素放在前半屏比较好，对于阅读习惯从左到右的用户来说，更贴近屏幕左侧位置容易引起关注的。

3.利用视觉表现形式的权重和平衡，尺寸较大的元素具有更高的权重，对于尺寸较小的元素来说，更能吸引目光，看上去更加重要。

C:UI的模拟情景概述：

D:UI的手势交互概述：

a：通过点击（tap）

b：通过拖拽：滚屏或移动对象（将从界面的一边移动到另一边）

c：通过滚动（flick）：快速滚屏或移动对象

d：通过一个手指轻扫（swipe）

e：通过双击（double tap）

f：通过双指涨开（pinch open）或闭合（pinch close）

g：通过长按（touch and hold）：在可编辑或可选择的文字上显示放大镜，用来定位光标。

h：通过摇晃（shake）机身可执行撤销或重做的操作。

F：UI的动画概述：

a：漂亮而精致的动画效果遍布于ios各处，它们是应用体验更具动态性，更加吸引人，精细而恰当的动画效果可以

      I：传达状态

      II：增强用户对于直接操作的感知

      III：通过视觉化的方式向用户呈现操作结果

b:尽可能与ios内置的应用的动画模式保持一致，人们已经习惯内置应用当中各种精妙的动画效果，实际上，用户往往会将内置应用当中的动效看作一体验的标准，例如切换视图时的平滑过渡效果，切换横竖屏时的流畅反馈，或是能表现出各种物理效果的滚动屏动画等等，这些都逐渐成为了人们预期当中的一部分。