UI设计规范Word格式文档下载.docx
《UI设计规范Word格式文档下载.docx》由会员分享,可在线阅读,更多相关《UI设计规范Word格式文档下载.docx(8页珍藏版)》请在冰豆网上搜索。
![UI设计规范Word格式文档下载.docx](https://file1.bdocx.com/fileroot1/2022-11/26/88d6bf92-47ea-4ee9-b09b-cd7895c8837c/88d6bf92-47ea-4ee9-b09b-cd7895c8837c1.gif)
40px导航栏:
88px标签栏:
98px
(5)iphone5-5c-5s(@2x)
分辨率640x1136pxppi326状态栏:
(6)iphone4–4s(@2x)
分辨率640x960pxppi:
(1)iphone&
ipodTouch第一、二、三代(@1x)
分辨率320x480pxppi:
163状态栏:
20px导航栏:
44px标签栏:
49px
2.iphone图标设计尺寸
(1)iphone6plus(@3x)
Appstore:
1024x1024px程序应用:
180x180主屏幕:
152x152Spotlight搜索:
87x87px标签栏:
75x75px工具栏和导航栏:
66x66px
(2)iphone6(@2x)
120x120主屏幕:
58x58px标签栏:
44x44px
(3)iphone5-5c-5s(@2x)
(4)iphone4-4s(@2x)
114x114Spotlight搜索:
44x44px
(5)iphone&
57x57Spotlight搜索:
29x29px标签栏:
38x38px工具栏和导航栏:
30x30px
3.ipad界面设计尺寸
(1)ipad3–4-5–6–Air–Air2–mini2
分辨率2048x1536pxppi:
264状态栏:
(2)ipad1–2
分辨率1024x768pxppi:
132状态栏:
(2)ipadMini
4.ipad图标设计尺寸
Appstore:
144x144Spotlight搜索:
100x100px标签栏:
50x50px工具栏和导航栏:
(2)ipad1–2
90x90主屏幕:
72x72Spotlight搜索:
50x50px标签栏:
25x25px工具栏和导航栏:
22x22px
(3)ipadMini
5.ios字体大小规范
iPhone上的字体英文为:
HelveticaNeue至于中文,Mac下用的是黑体-简,Win下则为华文黑体,所有字体要用双数字号。
字体舒适度
(1)长文本
可接受:
26px见小值:
30px舒适值:
32px-34px
(2)短文本
28px见小值:
32px
(3)注释
24px见小值:
24px舒适值:
28px
二.App设计规范(Android)
————Android采用的单位为dp
————一般很少使用andrid尺寸作为设计稿
1.Android界面设计尺寸
android的尺寸众多,一般使用分辨率为720x1280的尺寸设计。
这个尺寸720x1280中显示完美,在1080x1920中看起来也比较清晰
(1)屏幕尺寸:
720x1280
状态栏:
50px导航栏:
96px标签栏:
96px虚拟键:
96px
这个尺寸是万用形的
2.Android图标设计尺寸
320x480px(mdpi)
启动图标:
48x48px操作栏图标:
32x32px上下文图标:
16x16px系统通知图标:
24x24px最细画笔:
不小于2px
(2)屏幕尺寸:
480x800px—480x854px—540x960px(hdpi)
72x72px操作栏图标:
48x48px上下文图标:
24x24px系统通知图标:
36x36px最细画笔:
不小于3px
(3)屏幕尺寸:
720x1280px(xhdpi)
108x108px操作栏图标:
72x72px上下文图标:
36x36px系统通知图标:
54x54px最细画笔:
不小于5px
(4)屏幕尺寸:
1080x1920px(xxhdpi)
144x144px操作栏图标:
96x96px上下文图标:
48x48px系统通知图标:
72x72px最细画笔:
不小于6px
3.Android字体大小规范
Android上的字体为:
Droidsansfallback,是谷歌自己的字体,与微软雅黑很像。
480*800字体舒适度(高分辨率)
21px见小值:
27px
18px见小值:
18px舒适值:
21px
320*480字体舒适度(低分辨率)
14px见小值:
16px舒适值:
18-20px
14px舒适值:
18px
12px见小值:
12px舒适值:
14-16px
三.网页设计规范(web)
————网页设计规范比较自由
————网页有字体的规范
1.宽度控制
Fierfox和Opear当内容不超出页面高度时将不会显示滚动条
(1)IE6.0:
宽度减少[21]
(2)Firefox:
宽度减少[19]
(3)Opear:
宽度减少[23]
2.尺寸规范
(1)常见尺寸:
●1024x768(常用尺寸)
●1366x768
●1280x800
●1280x1024
●1440x900
●1600x900
●1920x1080
一般网站宽为996px;
国内网站大部分还是以1000个像素为界限,因超过1000像素适合在大屏幕上浏览,小屏幕会显得拥挤。
国内尺寸设置比较保守,这样可以保证大部分用户舒适的浏览网页
3.字体规范
(1)常用字体:
中文:
宋体、微软雅黑、黑体
(2)字号:
网页正文/导航字体:
12px-18px之间
网页正文/导航字体(英文):
10px-16px之间
标题文字:
18px-32px之间(双数)