在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. 包建强的培训课程（1）：Android App企业级开发

    @import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/c ...

  2. 吴恩达机器学习笔记37-学习曲线（Learning Curves）

    学习曲线就是一种很好的工具,我经常使用学习曲线来判断某一个学习算法是否处于偏差.方差问题.学习曲线是学习算法的一个很好的合理检验(sanity check).学习曲线是将训练集误差和交叉验证集误差作为 ...

  3. 吴恩达机器学习笔记21-正则化线性回归(Regularized Linear Regression)

    对于线性回归的求解,我们之前推导了两种学习算法:一种基于梯度下降,一种基于正规方程. 正则化线性回归的代价函数为: 如果我们要使用梯度下降法令这个代价函数最小化,因为我们未对theta0进行正则化,所 ...

  4. C++ Opencv 傅里叶变换的代码实现及关键函数详解

    一.前言 最近几天接触了图像的傅里叶变换,数学原理依旧不是很懂,因此不敢在这里妄言.下午用Opencv代码实现了这一变换,有一些经验心得,愿与大家分享. 二.关键函数解析 2.1copyMakeBor ...

  5. Java对象的克隆和深浅问题

    Java实现克隆的方式 Java实现克隆的方式有如下两种, 推荐采用实现Cloneable接口的方式 实现Cloneable接口, 重写clone方法, 调用父类的clone方法 还有另一种方法, 不 ...

  6. 解决ionic <ion-nav> rootParams获取不到参数

    在使用ion-nav 标签的时候 设置的页面 无法拿到传递的参数 import { Component } from '@angular/core'; import { GettingStartedP ...

  7. Python Selenium 常用方法总结（不断补充）

    还有此篇内容也丰富Selenium常见元素定位方法和操作的学习介绍 selenium Python 总结一些工作中可能会经常使用到的API. 1.获取当前页面的Url 方法:current_url 实 ...

  8. Web Service 部分内容简述（2）

    1. CORBA是什么?用途是什么?  CORBA 标准是公共对象请求代理结构(Common Object Request Broker Architecture),由对象管理组织 (Object M ...

  9. Apache Flink 漫谈系列 - JOIN 算子

    聊什么 在<Apache Flink 漫谈系列 - SQL概览>中我们介绍了JOIN算子的语义和基本的使用方式,介绍过程中大家发现Apache Flink在语法语义上是遵循ANSI-SQL ...

  10. JQ-bootstrap我的开源前端框架

        因为实在不知道写啥,所以迟迟没有相关的介绍.但是必须要积累过程资产,所以还是介绍一下,不定哪天就有人用了.       首先还是介绍遇到的问题,我是做传统后台管理系统的,公司赶时髦,要用boo ...