字体设计知识点汇总

用户头像
上海/交互设计师/5年前/320浏览
字体设计知识点汇总

增加跨越不同设计领域的知识、了解设计、遇到设计问题是激发灵感,并重拾对那些不常使用的设计法则的认识。

  1. 中西文字分类

    西文字体(基本都有版权,无法免费使用):衬线体(字形笔画末端有结构装饰细节)

    无衬线体(专指西文中没有衬线的字体,与汉字字体中的黑体相对应。相比严肃正经的衬线体,无衬线体给人悠闲轻松的感觉)

    常见衬线体有:Centaur(史诗风格,适合年代悠久的感觉,圣马可大教堂指示牌和环王海报上用了此款字体)

    Caslon(英国历史上第一款原创设计字样,适合表现文艺、奢华、高端设计里面的大标题,和阅读书籍类也可用,用于美国独立宣言)

    didot(字体既保留了传统古罗马字体的经典衬线,有拥有现代风格的锋利切角,适合时尚杂志的封面大字和标题文字)

    使用衬线体的APP:Medium(需要外网)、Ployvore、Artsy、2019字体日历、妙读、西窗烛、

    中文字体(代表字体:宋体、仿宋、楷体)

    宋体(结构饱满、端庄典雅、整齐美观,既适用于印刷刻版,又适合人们基本阅读需要。在财经类杂志的刊头运用最频繁)

    楷体(流畅和谐、富有韵味,通常用于正文及说明性文字,在新闻类杂志的刊头字体设计中运用的最频繁。)

    GUI(是图形化界面的总称,包含了字体、图标和一切显示器显示出来的东西)Alto施乐之星为GUI的发展奠定了基础。)

  2. UI字体需要注意:

    可读性:辨识度是需要首要考虑的;其次是低调去个性,应该方便用户完成任务的,而不应为用户添加认知负担;

    第三应该具有一定的灵活度,我们在为各种不同的媒介设计用户体验,无法掌握的是——用户能力、应用场景、所用的浏览器、屏幕大小等;

    第四是宽比例,比例是指一个字符的高和宽的比值,宽度比值越大辨识度越好,小屏阅读体验也越好。

    易读性(行文排版的一切要素都会影响易读性,包括字号最小12pt、字色、字距、行距、行宽、文本灰度、对齐方式和段落调整排布等)

    判断字色的sketch插件,字体颜色对比可行性软件:Contraste。

    行间距(行距又叫行高,指文字块的整体高度。)正文文字:行高数值可以为文字字号的1.5-2.2倍左右;标题文字:1.2倍左右。

    行宽:一行文字的行宽为文字尺寸的整数倍,或者为“文字尺寸+字距”的整数倍。

    第一对齐原则,中文UI排版设计左对齐即可,英文采用左对齐\行首对齐的形式。

    第二层次感,层次影响着行或段落的视觉流,字母间距小于字间距,字间距小于行间距,以此类推。

    第三每行字数,在Material Design移动端英文最适合的单行阅读字符数是40-60字,中文阅读时单行文字数是当字号为14pt时字数是18-28字;字号16pt时字数16-24字;字号18pt时字数14-22字。

  3. 中西文字体差异

    中文:是方块字是固定宽度,同时每个字本身自带隐形文本框,上下对齐,除了字间距没有可调整的空间。

    西文:是比例宽度,每个字母的宽度不同,无对齐关系,句子内了调整空间大,字母间距和单词间距可调。

  4. 中西文排版差异

    中文排版:会从一行排几个字的思考方式出发去计算行宽,先算好展示字数和字号大小,算出整数倍,定下文本框大小,剩下的是余白。最好不要标题结尾。

    西文排版:先定下两边间距、中间宽度,再排文字,不在乎每一行的字数。

  5. 推荐用字

    一、白舟大髭字体(行业里做海报、banner用的最多的一款手写字体)

    二、阿里普惠体(只能直接免费商用不能对字体进行变形修改)

    三、方正清刻本悦宋(优化过的宋体)

    四、汉仪小麦体(多用于插画里面的手写体)

    五、文悦古典明朝体(偏中国风、古朴)

    六、文悦新青年体(当今banner用的多)

    七、造字工房劲黑(常用的黑体、粗体,海报里常用)

    八、方正字库

    九、汉仪字库

    十、华康字型(华康少女字、墨字体、金文体、唐风隶)

    十一、华文字体

    十二、新帝字体(新帝金童体、泡芙体)

    十三、文悦字型(文悦后现代体)

    十四、文鼎(文鼎DC黄阳尖魏、文鼎DC陈森田)

    十五、锐字工房(青春体、李 林哥特、卡布奇诺细、禅粗黑、墨陌写意水墨、磅礴黑简、舒体、行草)

  6. 字体原理

    重心(物理重心和视觉重心)

    表现文艺、女性特点重心高,表现稳重、端庄、力量重心低。

    中宫(指实实在在的笔画结构,字体笔画在重心区域的造型和布局)分为上三宫、下三宫、中宫、左宫、右宫。

  7. 字体应用原则

    亲密性原则:

    一、多个项目之间存在很近的亲密性,他们将成为一个视觉

    二、亲密性的根本目的是实现组织性。

    三、不同层级元素之间的留白应该不同。

    四、彼此无关的元素,一定要拉开距离,避免建立亲密性。

    对齐原则:每个元素都应当与页面上的另一个元素有某种视觉联系。

    一、对齐的目的是使页面统一而且有条理。

    二、同一个页面上,避免使用多种文本对齐方式。

    三、尽量避免居中对齐,除非在比较正式、稳重的情景下。

    重复原则:让视觉要素在整个作品中重复,能够实现整体风格的统一,包括统一颜色方案、字体字号、文本行距、图片风格等。

    一、重复可以使视觉效果保持一致。

    二、重复的目的是统一并增加视觉效果,往往会易于阅读。

    三、避免太多的重复,让人心生厌恶。

    对比原则:对比是为页面增加视觉效果最有效的途径之一。强烈的对比会给人视觉甚至心灵上的冲击,从而形成用户记忆。有利于设计的传播及转化。

    一、对比可以增强页面的可读性,同时有助于组织信息结构。

    二、可以通过字体、颜色、形状、大小、线宽、空间等增加对比。

    三、对比一定要明显、强烈,让他截然不同。

  8. 相关网站推荐

    01、http://bigertech.com/100213/(有关英文知识、英文字体结构的)

    02、http://www.typeisbeautiful.com/(有关中文字体的访谈论坛活动的)

    03、http://www.ziticq.com/字体传奇(有关一些字体包、字体教程、文章)

    04、http://www.qt86.com/艺术字体在线生成器(打一句文案生成合适的字体)

    05、https://fonts.google.com/(谷歌自己的,有些可免费下载)

    06、http://font.knowsky.com/字体下载大宝库

    07、站长之家(可以免费下,几乎涵盖所有字体)

    08、https://www.fonts.com/(英文)

    09、http://www.qiuziti.com/求字网

    10、http://www,zhaozi,cn/找字网

    11、http://www.whatfontis.com/(可以上传图片搜索识别英文字体的)

    12、字由官网(发现字体、字体合集、字体案例、字说字话)

    11、方正官网里面的字加

    12、WhatFont(字体插件)

3
举报
|
5
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
城市园林平面布局航拍
玄关入门地毯印花图案红地毯
水蜜桃和李子的平面水果图案
课程海报,平面素材
学习,优惠券,平面,海报
城阙凡花
牛奶乳液层次平面平铺平面
海底世界插画
牛奶乳液层次梯田平铺平面
空的平台平面和自然景观
中秋节可爱呆萌平面兔子蛋黄月饼贴纸素材
平面风格黄绿色系花朵装饰
平面书法字手写
平面设计 吊牌设计
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
金色颗粒质地的平面
古风平面仕女与瓷器
金色颗粒质地的平面
金色颗粒质地的平面
平面男孩喝咖啡插画设计
城市园林平面布局航拍
金色颗粒质地的平面
平面插画设计女孩喝咖啡
倒计时,海报,平面
金色颗粒质地的平面
你可能喜欢
相关收藏夹
大家都在看
登录注册