UI设计学习(三)图标创意设计(2022.3.16)

PS,AI基础;

肌肉记忆:不用思考,可以自然去做想要画的图形。

一、功能图标设计

1.明确使用场景

功能入口

辅助功能

纯视觉传达 视觉

2.设计要领

  • 提炼特征,保持识别度(第一行比较好)
  • 保持图标的特征美感
  • 组合型比例

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA6Iqd5aOr6YCD6YCD4oKswqI=,size_12,color_FFFFFF,t_70,g_se,x_16 (最后一图是2:1)

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA6Iqd5aOr6YCD6YCD4oKswqI=,size_20,color_FFFFFF,t_70,g_se,x_16

 watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA6Iqd5aOr6YCD6YCD4oKswqI=,size_20,color_FFFFFF,t_70,g_se,x_16

 图标一致性

类型一致,风格统一

线型和面型,渐变,透明度,断点方向一致,透视一致,粗细一致

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA6Iqd5aOr6YCD6YCD4oKswqI=,size_14,color_FFFFFF,t_70,g_se,x_16

 46ec1ad133ca4c00ab8b9481f0a0cd9c.png

调整大小:正方形不变时,圆适当缩小,三角形适当放大,且往上一点

 watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA6Iqd5aOr6YCD6YCD4oKswqI=,size_13,color_FFFFFF,t_70,g_se,x_16

 图标规范:栅格化

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA6Iqd5aOr6YCD6YCD4oKswqI=,size_8,color_FFFFFF,t_70,g_se,x_16

 像素对齐

tips:面型变为线型---去除填充,将修改描边粗细

线型变为面型:需要先将线条拓展为形状才能删掉。去除顶层。

二、

猜你喜欢

转载自blog.csdn.net/qq_53682472/article/details/123530668