资源简介

(共23张PPT)
本章介绍：
本章针对UI设计中常用的线性图标、面性图标以及线面图标进行系统的知识讲解与实操演练。通过本章的学习，读者可以对图标设计有一个系统的认识，并快速掌握绘制图标的规范和方法，为接下来的UI设计打下基础。
项目2　
设计趣味的图标—UI图标设计
学习引导
掌握线性图标的风格特点
掌握面性图标的风格特点
掌握线面图标的风格特点
掌握线性图标的制作方法
掌握面性图标的制作方法
掌握线面图标的制作方法
培养良好的UI图标设计劳动习惯
培养一定的UI图标设计创新能力和艺术审美能力
任务2.1 设计旅游类App线性图标
任务引入
任务知识
设计理念
任务实施
2.1.1 任务引入
本任务通过学习使用软件Illustrator绘制旅游类App标签栏中的“行程”图标，掌握线性图标的设计要点与制作方法。
2.1.2 设计理念
在设计过程中，围绕旅游类App标签栏中的“行程”图标进行创意。图形选用“日历”作为核心创作元素，形象地表达行程之意。未点击状态采用形象简洁、设计轻盈的线性图标，呈现出干净的视觉效果。点击状态通过调整未点击状态的线性图标，转变为生动趣味、俏皮可爱的线面图标。色彩选灰色和橙色两种颜色，可以更好地区别不同的显示状态。同时橙色能够体现旅游的欢快热情，契合主题。
2.1.3 任务知识：Illustrator-变换命令
熟练掌握“属性”面板调整基础图形，运用“变换”命令进行快速复制，通过“扩展外观”命令变成真实图像。
2.1.4 任务实施
任务2.2 设计旅游类App面性图标
任务引入
任务知识
设计理念
任务实施
2.2.1 任务引入
本任务通过学习使用软件Photoshop绘制旅游类App金刚区中的“酒店”图标，掌握面性图标的设计要点与制作方法。
2.2.2 设计理念
在设计过程中，围绕旅游类App金刚区中的“酒店”图标进行创意。图形选用“高楼”作为核心创作元素，形象地表达酒店之意。整体采用形象饱满、视觉突出的面性图标，帮助用户快速进行图标的位置定位。色彩选用红橙渐变，能够体现入住酒店的温暖。
2.2.3 任务知识
熟练掌握“圆角矩形”工具、“属性”面板和“合并形状“命令绘制基础图形，运用“渐变”工具为图标添加颜色渐变，通过“不透明度”选项的设置调整图标不透明度。
2.2.4 任务实施
任务2.3 设计旅游类App线面图标
任务引入
设计理念
任务知识
任务实施
2.3.1 任务引入
本任务通过学习使用软件Illustrator绘制旅游类App标签栏中“攻略”图标，掌握线面图标的设计要点与制作方法。
2.3.2 设计理念
在设计过程中，围绕旅游类App标签栏中的“攻略”图标进行创意。图形选用“星球”作为核心创作元素，形象地表达旅游攻略之意。点击状态采用生动趣味、俏皮可爱的线面图标。未点击状态通过调整点击状态的线面图标，转变为形象简洁、设计轻盈的线性图标。色彩选灰色和橙色两种颜色，可以更好地区别不同的显示状态。同时橙色能够体现旅游的欢快热情，契合主题。
2.3.3 任务知识：Illustrator-属性面板、扩展外观命令
熟练掌握“属性”面板调整基础图形，通过“扩展外观”命令变成真实图像。
2.3.4 任务实施
任务2.4 项目演练——设计电商类App线性图标
任务引入
设计理念
2.4.1 任务引入
本任务通过学习使用软件Illustrator绘制电商类App标签栏中的“购物车”图标，掌握线性图标的设计要点与制作方法。
2.4.2 设计理念
使用“属性”面板进行调整使图标符合设计规范，扩展外观变成真实图像。
任务2.5 项目演练——设计餐饮类App面性图标
任务引入
设计理念
2.5.1 任务引入
本任务通过学习使用软件Illustrator绘制餐饮类App标签栏中的“订单”图标，掌握面性图标的设计要点与制作方法。
2.5.2 设计理念
使用“属性”面板进行调整使图标符合设计规范，扩展外观变成真实图像。

展开更多......

收起↑