ios界面设计规范尺寸规范(ios界面设计稿尺寸)

移动端设计尺寸是做App设计的设计师必须懂得的设计标准,然而很多UI新手都很头疼这个问题,其实并不复杂,只要记住常用的几个设计尺寸,即可。

首先,来看看各种iPhone的分辨率和界面尺寸:

移动端界面设计规范(ios尺寸篇)

iPhone分辨率

移动端界面设计规范(ios尺寸篇)

iPhone尺寸

移动端界面设计规范(ios尺寸篇)

看到上图之后,你的内心是不是崩溃的(反正我的内心是拒绝的),难道每个尺寸都要出一套设计稿? No No No,答案当然是否定的。

320x480px(也叫一倍图)是iPhone2G、3G、3GS手机的大小,在2017年的时候已经基本被淘汰不用了。640x960px(iPhone 4/4s)、640x1136px(iPhone5/5s)、750×1334(iphone6/6s/7/8)对应的则是2二倍图,尽管它们的尺寸不同,但计算出来的dpi是相同的,因此有三个2倍图。3倍图则是1080x1920px(iphone6p/7p/8p物理版)、1242x2208px(iphone6p/7p/8p设计版)。

由于iPhone X只是增加了高度,所以你不必担心,目前不会有4倍图的出现。所以我们选择750×1334的尺寸作为设计图,以此来向下向上都是极易方便的,本来plus我们要用1242x2208px来做设计,但是苹果公司用他们自己的方法再适配到1080x1920px尺寸的大小上,因此苹果只需要出两套图。

界面:750x1334px

尺寸高度

  • 状态栏:40px 状态栏字体:24px

  • 导航栏:88px 导航栏字体:34px 中等 可以大于34px但不能小于34px

  • 导航栏中搜索框:56~60px

  • 主菜单栏:98px 菜单栏图标下使用字体:20~24px 常规

  • 按钮最小为44px(手指可触控的最小区域),通栏按钮至少60px

  • 文本框大小为80~88px

  • 弹框遮罩:深色遮罩20%~40%透明度 浅色遮罩40%~60%透明度

  • 文本框之间的间距使用8的倍数(也称8像素原则),例如8px、40px等。

iPhone图标尺寸

移动端界面设计规范(ios尺寸篇)

这些尺寸比较多,小编在刚开始接触的时候都是一个个去制作(是不是很傻呀),然后输入给程序员哥哥的,后来才知道Ps中有一款神器,能够一键导出所有的icon,神器叫:IconTemplate,很好用的一款插件。

声明:本网页内容旨在传播知识,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。E-MAIL:dandanxi6@qq.com

(0)
上一篇 2024年 1月 1日 下午4:48
下一篇 2024年 1月 2日 上午9:02

相关推荐

  • 手机号不用了,微信还能继续用吗

    当我们不再使用手机号码时,可能会考虑将其注销,但同时又想继续使用微信这样的通讯应用。本文将回答这个问题,并提供详细的解释和相关建议。 温馨提示 当你更换手机号时,你可能需要更改绑定…

    2023年 7月 18日
  • 5g时代谁称雄华米ov格局暗藏变数

    2019年已经过去大半,但笼罩在智能手机市场中的阴霾却迟迟没有散去。 根据市场调研机构Gartner公布的预测显示:2019年全球手机出货量将比2018年下降6800万部,降幅达3…

    2023年 6月 2日
  • wlan流量是什么意思怎么用,wlan流量怎么使用

    很多朋友总是将移动流量和WLAN流量搞混,不知道它是什么意思,也不知道该如何“使用它”,本期文章就说说与其相关的知识。 WLAN流量是什么意思? WLAN流量的意思是“无线局域网流…

    2023年 12月 6日
  • 内存卡无法完成格式化操作怎么解决呢

      内存卡无法完成格式化操作怎么解决?当我们的内存卡受损的时候,都会非常着急,我们的资料相片视频、游戏、软件一大堆的重要资料难道都会丢失?那有没有办法修复内存卡呢?一定要格式化内存…

    2022年 12月 30日
  • 爱奇艺如何取消自动续费功能

    中新经纬客户端4月21日电 据浙江省消保委官方微信20日消息,截止至4月17日,爱奇艺、腾讯视频等11家视频、音频网站先后向浙江省消保委发来整改回复函,就4月8日省消保委约谈会中提…

    数码教程 2023年 1月 19日
  • 抖音怎么设置动态壁纸?教你几个简单的步骤

    抖音是一款非常流行的短视频应用程序,它允许用户上传和观看各种形式的视频内容。同时,抖音也提供了动态壁纸设置功能,可以让用户将喜欢的视频设置为手机壁纸或锁屏背景。下面是设置抖音动态壁…

    2023年 11月 9日
  • 怎么制作USB闪存驱动器,u盘闪存驱动器怎么做

    Author aliu Date 2022-10-14 21:44:29 Categories 技术教程 您正在尝试将数据保存在 USB 闪存上,但出现问题。 任何保存尝试都会显示…

    2023年 2月 4日
  • iphone刷机后怎么跳过id激活

    iPhone7相信大家耳熟能详,即使iPhone12都已经发布大半年,但至今还有不少的果粉在用,舒适手感,中规中矩的设计。2016年9月上市以来,收获一片好评。 特别是作为二手iP…

    2023年 10月 17日
  • 手机剩一半电充好还是快没电充好

    在日常生活中,我们都有一个共同的问题,那就是如何更好地保护电池寿命。特别是在手机使用过程中,如何合理地充电,避免不必要的电池损耗,这一问题更是备受关注。不少人常常面临一个纠结的选择…

    2023年 10月 5日
  • 苹果有锁可以变无锁吗(有锁版的iphone有什么区别)

    手机卡贴的原理就是将国内的SIM卡”伪装”成制定运营商的卡,使得能够正常使用,对应的方法破解方式就是找到iccid的漏洞去破解。 于是一直以来,有多少人希望…

    2022年 12月 30日