如何使用 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 矢量图形可以在其他程序中打开吗?

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

回复 brankaspedia

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

您的文章非常有趣。

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

回复 Martin Dynon

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

Creative Commons License本作品采用知识共享署名-相同方式共享 4.0 国际许可协议进行许可。
© . All rights reserved.