在iPhone 6还没出的时候，都是用640×1136 px来做设计稿的，自从6的发布，所有的设计稿尺寸以750×1334 px来做设计稿尺寸

以750x1334px作为设计稿标准尺寸的原由：

  1. 从中间尺寸向上和向下适配的时候界面调整的幅度最小，最方便适配。
  2. 大屏幕时代依然以小尺寸作为设计尺寸，会限制设计师的设计视角。
  3. 设计安卓版本时只需做最小的设计调整，提升设计效率。

所以做设计稿事请以750x1334px来做设计稿

iPhone界面设计规范：

iPhone 界面尺寸：

左右我习惯设置24 px的距离，我通过对国内外很多APP就行了对比，总结是24 px更合理，这个是我的个人习惯，所以也不要当做是明文规则，你设置为30 px，也是可以的。

然后就可以开始你的设计了.

关于设计字体

先来看一下字体的历史演变过程

  • iOS 9：英文字体为Helvetica Neue
  • iOS 9：中文字体由为冬青黑
  • iOS 10：英文字体为San Francisco
  • iOS 10：中文字体为苹方

设计稿标准文字

文字选用“苹方（PingFang SC Light) ”标题可加粗选用“苹方粗体”

文字搭配

一般用4和6的梯度搭配，例如：一般文字30px标题搭配26px详情, 带头列表30px标题搭配22px辅助信息
详情页标题文字与详情文字间距
间距为8的倍数，例如：24px、32px、40px等

行间距设定
行间距与字号比例为1.5倍

对齐原则
段落文字采用“两端对齐左对齐”，避头尾为“严格”，首行严禁放5标点

关于字体大小的问题：

    • 顶部操作栏文字大小：34-38px
    • 标题文字大小：28-34px
    • 正文文字大小：26-30px
    • 辅助性文字大小：0-24px
    • Tab bar文字大小：20px

引自：http://www.shui-mai.com/2018zuixiniosduanjiemianuishejiguifanzhengli/

2018最新iOS端界面UI设计规范整理的更多相关文章

  1. iOS 端的 UI 聊天组件ChatKit及代码实现

    ChatKit 是一个免费且开源的 UI 聊天组件,自带云服务器,自带推送,支持消息漫游,消息永久存储.底层聊天服务基于LeanCloud(原名 AVOS ) 的 IM 实时通信服务「LeanMess ...

  2. 金三银四，2018最新iOS面试题，由它可以搞定面试官？

    序言 这些资料,你一定会用到!我相信很多人都在说,iOS行业不好了,iOS现在行情越来越难了,失业的人比找工作的人还要多.失业即相当于转行,跳槽即相当于降低自己的身价.那么做iOS开发的你,你是否在时 ...

  3. 移动端UI设计规范模板参考以及设计规范的好处

    2018也快要过完了(-_-),我们的移动端的UI设计规范也层出不穷.很多APP设计师也要在年底给公司或者是团队做一个总结.那么一个像样的APP ui设计规范也是很有必要的作品回顾. 在创业公司做着一 ...

  4. 2018年IOS/Android UI设计规范

    更多参考: 2017最新设计尺寸及规范 UI : 2018年IOS/Android UI设计规范 转载:https://www.jianshu.com/p/03e5cdd4ffd6

  5. 美团开源Graver框架：用“雕刻”诠释iOS端UI界面的高效渲染

    Graver 是一款高效的 UI 渲染框架,它以更低的资源消耗来构建十分流畅的 UI 界面.Graver 独创性的采用了基于绘制的视觉元素分解方式来构建界面,得益于此,该框架能让 UI 渲染过程变得更 ...

  6. iOS之UI组件整理

    作者:神兽gcc 授权本站转载. 最近把iOS里的UI组件重新整理了一遍,简单来看一下常用的组件以及它们的实现.其实现在这些组件都可以通过Storyboard很快的生成,只是要向这些组件能够变得生动起 ...

  7. 2018年最新Java面试题及答案整理(持续完善中…)

    2018年最新Java面试题及答案整理(持续完善中…) 基础篇 基本功 面向对象特征 封装,继承,多态和抽象 封装封装给对象提供了隐藏内部特性和行为的能力.对象提供一些能被其他对象访问的方法来改变它内 ...

  8. 【Android源代码下载】收集整理android界面UI效果源码

    在Android开发中,Android界面UI效果设计一直都是很多童鞋关注的问题,今天给大家分享下大神收集整理的多个android界面UI效果,都是源码,都是干货,贡献给各位网友! 话不多说,直接上效 ...

  9. 安卓端调用h5界面js方法和ios端调用h5界面js方法

      备注:本人为h5开发人员,不懂安卓和ios,这是开发小伙伴对接联调的主代码. 1.iOS端调用h5界面js方法:     2.安卓端调用h5界面js方法: @Override    protect ...

随机推荐

  1. Windows反复重启的可能的解决办法

    Windows反复重启,原因很多,下面提供两个可能的解决办法: 1. 查看BIOS中关于SATA的设置,一般只有两种PCIE和IDE,调整成另外一个试试: 2. 查看BIOS的启动模式,如果是UEFI ...

  2. Dubbo 源码分析 - SPI 机制

    1.简介 SPI 全称为 Service Provider Interface,是 Java 提供的一种服务发现机制.SPI 的本质是将接口实现类的全限定名配置在文件中,并由服务加载器读取配置文件,加 ...

  3. pip 安装模块时出现error: Microsoft Visual C++ 14.0 is required. Get it with "Microsoft Visual C++ Build Tools":

    在使用pip安装mysqlclient模块时,出现如下错误: 在网上查找资料后显示可能是由于不兼容导致的,最好去下载.whl文件安装成功. 资源地址:http://www.lfd.uci.edu/~g ...

  4. soundJs库简单使用心得

    概述 由于工作需要,学习了一下soundJs库,把心得记录下来,供以后开发时参考,相信对其他人也有用. soundJs是createJs的一部分,它提供了强大的API来处理音频,是音频类H5的一个比较 ...

  5. 移动端点击事件300ms延迟问题解决方案——fastclick.js

    移动端点击事件300ms延迟的问题由来已久,如下截图 下面截图来自原文:https://www.jianshu.com/p/6e2b68a93c88 网上关于300ms延迟问题的解决方法,大致分为 3 ...

  6. pycharm删除project

    1 在pycharm里面选择关闭project 2 返回到这个页面,然后点×让project不在project列表显示(最好记住project的位置) 3 到源文件夹删除这个project文件夹 大功 ...

  7. python基础-分支判断语句(4)

    1.分支判断语句 1.单一if结构 2.if-else结构 3.if-elif-else结构 4.if嵌套结构 2.单一if结构 只有一种情况的时候 if 条件: 执行语句 说明: if后面的条件成立 ...

  8. SQL三表左关联查询

    今天在开发的时候遇到了一个需求就是三遍关联查询,表A包含有表B和表C的uid,然后使用left join左关联查询: SELECT c.`uid`, `fromuseruid`, `touseruid ...

  9. kafka快速开始

    Step 1: Download the code Step 2: Start the server Step 3: Create a topic Step 4: Send some messages ...

  10. 【Android基础】Fragment 详解之Fragment介绍

    Fragment在Android 3.0( API 11)引入,是为了支持在大屏上显示更加动态.灵活的UI,比如在平板和电视上.Fragment可以看作是嵌套的Activity,类似ActivityG ...