整套ICON设计，用实例向你解析！
在这次新的视觉改版中，我们更新了过去较为单一的图标形式，重新定义了图标系统。
在旧版的页面中，我们发现了几个问题：
1、页面形式复杂，导致页面的焦点太多，重要功能不够突出。
2、一些功能过于隐藏，导致用户很难搜寻。
在新的改版中，我们采用九宫格形式，使页面层次更加简单清晰，在财富页的改版里，我们突出了团团赚与散标功能，使得用户更加方便管理账户，然而我们为了使页面更具整体感，我们统一了图标风格。
在图标设计过程中，我们提出了几个关键的设计原则。
设计原则
一、更具识别性
在以往的图标系统中，我们发现，由于图标本身单线的表现形式，对界面具体信息的传达产生的作用不大，在这次新的图标改版中，我们将用更加具象的视觉语言对信息传达的更为准确。
二、更具一致性
在这次图标系统的更新中，我们将统一所有功能层级相同的图标形式，使页面更统一，视觉语言更为鲜明。
三、适度的情感化体现
作为一个金融产品，在用户使用界面时，我们想更改从前用户对金融产品严肃气质的认知，采用更为丰富的造型与颜色使页面更具亲和力。
设计过程
一、叠加风格
在面对这样多的关于数据与用户为主要内容的图标时，曾一度陷入了深深的疑惑，究竟要用怎样的形式才可以将内容概括的完整而又不显繁琐而重复。在尝试过多种形式之后，最终采用了图形与图形叠加的形式来概括图标，在面的基础上再增添一点基础形，形式较为单块面更显丰富，在达意上，多一个基础图形也更易概括复杂的金融数据的图标内容。
二、保持相同的大小与间距
在icon的设计过程中，是否能使图标一致性是一套图标系统成功的关键之一。然而不同图标之间的关系一定程度上决定了整套图标的一致性。在这套图标里，图形与图形的叠加感与其中间留白的间距也成了整套图标的特点之一，让这些特点保持一致，整个图标系统自然就展现一致。
严格的间距控制以保持图标的一致性 三、圆角的采用
在之前的设计原则中我们所提到的，更新金融产品的严肃感，采用更为亲和力的造型来体现适度的情感化。在这次的设计过程中，所有的图标的边角都采用圆角的形式，直觉上便给人亲和感。4px的圆角大小也较为中和的不会给人过多的可爱感。
Icon System一览
整套图标的设计过程中，我们也经历了很多挫折，过于严肃，过于可爱，或过于夸张，我们一直在调整这个度的掌控，然而最终还是将它完整的展现了出来，我们竭尽全力的用视觉来提高用户在流畅的使用页面过程中视觉的一致性，从而达到更佳的用户体验。希望这次新的改版，能够带给你们一个全新的感受！
看完教程咱们交作业咯！点我直达作业提交页面>>
DDC
作者：Esic