手机ui设计中常用的尺寸 安卓ui设计尺寸规范

2025-02-1217:01:07营销方案0

在设计移动应用界面时,我们有时会根据自己的主观感受进行创作,而不完全了解所有界面尺寸的规范。

确实,移动设备的屏幕尺寸五花八门,尤其是Android设备,分辨率众多,如480×800, 480×854, 540×960等等。而近年来,iPhone的屏幕尺寸和分辨率也日趋多样化,如640×960, 750×1334等。

为了确保设计的一致性和用户体验,我们整理了一系列UI设计尺寸规范。遵循这些规范,有助于我们创建出用户都能理解并易于使用的设计产品。

一、尺寸

设计图尺寸

在UI组件布局方面,有严格的要求。

状态栏和导航栏:在如iPhone 6/7/8这样的设计中,状态栏的高度定为20pt(即40px)。而导航栏的高度则为44pt(88px)。对于iPhone X的设计,其状态栏和导航栏的高度均为44pt(或132px)。

标签栏:在iPhone 6/7/8设计中,标签栏的高度是49pt(98px)。在iPhone X中,其高度调整为83pt(249px)。通常,我们会在Tab栏图标的下方添加10pt(或20px/30px)的注释文字,其中包含34pt(102px)的安全区域。

实际作图时,以iPhone X为例,常用尺寸为2750×1624(@1倍)或375×812(@2倍)。

对于状态栏、导航栏和标签栏的具体像素值,如状态栏为88PX,导航栏和标签栏分别为98PX。

二、字体

在IOS设计环境中,我们应选择PingFang SC作为中文字体和SF UI Text及SF UI Display作为英文字体。其中SF UI Text适用于小于19pt的文字,而SF UI Display则适用于大于20pt的文字。

而在安卓设计中,中文字体通常选用思源黑体或Noto,英文字体则使用Roboto。

三、启动图标

作为设计师,我们需要为应用设计一个1024x1024px的启动图标。随后,根据程序员的指示,切割出不同尺寸的图标。例如,在@3x情况下桌面图标的尺寸为180x180px,而在@2x情况下为120x120px。

设计规范虽然严格,但它们是确保设计质量、保持产品一致性的关键。我们应严格遵循这些规范,以保证我们的设计能够经得起考验。

(注:如果文中有任何错误或遗漏之处,请随时指正。)

  • 版权说明:
  • 本文内容由互联网用户自发贡献,本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 295052769@qq.com 举报,一经查实,本站将立刻删除。