【文档说明】移动UI界面设计02移动UI图标设计规范课件.pptx，共(29)页，5.880 MB，由小橙橙上传

转载请保留链接：https://www.ichengzhen.cn/view-50587.html

以下为本文档部分文字说明：

iOS系统与Android系统图标设计规范课程回顾APP设计的基本流程移动UI设计相关理论讲解简易图标的设计方法2/31本章任务掌握Android图标设计规范和设计方法掌握iOS图标设计规范和设计方法掌握双系统下启动图标设计的异同学会绘制AppStore

启动图标、Android系统电影启动图标、双系统下商店启动图标3/31目录iOS系统图标设计规范Android系统图标设计规范双系统下启动图标的设计4/31iOS系统图标设计规范iOS图标概述•

启动图标•栏图标•小图标5/31iOS系统图标设计规范iOS系统图标规范采用圆角矩形默认一般采用顶部光源在设计的时候，圆角部分是丌需要进行设计的，这部分是通过程序来实现的6/31iOS系统图标设计规范在设计iOS启动图标的时候，可

以将Photoshop中图层样式的光源统一成90度7/31iOS系统图标设计规范为方便适配，iOS系统的启动图标存在着多种设计尺寸8/31尺寸（px）用途512*512AdHoc发布测试的证书iTunes数字媒体播放应用程序，是供Mac和PC使用的一款免费应用软件，

能管理和播放数字音乐和视频57*57iPhone/iPodtouch的AppStore和主屏幕114*114高分辨率的iPhone4主屏幕72*72主屏幕，为了兼容iPad29*29Spotling和设置App50*50Spotling,为了兼容iPad58*58高分辨率的iPho

ne4的Spotling和设置App1024*1024在AppStore商场显示iOS系统图标设计规范9/31iOS系统图标设计规范在设计的时候，优先从1024×1024px开始设计尽量使用矢量图层或矢量软件进行绘制要考虑印刷设计要求10/31iOS系统图标设计规范设计启动图标时

应充分考虑是整个应用品牌的重要组成部分独特的、整洁的、打动人心的、让人印象深刻的在丌同的背景以及丌同的规格下都同样美观如果要考虑印刷，分辨率应该设置为300dpi为了考虑多尺寸适配，栏图标和小图标的尺寸都应该是双数11/31演示案例演示案例：AppStore启动

图标设计需求描述为iOS系统制作启动图标熟练掌握iOS系统启动图标的设计规范和技巧实现思路新建1024x1024像素的画布使用钢笔工具绘制毛笔头形状使用布尔运算绘制图形使用渐变工具填充颜色12/31课堂练习课堂练习：iOS系统商店类App启动图标设计需求描述为iOS系统制作启

动图标熟练掌握iOS系统启动图标的设计规范和技巧实现思路新建1024x1024像素的画布使用钢笔工具绘制基础形状使用布尔运算绘制图形13/31课堂练习课堂练习：iOS系统启动图标设计需求描述为iOS系统制作启动图标熟练掌握iOS系统启动图标的设计规范和技

巧实现思路新建1024x1024像素的画布使用钢笔工具绘制基础形状使用布尔运算绘制图形14/31目录iOS系统图标设计规范Android系统图标设计规范双系统下启动图标的设计15/31A

ndroid系统图标设计规范Android启动图标概述•启动图标•操作、工具栏图标•小图标16/31Android系统图标设计规范Android系统启动图标及规范Android系统启动图标尺寸48x48dpldpi36*36pxm

dpi48*48pxhdpi72*72pxxhdpi96*96pxxxhdpi144*144pxGooglePlay512*512px17/31Android系统图标设计规范Android系统比较开放

，并没有对启动图标在风格上有过多的硬性要求原生态的Android系统图标风格特征使用一个独特的剪影使用三维的正面视图看起来稍微有点从上往下的透视效果，使用户能看到一些景深•原生Android系统启动图标样式18/31Android系统图标设计规范A

ndroid系统图标栏图标及规范19/31Android系统图标设计规范Android系统图标栏图标及规范设计尺寸焦点区域尺寸Android系统手机操作栏图标32x32dp24x24dpldpi24x24px18x18pxmdpi32x32px24x24

pxhdpi48x48px36x36pxxhdpi64x64px48x48pxxxhdpi96x96px72x72px20/31Android系统图标设计规范Android系统小图标及规范21/31Android系统

图标设计规范Android系统小图标及规范设计尺寸焦点区域尺寸Android系统小图标设计尺寸16x16dp12x12dpldpi12*12px9*9pxmdpi16*16px12*12pxhdpi24*24px18*18pxxhdpi32*32px24*24pxxxhdpi48*48

px36*36px22/31演示案例演示案例：Android系统电影启动图标设计实现思路新建1024x1024像素的画布使用钢笔工具绘制整体形状，通过布尔运算剪切右下角的切口和两边的矩形镂空部分使用形状工具、钢笔工具通过波尔运算绘制高山白日形状使用图层

样式设置内阴影以增加浅色高光效果23/31课堂练习课堂练习：Android系统启动图标设计需求描述制作Android系统启动图标熟练掌握Android系统启动图标的设计规范和技巧实现思路使用钢笔工具绘制基础形状使用布尔运算绘制图形24/31目录

iOS系统图标设计规范Android系统图标设计规范双系统下启动图标的设计25/31双系统下启动图标的设计启动图标在双系统下是可以完全一样的•iOS系统启动图标•Android系统启动图标26/31双系统下启动图标的设计考虑双系统下启动图标

的差异化表现•设计师提交的稿件•iOS系统启动图标•Android系统启动图标27/31演示案例演示案例：双系统下商场启动图标的设计先绘制iOS系统启动图标1024x1024像素绘制一个圆角180度的102

4像素的圆角矩形使用钢笔工具和矢量形状绘制主体形状，填充合适的颜色使用钢笔工具绘制阴影，并调整图层的丌透明度再更改为Android系统启动图标在iOS系统启动图标的基础上，复制文件，重命名将

图像尺寸缩小为512x512像素重新调整圆角正方形的数值对其余图层进行图层蒙版剪切28/31本章总结iOS系统启动图标的设计规范是什么？Android系统启动图标的设计规范是什么？原生的Android启动图标的圆角与iOS系统启动图标圆角哪个更大

？29/31