前言

专注于做好一件小事,哪怕是做不好也用心去做,小到搭建一个精美的网格系统,做好一个字体的拐角,让设计因细节而美好…

先看一下我的往期设计案例:

如何从无到有设计一款字体

对于很多刚接触字体设计的同学经常会遇到一种情况那就是想法高大上,结果很悲伤,为什么会造成这样的结果?归根结底是对字体设计本身了解还不够细致就照葫芦画瓢直接上,为了避免这种尴尬的结果,我们应该在开始着手做字体之前要做好各项准备工作,不断去浏览优秀的字体设计从中寻找设计的感觉,确定感觉后建立网格系统,开始逐步设计字体。我在做字体设计的时候会把握几个步骤“建网格”——“选字体”——“拆字体”——“绘笔画”——“绑骨架”——“粗与细”——“取与舍”——“磨细节”——“去感受”。

下面我们就以大家最常见的矩阵字体为例来给大家分享如何制作字体。

1、建网格:建立网格系统,万丈高楼平地起,要做一款扎实的字体离不开网格系统的规范。

2、拆字体:以“燃”为例——选取一个默认字体,按照字体结构对笔画进行拆分。

3、绘笔画:将拆分出的笔画用横线和竖线在网格系统里进行笔画重绘,此时不要做细节,撇 捺和点根据自身走向和结构特点也归属为横竖线。

4、 绑骨架:拆分绘制的字体笔画就是字体的骨骼,笔画间的连接处可以理解成是人体的关节,关节的意义在于保证字体稳固的同时又有灵活多变行,字体的笔画可以根据视觉需要围绕关节在一定范围内做活动,也可调整长短比例。

5、 粗与细:笔画的粗细与硬度由你想要的字体气质来决定,细笔画与曲笔画柔美气质,粗笔画与直笔画沉稳大气,虽说设计是一种感觉,但是这种感觉对于初学者来说很难把控,所以跟大家共享一下常用的几种笔画的粗细,在1000PX*1000PX画板里采用6px,10px和20px为基础笔画粗细,根据想要的业务气质选取即可;

6、 解与构:常见的字体结构有“上下结构”“上中下结构”“左右结构”“左中右结构”“半包围结构”和“全包围结构”。其中“上下结构”中着重强调占比较小的那部分笔画,进而达到字体本身的平衡,例如“感”字着重设计心字;“上中下结构”中一般会在不影响识别性的前提下去掉中间部分横行笔画,进而达到字体本身的平衡,例如“享”字着重设计口字;左中右结构中在不影响识别性的前提下会简化左边部分笔画,进而达到字体本身的平衡,例如“燃”字着重设计火字;

7、取与舍:笔画变粗后整个字体笔画间的空间比例会受到一定影响,因此为了字体的美观度和透气性我们会对字体结构进行一些取舍和整合

8、 磨细节:为了让字体看起来更加舒适,我们将字体的拐角做圆,做圆角的同时也要根据网格系统来调整圆的度数。

9、去感受:打磨整体字体,继续刻画细节

注意:

在一组字里,每个单字的结构都存在差异,适当调整字体内部的比例,形成感官上舒适的笔势,对保持视觉上大小一致很重要。汉字字体类型繁多,但是如果我们用几何法则来划分字体类型其实大致可以归纳为四种:方形,圆形和三角形,从面积上来来方形和圆形的面积最大,三角形次之,所以我们为了保持字重大小的一致性需要调整他们之间的大小比例,做到大小均匀,笔画一致,结构严谨和间隙适中。

为了拉出字体的气质,一般会把字体做的稍微偏瘦长一些

字体设计的手段是多种多样的,每个设计师都有自己擅长的切入点,最后的结果是自己想要的好,上述的分享希望能给字体设计初学者一点帮助,也欢迎各位同行大神交流切磋。

​编辑:千锋UI设计

作者:阿里巴巴国际UED创意中心

UI中国主页:http://i.ui.cn/ucenter/1234247.html

如何从无到有设计一款字体相关推荐

  1. 磨金石教育分享:43款字体设计工具大集合,超赞!

    磨金石教育分享43款字体设计工具大集合,涵盖 iOS.Android 还有 Web 的字体设计应用.那么,到底有哪些呢?待我们一一道来: 01. PicLab 利用照片编辑器,快速给照片添加流行的字体 ...

  2. 实例:如何设计一款好的Metro UI应用

    据说 Windows Phone 标志性 Metro UI 的灵感最初来源于伦敦地铁指示图的设计,而这也是 "Metro" 这个名称的来历.从其对明亮色彩的广泛应用.以简单方块形式 ...

  3. eui自带字体是什么_阿里巴巴居然出品了两款字体,免费可商用,网友:太良心了...

    前段时间,有读者向我吐槽:PPT自带的字体资源包太少了,而且大多没有什么特色. 确实,在PPT页面中,字体用好了也是加分项. 比如: 上面这几张图片,页面强大的感染力,有一半都归功于字体. 所以,今天 ...

  4. ps字体识别_PS字体包免费送:艺术+时尚+炫酷+复古等5000多款字体,由你来选择

    对设计师而言,一款优美的字体板式设计可以为平面设计增添不少光彩,充满创造力的字体设计更是能为设计师带来源源不断的设计灵感:字体设计在平面设计中占据着重要的地位,对于一般人而言,美轮美奂的字体设计绝对能 ...

  5. mac word维吾尔文字体_字加软件更新啦!万款字体一键激活!

    [字加]客户端软件更新啦! 目前MAC版本和WIN版本[字加]都已更新.Mac OS客户端V0.9.9.13,Windows客户端V0.9.9.4. [字加]客户端软件是为设计师量身定做的一款字体获取 ...

  6. iOS设计 - 一款APP从设计稿到切图过程概述

    这篇文章站在GUI设计师的角度概述了APP从项目启动到切片输出的过程,相当于工作流程的介绍.这里写的不是一种规范,只是一种工作方法,加上技术的更新是非常快的,大家在具体工作中,一定要灵活运用. 这里我 ...

  7. 进阶学习,如何无代码设计一款美观且实用的网站?

    作为一门新兴的边缘性职业,网站设计既要从外观上创意,又要适当结合图形.版面及交互设计等相关原理,使得它成为一门独特且令人神往的艺术.毫无疑问,好的设计能让网站在诸多站点中脱颖而出,优秀的创意和表现方式 ...

  8. 设计一款给爸爸妈妈用的手机

    设计一款给爸爸妈妈用的手机 手机简图如下: 手机外观设计: 1.开关键,我们把开关键设在手机的右上方. 2.home键,在手机下方的正中间设置home键.考虑到父母的年龄层,对新事物的接受能力不强,更 ...

  9. android ui设计最新字体,ui用什么字体_安卓ui设计用什么字体

    1 ui用什么字体 UI中字体使用的关键因素. 1.可读性. ui用什么字体_安卓ui设计用什么字体,可读性是UI中字体所需考虑的首要因素.字母字形必须清晰可辨,作为UI元素,其中不同的字母必须可以被 ...

最新文章

  1. 云安全与我们未来的网络息息相关……
  2. 多源迁移学习相关研究回顾
  3. 动态路由选择协议(二)距离矢量路由选择协议
  4. 机器学习及大数据经典算法笔记汇总
  5. 4种不同类别的机器学习概述
  6. Layui父级页面调用子级页面方法
  7. java 枚举 大小_Java枚举入门
  8. 标准模板库 STL 使用之 —— vector 使用 tricks
  9. 清空oracle的注册表,Oracle中清除注册表
  10. Python官方中文文档网址和Python标准库官方中文文档网址
  11. linux 触屏校准命令,tslib-触摸屏校准
  12. 如何使用PS修改图片中的数字
  13. 安装telnet服务
  14. C语言的数据表现形式及其运算
  15. 生死看淡,不服就GAN
  16. React 运行流程
  17. tp5.1 EasyTask Windows本地测试和centos系统服务器安装
  18. java从入门到精通----OOP 2
  19. 微信小程序精品demo:面包旅行:界面设计,文本展示,
  20. 多测师肖sir_高级金牌讲师_app测试之环境安装(001)

热门文章

  1. 探讨Vue 数据监测原理-第四节-Vue.Set() API 介绍应用
  2. LINUX提权入门手册
  3. InstructPix2Pix: 随口修图
  4. Spatial-Temporal Transformer Networks for Traffic Flow Forecasting
  5. brew install 和 brew cask install 的区别
  6. 什么是继承extends?
  7. 叙事、画面和音效:解析VR游戏设计要点
  8. python学习笔记(BMR计算器)
  9. Unity 调用摄像头拍照保存
  10. php字典遍历,OC中的遍历数组和字典