Predix应用图标设计准则简介

来源:互联网 发布:carousel.js 使用手册 编辑:程序博客网 时间:2024/06/06 13:02

作者:侯松岩,GE数字化集团高级用户体验设计师。

如果您还没有Predix试用帐号,请访问https://supportcentral.ge.com/esurvey/GE_survey/takeSurvey.html?form_id=18446744073709715720 申请。请务必准确提供您的信息,我们会以邮件方式通知您注册结果。


身在一个产品开发团队,要在Predix上开发自己的App,在设计阶段,如何选择合适的图标来符合自己的工业生产场景? Predix提供了一系列准则来帮助你。


首先我们来看看一些大的准则:

  • 让你的图标变得有意义:让你的图标变得有含义,一目了然,而不是仅仅为了视觉效果。
  • 最小化颜色的使用:图标有自己的一套颜色选择,最好是为不同状态选择一个颜色的不同状态,并且统一语意。
  • 使用合适的图标类别:Predix提供了各自类别的图标库,但是不要跨库使用。如果没有,可以自定义创建。
  • 在自定义的时候遵循准则:设计语言的统一性永远都是重要的,在你的应用中,你要保持图标的家族性。

那接下来让我们简单的来看看这些准则吧:

  1. 样式

图标均由1像素的线条和0.5像素的圆角,来构成一定的软边角。在端口处使用硬朗的方形,90度的转角,给与一种工业的坚固性。

      2. 类别和尺寸

Predix提供的icon套装适用于不同的类别:功能类,导航类,物体类以及应用类。大部分图标典型的尺寸是32像素,但是次级别图标或是次要要素的图标建议使用22像素。最小的尺寸是16像素。所有的图标都应该使用1像素的线条来保持他们在一倍像素下的统一性。

应用类图标 16*16



导航类图标:22*22


功能类和物体类图标32*32

      3. 颜色

图标颜色的基础是单色调的色彩系统。可定义的色板通常是用在选中状态以及强调的时候。图标一般来说如果没有被选择或悬浮指定时是灰色的。对于Predix来说,标志性的蓝色是主要被使用的激活状态颜色,不过如果需要的时候,你也可以增加其他的颜色。



关于Predix

  • 在使用中您有任何问题,请访问我们的论坛http://bbs.csdn.net/forums/GEPredix 

    GE数字集团的技术专家们会在线回答您的问题。

    也请访问我们在CSDN的Predix专区http://predix.csdn.net 了解更多Predix的内容和相关活动。





原创粉丝点击