最新消息:

字体设计阐述(设计作品简介怎么写)

媒体模版 admin 浏览 评论

1、介绍设计方案想突出一个什么主题(当然要具体到某一个方面)——设计的关键词、意义是什么。

2、写这一方面的一些背景资料,或者是设计的现状或者发展方向——现状、应对办法、进展情况(围绕所给的素材进行表述)。 

3、写怎样表现主题的,画面主体部分的设计源泉在哪里,或者最先想用什么来表现这个主题(一般写一些具体事物或主题词)——从最开始想到的、原型、意象入手,在创作中又做了怎样的处理与拓展,如实表述。 

4、写在设计创作上用什么样的手法(比如抽象化、拟人化等等)进行了深化,再到具体细节上(比如构图、形状、动作、色调、字体)把要表达的一些寓意什么的一一说明,也就是让评委感到作品不是随便做的,尽量让评委明白在设计中你们做出了最佳的选择。

5、如果时间充裕,可以写写用了什么样的配景,当然写最精彩的部分,比如用了一个什么样手法抠图,或者是怎么手绘某个图案的。

6、最后做个归纳,说说你的这个设计可以让观众有什么体验,使他们能够得到或感受到什么(比如亲和力、感染力、活力动感什么的),用在这个场合会有什么效果,等等。 

扩展资料;

作品简介示例:

《诗经》,是中国古代诗歌开端,最早的一部诗歌总集。

收集了西周初年至春秋中叶(前11世纪至前6世纪)的诗歌,共311篇,其中6篇为笙诗,即只有标题,没有内容,称为笙诗六篇(南陔、白华、华黍、由康、崇伍、由仪)。西汉时被尊为儒家经典,始称《诗经》,并沿用至今。

诗经在内容上分为《风》、《雅》、《颂》三个部分。《风》是周代各地的歌谣;《雅》是周人的正声雅乐,又分《小雅》和《大雅》;《颂》是周王庭和贵族宗庙祭祀的乐歌,又分为《周颂》、《鲁颂》和《商颂》。反映了周初至周晚期约五百年间的社会面貌。

《诗经》内容丰富,反映了劳动与爱情、战争与徭役、压迫与反抗、风俗与婚姻、祭祖与宴会,甚至天象、地貌、动物、植物等方方面面,是周代社会生活的一面镜子。

手抄报的设计与制作手抄报是中学生开展课外活动的形式之一。学生直接参与编辑、撰写、制作等的全过程,深受学生的喜爱。每当重大的节日我们都会以各种各样的形式来表达,或祝愿或庆祝或歌功,比如迎元旦、迎“五四”、庆“七一”、庆国庆等。最近由中央教科所教育信息研究中心和中国教育情报研究会共同举办的“2003年首届全国中小学生手抄报大赛”,许多学生积极参与,取得了一定的成绩。在这里,我与大家谈谈怎样进行手抄报的设计与制作,大体上可以从这三个方面来阐述:一、美化与设计的步骤;二、报头、插图与尾花的表现;

三、编辑抄写描绘制作过程。一、美化与设计手抄报的美化与设计涉及的范围主要有:版面设计与报头、题花、插图、尾花和花边设计等。 1、版面设计版面设计是出好手抄报的重要环节。要设计好版面,须注意以下几点:(1)明确本期手抄报的主要内容是什么,选用有一定意义的报头(即报名)。一般报头应设计在最醒目的位置;(2)通读所编辑或撰写的文章并计算其字数,根据文章内容及篇幅的长短进行编辑(即排版)。一般重要文章放在显要位置(即头版);(3)要注意长短文章穿插和横排竖排相结合,使版面既工整又生动活泼;(4)排版还须注意:字的排列以横为主以竖为辅,行距要大于字距,篇与篇之间要有空隙,篇与边之间要有空隙,且与纸的四周要有3CM左右的空边。另外,报面始终要保持干净、整洁。

2、报头报头起着开门见山的作用,必须紧密配合主题内容,形象生动地反映手抄报的主要思想。报名要取得有积极、健康、富有意义的名字。报头一般由主题图形,报头文字和几何形体色块或花边而定,或严肃或活泼、或方形或圆形、或素雅或重彩。报头设计应注意:(1)构图要稳定,画面结构要紧凑,报头在设计与表现手法上力求简炼,要反映手抄报的主题,起“一目了然”之效;(2)其字要大,字体或行或楷,或彩色或黑白;(3)其位置有几种设计方案:一是排版设计为两个版面的,应放在右上部;二是排版设计为整版的,则可或正中或左上或右上。一般均设计在版面的上部,不宜放在其下端。 3、题头题头(即题花)一般在文章前端或与文章题图结合在一起。设计题头要注意以题目文字为主,字略大。装饰图形须根据文章内容及版面的需要而定。文章标题字要书写得小于报题的文字,要大于正文的文字。总之,要注意主次分明。 4、插图与尾花插图是根据内容及版面装饰的需要进行设计,好的插图既可以美化版面又可以帮助读者理解文章内容。插图及尾花占的位置不宜太大,易显得空且乱。尾花大都是出于版面美化的需要而设计的,多以花草或几何形图案为主。插图和尾花并不是所有的文章都需要的,并非多多益善,应得“画龙点睛”之效。 5、花边花边是手抄报中不可少的。有的报头、题头设计可用花边;重要文章用花边作外框;文章之间也可用花边分隔;有的整个版面上下或左右也可用花边隔开。在花边的运用中常用的多是直线或波状线等。

二、报头画、插图与尾花的表现手法报头画、插图与尾花的表现手法大致可分为线描画法和色块画法两种。 1、线描画法要求形象简炼、概括,用线准确,主次分明。作画时要注意一定的步骤:(1)一般扼要画出主线----确定角度、方向和大小;(2)再画出与图相关的比例、结构及透视;(3)刻画细部,结合形体结构、构图、色调画出线条的节奏变化;(4)最后进行整理,使画面完整统一。 2、色块画法除要求造型准确外,还须善于处理色块的搭配和变化关系,而这些关系的处理要从对象的需要出发,使版面色彩丰富。作画时,可先画铅笔稿(力求造型准确),再均匀平涂大色块;后刻画细部;最后进行修整,使之更加统一完美。线描画法与色块画法,通常是同时使用,可以是多色亦可单色。不管是线描还是色块画法,最好不要只用铅笔去画。版面上的图形或文字不能剪贴。三、手抄报的编绘制作的步骤编绘制作是落实由设想到具体着手完成的重要步骤。其步骤有二:一是准备阶段,另一是编制阶段。

1、准备阶段。主要是各种材料、工具的准备。具体包括:拟定本期手抄报的报名;准备好一张白棒纸(大小视需要而定,有半开,四开,八开等,本次政教处举办的手抄报比赛是要求为《江西日报》大小,即半开);编辑、撰写有关的文字材料(文章宜多准备些);书写、绘图工具等。 2、编制阶段。这个阶段是手抄报制作的主要过程。大致为:版面设计、抄写过程、美化过程。(1)版面设计:根据文章的长短进行排版,并画好格子或格线(一般用铅笔轻轻描出,手抄报制作完毕后可擦可不擦)。(2)抄写过程:指的是文章的书写。手抄报的用纸多半是白色,故文字的书写宜用碳素墨水;字体宜用行书和楷书,少用草书和篆书;字的个头大小要适中(符合通常的阅读习惯)。字写得不是很漂亮不要怕,关键在于书写一定要工整。另外,文章或标题中不能出现错别字。(3)美化过程:文章抄写完毕后,即可进行插图、尾花、花边的绘制(不宜先插图后抄写),将整个版面美化。这个过程是手抄报版面出效

小编:APP里面文字、图形、色彩是信息传达的三要素,字体则是这三要素中的最重要因素之一。

在用户界面中,每一个单词和字母都至关重要。好的字体等于好的设计。字体成了界设计的基石,而我们设计师,则是这些”信息基石“的修造者。

一汉字使用的前世今生

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

而到了后期,汉字分别经历了篆体、隶书、楷书等多元化的发展,百花齐放。而自从雕版印刷术的盛行之后,刻字用的雕刻刀所雕出来的字体因为横细竖粗,醒目易读,得到了广泛的运用,而活字印刷的时候首尾会有墨残留所以故意会留一部分装饰来溢墨。而这个字体在优化过后就是至今我们仍在广泛使用的宋体。在当今,特别是在Windows系统中,宋体仍占有很大的一席之地。后来人们又通过模仿宋体字体结构,对字体进行了调整,改成了笔画粗细一致,纤细狭长,的印刷字体,也就是今天我们称之为“仿宋体”的字体。与此同时,“黑体”诞生了,因为字体醒目大方,粗细一致,结构醒目严密,字形端正,容易阅读,所以也就是我们今天,在界面设计中,所用到的最多的字体。现代汉字的黑体是在现代印刷术传入东方后依据西文无衬线体中的黑体所创造的,所以按照西文的说法,也可以把黑体称作为无衬线体,把宋体叫做为有衬线体。

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

直到后面屏幕显示效果的进步,黑体才慢慢得以盛行,在屏幕分辨率较高的情况下,黑体已经能得到较好的识别效果。因此已经不需要原衬线体的功能,衬线体反而由于装饰性元素过多,阅读起来容易造成视觉疲劳。因此在屏幕密度较高的移动端载体中,无衬线黑体成功替代有衬线体成为霸主地位。修改后的黑体中宫更为开放,布白更为匀称,显示效果更为舒适,醒目利于阅读,更利于视觉信息的传达,从而在屏幕中起着主导地位。几大互联网巨头微软雅黑及苹果在此之后分别花重金打造了微软雅黑及苹方,用于自身的OS系统中。所以通过分析,可以看来,在将来界面设计中,字体样式还是会以无衬线体为主,甚至可能会更进一步简化字体的形状。

二 Android与 iOS中字体详解2.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.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个字重。

通过对比,我们可以发现,其实Android与iOS字体字形方面差异化明显不大,不用特意下载所有字体进行单独配置。那么在平常工作中,我们只需要按照一套标准的iOS设计稿输出即可,在Android方面进行自动延展,最后走查确认一下效果即可。如果涉及到使用除Regular标准体之外的字体,那么除了颜色,还应当标注相应的字重字高等信息,(如Font:Pingfang SC-Semibold,line:52px)而不应当只标注一个加粗或者加细。当然如果人力允许的情况下,我们也可以单独为Android做一套界面及字体适配,提高Android端的视觉显示效果。

三字体属性详解

在平时项目中,为了让页面中的字体更加贴合业务场景,需要对字体的字距字高进行调整。但很多同学在最后输出标注的时候,往往只标注了字号及颜色,而其它参数都没有进行标注或者标注的不正确,在最后视觉还原审核的时候,字体往往偏差较大,花费很多不必要的工作量去浪费在了视觉走查上。那么这里就给大家详细介绍一些字体属性及标注方法,节约开发走查工作量,更好的还原视觉稿。

3.1字体基础结构详解

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

所以由此图可以看出,平时我们在设计的时候,可能字体使用的28px,在使用工具量的时候,也确实是28px,但其实字体本身占用的距离是包含了升部及降部区域的,这样就导致其占用空间大于28px,而变成了40px。所以我们在标注的时候,应当按照包含升部降部的实际大小进行标注,这样所还原的视觉效果,也是极为接近设计稿的。

我们在设计输出的时候,如果没有调整line值,是可以直接借助sketch的标注插件sketch measure,来实时导出相应的参数,这样的参数是最接近开发效果的。如果没有Mac的同学,可以利用PS选中文字,那么选中的深色底就是字体本身的间距了。下图我做了两个示例,来阐述正确的标注方法,虽然标注的时候会麻烦些,但往往在视觉还原的时候,往往能达到事半功倍的效果。

3.2字体的行高行距参数详解

在一些文字较多的页面,为了让阅读更为顺畅,我们往往需要对文字的字高字距进行调整,那么我们先来看一下sketch及动效编程软件中的可配置参数。

我们可以发现,对于更改字距、字宽及端高,那么我没只需要配置好Charater、line、paragraph三个值即可,那么我们先来理解一下这三个值得含义:

Character:字间距/所谓的字间距,则是在两个文字中间的距离,一般加在一个字符的后段。如字符『AK』,默认Character为0,那么两个字符中间的间距,则是为字体默认所设定的安全距离。如果给Character设定一个值50,那么会自动在A的后段加上50px,那么显示效果则变成了『A K』

line:行高/即UILable中字段所占用的高度实际大小,刚刚有提到默认字体会设定一个安全距离,那么在设备中字段所占用的line高度=字体像素大小+升降安全距离+扩高值。每个字体都有相应设定的line Auto比例,可以通过sketch选中字体后听过line值来进行查看。另外刚刚提到,标注间距的时候,务必得把line值包含在内,否则实现出来容易出现字体偏移位置不对等情况。

Paragraph:行距/很多同学在调完这个参数,发现跟调整line值差不多。但其实Paragraph调整的是两行中间的间距,不单独调整单行字段的占用空间。

通过以上我们能了解字体在于实际设备中,是怎么样的布局方式,所以我们标注的时候,一定需要标注的较为仔细,如果发现开发出来的字体样式与设计稿不一致,那么我们只需要提供以上这几个参数值即可。如果在团队中还是靠手动标注的同学,那么完整的标注应该为:Font-name;Font-size;Font-color;Font-line;Font-character;Font- Paragraph。

如果没有设定,不填即可,如:

Font-name:Pingfang SC-SemiboldFont-size:32pxFont-color:#333333Font-line:AutoFont-character:5Font- Paragraph:0四科学的字号大小计算法则

现在目前市场中手机屏幕越来越大,分辨率也越来越高。那么我们在做设计的时候,在字号运用方面,难免会感到迷茫。文字是不是又点小了?或者大了显得不精致?标题跟正文没啥区别?像这种问题可能经常困扰着一些年轻的设计师。其实在字号大小方面,确确实实有着一套计算法则及公式在内,今天这里给大家进行一下科普。

当我们在查看一些物体时,测量视觉角度的方法为先量一下物体的的长宽以及眼睛距离物体的距离,得出相应的数学计算公式

其中θ=(arctan·h/2d)2,通过换算h=2d·tan(θ/2)

θ即视角度数d为眼睛离物体的距离h为物体高度4.1设计稿中最小的字号怎么来的?

关于人眼感光系统,人眼上的一个像素相当于0.3个角分。为何人的肉眼看不清远处的物体细节?或者看不清月亮上的环形山,那么是因为在你的视网膜上,月亮形成的图像其实不过就是一个100个像素左右的图片而已,所以环形山无法被肉眼观察得清。

而根据科学研究发现,人眼对于信息物体的识别,在眼睛内视角度数>0.3°,才能保文字信息体投射到视网膜中的分辨率足够大,能够被大脑所识别。那么我们将数据可以套入进公式计算,人眼距离手机的具体通常是30cm左右,那么也就是说,正常情况下,在手机距离眼睛30cm左右,使用视角计算公式,我们能识别到的最低的文字大小为h= 2*30·tan(0.3/2)≈ 0.157cm,因为我们经常使用iPhone8的尺寸1334×750作为设计稿。iPhone8的dpi为324,也就是一英寸上显示324个像素,1英寸为2.54cm,那么0.157cm=324*(0.157/2.54cm)= 20px所以也就是正常情况下我们在设计稿中使用最小号的字号时,一定不能低于20px。

4.2字号使用原子理论

而我们在做设计时,字号的单位需遵循原子理论,也就是使用一个基数作为倍增,如2、4、6、8、10或者3、6、9、12。但其实我们在做移动端设计时,单位需要遵循偶数原则,因为开发中的单位是以一倍图的基数来进行计算。那么其实在制定字体规范中,使用2为单位会导致字号过多,不易管理,且2号字体的差异化不大。所以在字号方面我们使用4作为单位是比较合适的,一是适配后在@2x跟@3x不会出现半像素,二是使用4为单位,能满足字体大小的均衡。那么我们则可以制定相应的字体单位。

4.3使用大字号作为标题也是个不错的选择

随着设计行业的发展,对于视觉的理解进步,现在更多设计师更愿意使用大号字体,大间距,来区分页面层级的信息。因为大号的字体阅读起来更为舒适,能精准快速的传达信息,提升阅读效率,降低视觉疲劳。所以大家在平时项目中,也不妨大胆的使用一下大字号字体来作为主标题,拉大页面不同信息的层级关系。

五使用字体参数来拉开层级

在移动端的界面设计中,除了前几篇文章讲的使用间距网格来拉开不同内容的层级外,对字体样式进行适当的调整也是个很不错的选择。通过调整字重,字色,能让页面的视觉逻辑变为更加的清晰明了,主次分明,降低因视觉给用户带来的干扰,提升页面的可操作性。那么我们如何来设定这两块呢?

5.1尽量减少页面中的不同色相的颜色数量

在日常界面设计的需求中,有些较为重要的字段,可能业务方为了突出,第一时间,想到的就是把字体标红处理,或者添加各类各样,五花八门的颜色。但其实往往这样的设计,在最后上线后的效果,反而容易适得其反,因为颜色过多,而导致页面缺乏重点,视觉疲劳,反而增加了页面的跳出率,难以取得想要的效果。经过调研显示,页面越干净,越整洁,页面的跳出率越低,而这套规则几乎适用于所有的界面设计。

所以字体颜色这块,颜色种类不宜过多。可以考虑通过使用同色系中的不同明度,来对不同层级字段进行差异化处理。我们可以通过先确认主色,再对主色进行名都延展,来适配多场景的文字颜色。配置好相应的色板之后,可以再根据页面层级关系对文字颜色进行合适的填充。

5.2使用不同的字重来区分内容

为了更好的拉开不同信息之间的层级关系,除了配置颜色外,通过配合,使用不同字重的字体来对内容进行区分也是个很好的选择。使用较粗的字重来作为主标题使用,细字重作为辅助信息,能更好的在单色环境中增加内容的呼应及对比,减少页面中字体过度色的使用,从而能够让页面更加的整洁,内容清晰明了。降低页面的跳出率。例如我们较重要的信息,可使用较粗的字重,弱信息则细字重。比如以下的余额宝及京东小金库界面,虽然两个界面在留白方面都留有较大余地,但京东金融在于对字重的设定更为严谨,所以在于对层级关系的处理上京东要更胜一筹。

而不同的字重,给予用户的感受也是截然不同的。较粗的字重往往传达的感受比细体要更为庄重、踏实严谨,而细体则显的更为活泼,有趣,给人愉快的感觉。

刚刚提到了字重的使用必要性,那么我们如何定义字重呢?如果字重没有进行规范使用,那么整个页面的视觉逻辑则会变的更为混乱,所以往往这个时候,我们需要设计一个文字规范,例如主标题使用什么样的字重,正文字重样式。仔细敲定整个文字的使用规则,并将规范延展到整个产品的页面设计中来,也是统一产品视觉语言的重要部分。比如京东在价格字体方面,使用了独立设计的一套品牌专有字体,而价格在电商中是一个极为重要的信息,通过统一字体,能很好的提升品牌归属感。

5.3 Sketch-Text Style提高协作效率

sketch在于对文字管理这块,做了一个Text Style样式,通过Text Style,能很好的提高效率,规范页面字号的大小。如果设计团队成员均使用Sketch作为主力使用工具,那么不妨尝试配置一下这块,提高团队协作效率。一方面可以统一规范页面的字体样式,另一方面免去了调整字体的时间,减少不必要的工作量。

六字体运用发展趋势总结

从iOS 11更新就不难看出,目前界面风格的趋势都是偏向于更为简洁化,在一屏的内容里做减法,这样有利于降低阅读负担,将重要的信息更好的展示。在这里,我分别对字体进行了梳理,分析下来,近期的字体使用特征主要有如下三点

6.1更大、更粗的标题

大标题能很好的吸引视线,第一时间抓住眼球,传递信息。拉大页面空间的张力,降低视觉阅读疲劳。

6.2字重层级更为明显

通过字重的差异化显示,能更好的在单色环境中增加内容的呼应及对比,减少页面中字体过度色的使用,从而能够让页面更加的整洁,内容清晰明了,降低页面跳出率。

6.3用字体明度做内容上的信息区分

使用单一色相的不同明度作为字体的颜色,能够在区分信息层级的基础上,能让页面显得更为整洁,降低视觉干扰。

七字体使用总结

互联网在进步,所以设计趋势也是有着各种各样不同的形式。而字体作为基本语言,是设计师需要掌握的基本技能之一。这篇文章里面的案例花了作者大量时间进行绘制收集,希望能对各位读者有所帮助。其实在工作中,也建议大家对自己的,进行总结,对关键信息进行提炼加以沉淀,一方面能让自己的知识更加牢固,另一方面也可以帮助后来者进行成长。

之前写的文章得到了较为广泛的传播,这里非常感谢各位小伙伴对阿坤的支持,如果对文章有疑问或者对文章感兴趣,也可以阿坤的专栏或者添加阿坤的微信。谢谢大家!

我们的设计日记(公众号)

作者:阿坤

转载请注明:片头模版 » 字体设计阐述(设计作品简介怎么写)

发表我的评论
取消评论

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)

网友最新评论 ()