搜索

Scratch 教程

基本介绍

使用 Scratch 3 注册与登录 操作界面 我的东西

图形与声音

绘制造型&背景 编辑音效

程序积木

积木种类 动作 外观 音效 事件 控制 侦测 运算 变数 清单 函数积木

扩充功能

音乐 画笔 视频侦测 文字转语音 翻译

技巧&观念

全域变数、区域变数 深入理解区域变数 控制指定分身 控制所有分身的方法 云端变数 云端变数记录文字 变数串接文字 判断英文字母大小写 中断与停止程序 广播消息并等待 键盘与鼠标 鼠标点击与长按 侦测所有键盘按键 点击隐藏的角色 突破角色尺寸限制 角色与舞台边界 重复积木的等待时间 音乐暂停与继续播放 使用造型名称建立清单 使用造型代替变数 文字转清单 清单合并为文字 判断两个清单是否相同 复制清单、反转清单 清单数字排序 清单最大值最小值

入门范例

键盘控制猫咪 指向中间的箭头 水果音乐钢琴 猫咪的影分身之术 猫咪的细胞分裂 螃蟹跑来跑去 吃水果 摸蝴蝶 小狗追棒球 鱼儿水中游 小鸟往前飞 舞棍阿伯 小时钟 摇骰子 转动的眼球 抽奖轮盘 大乐透电脑选号 卡牌抽签 ( 20 中 1 ) 移动到边缘切换场景 人物依序跳舞 ( 广播 ) 按钮控制猫咪 ( 广播 )

进阶范例

猫咪跑步 ( 连续背景 ) 猫咪跑步 ( 超长背景 ) 大型数字 ( 图形数字 ) 拖拉怪兽碰撞墙壁 键盘钢琴 ( 记录音符 ) 中文字逐字稿 英文字逐字稿 计算机 1 ( 显示数字 ) 计算机 2 ( 加减乘除 ) 云端聊天室 音乐播放器 推猫咪 ( 视频侦测 ) 围捕小鱼 ( 视频侦测 ) 戳泡泡 ( 视频侦测 )

视觉特效范例

视差效果 水中吐泡泡 雪花随风飘 键盘钢琴 ( 音符动画 ) 无限循环画中画 水底探照灯 狙击望远镜 ( 两倍变焦 ) 猫咪万花筒 仙女棒 ( 光迹效果 ) 骇客任务背景特效 放烟火 1 ( 往上发射 ) 放烟火 2 ( 爆炸效果 )

绘图范例

镜射画图 ( 对称图形 ) 小画家 ( 舞台上画图 ) 记录画图轨迹 绘制圆形 绘制椭圆形 绘制立方体 ( 会动 ) 绘制正多边形 绘制正多角星形 ( 单纯 ) 绘制正多角星形 ( 多线 ) 绘制抛物线 绘制折线图 绘制圆饼图 绘制圆饼图 ( 指示线 ) 蜘蛛结网 ( 八边形网 ) 绘制舞台方格 绘制正弦波形 ( sin ) 正弦波毛毛虫动画 显示声波图形

物理&模拟范例

钟摆运动 简单磁铁效果 两个磁铁的磁力线 立体空间 ( 三度空间 ) 循迹移动 抛物线发射炮弹 地球绕着太阳转 弹跳的篮球 电风扇 ( 控制强度 ) 拉不走的弹力球 惯性移动 ( 鼠标 ) 惯性移动 ( 键盘 )

入门游戏范例

猴子接香蕉 打地鼠 打地鼠 ( 体感视频侦测 ) 刮刮乐 吹风机吹头发 太空狗闪躲陨石 九九乘法测验 英文单字测验 钓鱼游戏 拍西瓜 ( 储存最高分 ) 宝可梦猜猜我是谁 ( 基本 ) 形状配对拼图 台湾地图拼图 英文打字机 英文打字机 ( 判断大小写 ) 射击外星人 猜数字 ( 猜大小 ) 猜数字 ( 几 A 几 B ) 连连看 ( 产生器 ) 连连看

进阶游戏范例

青蛙过河 青蛙过马路 反弹球 ( 乒乓球 ) 打砖块 狙击气球 ( 两倍变焦 ) Flappy Bird Flappy Bird ( 声控版 ) 走迷宫 ( 基本 ) 大型迷宫 ( 键盘控制 ) 大型迷宫 ( 鼠标控制 ) 翻卡记忆游戏 翻卡记忆游戏 ( 改良版 ) 井字棋 ( 圈圈叉叉 ) 九宫格拼图 九宫格拼图 ( 改良版 ) 音阶记忆 贪吃蛇 ( 分身版 ) 贪吃蛇 ( 画笔版 ) 小鸡下楼梯 拉霸机

团康游戏范例

摇骰子 ( 1~3 个 ) 比手画脚 ( 猜动物 ) 音乐传球游戏 大声公 ( 比赛谁的气长 ) 抽签 ( 可调整中签数量 ) 转盘指针 ( 指到谁就当鬼 ) 倒数计时器 ( 基本版 ) 倒数计时器 ( 大数字版 )

游戏设计技巧

角色 ( 地上移动 ) 角色 ( 蹲下、左右转 ) 角色 ( 跳耀、两段跳 ) 角色 ( 墙壁、爬墙 ) 地图 ( 清单转换 ) 地图 ( 二维数组 ) 地图 ( 控制移动 ) 地图 ( 墙壁碰撞侦测 ) 地图 ( 吃东西侦测 ) 俄罗斯方块 ( 角色与背景 ) 俄罗斯方块 ( 移动与碰撞 ) 俄罗斯方块 ( 放置方块 ) 俄罗斯方块 ( 消除完成方块 ) 俄罗斯方块 ( 下个形状 )

宝可梦猜猜我是谁 ( 基本 )

这篇文章会介绍,如何在 Scratch 里使用绘制造型,搭配点击角色、造型切换...等积木,实作宝可梦“猜猜我是谁”的基本游戏 ( 看影子猜宝可梦名字 )。

快速导览:

相关文章参考:绘制造型&背景、更换造型、点击绿旗 / 角色。

下载宝可梦图片

因为是“宝可梦猜猜我是谁”游戏,所以先前往“宝可梦图鉴”的官方网站。

宝可梦图鉴:https://tw.portal-pokemon.com/play/pokedex

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 前往“宝可梦图鉴”的官方网站

选择想要进行游戏的宝可梦,在宝可梦图片上按右键,选择“另存图片”,并将档名改成宝可梦的名字 ( 下载至少三种宝可梦 )。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 另存图片

将图片转换成 SVG

由于下载的图片是 PNG 格式,如果直接上传作为造型会变成“位图形”,如果要将位图形转换成全黑的“影子”,会造成后续大量处理图片的时间,所以需要先将下载的宝可梦图片转换成“SVG ”格式,使得上传的造型变成“向量图形”,就能快速制作全黑的影子。

首先打开 PNG2SVG 的工具网站 ( 还有其他不少类似的工具网站,这篇教学使用下方这个 ),点击“UPLOAD FILES”,选择宝可梦的图片上传。

PNG2SVG:https://png2svg.com/

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - PNG2SVG 上传图片

上传后就会自动进行转换,出现 SVG 缩图后,点击“DOWNLOAD”下载 SVG 图档,接着依此类推,将想要进行游戏的宝可梦图片,都转换成 SVG 格式。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 下载 SVG 图档

建立角色,上传宝可梦造型

使用“绘画”的方式,建立一个“空白”的角色。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 使用绘画方式建立角色

角色建立后,进入造型页签,移除第一个空白造型,接着使用“上传”方式,将 SVG 格式的宝可梦图片加入变成造型。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 使用上传方式增加造型

以下图为例,上传三张宝可梦的 SVG 图片变成三个造型。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 三个造型

制作宝可梦的影子

点击第一个造型,使用“选取”工具全选造型内容 ( 也可以使用 Ctrl + a 全选 ),将宝可梦的图案缩小为 200x200 左右 ( 从左侧造型清单可以看到实际大小 ),并对齐“画布中心点”。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 将宝可梦的图案缩小

用鼠标在造型上按“右键”,选择“复制”,复制一个一模一样的造型。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 复制造型

使用选取工具全选造型内容,使用“填满工具”,将每个区块颜色变成黑色。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 填满工具

使用选取工具选取“半透明的黑色”( 这个部分是图片本身的光晕 )。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 半透明的黑色

选取后删除半透明的黑色 ( 使用键盘的 del 或绘图工具的删除 ),就能得到漂亮的宝可梦影子,但如果仔细看,会发现黑色中间仍有一些白色细线,这些细线是不同色块的交界处。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 删除半透明的黑色

使用选取工具全选造型内容,加入“外框”,将外框粗细设定 2,颜色黑色,就能消除这些细线。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 消除细线

依此类推,将所有的造型都制作成“彩色版”和“影子版”两种,彩色版的名称使用原始宝可梦的名字。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 消除细线

积木程序原理

使用点击绿旗积木,当点击绿旗时,显示某一个宝可梦的影子造型,当角色被点击时,切换成该宝可梦有颜色的造型,并用讲话的方式讲出造型名称,持续两秒后换成下一个影子造型。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 显示某一个宝可梦的影子造型

完成后点击绿旗,就能看到基本的影子猜谜结果。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 基本的影子猜谜结果

了解基本原理后,将点击绿旗显示造型的积木,改成使用“随机数 x 2”的积木,随机显示影子造型 ( 因为共有三组颜色与影子,而颜色的造型编号是 1、3、5,影子造型是 2、4、6,所以如果使用随机数 1~3 去乘以 2,就可以变成读取 2、4、6 的造型 )。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 随机数 x 2

接着将刚刚的积木,修改成点击后出现“目前造型编号 - 1”的造型,意思是目前造型的“上一个造型”,也就会出现彩色的宝可梦,最后在点击后,继续显示随机影子,就能让游戏持续不断的进行下去。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 目前造型编号 - 1

使用调整亮度的作法

如果不是很在乎影子中的细线 ( 前面的作法可以消除影子中接缝处的白色细线 ),也可以采用“调整亮度”这种比较简单的做法,前往角色的造型,单纯使用四个宝可梦的造型 ( 同样要使用 SVG )。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 单纯使用四个宝可梦的造型

接着可以使用“图像效果 - 亮度”的积木,将亮度设为 -100 让角色变成全黑影子,当用户点击角色时,再将亮度调整回 0,就能做到猜猜我是谁的游戏效果。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 ) - 将亮度设为 -100 让角色变成全黑影子

完成效果

完成后,点击绿旗,就可以开始进行宝可梦猜猜我是谁的游戏。

Scratch 教学 - 宝可梦猜猜我是谁 ( 基本 )

范例解答

延伸应用

参考“( 范例 ) 宝可梦猜猜我是谁,全部填满皮卡丘”这篇生成式 AI 的有趣效果,也能够实作搞笑版本的宝可梦猜猜我是谁。

范例:宝可梦猜猜我是谁,全部填满皮卡丘

Leonardo.Ai 教学 - ( 范例 ) 宝可梦猜猜我是谁,全部填满皮卡丘

意见反馈

微信二维码 微信扫码关注 抖音二维码 抖音扫码关注