锐客网

  1. 首页 > 科技 > >

图标|一次客户沟通后，我悟出了「B端图标」若干设计点( 三 )


文章插图
2.5 从基础型拓展我们在设计图标时，都应该先从基础型开始思考——圆形、矩形、三角形、正方形等，保证计构图上的节奏感和规整性。当基础型无法满足需要的时，以它们为准向外散发，在遵循设计规范的基础上，做视觉上的平衡和微调。
如果是落到实际软件中应用的，建议所有图标最后都要合并路径，保证图形规整和干净，同时便于正确输出和使用。
三、图标画板尺寸在「2.1 约定图标绘制区域」中，我们说到了要为一套图标约定统一的画板区域，但这个事情给设计师造成了困扰，还不止一位设计师问我：“那是不是我不能在用其他尺寸的画板来设计图标了。”答案当然是否定的。约定画板尺寸不是约束，恰恰是在规则中给予了设计师有序拓展的能力。
假如不约定画板尺寸，那么设计师直接放飞，每个图标都有自己的尺寸，并且有些还会出现长方形的形态。毕竟每个人的工作习惯不同、面对的产品不同，直接打开软件画图标是最快的方式。
而首先约定画板尺寸，设计师就会有条理地进行绘制，在遇到特殊情况时进行有序拓展，我们可以称之为场景拓展法。例如设计师可以为B端基础组件、工作台常用导航模块、结果页的图标各自设计一套绘制尺寸。
那设计师要怎么判断什么时候采用场景拓展法去设计呢？我们可以优先使用默认画板尺寸设计图标，在遇到特殊场景不允许情况下，采用场景拓展法去执行，针对界面风格有场景区别的，可以规定几类画板尺寸，为不同场景使。
四、线型与面型线型图标与面型图标也是设计师经常在讨论的话题，他们常常讨论「什么情况下使用线型图标，什么情况下使用面型图标」。做过比较多B端产品的小伙伴可以发现，没有说哪种场景必须使用线型图标，哪种场景必须使用面型图标，主要还是看当前产品调性合适哪种，并且使用某类型图标后，对界面产生的效果是什么。
例如当界面图标较多时，采用面型图标，会显得页面很重，会把用户视觉引导到图标而不是重点数据上。
线型图标与面型图标在界面中使用，是一项系统工程，是由多方因素决定的。但我们设计师需要保证B端界面图标使用的统一性，即便按照场景区分，也需要认真思考，是不是有必要。
就如界面字号使用定律一样，建议不要超过3种，多了会让界面杂乱，降低界面设计品质。图标也是如此，不论面型还是线型，要站在产品角度去整体把握，而非线型和面型的简单选择。很多B端产品是两种类型混用的，但它们很好的划分了使用场景。
这里我总结了一些线型图标与面型图标常用的场景（以B端中后台为例，但这并不是唯一选择）：
在导航上（菜单极其多），常见默认用线型，选中用面型。
图标|一次客户沟通后，我悟出了「B端图标」若干设计点
文章插图
在导航上（菜单很少，单层），粗一些的线型图标或者面型图标都会用，且会比较个性化，以提升产品整体调性。
图标|一次客户沟通后，我悟出了「B端图标」若干设计点
文章插图
在基础组件中，通常使用线型图标，且颜色浅，用户可以把注意力聚焦在信息本身。
图标|一次客户沟通后，我悟出了「B端图标」若干设计点
文章插图
在表格数据的状态中，面型和线型是均分使用的状态出现。
图标|一次客户沟通后，我悟出了「B端图标」若干设计点
文章插图
在文字按钮中如果要添加图标，让界面展现更丰富，线型按钮居多。假如一旦按钮很多，面型图标会让界面显得太重。
图标|一次客户沟通后，我悟出了「B端图标」若干设计点

推荐阅读


上一篇：oculus|高通 CEO 安蒙：Meta 公司 VR 头显 Oculus Quest 2 已出货 1000 万台

下一篇：投稿|海底捞的问题远不止一次决策失误