2018-04-14字体

UI设计中字体的应用|UI|观点|Luyeelin - 原创文章 - 站酷 (ZCOOL)

一、两种设备中的字体

安卓 。

英文字体:Roboto   中文 Noto(思源黑体)

Roboto有6种字重:Thin、Light、Regular、Medium、Bold 和 Black

Google联合Adobe发布了「思源黑体」作为Android的默认中文字体,新的「思源黑体」不仅仅在字形上更易于在屏幕的阅读,并且拥有7个字重

Noto有7种字重:Thin, Light、DemiLight、Regular、Medium、Bold 和 Black(图片来源于谷歌官网) 

iOS

英文:San Francisco

中文:平方

二、文字的大小规范

在Android开发中,字体使用的单位是sp;iOS开发中,字体使用的单位是pt。(详细了解sp与pt的请查看http://www.uisdc.com/designers-guide-to-dpi

一款app中,你想要整体界面统一,就必须统一字体,设定字体使用规范

同时使用过多的字体尺寸和样式可以很轻易的毁掉布局。字体排版的缩放是包含了有限个字体尺寸的集合,并且他们能够良好的适应布局结构。最基本的样式集合就是基于 12、14、16、20 和 34 号的字体排版缩放。

这些尺寸和样式在经典应用场合中让内容密度和阅读舒适度取得平衡。字体尺寸是通过 SP(可缩放像素数,scaleable pixels)指定的,让大尺寸字体获得更好接受度。


iOS的系统字体是San Francisco。该字体有两个变种:SF UI Text (用于19pt及以下大小的文本)和SF UI Display(用于20pt及以上大小的文本)。当你在标签和其它界面元素应用了系统字体时,iOS系统会根据字号自动选择最合适的字体样式。它还会根据需要自动改变字体,以满足辅助性功能的设置。(动态规范字体请去官网查看https://developer.apple.com/ios/human-interface-guidelines/visual-design/typography/

在iOS中,通常使用的字体大小就这么几个:11pt、13pt、15pt、17pt、20pt。具体怎么使用并没有限定死,但是最小的字不要小于11pt。现在的app文字都趋向于大字体,用户的时间是越来越难获取,怎样在有效的时间内博得用户眼球,大文字标题也逐渐使用在app中了。


三、文字的颜色规范

区分文字的色彩层级:

方法一:根据透明度来区分文字的色彩层级。最深的颜色为Black 87%,切记不要使用纯黑色,纯黑在设计中用的非常少。

方法二:iOS中,主要文字颜色为#333333,次要文字颜色为#666666,辅助文字颜色为#999999,提示性文字或不可用文字颜色为#CCCCCC。


四、如何让你的app中的文字更有层级

主流的层级方式我总结如下:大小、色彩、加粗

1 大小:

Android中,通常使用的文字大小为12sp(多用于提示,或者较弱的层级展示)、14sp(用于展示型文字,或者辅助型文字)、16sp(用于展示型文字,或者小标题)、18sp(多用于导航文字或者标题)

颜色

3 加粗

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 14,190评论 4 61
  • 用到的组件 1、通过CocoaPods安装 2、第三方类库安装 3、第三方服务 友盟社会化分享组件 友盟用户反馈 ...
    SunnyLeong阅读 14,942评论 1 180
  • 1.大雅晨读打卡 89年以后,对我个人来说,是一种损害。激情、幻觉早就没有了。也就是说,89年后,诗歌应该在更本真...
    五月灵阅读 10,923评论 0 4
  • 1. JSON数据(NSData) -> OC对象(Foundation Object) {} -> NSDict...
    阿拉斯加的狗阅读 3,887评论 0 6
  • “什么?这儿很吵,听不清。同学聚会?这周末?这个,我恐怕脱不开身啊。我们以前同宿舍都去了?甄香也去了?我们已经再没...
    燃烧的蛀牙阅读 3,287评论 0 5