▍1.结构部分
分享前我们先要了解下字体结构:
顶部:字体中最高字形的基线上方的最大距离
上升:单个字母的基线上方的建议距
下降:单个字母的建议距离低于基线
底部 : 字母中最低字形的基线以下的最大距离
行距:指代字体连行的基线间的距离
基本的英文字体都是由这些单位组成的,所以在了解这些基础后,才更加方便我们设计中如何选择字体。
▍2.身体部分
前面那张图是字体的上下结构关系,那么这张图更多是字体本身由那些元素组成:
躯干:也就是数字本身的横竖,比较笔直的笔画
字碗:顾名思议,带弧形的笔划
字环:字体被包裹的空间
▍3.字距部分
在字距上,业内两种做法,一种是每个字体相同的大小,比如我们熟悉的lato,也有一种做法是根据每个字母本身一个大小,比如1会小一些,9会大一些,这两种布局方式有好有坏,我个人更推荐前者,每个字母间距采用一样的!
另外在选择字体时候,一定需要仔细检查每个字符,比如数字中最容易混淆的就是1和7,0和O。
招商银行:DIN字体
京东金融:DIN的字体,重新进行了设计
百度金融:DIN字体基础上调整6.9
支付宝:苹果原生Helvetica Neue
除了我们经常用的Din这个字体,还有其他一些不错的数字字体,都给大家打包好了,字体仅做参考和学习,需要的话可以添加叮当猫回复“数字”领取,已有叮当猫的无需重复添加。
05. 常用数字字体
▍1.Gaoel
在支付宝备用金页面中,就运用了类似这种比较圆润有活泼感数字字体!大家可以尝试下这个字体在你界面中效果,保证不会失望。
▍2.Montserrat
谷歌免费字体中很优雅的一个字体,用在数字上或者界面中都非常的优雅。
▍3.Poppins
▍4.Bitter
▍5.Fjalla One
Din字体的替代品,很多人一直在寻找的,如果公司不愿意购买Din字体,那么谷歌旗下这个字体非常完美的替代品,使用出来的效果和Din也不会相差很多。
▍6.Graduate
谷歌旗下免费的,非常英伦风格和学院风的一款数字字体,用在海报或者一些个人化活动页面效果非常好,当然作为英文排版也是很高级。
▍7.Futura
这个字体无论英文还是数字都非常现代化,非常干净利索的一款字体,做到PPT里面效果非常好。
▍8.Proxima Nova
这款不免费,当然收费也非常对得起他这个价格,效果大家可以自己看,非常优雅,现代。
▍9.Gotham
非常适合发布会,极简的网站设计,或者海报,非常现代干净的一款字体,效果如图,dribbble上各种好看的设计里面都跑不了这款字体。
▍10.Lato
Playfair Display
如果只让我推荐一款衬线英文字体,那么必须非 Playfair Display莫属,心头大爱的字体,集古典、现代优雅于一体,不知道多少大牌一直用这个字体做设计。
如果你一直在寻找一款衬线英文字体,那么这个必须首先,效果直接看图!
关于界面中字体系列就到这里,基本这些字体覆盖我们常用的中英文,掌握这两个就够了。
07. 最后
今天文章中介绍的数字字体,包括我们常见的Din这个字体,都给大家打包好了,字体仅做参考和学习,需要的话可以点个“在看”,添加叮当猫回复“数字”领取,已有叮当猫的无需重复添加。
设计干货
爱滑雪的设计师 | 从小公司到BAT | 站酷推荐设计师 | 有准备的人 | 弃教从设 | 26岁从0开始 | 理工科设计师 | 书法设计师 | 斜杠青年 | 兼职电台主播
最美交互
B站高德 | 企业微信菜鸟 | 腾讯视频菜鸟 | 淘宝QQ | 哔哩哔哩盒马 | 微信小米输入法 | bilibili大众点评 | 网易云音乐微信
文章为用户上传,仅供非商业浏览。发布者:Lomu,转转请注明出处: https://www.daogebangong.com/fr/articles/detail/After%20more%20than%20100%20revisions%20the%20fonts%20used%20by%20WeChat%20and%20Alipay.html
评论列表(196条)
测试