英⽂字体相对中⽂来说,字体包更⼩,所以选择性更⼤⼀些,今天主要推荐⼀些谷歌免费开源字体,谷歌字体真的⾮常棒,搭配好了, 能带来很多不一样视觉效果!
字体的骨架
结构部分
那么在研究数字之前,我们先来了了解下⼏个字体名称:
顶部:字体中最⾼字形的基线上方的最⼤距离
上升:单个字母的基线上⽅方的建议距
下降:单个⼦幕的建议距离低于基线。
底部: 字⺟中最低字形的基线以下的最⼤距离⾏
行距:指代字体连行的基线间的距离 基本我们的英⽂字体都是由这些单位组成的,所以在了解这些基础后,才更更加⽅便我们设计中如何选择字体!
身体部分
前⾯那张图是字体的上下结构关系,那么这张图更多是字体本身由那些元素组成:
躯⼲:也就是数字本身的横竖,⽐较笔直的笔画
字碗:顾明思议,带弧形的笔划
字环:字体被包裹的空间
字距部分
在字距上,业内两种做法,⼀种是每个字体相同的⼤⼩,⽐如我们熟悉的lato,也有⼀一种做法是根据每个字母本身⼀个⼤小,⽐如1会小一些,9会⼤一些,这两种布局⽅式有好有坏,我个⼈更推荐前者,每个字母间距采⽤一样的!
需要注意的点
通常我们很多时候,⽹上去免费找⼀些数字字体,或者选择⼏款热⻔字体时候,一定需要注意检查“$”和“%”“¥”符号,如果不经常上线会经常出一些问题
另外在选择字体时候,⼀一定需要仔细检查每个字符, ⽐比如数字中最容易易混淆的就是1和7,0和O
1.Playfair Display
受很多设计师喜欢的衬线字体,整体搭配出来杂志感,大牌特别强,在很多高品质的产品页⾯,或者H5 页面中有应⽤到
这个字体我最喜欢字体前10,常和一些非创线字体搭配起来,用作大标题或者主题非常优雅和艺术杂志 美感!字体非常优雅和经典
在UI设计中也是⼴受热爱,在⼀些PC⻚面,或者阅读类产品中,配合优美的排版,整体⾮常现代
2.Nunito Sans
英⽂界⾯常⽤的字体,老外设计师⽤的⽐比较多,字形很现代,⼲净,字⺟之间添加⼀些字间距,看起来更加⼲净
Nunito Sans⽆论在平⾯设计中,或者UI设计中都非常干净,现代,有利于阅读,所以老外在做设计时候⾮常喜欢⽤,有个⼩窍⻔,在做英⽂时候,字⺟之间加一个字间距,可以让设计看起来更舒服
3. Montserrat
这种字体很独特,不不像nunito sans那样干净。但每个字母上的⼀个小装饰,使的UI看起来⾮常有吸引⼒。
可以看出Montserrat字体深受⼀些⼤厂喜爱,⽆论是小写组合,还是正⽂文阅读,都很独特
在UI界⾯中也是如此,让整体设计更更加独一⽆二,充满着细节
4.Roboto
⾕歌产品界⾯默认字体,PC和⽆线上默认字体,可⻅在谷歌的重视程度,如果你做一个英⽂页⾯,不知选什么字体,那么选择这个是最安全的
这个字体通⽤性很强,字重也很丰富,无论是粗体还是细体,用在各类产品网站和移动界面中非常简洁优雅
5.Open Sans
Open Sans是一种无衬线字体,移动设计中也是运⽤比较多的一个字体,比较现代和简洁视觉感受
运⽤用在⽹站中很干净,几乎没有多余的笔画正式,字重对⽐强烈!
它配合这其他字体运⽤,都很OK,几乎百搭,在国外很多经典的官⽅网站都有运用到
6.PT Sans
1998年年发布,基于俄罗斯的无衬线字体,一般常⽤于杂志,美食产品
PTSans在美食⻚面中的运用,和⻝物本身也融合很好
PTSans在杂志排版中运⽤也同样很和谐
7.Futura PT
Futura PT是⼀种无衬线字体,也是深受设计师喜欢的一款字体,整体视觉感受现代时尚,我们⼀起来看它是视觉魅⼒
作为⼤标题的运⽤,简单清晰干净
作为设计公司⽹站的运⽤,配上⽹格的布局,⾮常的时尚
宝⻢御⽤字体之一,用在宝马官⽅APP和网站上,可见尊贵感
时尚杂志的官⽹运⽤,⼲净简洁
今天推荐的这些英文字体在界⾯中完全可以⽤到,并且很容易下载,都fonts.google.com⽹站中,下班来说下数字字体。
说到数字字体可能很多⼈都没有在意过,数字在设计中其实占⽐还是很⼤,特别是在⾦金融设计中,数字字体,⼀直是情感的传递,设计细节的体现! 好的设计一定是从中文字体,英⽂字体,数字字体整体考验的,那么今天和⼤家分享下在电商设计 和金融设计中,我们⽤的数字字体有那些!
常用数字字体
那么今天重点来了,那么我们做金融设计或者电商设计,数字字体到底⽤哪⼏个呢?在选择之前,我们先来看看互联⽹公司都在使用那些字体
所以通过以上简单调研,我们不难发现,现在国内外大多数金融产品数字字体都是运⽤用苹果⾃带数字字体,以及Din这个字体基础上调整,那么为什么Din这 个字体这么受设计师喜爱呢
Din故事
DIN 是德国标准协会,Deutsches Institut für Normung 的⾸字母缩写。1975年起,德国政府把DIN 作为国家标准体系,DIN 标准在国际和欧洲范围内被 广泛使用,并代表德国的利益。DIN字体算是⻄⽂字体中的另类。它不仅是一款字体,更属于一个庞大的国家标准体系,代表了了一种把简单的解决办法标准化的思想。
在德国公路指示牌,以及机场,地图⾥⾯,上⼤多数运用Din字体作为引导字体
缺陷:前面我们说了了DIN在公路以及杂志,平面设计中⽤的很多,但是直接拿到互联⽹APP设计中各种复杂的场景,DIN就没有那么的完美,如图中,4的开头较⼤,以及5,6字体的圆形不够一致,7缩⼩后识别度问题,所以很多公司都会基于这些问题进⾏行⼆次设 计,这也是前⾯竞品分析里面提到,为什么微信,京东,百度会这个基础上再设计的原因
如果只推荐⼀个数字字体,我肯定会推荐Din,但是 Din并不不免费,价格不便宜,如果需要运⽤每年⼀笔不小的费⽤,所以如果公司抠⻔门不愿意购买,你可以Din 基础再重新设计⼀版本,也可以使用⼀些其他不不错的 数字字体,接下来给⼤家推荐⼀些免费版权使⽤的!常用数字字体
1.Gaoel
如果都是⽤用Din其实也容易易看腻歪,⾸先推荐的这个我喜欢,整体字体设计很圆润,年轻化,可爱⾮常适合⼀些偏年轻化的产品,同时字重⾮常适合金融产品的字重效果!
在⽀付宝备用金页⾯中,就运⽤了类似这种⽐较圆润有活泼感数字体!⼤家可以尝试下这个字体在界⾯中效果,保证不会失望
2.Montserrat
谷歌免费字体中很优雅的⼀个字体,用在数字上或者界面中都⾮常的优雅,前面英文字体中我们也有介绍。
3.Poppins
⾕歌免费字体中经常被⽤到的一个字体,除了了9稍微显得有点笨拙意外其他都挺现代的
4.Bitter
谷歌旗下的同样广泛运用到各种设计中,数字字体和英⽂字体都很好用!
5.Fjalla One
Din字体的替代品,很多人⼀直在寻找的,如果公司不愿意购买Din字体,那么⾕歌旗下这个字体⾮常完美的替代品,使⽤出来的效果和Din也不会相差很多
6.Graduate
⾕歌旗下免费的,⾮常英伦⻛格和学院⻛的⼀款数字字体,⽤在海报或者⼀些个人化活动⻚⾯效果非常好。
7.Lato
非常现代科技感的⼀款字体,无数知名app在用的字体,同样出⾃谷歌旗下!保证不会出错的⼀款字 体,之前天猫⽤过,效果非常好