How to Make a Virtual Town in Scratch | RPG | Tutorial

Scratch Team
7 Jul 202108:51

Summary

TLDREn este video, Zoë de Scratch muestra cómo crear una ciudad virtual en Scratch. Al finalizar, los espectadores podrán diseñar su propio pueblo con personajes y lugares personalizados donde los jugadores puedan caminar y hablar con diferentes personajes, utilizando el proyecto para crear una historia o un juego de mundo abierto. Seguidamente, Zoë guía en la selección de un personaje principal, la adición de un fondo de visualización desde arriba, y cómo dibujar un sendero. Luego, se procede a agregar un personaje hablante y a programar la capacidad de moverse entre diferentes escenarios. Además, se incluye cómo hacer que el personaje principal se mueva con las teclas de flecha, proporcionando una sensación de caminar por la ciudad. Finalmente, se ofrece un enlace a un proyecto inicial para que los espectadores puedan empezar a trabajar en su propio proyecto de ciudad virtual.

Takeaways

  • 🎮 Se puede crear un juego de simulación de ciudad en Scratch donde los jugadores diseñan su propia ciudad con personajes y lugares personalizados.
  • 👤 Se puede elegir un personaje principal que se moviliza por la ciudad, como Jordan en este ejemplo.
  • 🖼️ Se pueden agregar fondos personalizados a la ciudad, incluyendo dibujos de casa, parques o lagos, utilizando las herramientas de pintura de Scratch.
  • 🗣️ Los personajes secundarios, como el Unicornio en este tutorial, pueden programarse para hablar cuando el jugador los selecciona.
  • 🔄 Los personajes pueden ser mostrados u ocultados en función del fondo en el que se encuentren, lo que permite la creación de una narrativa más rica.
  • ➡️ El jugador puede moverse entre diferentes ubicaciones de la ciudad usando flechas que cambian el fondo.
  • 🔄 Se pueden utilizar los bloques de código para que el personaje principal se mueva en respuesta a las pulsaciones de las teclas de flecha.
  • 🏡 Se pueden crear múltiples escenarios para la ciudad, como caminos, casas y lagos, y copiar y pegar elementos para ahorrar tiempo.
  • 📝 Los nombres de los fondos deben ser descriativos para facilitar la programación y la navegación entre ellos.
  • 👣 La movilidad del personaje principal puede ser controlada por las teclas de flecha para una experiencia de juego más interactiva.
  • 🔗 Se proporciona un enlace a un proyecto inicial en la descripción del video para que los aprendices puedan empezar a trabajar en su propio proyecto.
  • 🎉 El vídeo finaliza con un ánimo positivo, animando a los espectadores a crear sus propias ciudades virtuales y compartiendo la emoción de Zoë por ver sus creaciones.

Q & A

  • ¿Quién es Zoë y qué quiere mostrar en el video?

    -Zoë es parte del equipo de Scratch y también se conoce como Zinnea. Quiere mostrar cómo crear una ciudad virtual en Scratch.

  • ¿Qué se puede hacer al final del video?

    -Al final del video, se podrá crear un juego en el que se pueda diseñar una ciudad con personajes y lugares propios, donde los jugadores puedan caminar y hablar con diferentes personajes.

  • ¿Cómo se elige al personaje principal del proyecto?

    -Para elegir al personaje principal, se debe desplazarse sobre 'choose a Sprite' y hacer clic en 'choose', pudiendo elegir cualquier personaje que se desee.

  • ¿Cómo se agrega un fondo en Scratch?

    -Se puede elegir un fondo existente en Scratch haciendo clic en el botón 'choose a background'. Si se desea un fondo de vista superior, se debe hacer clic en 'paint' y dibujar con las herramientas proporcionadas.

  • ¿Cómo se agrega un camino en el fondo?

    -Para agregar un camino, se utiliza la herramienta de pincel y se establece el color en naranja, disminuyendo el slider de saturación para obtener un tono más desvanecido, y luego se ajusta el tamaño del pincel a un valor grande para dibujar el camino.

  • ¿Cómo se hace para que un personaje hable?

    -Para hacer que un personaje hable, se va a la categoría 'looks', se arrastra un bloque 'say' y se escribe el mensaje que el personaje dirá. Además, se utiliza un bloque 'when this Sprite clicked' de la categoría 'events' para que el personaje hable al hacer clic en él.

  • ¿Cómo se crean múltiples ubicaciones en la ciudad?

    -Se deben dibujar varios fondos adicionales para la ciudad, haciendo clic en 'choose a backdrop' y luego en 'paint' para diseñar cada ubicación con elementos como casas, lagos, etc.

  • ¿Cómo se puede copiar una forma en Scratch?

    -Para copiar una forma, se hace clic en la forma y se selecciona la opción 'copy'. Para copiar múltiples formas, se seleccionan todas las formas deseadas manteniendo presionada la tecla 'shift' y luego se hace clic en 'copy'.

  • ¿Cómo se permite que un personaje viaje entre diferentes ubicaciones?

    -Se agrega un Sprite de flecha y se utiliza un bloque 'next backdrop' de la categoría 'looks' junto con un bloque 'when this Sprite clicked' de la categoría 'events' para permitir que el personaje se mueva a la siguiente ubicación al hacer clic en la flecha.

  • ¿Cómo se asegura que un personaje aparezca solo en una ubicación específica?

    -Se utilizan bloques 'hide' y 'show' de la categoría 'looks' y un bloque 'when backdrop switches to' de la categoría 'events' para programar la aparición y desaparición del personaje según el fondo en el que se encuentre el jugador.

  • ¿Cómo se hace que el personaje principal se mueva con las teclas de flecha?

    -Se utiliza un bloque 'change X by' de la categoría 'motion' junto con bloques 'when key pressed' de la categoría 'events', seleccionando las teclas de flecha derecha e izquierda para mover al personaje horizontalmente y las teclas de flecha arriba y abajo para moverlo verticalmente.

  • ¿Dónde puedo encontrar el proyecto inicial para empezar a crear mi propia ciudad virtual?

    -El enlace al proyecto inicial se encuentra en la descripción del video, donde se puede remix para comenzar a crear la propia ciudad virtual.

Outlines

00:00

🎨 Crear un pueblo virtual en Scratch

Zoë de Scratch muestra cómo crear un juego de simulación de un pueblo virtual. Se describe cómo diseñar tu propio pueblo con personajes y lugares personalizados, donde los jugadores pueden caminar y hablar con diferentes personajes. Además, se ofrece la posibilidad de utilizar esta creación para contar una historia o desarrollar un juego de mundo abierto. Se inicia el proceso eligiendo un personaje principal y seguidamente se le enseña a agregar un fondo de visualización desde arriba, creando un sendero y luego añadiendo personajes con los que el jugador pueda interactuar. Finalmente, se explica cómo hacer que el jugador pueda caminar entre diferentes ubicaciones en el juego.

05:00

🚶 Habilidad de movimiento y interacción del personaje principal

Seguidamente, Zoë explica cómo hacer que el personaje principal se mueva cuando se presionan las teclas de flecha. Se detalla cómo utilizar bloques de Scratch para que el personaje cambie su posición en el eje X y Y en función de las teclas presionadas. Además, se aborda cómo hacer que el personaje Unicornio solo aparezca en un fondo específico, el de la laguna, utilizando bloques para mostrar y ocultar el personaje en función del fondo actual. Esto permite crear un juego donde los personajes aparecen en diferentes ubicaciones y el jugador puede interactuar con ellos mientras explora el pueblo. Finalmente, se proporciona un enlace al proyecto inicial en la descripción del video para que los espectadores puedan remixarlo y comenzar su propia creación.

Mindmap

Keywords

💡Scratch

Scratch es una plataforma de programación lúdico-educativa que permite a los usuarios crear sus propios videojuegos, animaciones y arte interactivo. En el video, Scratch se utiliza para enseñar cómo crear una ciudad virtual donde los jugadores pueden interactuar con personajes y entornos diseñados por ellos mismos.

💡Caracteres

Los personajes son las entidades que los jugadores controlan o con las que interactúan en un videojuego. En el contexto del video, el creador selecciona un personaje principal llamado Jordan y luego agrega otros personajes, como un Unicornio, para que el jugador pueda interactuar con ellos a lo largo de la ciudad virtual.

💡Fondo

El fondo, o backdrop, es el escenario visual en el que se desarrolla la acción de un videojuego. En la lección, se describe cómo crear y personalizar fondos para una ciudad virtual desde cero, utilizando herramientas de pintura para dibujar elementos como un camino, una casa o un lago.

💡Programación

La programación es el proceso de escribir y organizar código para que un ordenador ejecute tareas específicas. En el video, la programación se refiere a la acción de crear código en Scratch que determine cómo los personajes se mueven, hablan y reaccionan a las interacciones del jugador con el entorno.

💡Interacción

La interacción hace referencia a la capacidad de los jugadores de interactuar con los elementos del juego, como personajes, objetos o entornos. En el tutorial, la interacción se logra a través de bloques de código que permiten que los personajes hablen cuando son clicados por el jugador.

💡Movimiento del Personaje

El movimiento del personaje es una característica fundamental en los videojuegos que permite a los jugadores controlar la posición y dirección de los personajes en la pantalla. En el video, se explica cómo programar el movimiento del personaje principal usando las teclas de flecha del teclado para simular caminar por la ciudad virtual.

💡Código

El código es una serie de instrucciones escritas en un lenguaje de programación que un ordenador puede entender y ejecutar. En el contexto del video, el código se refiere a los bloques de programación en Scratch que se arrastran y colocan para crear la lógica del juego y el comportamiento de los personajes.

💡Bloques de Programación

Los bloques de programación son elementos visuales en Scratch que representan diferentes partes del código. Los usuarios pueden arrastrar y soltar estos bloques para crear comandos y funciones en su proyecto. En el video, se utilizan bloques de programación para controlar eventos, como cuando un personaje habla o cuando el jugador cambia de escenario.

💡Ciudad Virtual

Una ciudad virtual es una representación digital de un entorno urbano que puede ser explorado por los jugadores en un videojuego. En el video, el objetivo es crear una ciudad virtual donde los jugadores pueden caminar, interactuar con personajes y explorar diferentes lugares.

💡Diseño Gráfico

El diseño gráfico es el proceso de crear imágenes visuales para transmitir información o decorar artefactos. En el tutorial, el diseño gráfico se aplica al dibujo de los fondos y los elementos del juego, como caminos, casas y lagos, para construir la apariencia de la ciudad virtual.

💡Juego Abierto

Un juego abierto, o open-world game, es aquel en el que los jugadores tienen libertad para explorar un mundo grande y abierto sin una secuencia de eventos fija. En el video, se sugiere que los usuarios pueden ampliar su ciudad virtual para crear un juego abierto personalizado.

Highlights

Zoë from the Scratch team introduces a tutorial on creating a virtual town in Scratch.

The video demonstrates how to design a game with customizable towns, characters, and locations.

The main character is chosen from a selection of available Sprites.

A top-down view background is created by painting a green rectangle and an orange path.

A character is added for the player to interact with, using a 'say' block for dialogue.

The character's ability to talk is triggered by a 'when this Sprite clicked' event block.

Multiple locations are created by drawing additional top-down backgrounds for the town.

A simple house is drawn using different shades of brown rectangles.

A lake is added to one of the backgrounds with a blue squiggle.

A method to copy and paste shapes for efficient background creation is shown.

Backgrounds are named for easier coding and reference.

Arrow Sprites are used to navigate between different backgrounds.

The Unicorn character is programmed to only appear at the lake background.

The 'hide' and 'show' blocks are used to control the Unicorn's visibility based on the background.

The main character is coded to move with the arrow keys, enhancing the interactive experience.

The 'when key pressed' block is utilized to control character movement in response to key presses.

The tutorial concludes with a link to a starter project for viewers to remix and create their own virtual towns.

Zoë encourages viewers to have fun and explore their creativity in building virtual towns.

Transcripts

play00:00

- Hi everyone.

play00:00

It's Zoë from the Scratch team, also known as Zinnea.

play00:04

Today I wanted to show you

play00:05

how to make a virtual town in Scratch.

play00:08

By the end of this video,

play00:09

you'll be able to make a game like this one,

play00:12

where you can design your own town

play00:14

with your own characters in it and your own locations,

play00:17

where the player can walk around

play00:18

and talk to different characters.

play00:20

You can use this to make your own story

play00:22

or your own open-world game.

play00:23

Or really anything you want.

play00:26

So, yeah, let's get started.

play00:27

So first let's pick a character to be

play00:29

the main character of the project,

play00:31

the one that we'll walk around.

play00:32

I'll just hover over, choose a Sprite and click choose,

play00:36

and you can pick any character you want.

play00:38

I think I'll pick Jordan.

play00:39

Now let's add a background.

play00:41

You could click this button that says, choose a background.

play00:43

If you want to pick one of the backgrounds

play00:45

that are already in Scratch,

play00:46

but you might want a top down background.

play00:49

So a background that's viewed from above.

play00:51

Let me show you how to draw one of those really easily.

play00:54

So just hover over, choose a background and click paint.

play00:58

And here's what I'll do.

play00:59

I will click on the rectangle tool

play01:00

and then I'll set the color to green,

play01:02

and then I'll drag a rectangle that fills the whole stage.

play01:06

And now I'll draw a path across the grass.

play01:08

So I'll click on the paintbrush tool and I'll set the color

play01:13

to an orange color and then decrease the saturation slider.

play01:16

So that makes it like a faded orange or a brown

play01:19

and then I will set the paint brush size

play01:21

to something really big, like a hundred.

play01:23

And then I'll just scribble with the paint brush

play01:26

and yeah, there you go, that's a path.

play01:28

Okay, so now we have a really simple top-down background

play01:31

of a part of the town.

play01:32

Next let's add a character for the player to talk to.

play01:35

So again, I'll just hover over, choose a Sprite

play01:38

and click choose.

play01:39

You can pick any character that you want to be in your town.

play01:42

I think I'll pick the Unicorn.

play01:43

Let's make it so this character can talk.

play01:46

I'll go to the looks category and drag out a say block.

play01:49

And you know, you can just click that

play01:51

to have the character say something.

play01:52

You can write whatever you want in here,

play01:54

and let's make the character talk when we click on it.

play01:57

So to do that,

play01:58

I'll go to the events category

play02:00

and drag out when this Sprite clicked block,

play02:03

which is good for making something happen

play02:04

when you click on a Sprite.

play02:05

So now when I click on the Unicorn, it says, hello.

play02:09

So that's how you can add a character you can talk to.

play02:11

Now, let's make the player be able to walk between

play02:14

multiple different locations.

play02:16

So let's draw a couple more backgrounds for our town.

play02:19

So I'll hover over, choose a backdrop and click paint again.

play02:23

And now you get to think,

play02:24

what do you want to be here at this location in your town?

play02:26

I think I'll make there be a house here.

play02:28

So I'll make another green rectangle to be the grass.

play02:31

And then let me show you my

play02:32

extremely simple way of drawing a house.

play02:34

I will set the color to brown and draw a rectangle,

play02:37

and then I will pick a different shade of brown

play02:40

and draw another rectangle on top

play02:42

and then pick a different brown color

play02:44

and make a rectangle and try to get it to line up

play02:47

with the bottom here.

play02:49

And I say, that's a house.

play02:50

Of course you can draw it however you want.

play02:52

And you know, I'll also add a lake on this background,

play02:55

so I'll just set the color to blue

play02:57

and draw a little squiggle.

play02:59

And let's draw one more background,

play03:01

so I will paint a new one and make another green square.

play03:04

I think for this one, I'll do three houses on a street.

play03:08

And if you don't wanna have to draw a house again,

play03:10

you can click on this background

play03:12

and I'm gonna copy this house.

play03:14

To copy one shape, you could click on it and click copy,

play03:17

but we wanna copy all three shapes.

play03:19

So I will click on one part and then hold down shift.

play03:23

And while I'm holding down shift,

play03:24

click on the other two shapes.

play03:26

So now I've selected them all and I will click copy.

play03:29

And then I'll go down to this background and click paste.

play03:33

And now, I didn't have to draw the house again.

play03:35

So I'll put this over here, and you know what?

play03:37

I will paste another house and another one,

play03:40

and maybe I'll make them slightly different colors.

play03:43

So I can just click on any part of one of the houses

play03:45

and change the color up here.

play03:47

And you know what?

play03:48

I will paint one road.

play03:50

Okay, nice, now we have

play03:51

three different locations for our town.

play03:53

The last thing I'll do is

play03:54

I'm just gonna name these backgrounds

play03:56

so that I can know which one is which when I'm coding them.

play03:59

Okay, now let's make it so the character

play04:01

can travel between them.

play04:03

There's actually a really easy way to do this.

play04:05

So let me show you,

play04:06

I'll choose another Sprite

play04:07

and I'm gonna add this arrow Sprite,

play04:10

and now let's make it so that when this Sprite is clicked,

play04:14

it goes to the next backdrop.

play04:16

In the looks category, there's this block next backdrop.

play04:18

And you can click on that to go to the next background.

play04:22

And I will get that when this Sprite clicked block

play04:25

from the events category and put it on top.

play04:28

And now if we press it, it goes to the next backdrop.

play04:31

And let's also add an arrow

play04:33

so that you can go to the previous background.

play04:35

I'll add another arrow, Sprite.

play04:38

And then I want it to flip directions,

play04:40

which you can do by going to the costumes tab

play04:42

and then clicking flip horizontal.

play04:45

And now, let's go back to the code tab.

play04:46

Now, when this Sprite is clicked,

play04:48

we want to go to the previous backdrop.

play04:50

And the way to do that is in the looks category,

play04:53

you can drag out this block, switch backdrop to,

play04:56

and in the menu, you can choose previous backdrop.

play05:00

And now this block makes you go to the backdrop before.

play05:04

And let's add the,

play05:04

when the Sprite clicked block on top again,

play05:08

and there you go.

play05:09

Now, you can click this button to go forward

play05:12

and this button to go backward.

play05:13

Here's one thing, right now, the Unicorn shows up

play05:16

no matter what background you go to.

play05:18

Let's make it, so the Unicorn only appears

play05:20

at one of the backgrounds.

play05:21

So it's like, that's where the Unicorn is in the town.

play05:24

So let's say the Unicorn is by the lake.

play05:26

So we only want the Unicorn to appear

play05:28

if we're at the lake background.

play05:29

Here's how you do that,

play05:30

in the looks category, there are these blocks hide and show,

play05:34

and you can click them to make the Unicorn

play05:36

appear or disappear.

play05:37

And then in the events category,

play05:38

there's this block when backdrop switches to,

play05:41

and you can use this block to make a character do something

play05:45

when the background changes to a certain background.

play05:48

So for example,

play05:49

I can make it so that when the backdrop switches to

play05:52

house and lake, the Unicorn will appear, it will show up.

play05:56

So let's go there, okay, yeah.

play05:58

Now, the Unicorn appears when we go to the lake.

play06:01

And let's make it so that

play06:03

when we go to one of the other locations,

play06:06

the Unicorn will hide, will disappear.

play06:08

So when the background switches to the path,

play06:12

I'll make the Unicorn hide.

play06:13

And when the background switches to the houses in the path,

play06:16

I'll also make the Unicorn hide.

play06:17

So now, if we traveled between the backgrounds,

play06:20

the Unicorn only shows up at the lake background.

play06:22

And so this is really helpful because now

play06:25

you can make a game where there are different characters

play06:28

at different locations, and you can walk around and

play06:31

meet them all.

play06:32

Now, let's add one last thing.

play06:34

Let's make it so that the main character

play06:35

moves when you press the arrow keys.

play06:37

So that the player really feels

play06:39

like they're walking around the town.

play06:40

I'll click on the main character

play06:41

so that we can add code to her.

play06:43

In the motion category, this block change X by 10.

play06:46

We'll make a character move this way.

play06:48

If you don't already know in Scratch

play06:51

X represents how far a Sprite is

play06:53

from this side of the screen to this side of the screen.

play06:56

So if you increase X by 10, if you change X by 10,

play07:00

this Sprite will move this way.

play07:02

And if you change X by negative 10,

play07:04

the Sprite will move this way 'cause you're decreasing X.

play07:07

So that's how you can make a character

play07:09

move this way or that way.

play07:10

Let's make this happen

play07:11

when we press the right arrow key and the left arrow key.

play07:14

To do that, you can go to the events category,

play07:17

and there's this really helpful block

play07:18

when space key pressed.

play07:20

So this block can make something happen

play07:22

when a player presses a certain key.

play07:24

So instead of space key, let's pick right arrow key,

play07:28

and I'll put it on top of this change X by 10 block.

play07:31

And so now when I press the right arrow key,

play07:34

Jordan moves this way, changes X by 10,

play07:37

and let's make it so that when I press the left arrow key,

play07:40

she goes this way, so change X by negative 10, okay, nice.

play07:44

And let's do the same for going up and down.

play07:46

So going back to the motion category,

play07:49

so X represents how far a Sprite is

play07:51

from this side of the screen to that side of the screen.

play07:54

And Y represents how high up a Sprite is.

play07:57

So if I change Y by 10, she goes up.

play08:01

And if I change Y by negative 10, she'll go down.

play08:04

Let's drag out, when key pressed block and choose up arrow

play08:08

and make the Sprite go up, when I press that

play08:10

and drag out when key pressed block and choose down arrow

play08:15

and make the Sprite go down when I click back.

play08:17

So now the character can move around with the arrow keys.

play08:21

So yeah, that's how you can make your own virtual town.

play08:24

You could have as many characters as you want

play08:26

or backgrounds as you want.

play08:27

Also this link to this starter project

play08:30

is in the description below.

play08:31

So if you want to, you can always remix that.

play08:35

I hope you have fun making virtual towns.

play08:36

I can't wait to see them.

play08:37

I'll see you next time and Scratch on.

play08:41

(upbeat music)

Rate This

5.0 / 5 (0 votes)

Related Tags
Creación de juegosProgramación ScratchDiseño de ciudadesCaracteres personalizadosEntorno interactivoTutorial de programaciónCódigo de juegosEducación técnicaCreación de historiasJuegos abiertosDesarrollo de software
Do you need a summary in English?