【文档说明】移动UI界面设计04拟物化风格图标设计课件.pptx，共(31)页，6.185 MB，由小橙橙上传

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

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

拟物化风格图标设计课程回顾扁平化风格概述扁平化风格设计原则扁平化风格的特点扁平化风格的分类2/33本章任务了解拟物化设计的概念熟知拟物化启动图标设计的流程了解启动图标的设计原则能够使用Photoshop进行拟物化图标的设计3/33目录拟物化设计的

概念拟物化启动图标设计的流程启动图标的设计原则4/33拟物化设计的概念拟物化设计的概念“拟物化”一词来源于古希腊，意思是只要看到它的外在形态，就能知道它是用来做什么的“拟物化”设计是一种以保留原始被模仿对象

的各种装饰元素为基础、并由此衍生出来的设计风格5/33拟物化设计的概念拟物化设计的概念哪一幅运用了拟物化风格?6/33拟物化设计的概念哪一幅运用了拟物化风格?7/33拟物化设计的概念拟物化设计的优点外观完全与现实事物相似，用户认知和学习成本低交互与现实事物保

持一致动态效果高度统一，给用户以人性化的体贴8/33拟物化设计的概念拟物化设计的缺点花费大量的时间在视觉的阴影和质感效果上要求设计师有更深厚的设计功底和更熟练的软件使用在适配方面比较复杂和麻烦9/33拟物化设计的概念拟物化设计的核心：提取物体的关键元素：它

们的关键元素是？10/33拟物化设计的概念拟物化设计的核心：提取物体的关键元素：它们的关键元素是？11/33演示案例需求描述完成拟物化风格日历启动图标设计演示案例：拟物化风格日历启动图标设计实现思路使用形状工具和钢笔工具绘制整体的结构和

布局给图标上色，将各部分大致的颜色分出来为图层增加图层样式，通过颜色渐变、内发光、外发光等增加图形的质感和细节12/33课堂练习需求描述完成拟物化风格旋钮设计实现思路使用形状工具和钢笔工具绘制整体的结构和布局给图标上色，将各部分大致的颜色分出来为图层增加图层样式，通过颜色渐变、内

发光、外发光等增加图形的质感和细节课堂练习：拟物化风格旋钮设计13/33目录拟物化设计的概念拟物化启动图标设计的流程启动图标的设计原则14/33拟物化启动图标设计的流程拟物化启动图标15/33拟物化启动图标设计的流程从实际出发•台球App图标16/33拟物化启动图标设计的流程从现

有图形系统出发被人们熟知被人们认同避免引起歧义•设置图标17/33拟物化启动图标设计的流程从竞品出发开始相同类型竞争对手不同平台pcwebphone……18/33演示案例：拟物化风格抽屉邮件图

标设计从实际出发。根据这个设计的需求找到相关素材主题“抽屉”、“邮件”19/33演示案例：拟物化风格抽屉邮件图标设计从现有图形系统出发20/33演示案例：拟物化风格抽屉邮件图标设计从竞品出发开始21/33演示案例演示案例：拟物化风格

抽屉邮件图标设计需求描述完成拟物化风格抽屉邮件图标设计实现思路使用钢笔工具和图形工具绘制图标的整体结构双击图层缩略图，更改形状图层的颜色为图层增加图层样式，通过添加颜色渐变、内发光、外发光等为图标增加更多的质感和细节将图标作为一张图片进行修整，在最上面增加一个图层

调整整体的光感22/33课堂练习需求描述完成拟物化风格复古磁带图标设计实现思路使用形状工具和钢笔工具绘制整体的结构和布局给图标上色，将各大部分大致的颜色分出来为图层增加图层样式，通过颜色渐变

、内发光、外发光等增加图形的质感和细节课堂练习：拟物化风格复古磁带图标设计23/33目录拟物化设计的概念拟物化启动图标设计的流程启动图标的设计原则24/33启动图标的设计原则严格遵守平台下的规范进行设计•iOS系统启动图标尺寸的设计规范25/

33启动图标的设计原则严格遵守平台下的规范进行设计注意App启动图标在设计时要考虑后期是否要印刷，设计时的像素大小直接影响后期印刷效果为了防止图片过大引起的卡机、死机现象，或后期修改带来的被动

因素，设计时请尽量使用矢量软件或PS里的矢量工具来设计26/33启动图标的设计原则严格遵守平台下的规范进行设计考虑在各个平台实际应用中的情景必须符合国家相关规定考虑受众群体的审美需求27/33演示案例演示案例：拟物

化风格相机图标设计需求描述完成拟物化风格相机图标设计实现思路仔细观察现实中的相机的模样，抓取它的关键元素对相机图标进行拆分使用圆形工具绘制几个同心圆，然后分别为其增加图层样式绘制光晕镜头各个圆形乊间的完美对齐28/33课堂练习需求描述完成拟物化

风格可爱照相机图标设计实现思路使用形状工具和钢笔工具绘制整体的结构和布局给图标上色，将各部分大致的颜色分出来为图层增加图层样式，通过颜色渐变、内发光、外发光等增加图形的质感和细节课堂练习：拟物化风格可爱照相机图标设计29/33课堂练习需求描述完成拟物化风格圆角直

尺图标设计实现思路使用形状工具和钢笔工具绘制整体的结构和布局给图标上色，将各大部分大致的颜色分出来为图层增加图层样式，通过颜色渐变、内发光、外发光等增加图形的质感和细节课堂练习：拟物化风格囿角直尺图标设计3

0/33本章总结什么是拟物化风格设计？拟物化启动图标设计的流程是什么？启动图标的设计原则是什么？拟物化和扁平化设计，哪一个更好？31/33