2023-02-8 图标的分类以及应用场景

图标的分类以及应用场景

图表定义:通过相似性或类比来代表的符号,比语言更容易理解,传递更高效。

​ 相似性-表象符号

​ 类比性-表意符号

风格分类

​ 线性 剪影 填充 扁平 手绘 微质感 拟物写实

图标分类

​ 线性图标 Outline icons

​ 剪影图标 Glyph icons

​ 线性填充 Filled-line icons

​ 扁平化图标 Flat icons

​ 手绘图标 Hand-drawn icons

​ 微质感图标 Textrue icons

​ 拟物化图标 Skeuomorphic icons

功能的分类

功能引导、辅助说明

图标应用场景

​ 网页 软件 APP 其他

图标绘制标准化流程

​ 确定图标主题

​ 拟定关键词

​ 搞清指代、隐喻

​ 手稿

绘制中的标准化流程

​ 风格 软件 尺寸栅格 结构造型 细节优化 色彩

绘制后的输出 包装 总结

​ 优化输出 润色包装 设计总结

图标绘制的基本原则

​ 图标设计的重要性:传递引导、指引方向、具有方向性。

​ 具有趣味性

图标设计原则

​ 掌握好的规范原则,让你的设计更符合调性

​ 1.协调美观【审美统一】:统一的视觉风格有很多种元素,包含圆角,线面,线条粗细,涉及形式等。

​ 统一的线条粗细,统一的断点设计,统一的色彩运用

​ 统一的色彩,统一的线条,统一的圆角

​ 2.易于理解【可辨识性高】:简单、直观

​ 3.视觉平衡【面积一致性】

​ 4.色彩搭配、质感、透视与光效的统一性

​ 5.避免模糊像素 保证图标都是矢量图形

图标设计参考网站

http://www.iconfont.cn/

https://www.easyicon.net/

https://icon.52112.com/

http://www.icontuku.com/

设计软件以及图标大小工具

​ PA AI XD Sketch

图标设计尺寸详解

​ 掌握更好地规范原则,让你的设计更符合调性 1024 * 1024px

工具栏和导航栏图标

​ 状态栏 导航栏 标签栏 iphone6: 44 * 44px

图标分类

​ icon的分类

​ 不可点击的展示图标 通常尺寸:16 * 16px 24 * 24px 28 * 28px 32 * 32px

​ 可点击的按钮图标

一个宏观的产品流程

​ 战略层

​ 明确用户需求和产品目标 这一般是老板干的事

​ 范围层

​ 明确功能规格和内容需求 这是产品经理干的事

结构层

分为交互设计与信息框架 交互设计师、系统架构师

​ 框架层

细化具体的产品原型 这一般是产品结构师做的事(出产品原型图) 界面设计 导航设计 信息设计

​ 表象层

​ 将最终的产品呈现在用户面前。 视觉设计师干的事儿

UI设计师

​ 经历从产品需求到最终产品设计整个阶段

一、产品定位与市场分析阶段

​ 了解产品市场定位、产品定义、客户群体、运行方式等

二、用户研究与分析阶段

​ 收集相关资料分析目标用户的使用特征、情感、习惯、心里、需求等,提出用户研究报告和可用性设计建议。这部分工作由团队配合完成。时间与项目需求允许的情况下,更可以制定实景用户分析。

三、架构设计阶段

​ 根据可用性定制交互设计、操作和跳转流程、结构、布局、信息和其他元素。界面设计、图标设计、风格设计。

posted @ 2023-02-08 10:16  一只小白呀  阅读(278)  评论(0编辑  收藏  举报