恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
电力线性图标设计小结
0.0°
2019-01-18 原创文章 经验/观点 举报 1146 1 5 1

自己最近一直在做图标库的工作,绘制了不同主题的线性图标,有点体会和各位感兴趣的同行们一起分享交流。

写在前面

有人会问我,你在设计界混了这么些年还是一个青铜,不怕被后来人超越并且踩死吗?我的回答:我靠的不是资质不是灵感是坚持。

有人认为坚持很容易,一年很容易,10年很容易,30年呢?

我认为大多数的人资质都是平庸的,想做成一件事情没有多年的耕耘是不行的。

Image title

最近在整理电力行业的图标,之前用到图标的时候都是时间充裕就自己画时间紧就去网上下载,造成图标风格不统一,形不成体系等问题。所以在领导和组内成员的一致意见下开始绘制属于自己部门的图标成果物。
部门一般用图标最普遍的地方是WEB端菜单栏、APP端、PPT等地方,考虑设计风格这套图标能够最大限度的通用涵盖电力行业的各个业务链。最终经过取舍选定线性断线图标作为绘制对象。线性可以最大限度通用基本的场景都可以用,断线是突出一些风格避免雷同。
图标是界面设计中最重要的元素之一,也是我们UI设计师的必备技能。那到底什么样的图标才算是优秀的图标呢?可以说图标绘制伴随着我的设计生涯,之前就是根据字的意思找一些图片把图片经过提炼变成图标,相信很多设计师都有类似经历。这样做呢会导致图标不统一,有的太简单有的太复杂缺少节奏感。
以下是我这次线性图标绘制总结的几个图标设计的要点,可以通过这五点来检测以下自己的图标是否合格。
辨识度
图标的用途是帮助用户理解信息,所以辨识度就是图标最重要、最底层的价值,如果你设计一个图标,看着很好看但是用户看不懂那也是没有任何价值可言。
识别性可以分为两个方面,一是含义识别,二是视觉识别。
首先含义识别:顾名思义就是你的图标能不能被客户理解,当然并不是设计师自己理解就OK,而是需要用户来决定我的方法是找组内的领导和同事一起来识别一下,内部调研有条件可以找不同岗位的人来测试效果更好。
例如:
Image title上图的线损管理图标字面含义是电能在传输过程中产生的损耗,我想突出全部含义所以把电工和线损进行结合。拿给领导和组内成员讨论,只有2个人看出含义,这说明这个图标设计不够直观,所以还有很大改进空间结合提出意见才有了最终的线损管理。
其次视觉识别主要是从图标的视觉层面例如大小、圆角、粗细等决定识别程度的因素。
线性图标切记根据大部分使用场景来考虑线条的粗细,如果线条太细会严重影响识别性。
例如:
Image title辨识度是图标最重要的价值,理论上来讲用户看到图标后不能产生困惑、思考,这样才能算是一个合格的图标。
风格统一
人们都喜欢有鲜明性格的人,就像四季春夏秋冬四季分明给人的感受最舒服。图标也是一样必须给人统一风格的感受才能提高图标的价值。
如何打造统一的视觉风格,我的方法是从用户和行业出发,例如我们的用户都是电力、石油方面的从业人员,图标必须符合严谨、商务不失活力的感觉,所以我设计的图标圆角很小。
Image title结构简单
图标是具有指代意义的图形符号,具有高度浓缩并快捷传达信息、便于记忆的特性。所以说图标必须要结构简单并且经得起推敲。
例如:
Image title上图核算管理图标把电脑计算器营销元素加进来结合处一个图标,虽然把含义全展现出来但显得过于复杂,不符合图标的高度浓缩属性,其实只用一个计算器就能很好解释图标的含义,所以设计到最后是做减法的。
细节
古人云,失之毫厘,差之千里,图标这种高度概括的元素更需要对细节的绝对把握,每处细节都需要再三斟酌。
例如:圆角大小是否统一描边末端的细节处理
Image title上图描边末端要么统一是方的,要么统一是圆的。还有圆角的大小必须所有图标保持统一大小。
饱满
做图标和做字体是一个道理,我们画出来的图标感觉不舒服,不够精致很大程度就是不够饱满。
如何判断图标是否饱满?学的一位前辈大神的方法就是画一个矩形,看图标的面积是否还能继续增加
例如:
Image title上图的图标上面剩余空间太多,显得不够饱满,于是我换了一种思路很好的把空间利用起来。当然具体问题还需要具体分析不要刻意去为了饱满而饱满。整套图标的绘制要做到和谐统一而又不失有变化。
总结
本次总结的几点线性图标的设计方法和思路是我的一点实践经验,希望能给看到的同行们带来一点启发和帮助,希望我们一起进步。
如果觉得对您有一点点启发请点击支持一下。

谢谢

更新:2019-01-18

收藏

1人已收藏

黄巨虎

本人觉得做设计就要有玩得心态才能做好,享受做设计的过程。

  • 9

    作品

  • 8

    粉丝

  • 18

    关注

  • 做项目如何让界面经得起推敲
  • 2018上作品集
  • 中国风主题页面
  • 防震助手APP-第二届防震减灾公益大赛

    猜你喜欢

      2019-01-18 原创文章 经验/观点 举报 1146 1 5 1

      电力线性图标设计小结

      0.0°

      你确定要举报电力线性图标设计小结

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2019年01月18日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      5
      1
      1

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录