400-807-8991
奇酷学院专注于UI设计培训,欢迎您咨询本校UI设计培训班
网站首页 >UI设计 >UI设计教程 >手机端页面UI设计尺寸和字体大小规范

手机端页面UI设计尺寸和字体大小规范

来源:奇酷学院 点击量: 发表于:

UI设计师在初涉移动端设计和开发的时候,基本都会面临一个令人十分苦恼的问题那就是移动端页面UI设计尺寸标准和字体规范,今天奇酷学院整理了一些关于手机端页面UI设计尺寸和字体大小规范问题,希望对UI设计师设计移动端页面的时候有一些帮助。

ios页面设计规范


一、PS工具设计IOS界面


1.画布尺寸

新建750×1334  分辨率72,像素/英寸。

2.常见的字体大小

24px、26px、28px、30px、32px、34px,36px等等。记住是偶数的。最小字号20px。

3.常用字体

中文用苹方黑,英文用San Francisco,如果安不上也可以用Helvetica代替。

4.界面里的小图标常见的尺寸

注:ios开发里单位是pt

750×1334尺寸的换算关系 1pt=2px,也就是说程序员拿到我们的px单位的标注稿,自己除以2就是pt了。

24px、32px,48px等,记住4的倍数比较好。

注意图标的尺寸要统一尺寸,以眼睛观察为主调整尺寸看上去一样。方形的比圆形的看着要大,需要调整下。

界面上的间距和元素尺寸:

以偶数为单位,不清楚的可以截图量大公司的APP界面作为参考。

750 x 1334 设计稿尺寸:

状态栏高度:40 px

导航栏高度:88 px

标签栏高度:98 px

Android页面设计规范


二、PS工具设计安卓界面规范


1.画布尺寸

如果想一稿适配ios,那就新建720×1280  分辨率72,像素/英寸。

如果单独设计安卓MD新规范的,那就新建1080×1920  分辨率72,像素/英寸。

2.720×1280常见的字体大小

24px、26px、28px、30px、32px、34px,36px等等。记住是偶数的。最小字号20px。

3.常用字体

中文用Noto/思源黑体(是一个字体,叫法不同而已),英文用Roboto。

4.界面上的间距和元素尺寸

最新规范MD的做法:

8dp原则   栅格系统的最小单位是8dp,一切距离、尺寸都应该是8dp的整数倍。

常见一般常用做法:

直接把ios的设计稿照搬过来,只不过状态栏,导航栏,标签栏按照安卓的来。

720 x 1280 设计稿尺寸:

状态栏高度:50px

导航栏高度:96px

标签栏高度:96px

热门文章

  • 10款常用的Photoshop插件,UI设计师必备。

    Photoshop可以说是UI设计们最常用的一款软件了,无论是在进行平面设计还是在进行网页设计。俗话说工欲善其事必先利其器,下面就让小编来设计师们提供一些常用的Photoshop插件【阅读全文】

    发布时间:2017-10-17 阅读量:147
  • UI设计师UI界面设计流程是怎样的

    UI设计师的工作是产品设计中最为重要的一环,几乎贯穿整个产品设计流程,但对于一个新手来说接到一个新项目却不知该如何做【阅读全文】

    发布时间:2017-11-01 阅读量:33
  • 网页UI设计师规范,UI设计师必读。

    每个工作岗位和类别都是自己的工作规范,当然UI设计岗位也不例外,这些规范都是经过严格是市场检验才制定出来的,UI设计师只有严格遵守这些UI设计规范才能设计出一个用户极高的作品【阅读全文】

    发布时间:2017-11-01 阅读量:32
  • UI设计师常用的9款免费信息图制作工具

    如今正兴起的信息图形,给没有时间和精力坐下来好好琢磨满屏文字的人们带来了福音。或许过去,你需要大量的证据和分析去解读某一信息,取而代之的信息可视化,为人们提供了更易解读【阅读全文】

    发布时间:2017-11-02 阅读量:33

开课提醒

郑州 石家庄

郑州UI设计
开课时间离开课还有

-

石家庄UI设计
开课时间离开课还有

-

奇酷学院培训课程

猜你喜欢

UI设计工具教程

UI设计视频教程