初学者必备,UI设计中字体的相关属性!

189 阅读3分钟

  对于一名UI设计师来说,字体是一门基本语言,更是设计师需要掌握的基本技能之一。目前常用的字体有很多种,比如黑体、宋体、楷体等。在平时的项目设计中,为了让页面中的字体更加贴合业务场景,设计师需要对字体的字距字高进行调整。接下来千锋就给大家讲解一下字体的相关属性。

image/20200217/1c07460ce2f4bc7f3daef49abff59e07.jpeg

  1、字体基础结构详解

  一般来说,为了保持字体的完整展示,字体设计师都会给字体预留一定的安全距离,设定合适的升部线及降部线距离,让字体展示的更为平衡。

  在设计输出的时候,如果没有调整line值,是可以直接借助sketch的标注插件sketch measure,来实时导出相应的参数,这样的参数最接近开发效果。如果没有Mac的同学,可以利用PS选中文字,那么选中的深色底就是字体本身的间距。

  2、字体的行高行距参数详解

  在一些文字较多的页面,为了让阅读更为顺畅,我们需要对文字的字高字距进行调整。通过sketch及动效编程软件Origami中的可配置参数时只需要配置好Charater(字间距)、line(行高)、paragraph(行距)三个值即可。

  3、字号大小如何设定

  我们在做设计时,字号的单位需遵循原子理论,也就是使用一个基数作为倍增,如2、4、6、8、10 或者3、6、9、12。但其实我们在做移动端设计时,单位需要遵循偶数原则,因为开发中的单位是以一倍图的基数来进行计算。那么其实在制定字体规范中,使用2为单位会导致字号过多,不易管理,且2号字体的差异化不大。

  所以在字号方面我们使用4作为单位是比较合适的:一是适配后在@2x跟@3x不会出现半像素,二是使用4为单位,能满足字体大小的均衡。

  4、合理配置字体拉开层级关系

  在移动端的界面设计中,除了使用间距网格来拉开不同内容的层级外,对字体样式进行适当的调整也是个很不错的选择。通过调整字重、字色,能让页面的视觉逻辑变为更加的清晰明了、主次分明,降低因视觉给用户带来的干扰,提升页面的可操作性。如何来设定这两块呢?1)尽量减少页面中的不同色相的颜色数量;2)使用不同的字重来区分内容。

  当然,随着用户体验度的变化以及技术的革新,字体运用也会出现新的趋势,比如更大更粗的标题、更明显的字重层级、用字体明度做内容上的信息区分等。

  综上所述,想要成为一个合格的UI设计师绝不是只会使用PS、AI软件就可以,你还要注意各种细节。关注千锋学习更多UI设计相关知识,让你理论与实战兼备,搭建属于你的职场高起点。