以下内容都是我在做App时通过自己的经验和精品的分析得来的,希望会帮助到你。但是有时个别情况也要个别分析,要活学活用。

一. App  Icon

在设计iOS App Icon时,设计师不需要切圆角,直接矩形就可以。

下面是App Icon需要的尺寸和命名(尺寸和命名不做解释):

尺寸                                                               命名

1.57x57 px                                                      Icon

2.114x114 px                                                  Icon@2x

3.40x40 px                                                      Icon-40

4.80x80 px                                                      Icon-40@2x

5.120x120 px                                                  Icon-40@3x

6.120x120 px                                                  Icon-60@2x

7.180x180 px                                                  Icon-60@3x

8.72x72 px                                                      Icon-72

9.144x144 px                                                  Icon-72@2x

10.76x76 px                                                    Icon-76

11.152x152 px                                                Icon-76@2x

12.29x29 px                                                    Icon-Small

13.58x58 px                                                    Icon-Small@2x

14.87x87 px                                                    Icon-Small@3x

15.50x50 px                                                    Icon-Small-50

16.100x100 px                                                Icon-Small-50@2x

二. 启动页

下面是启动页需要的尺寸和命名(尺寸和命名不做解释):

尺寸                                                               命名

1.320x480 px                                                  Default

2.640x960 px                                                  Default@2x

3.640x1136 px                                                Default-568h@2x

4.750x1334 px                                                LaunchImage-800-667h@2x

5.2208x1242 px                                              LaunchImage-800-Landscape-736h@3x

6.1242x2208 px                                              LaunchImage-800-Portrait-736h@3x

三.  App内图标

我会把App内的图标分成四类进行规范设计:第一类顶部栏内的图标;第二类底部导航栏内的图标;第三类内容区域的图标;第四类弹窗、浮层内的图标。

1.顶部栏内的图标

在设计顶部栏内的图标时应注意,图标的高度不能超过顶部栏高度的一半。以750x1334 px的尺寸为例,顶部栏高度为88 px,图标不能超过顶部栏的一半就是44 px, 但为了页面的美观感与整体性,图标的高度最好与顶部栏标题的字高度保持一直,一般图标的高度控制在32-36 px左右。

2.底部导航栏内的图标

底部导航栏内不仅只有图标,一般每个图标下都会有对应的文字,这种情况就比较复杂,因为你需要把图标距上间距、图标与文字间距、文字距下间距等因素考虑进去。图标与文字上下间距一般控制在20 px左右,文字大小在20 px左右,图标与文字间距控制在14 px范围内,最终图标的大小在40-44 px左右。 和顶部栏的原则一样,底部导航栏的图标不能超过其高度的一半,若底部导航栏高度为98 px,图标不要超过48 px, 再加上底部导航栏的文字48 px高的图标也不太合适,所以以我的经验之谈,最佳高度是44 px。

3.内容区域的图标

其实仔细研究就会发现,App里的图标分为两种,一种是可点击的,一种是起修饰作用的不能点击的。可点击的图标往往比起修饰作用的图标大。我在做内容区域的图标时为了使整体的App看上去比较统一,图标的大小范围和顶部栏、底部导航栏的图标上下不超过2-4个像素,基本和文字的高度一致。可点击图标范围在32-36 px左右, 不可点击图标范围在24-28 px左右。

上述内容都是我在做App时通过自己的经验和精品的分析得来的,希望会帮助到你。但是有时个别情况也要个别分析,要活学活用。

[摘抄]iOS App icon、启动页、图标规范的更多相关文章

  1. iOS程序的启动图片图标规范

     

  2. iOS app 程序启动原理

    iOS app 程序启动原理 Info.plist: 常见设置     建立一个工程后,会在Supporting files文件夹下看到一个"工程名-Info.plist"的文件, ...

  3. Asset Catalog Help (五)---Migrating an iOS App Icon Set or Launch Image Set

    Migrating an iOS App Icon Set or Launch Image Set Simplify image management by moving existing app i ...

  4. Asset Catalog Help (四)---Adding an iOS App Icon Set or Launch Image Set

    Adding an iOS App Icon Set or Launch Image Set Organize different resolutions of your app icons and ...

  5. 怎样做一个iOS App的启动分层引导动画?

    一. 为什么要写这篇文章? 这是一个很古老的话题,从两年前新浪微博开始使用多层动画制作iOS App的启动引导页让人眼前一亮(当然,微博是不是历史第一个这个问题值得商榷)之后,各种类型的引导页层出不穷 ...

  6. iOS App的启动过程

    一.mach-O Executable 可执行文件 Dylib 动态库 Bundle 无法被连接的动态库,只能通过 dlopen() 加载 Image 指的是 Executable,Dylib 或者 ...

  7. iOS开发 关于启动页和停留时间的设置

    引言: 在开发一款商业App时,我们大都会为我们的App设置一个启动页. 苹果官方对于iOS启动页的设计说明: 为了增强应用程序启动时的用户体验,您应该提供一个启动图像.启动图像与应用程序的首屏幕看起 ...

  8. Android APP应用启动页白屏(StartingWindow)优化

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 StartingWindow 的处理方式: 使用系统默认的 StartingWindow :用户点了应用图标启动应用,马上弹出系统默 ...

  9. [转]iOS证书(.p12)和描述文件(.mobileprovision)申请

    转载于:http://ask.dcloud.net.cn/article/152 iOS有两种证书和描述文件: 证书类型 使用场景 开发(Development)证书和描述文件 用于开发测试,在HBu ...

随机推荐

  1. Spring学习笔记

    Spring 的控制反转:把对象的创建.初始化.销毁等工作交给Spring 容器来做,有spring容器控制对象的生命周期 applicationContext.xml beans --->sp ...

  2. iOS autoresizing布局

    在对UIView以及其子类空间的布局方案有多种,今天温习了一下autoresizing布局 一.了解一下相关知识: 1.UIView其中一个属性为 @property(nonatomic) UIVie ...

  3. 解决 主界面mainactivity 中fragment弹框把下面tab选项卡 顶上去的方案

     android:windowSoftInputMode="adjustPan"            android:configChanges="screenSize ...

  4. iptables基本规则配置(二)

    注释:文章中fg:为示例  红色标记的为命令 在上篇博文中详细讲解了iptables的原理及一些常用命令,这里在简要的说明一下: Linux防火墙包含了2个部分,分别是存在于内核空间的(netfilt ...

  5. Ajax与Comet

    1.Ajax核心? XHR >>1.新建XMLHttpRequest >>2.open(),接受3个参数. >>3.send(),接受1个参数. >>4 ...

  6. AFNetworking之缓存篇

    苦苦看了我两天,最近后台为了减轻压力,要我做缓存,我说好吧...... 借鉴了别人的说法找到一张图可以看明白好多:       这个是我比较战成一种方案. 好了直接上代码了 首先我们要有自己缓存的类 ...

  7. 关于JQuery简单介绍

    jQuery是一个兼容多浏览器的javascript库,核心理念是写得更少,做得更多.如今,jQuery已经成为最流行的javascript库,在世界前10000个访问最多的网站中,有超过55%在使用 ...

  8. Eclipse 搭建 Maven Web项目

    第一步:安装JDK: 第二步:安装Eclipse: 第三步:安装tomcat7: 第四步:安装maven插件: 4.1 下载maven:http://maven.apache.org/download ...

  9. 如何在tomcat中如何部署java EE项目

    如何在tomcat中如何部署java EE项目 1.直接把项目复制到Tomcat安装目录的webapps目录中,这是最简单的一种Tomcat项目部署的方法,也是初学者最常用的方法.2.在tomcat安 ...

  10. BackgroundWorker组件的作用

    当构建一个图形化的Windows Form桌面应用程序并且需要执行在应用程序主UI线程之外的线程中长时间的任务时,BackgroundWorker类就很有用了. 要使用BackgroundWorker ...