15年软件开发经验只做源码定制互联网+定制化解决方案

首页

源码定制

网站开发小程序APP

技术论坛

视觉设计前端开发后端开发服务器运维运营推广

| 登录注册

a

15年软件开发经验只做源码定制互联网+定制化解决方案

15年软件开发经验,只做源码定制!

原创设计定制开发

满足您的个性化需求

当前位置：首页视觉设计网站设计

UI设计中的图标辅助图形

路亚杰| 发布于 2021-11-11 15:33:22| 695阅读| 0点赞| 0评论

举报

如何使图标更有细节感

什么是图标辅助图形？

首先，我们在设计 小程序也好，网页也好，甚至是app的过程中，都会使用到图标。图标其实也是品牌识别度的一种展现方式，而图标中的辅助图形，简单理解就是一些装饰元素。他能让图标有更多的细节和特点，强化图标识别性。同时还能让图标更具视觉冲击力

像下面这套图标中的浅蓝色就是图标里的辅助图形，去掉这些浅蓝色块不大影响图标整体的识别性，但增加这些辅助图形后，图标变得更有特点，更容易被记住。

1.尽量让辅助图标有意义。

图标的辅助图形不是随随便便就加上去的，他的出现应该是代表了一些东西的。而不是随便的一个圆形，一个方块就算。底下这个是我找的网上的一个案例。这里面的图标辅助图形就是一个圆，出现在右上角。而且所有图形的圆出现的位置和大小都不变。其实他去掉这个圆形对整体的识别度也不会有影响，加了这个圆反而会让图形出现视觉疲劳。

2.综合品牌色来进行设计

我们设计的时候可以参照品牌的主色，辅助色就是辅助图形的颜色。主次关系有搞明白。不能让辅助图形占据主导。所以辅助图形的占比一定是比主色要小的。我发现了像爱奇艺的底部图标就是使用了品牌色加辅助色的搭配。使得整体看起来更加富有细节。

3.避免太过一致

对于多图标的时候来说，一定要避免重复使用一种形状和颜色。完全一致的辅助图形会让图标显得呆板、缺乏细节。还是这个案例，他页面就重复使用了圆形。

4.主次分清

另外就是图标和辅助图形是由一个主次关系的，辅助图形不要喧宾夺主。这个案例里的辅助图形就是和图标的占比太多。使得用户一看到的时候一时间分不清哪个是图标哪个是辅助图形。

ps：以上仅仅只是个人结合了网上的一些案例进行的参考，可能有的地方不是很对，也不够全面。也仅是参考之用

原创©本文章为路亚杰原创，未经许可，禁止转载

相关标签

图标教学 UI设计

0条评论

别默默看啦~登录/注册一起参与讨论吧~

热门标签

勤奋鸟小程序网站开发 app 网站开发源码小程序开发二手超市交友加盟洗车自助刷题广场爆料曝光课程购买练字作品教师点评购买课程积分兑换分红积分明细详情页商城手机端网页官网设计前端 js uniapp uni 医院管理医院科室病人信息社区医院婚姻婚庆交友

联系我

695
浏览 44
文章

原创©本文章为路亚杰原创，未经许可，禁止转载

相关标签

图标教学 UI设计

热门文章

uniapp通过uni.setStorageSync()实现前端购物车，纯前端代码 2022-05-28 16:27:18
XD如何切图上传蓝湖 2021-09-16 18:27:22
宝塔搭建多个站点,多个域名解析到一个IP,主域名和无限二级域名, 2021-10-23 17:44:15
培训答题小程序页面设计UI设计 2022-09-27 17:06:42
微信支付‘签名错误，请检查后/稍后再试’如何排查 2022-08-30 09:09:46
uniapp实现video视频禁止拖拽快进功能,禁止拖动进度条快进 2021-11-16 13:58:32
创格科技LOGO设计 2022-08-31 17:48:19
外贸响应式网站 2022-11-11 16:00:36
PS如何切图上传蓝湖 2021-09-16 17:29:49
uniapp 使用md5加密 2022-05-27 16:25:11

优秀作者

源码定制--联系客服更多源码

路亚杰

微信扫一扫立即咨询

分享到-微信

举报

您好，当前积分不足。

前往充值返回

在线客服

拨打电话

17330196230 13230981129

顶部