《04-拟物化风格图标设计.pptx》由会员分享，可在线阅读，更多相关《04-拟物化风格图标设计.pptx（33页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、拟物化风格图标设计课程回顾n扁平化风格概述n扁平化风格设计原则n扁平化风格的特点n扁平化风格的分类2/33本章任务n了解拟物化设计的概念n熟知拟物化启动图标设计的流程n了解启动图标的设计原则n能够使用Photoshop进行拟物化图标的设计3/33目录n拟物化设计的概念n拟物化启动图标设计的流程n启动图标的设计原则4/33拟物化设计的概念n拟物化设计的概念l“拟物化”一词来源于古希腊，意思是只要看到它的外在形态，就能知道它是用来做什么的l“拟物化”设计是一种以保留原始被模仿对象的各种装饰元素为基础、并由此衍生出来的设计风格5/33拟物化设计的概念n拟物化设计的概念哪一幅运用了拟物化风格?6/33
2、拟物化设计的概念哪一幅运用了拟物化风格?7/33拟物化设计的概念n拟物化设计的优点l外观完全与现实事物相似，用户认知和学习成本低l交互与现实事物保持一致l动态效果高度统一，给用户以人性化的体贴8/33拟物化设计的概念n拟物化设计的缺点l花费大量的时间在视觉的阴影和质感效果上l要求设计师有更深厚的设计功底和更熟练的软件使用l在适配方面比较复杂和麻烦9/33拟物化设计的概念n拟物化设计的核心：提取物体的关键元素：它们的关键元素是？10/33拟物化设计的概念n拟物化设计的核心：提取物体的关键元素：它们的关键元素是？11/33演示案例n需求描述l完成拟物化风格日历启动图标设计演示案例：拟物化风格日历启
3、动图标设计n实现思路l使用形状工具和钢笔工具绘制整体的结构和布局l给图标上色，将各部分大致的颜色分出来l为图层增加图层样式，通过颜色渐变、内发光、外发光等增加图形的质感和细节12/33课堂练习n需求描述l完成拟物化风格旋钮设计n实现思路l使用形状工具和钢笔工具绘制整体的结构和布局l给图标上色，将各部分大致的颜色分出来l为图层增加图层样式，通过颜色渐变、内发光、外发光等增加图形的质感和细节课堂练习：拟物化风格旋钮设计13/33目录n拟物化设计的概念n拟物化启动图标设计的流程n启动图标的设计原则14/33拟物化启动图标设计的流程n拟物化启动图标15/33拟物化启动图标设计的流程n从实际出发 台球A
4、pp图标16/33拟物化启动图标设计的流程n从现有图形系统出发p被人们熟知p被人们认同p避免引起歧义设置图标17/33拟物化启动图标设计的流程n从竞品出发开始l相同类型l竞争对手l不同平台ppcpwebpphonep18/33演示案例：拟物化风格抽屉邮件图标设计l从实际出发。l根据这个设计的需求找到相关素材主题“抽屉”、“邮件”19/33演示案例：拟物化风格抽屉邮件图标设计l从现有图形系统出发20/33演示案例：拟物化风格抽屉邮件图标设计l从竞品出发开始21/33演示案例演示案例：拟物化风格抽屉邮件图标设计n需求描述l完成拟物化风格抽屉邮件图标设计n实现思路l使用钢笔工具和图形工具绘制图标的整
5、体结构l双击图层缩略图，更改形状图层的颜色l为图层增加图层样式，通过添加颜色渐变、内发光、外发光等为图标增加更多的质感和细节l将图标作为一张图片进行修整，在最上面增加一个图层调整整体的光感22/33课堂练习n需求描述l完成拟物化风格复古磁带图标设计n实现思路l使用形状工具和钢笔工具绘制整体的结构和布局l给图标上色，将各大部分大致的颜色分出来l为图层增加图层样式，通过颜色渐变、内发光、外发光等增加图形的质感和细节课堂练习：拟物化风格复古磁带图标设计23/33目录n拟物化设计的概念n拟物化启动图标设计的流程n启动图标的设计原则24/33启动图标的设计原则n严格遵守平台下的规范进行设计 iOS系统启
6、动图标尺寸的设计规范25/33启动图标的设计原则n严格遵守平台下的规范进行设计n注意lApp启动图标在设计时要考虑后期是否要印刷，设计时的像素大小直接影响后期印刷效果l为了防止图片过大引起的卡机、死机现象，或后期修改带来的被动因素，设计时请尽量使用矢量软件或PS里的矢量工具来设计26/33启动图标的设计原则n严格遵守平台下的规范进行设计n考虑在各个平台实际应用中的情景n必须符合国家相关规定n考虑受众群体的审美需求27/33演示案例演示案例：拟物化风格相机图标设计n需求描述l完成拟物化风格相机图标设计n实现思路l仔细观察现实中的相机的模样，抓取它的关键元素l对相机图标进行拆分l使用圆形工具绘制几
7、个同心圆，然后分别为其增加图层样式l绘制光晕镜头l各个圆形之间的完美对齐28/33课堂练习n需求描述l完成拟物化风格可爱照相机图标设计n实现思路l使用形状工具和钢笔工具绘制整体的结构和布局l给图标上色，将各部分大致的颜色分出来l为图层增加图层样式，通过颜色渐变、内发光、外发光等增加图形的质感和细节课堂练习：拟物化风格可爱照相机图标设计29/33课堂练习n需求描述l完成拟物化风格圆角直尺图标设计n实现思路l使用形状工具和钢笔工具绘制整体的结构和布局l给图标上色，将各大部分大致的颜色分出来l为图层增加图层样式，通过颜色渐变、内发光、外发光等增加图形的质感和细节课堂练习：拟物化风格圆角直尺图标设计30/33本章总结n什么是拟物化风格设计？n拟物化启动图标设计的流程是什么？n启动图标的设计原则是什么？n拟物化和扁平化设计，哪一个更好？31/33本章作业本章作业n完成本节课所有的演示案例、课堂练习n临摹下列拟物化风格图标l拟物化风格金属保险箱图标设计l拟物化风格湿度计图标设计n请教员根据班级情况布置预习32/33