相关分类
photoshop教程
Illustrator教程
CorelDraw教程
painter教程
Indesign教程
UI设计教程
sketch教程
设计理论
飞特网 顶部通栏广告

原子设计理论——实践

心蓝发布于:2019-12-3 12:18 |原作者: 罗耀| |来自:站酷
心蓝
上海市 徐汇区 设计爱好者
发私信 + 关注
简介: 上篇文章写的原子设计理论可能过于理论化了,今天通过实际案例展示的方法,来讲述原子设计理论到底有什么用,能做到什么程度,包含什么,能解决哪些工作上的问题等。


5.4 按钮 - 字符限制(中文)

绘制一个按钮时要对按钮中的字符有一定的限制,像两个字、三个字这样固定字数的按钮,可以给它固定打死一个数值。而多于三个字,或者字数不固定的情况下,就要设置好字符与框之间的距离,来时宽度做相对的变化。

5.5 按钮 - 字符限制(英文)

由于英文字体结构与中文不同,中文是由几个汉子组成的一个词,英文则是由不同的英文字母组成的单词。所以限制英文这样的按钮时,要比中文多稍微多加一些宽度,这样按钮就不会显得过于拥挤,相对比较舒服。

5.6 按钮 - 带图标按钮(中/英)

带图标的按钮相对不太好画,如果把图标和文字都进行水平垂直居中,就会从视觉上产生差异,看上去左面留白大,并且整体往右面倾斜。这是因为图标字体的视觉重量比图标的视觉重量大造成的,避免视觉产生差异的方法就是把整体向左移动一些单位,这样的整体看上去就会显得比较的平衡了。

5.7 按钮 - 按钮状态

按钮状态也是分为常规的这几种,分别是禁止、正常、点击和选中等状态。白色由深到浅,黑色由浅到深。

6.1 原子 - 图标

图标我定义了两种类别,分别是线性和圆润,一共加起来差不多600多个,来适应不同的需求,但600个图标风格比较单一,没有太大的变化,比较适合英语于系统/后台中。如果想做成一整套设计语言,就需要设计出不同风格的图标,觉得成本高也可以买一些国外付费图标。

6.2 图标 - 产品图标

产品图标以前也讲过,产品图标是品牌和产品的视觉表现。图标以简单、大胆、友好的方式传达产品的核心理念和意图。虽然每个图标在视觉上是不同的,但是一个品牌的所有产品图标都应该通过概念和执行来统一。

6.3 图标 - 基础图标

基础图标属于整个系统图标里的一个小分支,主要由"基础的图标"组成的。如上下左右箭头、时间、位置、搜索、设置等都属于基础图标,基础图标应用最广也最为常用。在建立图标体系时应先考虑建立基础图标,这样利用帕累托定律就能减少80%的研发成本并带来20%的实际价值。


22

好评
19

差评

刚表态过的朋友 (41 人)

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

心蓝
上海市 徐汇区 设计爱好者
+关注 发私信

最新评论

您需要登录后才可以评论和提交作业 登录 | 立即注册
本周热点文章
2020 新飞特 从心开始
关于飞特| 广告服务| 付款方式| 版权申明| 网站地图| 联系我们| 加入我们| 举报| 帮助中心| 移动版| 手机版| 飞特网

委托设计