UI尺寸规范

作者: ui_小鸡蛋 | 来源:发表于2017-03-21 16:09 被阅读227次

    一、电商页面基本原则

    1、界面尺寸:1920-2000px带有底图必须那么大(无底图的1366-2000px)

    2、版心:980-1220px

    3、Banner高度建议870px;

    4、分辨率72px

    5、色彩模式RGB

    6、按钮高度为文字字高的的2-2.5倍

    7、字体

    导航:14px

    字体:宋体 微软雅黑

    字号:12、14、16、18、20px

    专题页字体建议是12、14px,电商主页建议:16、18、20px

    8、焦点图高度:600px-700px

    二、登录框尺寸

    1、尺寸:730x320px

    2、登录界面的字体:12px 宋体 字体样式无

    3、文本框高度为文字字高的的2-2.5倍

    4、头标与框高度为20px

    三、企业站

    1、企业占中颜色尽量控制在三种以内

    2、背景色:70%     主色调:25%     强调色:5%

    背景有底纹画布大小建为1920-2000px

    背景无底纹画布大小建为1366-2000px

    4、版心宽度 980px 或 1000px 左右

    5、焦点图高度小于580px 底部坐标到580px

    6、在做企业站中要使用统一字体:宋体(Banner图除外)

    字体字号规范:

    1、头部注册、登录:12px 宋体

    2、导航:16 18px 仿粗    底色块高度为字高的2-2.5倍

    下拉导航与导航为从属关系建议使用小一号字体14px

    内容区域的文字一般分为标题和正文两种,可以选择统一字号,用仿粗区分

    文字区域到表框的边距一般为10px-20px;

    版权信息文字用12px

    四、照片尺寸

    1、1寸:2.5x3.5cm     5寸:12.7x8.9cm

    证件照拼版建议画布大小为12.7x8.9cm

    名片规范

    横版:90x54mm  90x55mm

    竖版:50x90mm  45x90mm

    圆角名片:85x54mm

    折叠名片尺寸不固定

    使用材质:纸张(大于200g)

    四色印刷:CMYK      出血值1mm

    名片的主要内容:公司名称  LOGO    姓名  职务  联系方式  业务范围

    名片的排版:

    1、名片边缘留足5-10mm距离

    2、logo大小不能小于1cm

    3、名片中最小的文字不能小于6px

    名片的储存于输出:

    1、将所有文字转曲(交与客户源文件)ctrl+a-    ctrl+shift+o

    2、交与印刷厂PDF格式,不保留AI编辑功能

    3、加入出血值

    x展架、易拉宝

    1、x展架尺寸:60x160cm  80x180cm

    易拉宝:高200cm  宽80  90  100  110  150cm  常见的为80*200cm

    展架、易拉宝输出方式为写真机,写真机输出幅面一般为:90  120  150cm

    易拉宝输出材质:相纸(背面无胶)

    展架:背胶纸(背面有胶) 装裱在KT版上

    输出方式:写真:1软件可以使用ps软件(黑色为四色黑)

    2、颜色模式可以为RGB也可以用CMYK

    3、文档建立尺寸和实际尺寸一致,不需要加出血

    4、展架易拉宝分辨率为72或80,特殊情况可以使用300(封面)

    5、查看画布效果时,缩放比例为100%

    6、使用黑色必须为四色黑(CMYK都为100),不能使用单色黑,使用单色黑,制作出的易拉版展架会有条纹。

    7、背景的过度使用弱对比:色相H接近或相同,饱和度S差值在30以内或者明度B差值在30以内

    8、强对比(背景与要突出的产品或文案):色相H相反,饱和度S差值在70以内或者明度B差值在70以内。

    折页(出血3):纸张一般为157g铜版纸

    1、四色印刷----CMYK(专色印刷要出专色版)

    2、成品尺寸:制作一个90*120的三折页(从印刷厂制作完成后并且折叠后的尺寸)

    2、展开尺寸:宽度 90+90+90=270  高度210

    2、制作尺寸:展开尺寸+出血

    2、大16K:210*285 毫米      成品尺寸 :95*210或90*210     正度16K:185*260毫米

    五、APP

    iOS尺寸规范:

    iPhone:320x480  640x960  640x1136  750x1334  1080x1920

    Ipad:1024x768  2048x1536

    Android:482x800  720x1280  1080x1920

    Ipad、iPhone:状态栏:40px

    导航栏:88px

    主菜单栏:98px

    内容区域:910px

    Android:

    状态栏:50px

    导航栏和主菜单栏:96px

    内容:1038px

    1、iphone英文字体为Helvetica,中文为华为细黑,冬青黑体,不用微软雅黑。

    2、可点击对象的区域:尺寸不要小于44*44px;

    六、智能电视

    分辨率模式:1920×1080、1280×720 我们常用还是1920×1080的分辨率进行设计

    颜色与分辨率

    1、不要使用纯白色(#FFFFFF)可采用#F0F0F0

    2、高饱和度颜色尽可能少用,会显示失真

    3、大范围渐变会导致带状显示,无法达到平滑过渡

    4、在界面边缘最好留出10%左右的空间(54PX)

    相关文章

      网友评论

        本文标题:UI尺寸规范

        本文链接:https://www.haomeiwen.com/subject/cadgnttx.html