查看原文
其他

你常见的标点符号,是设计师的王牌武器。

牧子 研习设 2022-10-16


研习设订阅号

设计干货  杜绝注水



点击观看视频版







标点符号,提到这四个字,相信大家应该并不陌生,因为我们日常的生活中几乎每天都会见到它。说到这相信屏幕前的小伙伴开始犯嘀咕,难道这期的主题是如何正确的使用标点符号吗?桥豆麻袋!当然没有这么简单,标点符号除了在文本中的用法以外,在设计中也有很多特别的作用,今天我挑了几个在设计中常见的标点符号来带大家一块看看在设计中,这几种标点符号的应用方法。




我们先来说一下句号,句号代表着一句话的结束。




正是因为它代表着“结束”,所以会给人带来肯定、坚决、强调等一系列的心理感受。




而在电影标题中,我们也经常见到句号的影子,比如《你的名字。》《那些年,我们一起追的女孩。》在这些影视作品的标题中加入句号,会给整个标题带来一种[诉说感],就像是在与观众对话一样。




商业广告也经常利用这点来拉近与消费者之间的距离。使用这样的句式,没有刻意强化产品的特点,传达出亲切、可信赖、自然的品牌气质。




而句号说白了其实就是一个圆点,我们看这段简单的文字。当圆点出现在画面中时,观看者很难忽视它的存在。自然就会起到一个[产生张力]的作用。






接下来我们就来试一试,看看句号的张力与情绪属性如何应用在设计稿中。







其实普通的文字,加入标点符号之后自然就会增强一些语句的诉说感,但是设计却并没有那么简单,我们先把它放到版面里,确定标题的位置,在通过加大字距来增加画面中大留白的呼吸感。





大家还记得之前提的,句号可以产生张力的作用吗?但是在这里没有体现出来,这是因为它的面积太小,还不足以图形化。我们可以按照黄金分割比放大句号。



另外在设计海报的时候我们也可以将句号当成图形处理,这样的话就可以突破标点符号在设计中的规范和局限。



这里我将句号向左下偏移一点点距离,一方面可以打破标题这里呆板的印象,给画面加入一个不过分的“变化”,另一方面在这里同时也可以象征着夕阳。城市的傍晚,夕阳落下地平线。





最后我们利用网格系统,规范一下各个元素的位置。




在日常的设计中,我们可以利用句号给画面添加情绪属性,也可以利用句号的特点对画面进行强调引导阅读顺序。甚至,经过巧妙的安排,句号可以为版面添加张力。








接下来我们来说一下叹号,首先叹号的外形是细长的像线一样,因此,它在版面中也具有和线条一样的[连接作用]






我们来试一试叹号在版面的基础的文字组合中能发挥到什么样的作用。我们来看下面这个组合,两组文字之间的距离非常近,层级没有拉开看起来不是很舒服。




拉开两组文字的距离,将叹号作为文字组合中的线连接上下文。





现在上面的长度和叹号的横向长度对比有些极端。我们可以继续提取关键词,置入到叹号两侧。加宽中间的横向面积。






除了连接作用以外,叹号还具有着非常强的[情绪属性],我们常常会在需要强调、表达强烈情感的句子后加入叹号。表达惊讶、喜悦、愤怒、伤感等情绪。





既然这个符号具有这么强的情绪属性,那它就一定非常适合应用在营销或广告中的设计中。





我们来试着做一下这张促销贴纸。试一试叹号在版面中的视觉属性。


首先我们可以试着增加一些颜色把关键信息编排好,让整个版面处于一个稳定的状态。




感觉好些了,为了达到快速传递信息的目的,我们可以进一步放大利益点。我们把五换成数字。





放大字号,在右侧的负空间放入叹号,增加促销感。




总结一下,叹号具有强烈的情绪属性,我们可以用它丰富一些强烈情感的版面。同时因为它细长的外形,还具有像线条一样的连接作用。









破折号有解释说明,承接话题转变,声音的延长的功能。


举个栗子,这里的设计干货平台就是对破折号的进一步解释说明。





而在这里,破折号则是承接两个话题的转变。




这句话里,破折号则是延长了声音。




针对下面这个文字组,我们就可以使用破折号让文字组更易读。




现在这个文字组的问题在于“单读”和“十周年特辑”的文字层级太过于接近,不利于区分标题与副标题。





尝试把十周年特辑缩小,拉开层级对比。但是这时多了一块负空间。然后我们加入破折号做[进一步解释说明],顺便[填充负空间]




最后调整文字之间的距离。破折号的加入不仅利于信息的有效传递,对比前一版也更加雅致了。



由于文章篇幅有限,在这里无法给大家分享更多我对于标点符号的理解,感兴趣的同学可以加入研讨群(具体加入方式在文章底部),我会给大家分享一些图形感强的标点符号字体,咱们下午见。








接下来我们来说一下引号,引号分为直角引号和弯角引号。




直角引号最初出现在清末王煜初(炳耀)所著的《拼音字谱》里,被称之为「释明之号」。





后面1990年版的的《标点符号用法》把书写方向改成横排, 为了方便,开始规范使用弯引号。






比如说下面这几个字,大家可以看出这个在讲什么吗?




加入引号,是不是一下就理解了电影展的名字叫做《裂0003》。



我们编排上其他文案。




将其置入到版面中,绘制网格,规范位置和大小。置入图片,我们可以利用网格,把图片的人物安排在三分之一处。




这是最终的效果。在一段文字中,我们可以合理使用引号来突出某一部分,这样[减轻阅读负担]的同时,也可以打破枯燥的编排。








最后一位出场的是问号,问号可以表达疑问和反问。




举个栗子,小凹又胖了?表达了一种疑惑。




而在这里则是反问,表达一种惊讶。




问号因为圆润的外形,极具有符号性。设计中我们可以把它当成[图形元素]来使用。






我选择的是海洋环保主题,叫做“我们应该去哪里?”。在这里,问号一方面是表示疑问。另一方面则是反问,家园已被破坏,我们还能去哪里呢?



我们先在版面中置入相应的文案。完成后,会发现中间这一块的负空间较大。还记得我们前面提到的,问号可以当作图形元素使用吗?





我们把问号换一个颜色,放大旋转,放到版面的负空间里试试。





为了不影响后方文案的识别,可以降低问号的不透明度。





仔细看看,还有改进的空间吗?换色后的问号,图形感更强了。但是后方的日期稍微有点刻板单调。尝试为文字换上更具图形感的字体。





问号也可以作为主形象。我们用这个主题延展一下海报。在海报里加上相应的文案和图片后,也加入问号,形成一致性。




问号因为它奇特的外形,具有强烈的图形感。在版面中,合理的运用,说不定可以作为主体形象,为设计增添一些新奇感。







其实一个版面中往往不会只存在一个标点符号,我们在使用的时候也不要限制自己,让标点放心大胆的出现在它该出现的位置。最后,我们来试一试,如何利用几个小小的标点符号给画面增加情绪感和图形感。




我们先做好版心,预留出图片的位置,放入主题文案。为了增加文艺,自然的感觉。加入标点符号,让观者在阅读时,顺应我们设定的停顿——小田原,自然、自由。






然后我们绘制一个七栏网格。在主题上方放入一段解释文字。





东京小田吉自由行,这个小标题不会阅读错误。但还是有点单调,我们可以加入前面说的引号丰富一下版面。





两边的负空间加一些点缀元素。这样感觉上方还是有点空。拉开距离,加入线连接。


还记得我们提到的叹号具有情绪属性吗?我们加在后面,购物和美景就在眼前,还犹豫啥?





进一步完善,在下方加入一句描述。拉开字间距,中间加入破折号连接。最后一步,加入一些小文案,二维码和图片。





在画册里,我们也可以延用相同的感觉。在画面的左下方加入有标点符号的主题,同时用大留白营造出自然清新的感觉。





用做宣传的banner也是一样,利用符号来断句,营造清新自然感。




下面就是最终的展示。我们利用标点符号为标题做断句,给版面增添了清新文艺感。在局部使用了叹号,恰当的渲染了购物的热闹感 。破折号则为我们解决了长度的问题。




标点符号除了本身的功能以外,在平面设计中也可以分为两种功能,一种是情绪传达,一种是视觉传达。在文案中加入标点符号会拉近观看者与作品的距离,让作品更有人情味儿。在版面中某些形态优美的标点符号也可以当作图形来使用。但是大家千万不要强行使用和过度设计,就像我们之前说的一样,让标点符号出现在它最自然最合适的位置就可以了。本次就先分享给大家这些,如果你对这篇文章感兴趣请加入我们的研讨群,我们会有更丰富的彩蛋内容等你解锁。







往期教程导读:




由于微信公众号更改了推送机制,推文不再按照时间线推送,为了以后能及时观看到我们的教程和文章,看完文章后记得给我们点个“在看”哦。如果你喜欢我们的文章,这将是对我们最大的鼓励和支持。

您可能也对以下帖子感兴趣

文章有问题?点此查看未经处理的缓存