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

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

提交需求

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

0/20
0/200

设计大赛

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

提交完成
感谢您对UI中国的支持和信赖!
线性个性图标设计
0.0°
2019-02-27 原创文章 经验/观点 举报 1218 2 9 2

线性个性图标设计

做设计都做了好几年了,居然都没写过教程,实在是惭愧,今天就来给大家聊聊互联网中最基础的图标设计,文中若有不妥或者需要完善的地方,请大佬们多多指教,话不多说,正文如下......


首先我们来认识下什么叫图标

Image title

用红色圈了一些象征性的图标,都是要设计师设计的,那就先来讲讲图标设计的规范,有一套电子档规范,是由苹果公司提供的,大家也都是基于这个基础设计图标,再加上本身产品的属性,不同图标的造型、颜色就将以千姿百态的方式展示在大家面前了。

下面是电子档图标的设计规范,大家可自行下载

链接 https://pan.baidu.com/s/11FPjbwVhS4rm7BUlPc7uMQ    提取码 jigk

文件内容如下

Image title


规范有了,就来分析下现在流行的图标设计风格了,



1、线性图标

  设计参考从现实生活中的实物拟化而来,就拿我们常看见的购物袋,举个简单的例子

Image title

常用的图标尺寸大小以IOS端为例

Image title


线性图标的变形如下......

Image title

2、面性图标

Image title

3、个性图标(加背景色)


(1)背景圆与内部图标比例为 1:0.6,内部的图标也可以定个图标设计尺寸,保证图标视觉统一。如下图

Image title

(2)、线性图标部分加色


第一组是直线,第二组带8像素的圆角,图下做两个示例,大家可以看下,带圆角的图标看起来会更柔和些,

Image title

Image title



面积用色要均匀,否者视觉上会让图标看起来大小不一


还有一个关于可爱图标的文章,感兴趣的可以看下

https://www.ui.cn/detail/355618.html




        还有更多个性图标将持续更新,敬请期待......





更新:2019-02-27

收藏

2人已收藏

茱芭介

个人微信:Carfui916 越努力越幸运!设计交流可加

  • 11

    作品

  • 37

    粉丝

  • 55

    关注

  • 个人作品集
  • 解锁注册logo的设计过程梳理
  • Dribbble个人作品展示
  • 积分商城页面设计
相关标签
设计经验分享ui

    猜你喜欢

      2019-02-27 原创文章 经验/观点 举报 1218 2 9 2

      线性个性图标设计

      0.0°

      你确定要举报线性个性图标设计

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

      0/200

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

      点击上传附件

      对谁可见:

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

      您确认要推荐?

      该作品发布时间:2019年02月22日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      9
      2
      2

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

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

      登录

      手机号

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

      登录
      第三方账号登录