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

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

OpenGameArt.org

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

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

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

什么是矢量?

矢量绘图与使用普通画图应用程序绘图不同。矢量图像无论放大或缩小多少倍都显得平滑。不会出现像素化。矢量在任何尺寸下都能创建平滑且成品化的产品。

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

如何吃掉一头大象

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

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

绘图工具

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

Scratch tools

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

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

入门

要开始绘图,请打开 Web 浏览器并导航到 Scratch.mit.edu。如果您使用的是 Scratch 桌面版,请打开该应用程序。

要打开一个新项目,请从顶部菜单中选择 创建。要打开 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本作品根据 Creative Commons Attribution-Share Alike 4.0 International License 许可获得许可。
© . All rights reserved.