020-29815005
预约专线时间:09:00-23:59

【UI设计培训】:初学者必懂的UI设计中字体使用指南

新闻来源:本站 日期:2022-03-07
每种字体都有自己的风格和风格,选择合适的字体不是一个草率的决定。字体作为基本语言,是设计师需要掌握的基本技能之一。这篇文章里面的案例花了作者大量时间进行绘制&收集,初学者必懂的UI设计中字体使用指南,希望能对各位读者有所帮助。

  每种字体都有自己的风格和风格,选择合适的字体不是一个草率的决定。字体作为基本语言,是设计师需要掌握的基本技能之一。这篇文章里面的案例花了作者大量时间进行绘制&收集,初学者必懂的UI设计中字体使用指南,希望能对各位读者有所帮助。


【UI设计培训】:初学者必懂的UI设计中字体使用指南


  一、汉字使用的前世今生


  在人类发展历史过程中,文字作为信息传播的载体,有着承上启下的重要意义。而汉字,是世界上使用时间最久、空间最广、人数最多的文字。从距今大约六千年前,就开始诞生了具有整齐规范、初步具有文字特征的图形符号。

  而到了后期,汉字分别经历了篆体、隶书、楷书等多元化的发展,百花齐放。而自从雕版印刷术的盛行之后,刻字用的雕刻刀所雕出来的字体因为横细竖粗,醒目易读,得到了广泛的运用,由于活字印刷的时候首尾会有墨残留,所以故意会留一部分装饰来溢墨。

  而到了后期,这个装饰也得以保留下来,对这个字体进行优化过后,就是至今我们仍在广泛使用的宋体。在当今,特别是在Windows系统中,宋体仍占有很大的一席之地。

  后来人们又通过模仿宋体字体结构,对字体进行了调整,改成了笔画粗细一致,纤细狭长的印刷字体,也就是今天我们称之为“仿宋体”的字体。

  与此同时,“黑体”诞生了,因为字体醒目大方,粗细一致,结构醒目严密,字形端正,容易阅读,所以也就是我们今天,在界面设计中,所用到的最多的字体。现代汉字的黑体是在现代印刷术传入东方后依据西文无衬线体中的黑体所创造的,所以按照西文的说法,也可以把黑体称作为无衬线体,把宋体叫做为有衬线体。

  到了现代,随着互联网的兴起,LED屏幕中的字体也得到了较大的发展。

  在早期时代中,显示屏效果较差,分辨率低,屏幕颜色较少,而汉字笔画较多,黑体小字体的清晰度较差,所以一般主要用于文章重要标题。而宋体在为了匹配低分辨率下的像素栅格,对字体进行了调整,调整后的字体能在低分辨率下的小点阵中得以良好的显示,辨识度较高,在开启了ClearType之后,字体的被识别性能得到良好的保证,所以在互联网初期阶段中,有衬线体在互联网中一直处于霸主地位。

  直到后面屏幕显示效果的进步,黑体才慢慢得以盛行,在屏幕分辨率较高的情况下,黑体已经能得到较好的识别效果,因此已经不需要原衬线体的功能,衬线体反而由于装饰性元素过多,阅读起来容易造成视觉疲劳。因此在屏幕密度较高的移动端载体中,无衬线黑体成功替代有衬线体成为霸主地位。

  修改后的黑体中宫更为开放,布白更为匀称,显示效果更为舒适,醒目利于阅读,更利于视觉信息的传达,从而在屏幕中起着主导地位。几大互联网巨头微软雅黑及苹果在此之后分别花重金打造了微软雅黑及苹方,用于自身的OS系统中。所以通过分析,可以看来,在将来界面设计中,字体样式还是会以无衬线体为主,甚至可能会更进一步简化字体的形状。

  二、Android与iOS系统字体详解

  1.Android默认字体-思源黑体/Robot

  在Android设备中,Android始祖Google为了更好的追求视觉效果,提高用户体验,所以联合了Adobe设计发布了思源黑体(Noto)来作为中文字体。

  该字体字形较为平稳,利于阅读,且有个7个不同的字重,充分满足了不同场景下的设计需求,7个字重分别为:Thin、Light、DemiLight、Regular、Medium、Bold和Black。而英文,则使用Robot来作为基础字体,只有6个字重:分别为Thin、Light、Regular、Medium、Bold和Black,视觉语言与思源黑体Noto保持一致。

  另外在Google的Material Design手册中,官方还给出了标准的字号大小。在安卓的字体单位中,不再以px,pt作为单位而是统一的使用了sp,换算方式:

  px=sp*ppi/160,sp=px/(ppi/160)

  按照iPhone7的尺寸1334×750.密度326ppi来换算,那么Android的1dp=1*326/160≈2px

  2.iOS默认字体-苹方/San Francisco

  在iOS系统中,中文方面苹果则加入了全新的苹方字体,字形纤细中宫饱满,利于阅读,并且还提供6个字重供设计开发者使用。所以后面的设计趋势中,字重的使用变的开始多元化了起来,使用Semibold中粗体、大字号作为界面的标题变的更为流行起来,较为明显的有iOS 11中的一些原生界面及一些知名APP。

  而在英文方面,则使用了San Francisco的字体,除了在iOS和Mac OS上,还单独为Watch OS单独对字体进行了调整,命名为San Francisco Compact。而每套字体下面又分为Text与Display两种属性,Text只有6个字重,而Display则有9个字重。

  3.总结&结论

  通过对比,我们可以发现:其实Android与iOS字体字形方面差异化明显不大,不用特意下载所有字体进行单独配置。那么在平常工作中,我们只需要按照一套标准的iOS设计稿输出即可,在Android方面进行自动延展,最后走查确认一下效果即可。

  如果涉及到使用除Regular标准体之外的字体,那么除了颜色,还应当标注相应的字重字高等信息(如Font:Pingfang SC-Semibold,line:52px),而不应当只标注一个加粗或者加细。当然如果人力允许的情况下,我们也可以单独为Android做一套界面及字体适配,提高Android端的视觉显示效果。

  以上就是优漫教育小编为大家介绍的“【UI设计培训】:初学者必懂的UI设计中字体使用指南”相关内容,学习ui设计培训,可以参考优漫教育提供的ui学习路线,该学习路线内容包含ps软件入门、AI与品牌设计、视觉表达技法、web视觉设计、图标设计、产品交互、移动端设计等,根据优漫提供的ui学习路线图,可以让你对学好ui需要掌握的知识有个清晰的了解 !