首页 app开发 正文

app设计ui界面尺寸(ui手机界面设计尺寸)

app开发 179
今天给各位分享app设计ui界面尺寸的知识,其中也会对ui手机界面设计尺寸进行解释,如果能碰巧解决你现在面临的问题,别忘了关注本站,现在开始吧!本文目录一览: 1、ui界面一般多大

今天给各位分享app设计ui界面尺寸的知识,其中也会对ui手机界面设计尺寸进行解释,如果能碰巧解决你现在面临的问题,别忘了关注本站,现在开始吧!

本文目录一览:

ui界面一般多大

这个要看你的ui界面是要适用哪个平台?

IOS界面,例如iphone6:

1、界面尺寸大小是:750x1334px。

2、状态栏(status bar):就是电量条,其高度为:40px;

3、导航栏(navigation):就是顶部条,其高度为:88px;

4、主菜单栏(submenu,tab):就是标签栏,底部条,其高度为:98px;

5、内容区域(content):就是屏幕中间的区域,其高度为:1334px-40px-88px-98px=1108px

iPad的设计尺寸,例如iPad Mini:

1、界面尺寸大小是:1024×768 px

2、状态栏(status bar):就是电量条,其高度为:20px;

3、导航栏(navigation):就是顶部条,其高度为:44px;

4、主菜单栏(submenu,tab):就是标签栏,底部条,其高度为:49px;

5、内容区域(content):就是屏幕中间的区域,其高度为:768px-20px-44px-49px=655px

Android的图标尺寸

一般屏幕大小有:

小米、索尼、华为:1080×1920 px

OPPO R3:720×1280 px

ui基础 一般用户端尺寸

Android设计尺寸360X640,IOS设计尺寸375X812,电脑设计尺寸1920X1080。

ui的尺寸是1920到2000px,iOS和Android平台都定义了各自的像素计量单位,iOS的尺寸单位为pt,Android的尺寸单位为dp。

UI尺寸基础知识是有像素密度一PPI和计量单位,其像素密度是指显示屏幕每英寸的长度上排列的像素点数量,PPIPixelsperinch越高代表屏幕显示效果越精细,Retina屏比普通屏清晰很多,就是因为它的像素密度翻了一倍。

iOS和Android的app界面设计规范(750×1334)

目前,很多UI设计师的UI设计稿是先做iPhone6(750×1334)的,目的是向上适配iPhone6Plus,同时向下适配iPhone5和iPhone4的尺寸。这一节课也算是25学堂为大家精心整理的iPhone6界面设计尺寸规范大全。

iOS篇

————————————————————————————————————

界面尺寸

☆ 状态栏(status bar):就是电量条,其高度为:40px;

☆ 导航栏(navigation):就是顶部条,其高度为:88px;

☆ 主菜单栏(submenu,tab):就是标签栏,底部条,其高度为:98px;

☆ 内容区域(content):就是屏幕中间的区域,其高度为:1334px-40px-88px-98px=1108px

| 设备|App Store|程序应用|主屏幕|spotlight搜索|标签栏|工具栏和导航栏|

| :-------------:|:-------------:| :-----:|:-----:|:-----:|

|iPhone6 plus(@3x)|1024 1024px|180 180px|144×144px|87×87 px|75 75px|66 66px|

|iPhone6(@2x)|1024 1024px|120 120px|144×144px|58 58px|75 75px|44 44px|

|iPhone5 - 5s - 5c(@2x) |1024 1024px|120 120px|144×144px|58 58px|75 75px |44 44px|

|iPhone4 - 4s(@2x)|1024 1024px|120 120px|144×144px|58 58px|75 75px|44 44px|

|iPad3 - 4 - Air - Air2 - mini2|1024 1024px|180 180px|144×144px|100 100px|50 50px|44 44px|

|iPad1 - 2|1024 1024px|90 90px|72 72px|50 50px|25 25px|22 22px|

|iPad mini |1024 1024px|90 90px|72 72px|50 50px|25 25px|22 22px|

字体

iPhone 上的字体英文为: HelveticaNeue 至于中文,Mac下用的是黑体-简,Win下则为华文黑体,所有字体要用双数字号。

百度用户体验部做过一个小调查, 对于app字体大小的调查结论如下:

UI尺寸规范

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、加入出血值

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以内。

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

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

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

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

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

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

Ipad:1024x768  2048x1536

Android:482x800  720x1280  1080x1920

Ipad、iPhone:状态栏:40px

导航栏:88px

主菜单栏:98px

内容区域:910px

状态栏:50px

导航栏和主菜单栏:96px

内容:1038px

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

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

六、智能电视

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

颜色与分辨率

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

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

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

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

关于app设计ui界面尺寸和ui手机界面设计尺寸的介绍到此就结束了,不知道你从中找到你需要的信息了吗 ?如果你还想了解更多这方面的信息,记得收藏关注本站。

扫码二维码