二、界面中文字使用的规则

在不同平台的界面设计中规范的字体会有不同,像移动界面的设计就会有固定的字体样式。网页中会有常用的几个字体,在这我和大家分别介绍一下。

以下是在72像素/英寸下的规范

移动端常规字体

IOS:常选择华文黑体或者冬青黑体,尤其是冬青黑体效果最好。

Android:

英文字体:Roboto

中文字体:Noto

移动端常用的的字号有哪些呢?

导航主标题字号:40-42px

一般设计就用40px,偏小的40px字号,显得精致些。

在内文展示中字号大小又是多大呢?

大的正文字号32px,副文是26px,小字20px。在内文的使用中,根据不同类型的App会有所区别。

像新闻类的APP或文字阅读类的APP更注重文本的阅读便捷性,正文字号36px,会选择性的加粗。

而列表形式、工具化的APP普遍是正文32px,不加粗。副文案26px,小字20px

26px的字号还会用于划分类别的提示文案,因为这样的文字希望用户阅读,但不要抢过主列表信息的引导。

大家注意了,在选用字体大小的时候一定要选择偶数的字号,因为在开发界面的时候,字号大小换算是要除以二的。这个详细缘由大家可以网上查询,就不在这一一的介绍了。

常用字号的大小基本就这几个,根据版式设计也会采用异样大小字号来特殊处理。这种更高的要求设计师的全局把控能力了。

网页端

常用的字号有哪些呢?

网页中文字字号一般都是宋体12px或14px(无状态),大号字体用微软雅黑或黑体。大号字体是18px、20px、26px、30px,一般使用双数字号,单数的字体在显示的时候会有毛边。

常用的字体:

1. 平平稳稳:微软雅黑/方正中黑

微软雅黑系列:在网页设计中这款字体使用的非常平凡,这款只无论是放大还是缩小,形体都非常的规整舒服。在设计过程中建议多使用雅黑,大标题用加粗字体,正文用常规字体。

方正正中黑系列

中黑系列的字体笔画比较锐利而浑厚,一般运用在标题文字中。但这种字体不适用于正文中,因为边缘相对比较的复杂,文字一多会影响用户的阅读。

2. 与时俱进:方正兰亭系列

方正兰亭系列:个人最推荐的就是这个系类的字体,整个兰亭系列的字体有大黑、准黑、纤黑、超细黑等。因笔画清晰简洁,这个系类的字体就足以满足排版设计的需要。可以通过对这个系列的不同字体进行组合,不仅能保证字体的统一感,还能很好的区分出文本的层次。

3. 刚劲有力,运动型:汉仪菱心简/造字工房力黑/造字工房劲黑

在这几个字体中,他们有着共同的特点,字体非常的有力而厚实。基本都是以直线和斜线为主。适合广告和专题使用。在使用这类字体的时候我们可以使用字体倾斜的样式,让文字显得更为活力。在这三种字体中,菱心和造字工房力黑在笔画、拐角的地方采用了圆和圆角。而且笔画也比较的疏松,更多的有些时尚而柔美的气氛。而劲黑这款字体相对更为厚重和方正。这类字体使用在大图中偏多,效果比较突出。

毛笔字生成器

通过自由的书法网站在线生成。在网址中输入文本,再进行选择书法字体样式。通过这种方法我们能很快的找到需要的书法字体。这招非常管用。

推荐大家几个毛笔字相关的网站:

http://www.51poca.com

http://www.epinv.com/online

http://www.akuziti.com/mb

http://www.ziticq.com/shufa

三、常用字体颜色

字体颜色又有哪些常用的颜色呢?

在界面中的文字分为三个层级,主文、副文、提示文案等。

在白色的背景下,字体的颜色层次其实就是黑、深灰、灰色。

常用的色值是#333333;#666666;#999999

在界面中还经常会用到背景色#eeeeee。

分割线则采用#e5e5e5或#cccccc的颜色值,一个深一些,一个浅一些。这个会更具不同的软件风格采用不同的深浅,由设计自己把控。

在我们做设计的时候,字体和图库均是有版权的,请注意合法使用。

设计的时候我们还可以将字体进行变形来达到宣传的目的,这个需要设计师对字体设计有一定的了解。

android界面设计中用的字体,APP界面设计必备!最全UI设计字体规范相关推荐

  1. 有了这些字体,才是高逼格的UI设计!

    于UI设计师而言,在日常的设计中,给字体增加特效,一直都是一件恼人的事情.客户提出的浮雕特效或者大阴影的需求,但是直接按照要求来设计可能会毁掉整个设计. 更多时候,UI设计师需要的是一些相对优雅但是又 ...

  2. UI设计和平面设计学哪个好?平面设计转行做UI设计容易吗?

    本文由:"学设计上兔课网"原创,图片素材来自网络,仅供学习分享 UI设计和平面设计学哪个好?平面设计转行做UI设计容易吗?早期的UI设计和网页设计一样,都是平面设计的基础上衍生出来 ...

  3. UI设计素材模板|游戏APP界面

    作为设计师,不能只是欣赏手机APP UI设计灵感.web网易设计灵感,一些视觉体验极佳的游戏APP也是不错的. 游戏类UI 设计主要针对游戏的图标.登录界面.游戏界面.局内道具等方面进行设计.游戏分为 ...

  4. UI设计干货素材|聊天APP界面,临摹学习进步快

    在日常工作和生活中,大家见到过最多的界面应该就是聊天界面了.说到聊天界面,内心浮现出的一定是你一言我一语的气泡来往,有没有其他的设计方式呢?或者,要注意什么呢? 免费聊天应用程序模板 Mensaje ...

  5. html优美界面左侧下拉,一组时尚的侧边栏菜单和下拉列表UI设计

    这是一款非常时尚的可伸展的侧边栏菜单和select下拉列表以及手风琴式垂直下拉列表UI设计效果.它们通过简单的CSS样式设置,以及和jQuery,jqueryUI的配合,制作出非常时尚的web组件UI ...

  6. 计算机应用专业UI设计方向,长沙经贸职业中专学校计算机应用技术(UI设计方向)简介...

    原标题:长沙经贸职业中专学校计算机应用技术(UI设计方向)简介 UI设计方向 培养目标: 熟练掌握视觉形象设计,交互设计等知识与技能, 具有较强的审美能力,用户体验设计能力和界面创意设计能力, 适应软 ...

  7. Sketch 54 Shark 鲨鱼中文汉化特别版 Mac 设计师必备的原型UI设计工具

    这是一款Mac平台的矢量绘图工具,是一款为设计师量身定做的优美界面和强大工具兼有的专业绘图工具.能够满足网页.用户界面.图标等的设计需求. Sketch是一款为设计师量身定做的优美界面和强大工具兼有的 ...

  8. Sketch 55 Shark 鲨鱼中文汉化特别版 Mac 设计师必备的原型UI设计工具

    这是一款Mac平台的矢量绘图工具,是一款为设计师量身定做的优美界面和强大工具兼有的专业绘图工具.能够满足网页.用户界面.图标等的设计需求. Sketch是一款为设计师量身定做的优美界面和强大工具兼有的 ...

  9. ui设计和python哪个容易学_软件开发和ui设计那个容易学?

    感谢邀请,以下是我的一些亲身经历,想和大家分享. 真心的!建议哪怕是念完一个普通高中,也比现在直接去学那些职业技能要好,学历高一点,你面对的选择.能做的选择也会更多一些,能够拓宽你未来的职业路. 初中 ...

  10. 优秀分层UI设计模板解析提升网站用户体验,5个UI设计技巧轻松搞定

    UI设计时刻影响用户体验.在构成 UI 的所有因素中,比如浏览网站.阅读内容的难易程度,都会导致用户对网站产生或好或坏的主观感受,而这种感觉影响用户决定是否按照设计师的期望进行接下来的操作并达成销售. ...

最新文章

  1. mysql 查询 插入
  2. Jackson 注解 -- 自定义输出格式
  3. PHP中少用但是很好用的方法
  4. 利用CSIDL打开特殊文件夹
  5. 通讯模块板载天线设计方法
  6. Peoplesoft取Translate Value标签值的方法
  7. 当碰到非ARC写的文件时在ARC环境下运行报错时解决办法
  8. Mac安装双系统后在Windows下体验mac原生触控功能(双指、三指、四指)
  9. SuiteCRM搭建安装(apache+msyql+php)
  10. C语言读取wav文件中特定内容6,c读取wav文件,头文件后面的所有数据
  11. Showwindow及参数介绍
  12. 解决报错: ‘v-slot‘ directive must be owned by a custom element, but ‘div‘ is not
  13. NTL密码算法开源库-大整数ZZ类(一)
  14. 虚幻4学习日志2021.4.1 关于瞬移(相机拉近)以及二段跳
  15. 每个程序员都应该了解的 CPU 高速缓存
  16. 智能硬件行业产品经理
  17. 蓝汛CEO推动CHN-IX发展,为互联网行业增效减负
  18. 关于nextline自动跳过问题
  19. windows彻底卸载python的方法
  20. Vue.js实战之系统学习第七节

热门文章

  1. java+控制台-学生选课管理系统
  2. c语言答案网站,c语言习题及答案
  3. Ubuntu系统安装JDK教程
  4. mock gps android,MockGPS: Android application to fake GPS
  5. VsCode开发Java插件集合
  6. python运维之路
  7. 区块链技术指南 序章理解感悟
  8. 【C语言】c语言练习题【4】(适合初学者)
  9. SQL解析处理和扩展开发工具 Java
  10. 【MFC开发(7)】编辑框控件Edit Control