Scratch全国少儿编程竞赛获奖作品《记忆碎片》解析上篇

admin 发表于 2019-10-09 13:15

Scratch全国少儿编程竞赛

获奖作品解析
《记忆碎片》

本文介绍的作品是全国青少年创意编程与智能设计大赛创意编程比赛一等奖获得者孙佳阅同学的最新参赛作品。

作品说明

暑假里,我无意中被妈妈订阅的一期《三联生活周刊》的主题《我把自己弄丢了》吸引了,我一口气读完了里面的每一篇相关文章,了解了一种我从未听说过的疾病——阿尔兹海默症。患者的世界深深震撼了我,他们的记忆在被疾病一点一点无情地吞噬,但他们仍然能够感受到悲哀、孤独、不安,仍然能够感受到爱与被爱。于是,我决定以此作为作品的主题,我想通过这个作品,让玩家走进阿尔兹海默症患者的内心,呼吁整个社会对他们的关注与爱。

游戏中的变量以及作用
变量名称
作用
播完了? 记录背景音乐是否播放完
拼好数量 记录拼好的碎片数量
收集数量 记录收集到的碎片数量
正文https://cdn.china-scratch.com/timg/191009/1315506219-0.jpg

今天,果冻老师继续带大家解析Scratch的参赛作品,这一次,我们来学习小学4-6年级组一等奖获得者孙佳阅同学的《记忆碎片》。这是一个有关阿尔兹海默症的作品,什么是阿尔兹海默症呢?它是一种认知与行为功能障碍的疾病,常发生于老年人的身上,主要的表现就是记忆力减退,经常将日常所做的事和常用的一些物品遗忘。在《记忆碎片》这个作品中,孙佳阅同学使我们化身一名阿尔兹海默症患者,将记忆中残留的物品碎片进行拼接,重新唤起对于往事的完整记忆。这个小小的作品呼吁的是要对阿尔兹海默症患者有更多的关注与爱心,作为每一个都会变老的人,我们应该让这样的作品传播的更远。

整个作品的基调是缓慢而温馨的,接下来我们就一起进入阿尔兹海默症患者的世界。

点击绿旗

如同大多数的游戏作品一样,点击绿旗后并没有立即开始游戏,而是有一个开始页,上面显示了作品的名字与一个开始按钮。

https://cdn.china-scratch.com/timg/191009/1315515Y2-1.jpg

这里带有特效的角色有两个:游戏名称的文字和三角形的开始按钮。

https://cdn.china-scratch.com/timg/191009/13155140K-2.jpg

当绿旗被点击后,文字与按钮都有一个虚像渐变显示的效果:

https://cdn.china-scratch.com/timg/191009/1315512T0-3.jpg

不同的是,按钮的显示有一个0.5秒的延时。

https://cdn.china-scratch.com/timg/191009/1315514919-4.jpg

这样,一个简单的过渡动画就添加好了。接下来,我们就要点击按钮进入游戏了。那如何判断按钮被点击了呢?在Scratch的事件中有一个当角色被点击的语句,拖动它到代码区就可以简单快速的判断角色是否被鼠标点击了。

但是作为一名参加比赛的选手,我们要自己来实现点击判断的代码,这样才会显得与众不同,其实代码实现起来也不难,就是两个等待语句:

https://cdn.china-scratch.com/timg/191009/131552C15-5.jpg

第一个等待语句判断按钮是否碰到了鼠标指针并且按下了鼠标,也就是我们按下了鼠标的左键;第二个等待语句是反向判断,它判断第一个等待语句的条件是否不成立,也就是我们松开了鼠标的左键,这两个语句组合在一起就实现了鼠标按键点击判断的效果。

当两个等待语句的条件都满足之后,就会继续执行下面的代码,广播进入并将文字与按钮逐渐隐藏掉。

进入

点击开始按钮之后,并没有立即开始游戏,而是播放了一段过渡动画。

https://cdn.china-scratch.com/timg/191009/1315522X0-6.jpg

这段动画通过打字的方式向我们介绍了游戏的背景,让游戏者化身为一名阿尔兹海默症患者。在Scratch中,对于单个文字的操作是非常有限的,并没有专门的语句来控制文字。例如这里的打字效果,需要将文字一个一个的显示出来,直接拖动语句通过代码逻辑是无法实现的。于是,就要转变思路,代码不行就从造型上入手,我们把文字看成是一个整体,每多一个文字就多一个造型,这样不断的切换造型就可以实现打字的动画效果了,这就是作品中使用的方法。

果冻老师简单的画一下大概就是这个样子的:

https://cdn.china-scratch.com/timg/191009/131552M35-7.jpg

每个造型都比前一个多一个文字,其中从第一个开始每间隔一个造型还给文字的后面添加了一个“I”的符号,这样在动画中打字的效果就更加逼真了。

https://cdn.china-scratch.com/timg/191009/13155324R-8.jpg

当接收到进入的广播后,首先将造型初始化为第一张,然后就不断的切换下一个造型,这段话总共有61个字,那么就需要切换61次,当重复执行结束后,打字动画就完成了,接着再使用虚像特效将文字整体逐渐的隐藏掉,最后广播开始就进入游戏的正式环节。

很简单,是吧!但是这里有一个小问题,就是这段打字动画还是挺耗时的,如果每次打开游戏都要看一遍也有点太烦人了吧,所以我们还要给这个动画添加一个可以跳过的功能,比如按下键盘的空格键就可以直接进入游戏:

https://cdn.china-scratch.com/timg/191009/1315535418-9.jpg

接下来,就赶快按下空格键开始游戏吧。

开始

果冻老师第一次游戏进行到这里的时候是有些惊讶与疑惑的,惊讶的地方在于这竟然是一个3D立体的效果,太棒了,孙佳阅同学真的厉害!疑惑的地方在于虽然界面上有一个简单的提示,告诉我按方向键,但是我还是不知道该如何操作进入下一步。

https://cdn.china-scratch.com/timg/191009/1315532205-10.jpg

于是,老师就打开游戏的源代码仔细的阅读了一下,原来这里需要我们按下方向键收集所有的碎片,收集的方法就是让每个碎片都碰到舞台的边缘。这样子啊,看来我们要在游戏中把提示写的更清楚些,否则就会出现玩到一半卡住进行不下去的尴尬情况了。

搞清楚了游戏的玩法,就来看接收开始广播的代码吧。

接收开始广播的角色有很多,果冻老师数了一下,一共有13个。

https://cdn.china-scratch.com/timg/191009/131554O59-11.jpg

哇,这么长的一串!别害怕,果冻老师将这些角色分成了四类,点1到点4是一类,画笔角色是一类,碎片1-1到1-6以及黑色唱盘是一类,最后背景是一类。每一类的角色它们的代码是类似的,所以只要各选出一个角色将它的代码搞清楚,上面截图中的一长串角色就都清楚了,是不是一下子简单多了!

点1到点4是四个点坐标,它们为画笔的画线提供参考点,按下键盘的方向键可以移动点坐标,同时画笔画出的线也会跟着点移动。

比如点1的代码:

https://cdn.china-scratch.com/timg/191009/1315542914-12.jpg

按下不同的方向键点1会向不同的方向移动,移动是通过改变角色的X或Y坐标实现的。

点2、点3、点4的代码与点1是类似的,只是初始化的位置坐标不一样而已。这四个点一起组成了一个矩形。

OK,点的坐标设置好了,那就该画笔登场了。

https://cdn.china-scratch.com/timg/191009/131554I44-13.jpg

画笔接收到开始的命令后,先将收集数量这个变量初始化为0,它是用来记录我们收集到碎片的数量,后面我们每收集一个碎片它的值就会增加1。

接着,代码都是有关绘制线条的,由于背景是黑色的,所以将画笔设置为白色,这样线条更明显突出,然后放置一个重复执行语句,这个语句很重要,它的意思是说画笔会一直不停的绘制,添加上重复执行的语句,白色的线条才会随着四个点的移动而移动。果冻老师在截图中标记了绘制过程中的各个关键点,每一轮的绘制都是在瞬间完成的,如果在个点之间添加上等待时间,就可以看到绘制的过程。

https://cdn.china-scratch.com/timg/191009/1315555005-14.jpg

在代码中还有一个非常重要的语句就是全部清除,它被放在重复执行的里面,全部清除的意思就是清除之前绘制的所有线条,放在重复执行里面就可以保证每一轮绘制的线条都是独立的,不会和之前绘制的线条混在一起。这样说可能不太清楚,同学们尝试在源代码中删除全部清除这条语句,再看游戏的效果,就知道果冻老师要表达的意思了。

第一张拼图一共有六个碎片,它们随机分布在页面中,并且根据三维坐标系近大远小的特点,设置碎片为不同的大小,这样就在二维平面中模拟出了三维空间的效果。

以第一个碎片的代码为例:

https://cdn.china-scratch.com/timg/191009/1315551F2-15.jpg

第一条语句设置了角色的拖动模式为不可拖动,意味着游戏中我们不能用鼠标来拖动角色,也就是说它的位置是不能用鼠标改变的。碎片1的大小设置为20,并显示在(90,150)这个位置。接下来,拖动重复执行直到碰到舞台边缘?这组语句到脚本区,表示碎片会一直执行重复里面的代码,直到碰到舞台边缘才继续执行重复后面的代码。

重复执行里面的代码和点1是类似的,按下不同的方向键角色会向不同的方向移动。不一样的是碎片除了距离会移动之外,它的大小也会发生变化,这样设置的原理是,在三维空间中物体朝观察者方向移动时,它在观察者眼中的投影是逐渐变大的,而反方向移动时它在观察者眼中的投影是逐渐变小的,同学们可以试一试你观察一个物体运动时是不是这样子呢?

除了大小的变化,碎片与点还有一点不一样,就是当按下左或者右方向键时,碎片X坐标移动的距离是0.5,而点移动的距离是1,它们移动的距离是不一样的,这样做也是为了模拟物体在真实三维空间中的效果,按下左右方向键就相当于观察者左右在移动,他的视角就会发生改变。在真实世界中当观察者视角发生变化后,远近物体在眼中移动的距离是不一样的,远处物体移动的快,近处物体移动的慢,这种现象有一个名字叫做“视差”,代码中就是根据这个原理设置的。

接收开始广播的几个重要角色果冻老师就介绍完了,现在我们就可以按下键盘的方向键来收集碎片:

https://cdn.china-scratch.com/timg/191009/131555E57-16.jpg

在下一篇文章中,我们继续介绍游戏后面的情节,碎片收集齐后还要将这些碎片拼接成一幅完整的照片,我们一共要完成五幅照片的拼接游戏才算完成。好了,那我们下次再见吧!

后记,小编朋友公司研发了一个游戏化的少儿编程在线课程(5-12岁),游戏化教学结合scratch(一款在线少儿编程工具,类似乐高的积木拼搭),我家娃娃学了几次课,非常喜欢(超预期),16次课才200多块钱,对锻炼孩子的思维能力和动手动力很有帮助。

感兴趣的朋友可以扫描二维码,关注一下,或微信搜索“大耳猴少儿编程”

https://www.china-scratch.com/Uploads/Editor/2018-04-22/5adca08bdc212.jpg