如何使用 Scratch 3 绘制矢量图形

使用 Scratch 的矢量绘图应用程序为你的视频游戏创建新对象。
214 位读者喜欢这篇文章。
Python game screenshot

OpenGameArt.org

Scratch 是一种流行的可视化编程语言,用于创建视频游戏和动画。它还具有矢量绘图工具,任何人都可以使用它来创建独特的游戏资源和艺术作品。

Scratch 1.0 是用 Smalltalk 编写的,Smalltalk 是一种极其容易破解的编程语言,允许用户窥探软件的幕后。它在各个平台上都很流行,甚至被 Raspberry Pi 基金会分支出来以获得扩展支持。

Scratch 3.0 已被从头开始重写。它基于 HTML5 和 JavaScript,这意味着它在平板电脑或手机上与在笔记本电脑或台式机上运行一样好。

什么是矢量?

矢量绘图与使用普通绘画应用程序绘图不同。无论放大或缩小多少,矢量图像看起来都很平滑。没有像素化。矢量在任何尺寸下都能创建平滑且完成的产品。

在 Scratch 中,游戏中可玩的角色称为精灵。Scratch 有一个预制精灵库,可以用于项目,但你也可以使用内置的绘画程序或内置的矢量应用程序绘制自己的精灵。

如何吃掉一头大象

使用矢量绘图不需要绘画技巧。与其一次性绘制一个对象,不如将其分解为单独的形状。寻找圆形、椭圆形、三角形和矩形。使用照片或你正在绘制的对象的实物模型可能会有所帮助。

我将通过解释如何绘制一个苹果来演示在 Scratch 中绘制矢量精灵的所有要点,但你可以将此方法应用于你想创建的任何对象。

绘图工具

Scratch 的矢量绘图工具箱是你找到绘制对象所需工具的地方

Scratch tools

以下是一些与矢量图形绘制相关的词汇

  • 画布:你绘图的地方;白色和灰色棋盘格是透明的
  • 节点:沿着对象路径的点,决定对象的形状
  • 对象:画布上的圆形、正方形或线条
  • 箭头工具:使用此工具抓取、调整大小和旋转对象
  • 节点工具:使用此工具添加、移动和选择节点

开始入门

要开始绘图,请打开 Web 浏览器并导航到 Scratch.mit.edu。如果你正在使用 Scratch Desktop,请打开应用程序。

要打开一个新项目,请从顶部菜单中选择创建。要打开 Scratch 的矢量绘图应用程序,请单击蓝色的 Scratch 猫图标,然后选择画笔图标。这将创建一个新的精灵画布。

Selecting the paintbrush icon to open the vector drawing app

有两种创建自定义精灵的方法

  • 要创建一个全新的精灵,请使用并组合工具箱中的任何绘图工具。
  • 要更改现有精灵的外观,请单击右下角精灵的图标使其处于活动状态,然后单击工具箱中的箭头工具,单击画布上的精灵,并进行你想要的更改。

警告:如果你单击绘图屏幕底部的转换为位图按钮,你的插图将变成像素化的位图图像,并且你将无法将其恢复为矢量。

绘制苹果形状

  1. 选择一个空白精灵画布,然后选择圆形工具。通过单击空白画布并拖动鼠标来创建一个圆形。按住 Shift 键执行此操作会创建一个完美的圆形。
  2. 要更改圆形的颜色,请选择箭头工具,单击圆形以选择它,然后单击填充下的下拉菜单。这将打开用于更改形状的颜色、饱和度和亮度的选项。

    – 如果你想让形状是透明的,请选择带有对角红色线条的白色框,将颜色设置为“无”。

    – 如果你想在你的对象周围添加或删除彩色边框,请选择轮廓下的下拉菜单。
    Changing the fill color
  3. 选择节点工具。单击你对象的中心以选择它。你将看到四个节点均匀地分布在圆形的边缘周围。

    Node tool



    移动任何节点都会改变圆形的形状。你可以通过单击圆形的边缘来添加更多节点。如果你移动节点太多或意外添加了节点,你可以通过单击屏幕顶部的后退箭头图标来撤消你的上一步操作。你也可以按 Ctrl+Z 撤消。

  4. 苹果通常底部比顶部小。单击并拖动两个侧面节点以选择它们。节点在被选中时会变成蓝色。

    Dragging to select multiple nodes



    在节点被选中的情况下,按键盘上的向上箭头键将节点向上移动到圆形的顶部。

    Moving nodes with the Up arrow
  5. 在圆形的底部添加两个节点——一个在原始底部节点的左侧,另一个在右侧。稍微向上抬起原始底部中心节点以创建一个凹痕。

    Editing nodes
  6. 现在以类似的方式在圆形的顶部添加两个节点。稍微向下降低原始顶部中心节点以创建一个凹痕。
  7. 继续调整和添加节点,直到你对苹果的形状感到满意为止。

绘制茎

  1. 选择矩形工具。在画布上你想要茎的位置创建一个长而细的矩形。
  2. 使用节点工具塑造矩形,使其类似于茎。将填充更改为你想要的颜色。
  3. 使用箭头工具选择茎。要将茎移动到苹果后面,请单击画布上方的后退按钮。

    Creating the apple stem

添加高光形状

  1. 选择线条工具。通过将每条新线与前一条线的末端连接起来,在苹果形状上绘制一个三角形。这将把线条变成一个完整的形状。
  2. 使用箭头工具选择三角形,并使用填充工具将其更改为较浅的颜色,例如白色。
  3. 使用节点工具添加和调整节点以创建高光形状。如果节点太尖锐和尖角,你可以将它们更改为弯曲的。选择你要弯曲的节点,然后单击弯曲按钮。

    – 专家提示:要一次选择多个节点,请在选择每个节点时按住 Shift 键。
    Drawing the highlight shape

就这样,你已经画了一个无限可缩放的苹果。

 

如果你想在 Scratch 之外使用你的图像,请右键单击服装缩略图并选择“导出”。这将把你的绘图下载为 .svg 文件。

Export a vector to a svg file

opensource.com

要在 Scratch 项目中使用该图像,请返回代码选项卡。你的新精灵将出现在右上角,与项目的其余精灵一起。在你的 Scratch 项目中使用它,在 Scratch 网站上与其他 Scratch 用户分享它,最重要的是——用矢量绘制更多酷炫的东西。

接下来阅读什么
User profile image.
Jess Weichler 是一位数字艺术家,使用开源软件和硬件在数字世界和物理世界中创作作品,网址为 CyanideCupcake.com。

9 条评论

我也喜欢在用 Scratch 3 创建游戏时绘制自己的背景… 感谢你分享关于如何在 Scratch 3 中绘制矢量的步骤。

Nhick

非常欢迎!很高兴你发现 Scratch 3 对创建你的视频游戏背景很有用。感谢你的阅读和评论!

回复 作者 SocialNic

我感谢你努力分享关于使用开源工具创作的艺术主题的信息。这很有帮助,并且看到其他艺术家关心开源令人鼓舞!请继续发布!

你的文章非常有趣。但我有一个问题,Scratch 3 矢量图形可以在其他程序中打开吗?

这是一个很好的问题!是的,无论是保存为 .png 还是 .svg,在 Scratch 中创建的矢量图形都可以在其他程序中打开,例如 Inkscape。

回复 作者 brankaspedia

我在网上找到了很多关于 Java sript 的课程

你的文章非常有趣。

谢谢 Martin,我很高兴你觉得它有用!

回复 作者 Martin Dynon

感谢分享,这太有帮助了!

Creative Commons License本作品根据知识共享署名-相同方式共享 4.0 国际许可协议获得许可。
© . All rights reserved.