找回密码
 注册

扫一扫,访问微社区

QQ登录

只需一步,快速开始

查看: 1310|回复: 6

[专题热点] 看《歌手》学PPT设计 第一期

[复制链接]

93

主题

257

帖子

7782

锐币

积分
1499
ThinkPPT 发表于 2019-1-15 14:00:21 | 显示全部楼层 |阅读模式
本帖最后由 ThinkPPT 于 2019-1-15 14:14 编辑

周日下午抽空看了湖南卫视《歌手2019》。

真的,这一季的质量是真好,无论从首发歌手,还是舞美设计、剪辑来看都是这三季来最好的(个人观点)。

视频看到一半,我发现了节目中创意满满的设计,而这些设计方法正好能运用到PPT设计中。

下文内容“狠”(很)多,先放一张下文的思维导图,防止“迷路”。

640.webp.jpg
本文思维导图

开  头

640.gif 640 (1).gif
“刘欢”字体设计                                                  “齐豫”字体设计



节目一开始,这个创意就吸引了我。哎,这不就是PPT中的文字拆分嘛。

节目设计团队对每一个笔画都加上了动画,看上去非常优雅。

再放一张图欣赏一下。

640 (2).gif
标题动画

在PPT中的应用

640.webp (1).jpg
锐普超神课截图

制作方法
文字拆分

方法一:布尔运算

①插入一个文本框和一个矩形
注意:插入的矩形要大于文本范围。

640.webp (2).jpg

②先选文字,再选矩形,实行『拆分』布尔运算

拓展一:文字被矩形覆盖了,怎么选择?

640 (3).gif

这时候借助『选择窗格』就可以了。

640.webp (3).jpg


拓展二:如果先选矩形,再选文字会有什么效果?

640 (4).gif

方法二:借助PA插件

640.webp (4).jpg

①下载PA插件
②选中文本框
③依次点击“矢量工具”“文字拆分”

提示:把该命令添加到快捷访问工具栏,可以一步到位,如下图所示。



640.webp (5).jpg

方法三:编辑顶点


640 (5).gif

节目中的效果是拆分了很多笔划。用以上两种方法我们只能拆分部首和部分比划,这时候我们可以插入多边形,编辑顶点,一点点调整。


640.webp (6).jpg

这样我们就可以对每一个笔画进行设计了。


一点点描边,太累了,有没有更高效的方法呢?

有的,用搜狗拼音输入法的『符号大全』。

方法四:借助输入法工具

640.webp (7).jpg

在中文字符中能看到很多笔画,单击直接输进文本框即可进行编辑。

笔画拆分后我们可以对每一个笔画进行笔画颜色、大小、角度等方面进行处理,当然,我们还可以对拆分后的笔画进行艺术处理,比如虚化。

640.webp (8).jpg
图片源自花瓣

在『艺术效果』中可以使用更多效果,大家有空可以去尝试

640.webp (9).jpg


四种方法优缺点对比
640.webp.jpg

640.webp (10).jpg


介绍完了节目开头隐藏的设计创意,下面开始正式表演了。



正式演出

640 (6).gif

吴青峰 《燕窝》
设计赏析


从动图中我们会发现四个设计亮点:


1.文字拆分,然后对部首进行艺术化处理

2.文字使用是渐变色,看起来更有质感

3.文字后加入一个渐隐的圆形,增加设计感

4.“燕”“窝”二字出现动画皆为圆形渐变,呼应了第三点


好,我们继续往下看。


640.webp (1).jpg

640.webp (11).jpg


从图中我们会明显发现一个设计亮点——文字后加入一个渐隐的圆形,增加了设计感,也呼应了前面“燕窝”标题设计的风格。


整理完了设计思路,下面我们来学习如何用PPT制作以上效果。


制作方法
文字渐变

①选中文本框
②右键单击鼠标,选择『设置形状格式』

640.webp (12).jpg

③如下图所示,依次操作

640.webp (13).jpg

④拖动滑块即可调整


制作方法
渐隐圆形

①选中圆形
②右键单击鼠标,选择『设置形状格式』
③如下图所示,依次操作

640.webp (14).jpg

④拖动滑块即可调整

提示:一般我们将一角颜色设置与背景一样的颜色,然后透明度调为100%。


640.webp (15).jpg





640.gif

640 (7).gif
张芯 《可汗山》
设计赏析

从动图中我们会发现三个设计亮点:


1.书法字体+笔刷元素,大气,设计感强烈
2.文字背景为金色纹理,有质感
3.“山”字形象化处理,使内涵传达更有效

好,我们继续往下看。

640.webp (16).jpg

从图中我们会明显发现一个设计亮点——字体倾斜,使页面更具活力。另外,字体颜色与标题颜色一致。


整理完了设计思路,下面我们来学习如何用PPT制作以上效果。

制作方法
笔刷

方法一:先用一个书法字体,再添加笔刷
方法二:用笔刷一个个的“拼”字


640.webp (17).jpg
效果如下图所示。


640.webp (18).jpg 640.webp (19).jpg

图片源自站酷



方法三:借用PS和AI软件设计字体


三种方法优缺点对比

640.webp (20).jpg

制作方法
文字纹理

方法一:填充图片

①选中文本框
②右键单击鼠标,选择『设置形状格式』
③如下图所示,依次操作

640.webp (21).jpg

方法二:布尔运算

①插入文本框和纹理素材
②先选图片,再选文字,实行『相交』布尔运算

640 (8).gif


两种方法优缺点对比

640.webp.jpg

效果如下图所示。

640.webp (22).jpg
640.webp (2).jpg
图片源自站酷


制作方法
编辑顶点

方法一:布尔运算+编辑顶点
①插入文本框和一个矩形
②先选文字,再选矩形,实行『拆分』布尔运算
③选中文本,右键单击鼠标,编辑顶点

640 (9).gif


提示:矩形和文字要分开放,不要重合。


效果如下图所示。

640.webp (24).jpg
640.webp (25).jpg

图片源自站酷

方法二:PA插件+编辑顶点

①选中文本框
②依次选择“矢量工具”“文字矢量”

640.webp (26).jpg



③选中文本,右键单击鼠标,编辑顶点


方法三:文字拆分+图标


具体方法见上文,此处不再赘述。

效果如下图所示。

640.webp (28).jpg
640.webp (27).jpg

图片源自站酷

方法四:文字拆分+无底色图片

文字拆分具体方法见上文,此处不再赘述。

填充无底色图片可以用“设置形状格式”或“布尔运算”,具体见上文,此处不再赘述。

效果如下图所示。

640.webp (29).jpg

图片源自锐普PPT



四种方法优缺点对比

640.webp (30).jpg







640 (10).gif

逃跑计划 《一万次悲伤》
设计赏析

从动图中我们会发现两个设计亮点:


1.字体设计更具艺术感,符合演唱歌曲内涵
2.动画为从上到下出现,达到了“流泪”的效果,符合主题


好,我们继续往下看。

640.webp (31).jpg
640.webp (3).jpg


从图中我们会明显发现这边采用的中规中矩的竖排文字设计。(这个中规中矩的设计也是有心思的,先卖个关子)

下面我们思考一下,为什么采用这个设计呢?

因为和页面有关,此时页面是右边留白多,所以使用多文字排版。

这里,我们再进一步思考:
既然是多文字排版,为什么不用更中规中矩的横排排版呢?

我们再回到原图。



大家有没有注意到图片中虽然是竖排排版,但是文字顺序是按从右往左的顺序排列的。


这又为什么这么设计呢?


因为此时人物在左边,使用从右往左的文字顺序,最后很自然的将视觉焦点落到人物身上。

640.webp (33).jpg


整理完了设计思路,下面我们来学习如何用PPT制作以上效果。

制作方法
文字竖排排版

方法一:回车键一个个敲

640 (11).gif


方法二:压缩文本框

640 (12).gif


方法三:改变文字方向

①选中文本框
②依次单击“开始”选项卡,“文字方向”“竖排”

640.webp (34).jpg


③拖动文本框调整



三种方法优缺点对比

640.webp (35).jpg










640 (13).gif

Kristian Kostov  《Beautiful Mess》
设计赏析

从动图中我们会发现四个设计亮点:

1.字体设计使用了“文字纹理”和“编辑顶点”两种方法
2.文字被框在一个矩形里,符合主题“Mess(困境)”
3.文字虽然被框在一个矩形里,但“M”“L”个笔画突出边框,更具设计感,使页面更具有活力
4.文字背后是从上而下的动画,类似“流星雨”效果,符合主题“Beautiful(美丽)”

好,我们继续往下看。

640.webp (36).jpg


这里使用的是PPT中常用的设计方法——加蒙版。

当然,在这里,设计者又花了一点心思——在蒙版周围加上刚才的“流星雨”动画,呼应了主题,也使得页面不那么死板

整理完了设计思路,下面我们来学习如何用PPT制作以上效果。

制作方法
蒙版


关于蒙版的知识,很多公众号都有介绍,在这里我只介绍我的分类——纯色蒙版和渐变蒙版
(渐变按类型又分为线性、射线、矩形、路径,还有最近很火的弥散渐变,在这里统称归为渐变)

然后这两种蒙版在使用范围上进行控制就组合变成了全图纯色蒙版、部分渐变蒙版等等,如下图所示。


640.webp (37).jpg

部分纯色蒙版


640.webp (38).jpg

部分渐变蒙版


640.webp (39).jpg

全图蒙版







640 (14).gif

杨坤 《我比从前更寂寞》
设计赏析

从动图中我们会发现一个设计亮点——手写字体,更利于传达内心情感,也很有个性。

好,我们继续往下看。

640.webp (40).jpg

乍一看,这里的设计效果和《可汗山》介绍页面的设计差不多,当我们把这两张图放一起就发现了不同。


640.webp (41).jpg

我们会发现,后者在文字排版上进行了“错位”处理,使页面有了活力。







640 (15).gif
齐豫 《最爱》
设计赏析

从动图中我们会发现两个设计亮点:

1.文字拆分
2.文字背景为视频
(这一点在AE上可能不需要用视频做背景,但在PPT设计里可以用加视频达到与上图一样的效果,下面会具体演示)


好,我们继续往下看。

640.webp (42).jpg

这里采用的是交叉倾斜排版,中间加一个动态烟雾进行进一步区分内容(上部分为歌曲原作介绍,下部分为歌曲现作介绍)。

在PPT中区分层级我们可以用哪些方法呢?

修改字体、字体颜色、字号、加底纹、下划线;拉开间距;添加一条横线、曲线、不规则曲线;添加矩形、多边形矩形;修改动画顺序......

制作方法
文字视频背景

方法一:录制GIF,填充图片

①用工具录制好GIF
②选中文本,右键单击鼠标,“设置形状格式”,然后按图中顺序操作

640.webp (43).jpg



方法二:布尔运算
①插入视频和文本
②先选视频,再选文字,实行『相交』布尔运算

640 (16).gif

最终效果如下图所示。

640 (17).gif



两种方法优缺点对比

640.webp (44).jpg







640 (18).gif

刘欢 《夜》
设计赏析

从动图中我们会发现两个设计亮点:


1.文字拆分+字体设计(夜空元素),突出主题
2.动画按照笔画方向展开,流畅自然
好,我们继续往下看。


640.webp (45).jpg


这里终于采用了最传统的横排文字排版,但是又加了很多心思:


1.字体倾斜,更有活力

2.右下角添加和前面标题一样的元素,呼应主题,页增加了设计感



整体分析
节目整体设计完全满足排版四原则:

640.webp (46).jpg


我们再来整体回顾一下歌曲名字的设计和歌曲介绍的设计。

640.webp (47).jpg
640.webp (48).jpg

从上图中我们可以看到:

1.歌曲名称设计基本采用“文字拆分”,但每一个标题又不同,满足“重复”与“对比”原则
2.歌曲介绍设计文字和段落“对齐”,每一个介绍又不同,满足“重复”与“对比”原则
3.每一首歌曲的介绍设计与名称设计,字体颜色统一
4.每一首歌曲的介绍设计与名称设计动画设计与点缀素材设计均前后呼应,凸显歌曲主题


除了以上内容,不知大家有没有发现节目的字体设计。

640 (1).gif
串讲时的字体


640 (20).gif
中文歌词的字体


640 (21).gif
中英文歌词的字体

字体设计也满足“对比”原则。


福  利

TIM截图20190115135920.png

640.webp (49).jpg




回复

使用道具 举报

0

主题

1

帖子

201

锐币

积分
6
飞翔lee 发表于 2019-1-18 13:11:52 | 显示全部楼层
顶贴学习
回复

使用道具 举报

581

主题

2万

帖子

13万

锐币

锐普守护者

积分
109533

灌水精英勋章优秀会员勋章致富精英勋章优秀版主勋章守卫精英勋章智慧精英勋章2015奉献楷模勋章推广精英勋章

chinakui卖家认证 微竞赛 发表于 2019-1-18 16:00:46 | 显示全部楼层
很有价值的文章
锐意进取,普及精品——中国专业PPT领跑者
回复 支持 反对

使用道具 举报

0

主题

8

帖子

16

锐币

积分
71
155024957 发表于 2019-1-19 14:48:16 | 显示全部楼层
用心了,老铁
回复 支持 反对

使用道具 举报

0

主题

64

帖子

584

锐币

积分
381
shklxmi 发表于 2019-1-21 13:17:08 | 显示全部楼层
感谢老师~看节目都能有这么多启发,很厉害!
[发帖际遇]: 一个袋子砸在了 shklxmi 头上,shklxmi 赚了 2 元 锐币. 幸运榜 / 衰神榜
回复 支持 反对

使用道具 举报

1

主题

10

帖子

280

锐币

积分
52
Aspirin_L 发表于 2019-3-8 10:47:04 | 显示全部楼层
很给力,谢谢!!~
回复 支持 反对

使用道具 举报

0

主题

1

帖子

205

锐币

积分
5
wepure 发表于 2019-3-8 18:54:45 | 显示全部楼层
很给力!!!!
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

展开
快速回复 返回顶部 返回列表
展开