图标是UI设计中的点睛之笔,更是赋予了UI设计灵魂。很多小伙伴留言说不会做图标设计,所以今天胡老师今天谈谈图标设计。

  图标是 UI 设计中必不可少的组成。通常我们理解图标设计的含义,是将某个概念转换成清晰易读的图形,从而降低用户的理解成本,提升界面的美观度。在我们的企业级应用设计范围中,图标在界面设计的诸多元素中往往只占了很小的比重,在调用时也会被缩到比设计稿小很多倍的尺寸,加上在图形素材极度丰富并且便于获取的今天,在产品设计体系中实现一套美观、一致、易用、便于延展的图标体系往往会被不小心忽略掉。相信一整套优质的图标对于设计质量的影响是非常巨大的,这考验着设计师的协作能力,以及对图形塑造的系统性思维,同时也能反映一个团队对于细节的追求。

  尺寸

  由于图形化用户界面的使用环境不同,导致图形用户界面在使用中的显示环境不同。因此,图形化用户界面的图标尺寸,也出现了不同。同时,随着显示技术的不断发展,图标对应 的显示尺寸越来越大,分辨率越来越高,这使得图标的细节,也不断地在进行改进中。并且跨平 台软件的图标大小或像素的数量,通常按照特定的技术规范进行设计 。一般的图标标准尺寸有3种,分别为24*24 像素、32*32像素和48*48像素。其中48*48较为常见。

  图标设计,不同于其他的视觉设计。同一图标,由于其尺寸不同,展示效果和制作细节也不尽相同。因此,在不同显示系统下的图标,在图标设计时,都有其对应的图标效果。

  高识别性原则

  图标设计的目的,是通过符号化的图形传达 信息。因此,图标设计中高识别性原则就显得尤其重要。图标,是建立在虚拟世界和真实世界的一种隐喻或映射关系的桥梁。隐喻旨在“以一种更为明显,更为熟悉的观念符号来表示某种观念”,观念之间存在着类似性。

  统一性原则

  一个软件或程序的系统中,图标的设计风格 需要保持统一。因为统一的图标比单一零散的图标更具品质,更容易让用户理解和接受。(如下图美团APP)

  简洁性与符号性原则

  视觉图案的写实程度,与受众对 视觉图案的关注度,是成正比的。即越写实的图案,越容易引起受众的关注。因此,设计师在进行图标设计时,其设计的图标的视觉表现越是逼真,越是可以引起用户更多的注意,也可激发更多用户的使用兴趣。但是,形象写实逼真的图标设计,却也从另一个方面影响了图标信息的快速传达。

  象征性的符号,在图标设计中也是常见的。符号图标能够更快地被用户所接受、记忆和识别。同时,符号图标所使用的图形文件小,便于硬件的支持和运算效率的提高。因此,在图标设计时,尽量不要使用过于复杂的图案。过多的图形和装饰效果,会降低图形的认知度,特别是在小尺寸图标中,由于图标尺寸偏小,导致视觉上的识别度降低。

  文字应用原则

  在图标设计中,除了图形设计之外,还有一 个重要的组成部分就是文字。简洁明快的文字标签和清晰准确的文字说明,能更好地提高图形化用户界面的工作效率 。在设置图标文字时,最好使用简单通俗的文字作为图标的说明文字。UI设计中图标设计规范是什么https://www.aaa-cg.com.cn/ui/2842.html?seo1在图标文字的选择上,需要具备高度的概括性。同时,图标文字又需要有高度的信息传达性,能够充分体现其是对图标图案的一种解释和说明。

  在图标文字的设计中,需要对文字属性和文字使用环境进行考虑。而文字的字体、尺寸和色彩等方面,也会对图标的整体视觉和运行效果产生影响。在文字字体的选择上,考虑图标字体的形态不宜复杂。文字的识别度差异,在通常情况下,中文字体应不小于14px,英文字体应不小于 12px。另外,应该尽量使用均匀的间距,使文字更为整齐清晰,易于辨体识。

  图标的设计是 UI 设计中非常容易被忽略的环节,建立优秀的图形体系也不是一、二个设计人员的事,需要整个团队在设计前、设计中以及设计后都能够达成共识并且通力合作去完成共建。本次图标的升级,仅仅是一个开始。我们会建议在调用图标时,考虑具体业务对于图形化寄予的期望,以及用户操作时的心智模型等因素,结合实际情况做调用和适当的二次设计。

摘自:https://www.aaa-cg.com.cn/ui/2842.html?seo1

UI设计中图标设计规范是什么相关推荐

  1. UI设计中图标设计的有几大原则

    本文由:"学设计上兔课网"原创,图片素材来自网络,仅供学习分享 UI设计中图标设计的有几大原则?一款简练的图标比起同样大小的文字符号,可以表达更多的意义,根据界面的需要,控制图标的 ...

  2. UI设计APP图标设计规范介绍

    ​ UI设计所涉及的内容是比较多的,其中关于APP图标的设计就是常见的一种,UI设计师需要掌握不同的UI设计规范.今天小编就帮助大家了解下移动端APP图标设计规范: 很多设计师以为UI设计就是设计图标 ...

  3. UI设计中的按钮设计规范

    已经有很多朋友催我更新设计规范的文章了,今天我就先来一篇,关于按钮设计规范的,后面会陆续更新其他控件内容.严格来说,按钮包括很多种,比如普通按钮.图标按钮.文字按钮.开关按钮等等. 但我觉得根据这样的 ...

  4. html5中按钮尺寸设计,UI设计中的按钮设计规范

    原标题:UI设计中的按钮设计规范 已经有很多朋友催我更新设计规范的文章了,今天我就先来一篇,关于按钮设计规范的,后面会陆续更新其他控件内容.严格来说,按钮包括很多种,比如普通按钮.图标按钮.文字按钮. ...

  5. UI设计中面性图标设计总结

    图标在UI设计中占了一席之地,不同风格的图标会影响页面整体风格效果.主流的图标可分为线性.面性.线面结合3大类,之前跟大家分享过线性图标今天我就来跟大家聊聊面性图标设计总结. 1.图标的作用 事物的价 ...

  6. UI设计中网页的设计规范总结

    很多刚入行的UI设计师开始接触网页端UI设计的时候,对于基础的界面尺寸规范可能会有一定的模糊认知,导致做出来的页面往往会感觉不是那么和谐,却也不知道怎么去完善和改进. 对于大多数的刚入行者来说,如果不 ...

  7. UI设计中的IOS14设计规范

    你了解UI设计的规范吗? 很多新人在开始做移动端UI设计的时候,对界面的尺寸规范不是那么清楚,很多时候都是凭借自己的感觉和经验去设计,导致做出来的页面总是不那么尽如人意,从而一遍遍修改,拉低了工作效率 ...

  8. UI设计中的标签设计规范

    每个平台都会存在标签,我们可以根据自身平台属性,打造一套属于自己的标签体系,今天我就把UI设计中的标签设计规范分享给大家.(今天我们仅讨论不可点击标签,也就是展示型标签): 1.理解标签作用 2.整理 ...

  9. ui设计中的版式设计_设计中的版式-第3部分

    ui设计中的版式设计 and how not to suck at it 以及如何不吸吮它 This is the 3rd and last part of the series. Here we t ...

最新文章

  1. SSRS 2012 交互式报表 -- 层次性文档结构图
  2. 论流量平台(交易内容)生死劫——币看流量生意正在进入正循环
  3. 机器学习入门学习笔记:(4.1)SVM算法
  4. Python基础教程:内置类型之比较
  5. html5 json转字符串,web前端-js小记(5)-字符串及json
  6. IOS开发基础之使用AFNetworking框架实现xml文件的解析
  7. json绑定到实体_绑定到JSON和XML –处理集合
  8. Fibonacci in the Pocket 模拟
  9. libgmailer更新了,俺的下载空间又可以使用了(使用G-Share)
  10. Git版本控制,一个本地子分支修改了代码(包括依赖pom)任何文件,然后本地主分支就自动更改为子分支的!这个问题这样解决
  11. JDK9API网盘下载
  12. 拼多多token是什么?如何提取及写入?
  13. 手机远程启动汽车,汽车远程启动还是手机控制好!有一种远程手机启动热车系统非常的不错是什么功能知道吗?
  14. ffmpeg库编译加文字_我自己的FFMpeg编译之路
  15. LPC1768 关于延时Delay时间与不同等级的优化对比
  16. 零基础学习PS——Photoshop的167个技能
  17. oracle备份恢复(dmp文件)
  18. DynamoDB安装及配置
  19. 【优化布局】matlab基于禁忌搜索算法求解基站选址问题代码
  20. 自动驾驶中的Scene, Situation和Scenario的定义与补充

热门文章

  1. matlab直流输电,基于MATLAB/Simulink的高压直流输电系统的仿真研究
  2. Apache Solr任意文件读取漏洞复现
  3. kali中steghide命令工具教程;7z命令详解;kali中base64命令详解
  4. sau交流学习社区-songEagle开发系列:Vue + Vuex + Koa 中使用JWT(JSON Web Token)认证
  5. 分水岭算法--语义分割
  6. 高数——定积分计算大法之换元法
  7. 五个网络游戏植入商品营销的案例
  8. 腾讯云服务器增加网卡,腾讯云服务器(CVM主机)绑定多个弹性网卡和IP地址的方法...
  9. css3 呼吸的莲花_Css实例制作“荷花盛开”代码演示
  10. FPGA(五):Quartus II 调用Fir IP核使用说明