https://www.youtube.com/watch?v=DaNQPek2TNw

Tutorial de Scratch 2.0: Editores Gráfico y de Sonido

¡Muy buenas a todos! En el tutorial de hoy vamos a explorar las novedades más importantes de la nueva versión de Scratch, la versión 2.0. Las mejoras realmente importantes están en el editor gráfico y en el editor de sonido.

Vamos a revisar sus posibilidades y cómo podemos aprovecharlas al máximo. ¡Empecemos!

🖥️ Paso 1: Cargando el Programa y Preparando el Entorno

Haz clic en "Crear" para cargar un nuevo proyecto en Scratch.
Cierra la ventana de ayuda (tips) haciendo clic en la "X" para tener más espacio de trabajo.
Haz clic encima del gato (nuestro personaje principal) para seleccionarlo.

🖌️ Paso 2: El Editor Gráfico - Disfraces

Vamos a ver el editor gráfico de este objeto. Como podrás observar, nuestro gato tiene dos disfraces. Cada disfraz es una imagen que representa a nuestro personaje.

📸 ¿Qué son los Disfraces?

Cada objeto puede tener tantas imágenes como se quiera.
En el caso del gato, tenemos dos imágenes donde cambian los pies. Esto nos servirá para intercalar un disfraz por otro y lograr la ilusión de que el gato camina.

Ventajas de los disfraces:

Hacer que el gato ande.
Hacer que el gato salte.
Hacer que el gato maúlle.
Hacer que el gato piense.

🛠️ Gestionando Disfraces

Eliminar: Puedes eliminar un disfraz que no necesites.
Duplicar: Haz una copia del disfraz para trabajar sobre él y ahorrarte tener que volver a dibujarlo desde cero.

🎨 Paso 3: Herramientas del Editor Gráfico (Mapa de Bits)

Voy a crear un dibujo nuevo para que veáis las posibilidades del editor. Como se evidencia, es muy parecido al Paint de Windows. Veamos herramienta por herramienta:

✏️ Herramientas Básicas

Herramienta	Función
Pincel / Lápiz	Dibujar líneas. Podemos variar el grosor (más gruesas o más delgadas) y el color.
Selector de Color	Elegir colores directamente o usando el cuentagotas para seleccionar un color que ya existe y replicarlo.
Color Transparente	Es ese color blanco con una línea roja. Cuando lo elegimos, lo que hace es borrar. Veremos su utilidad más adelante.
Formas (Cuadrado, Círculo, etc.)	Dibujar formas geométricas. Podemos elegir si las queremos con relleno o solo con contorno.
Texto	Escribir texto. Podemos elegir el tipo de letra y cambiarlo después.
Bote de Pintura	Rellenar toda una imagen o área de un solo color.
Goma de Borrar	Borrar partes del dibujo.
Selector (Flecha)	Mover cosas. Una vez seleccionado el objeto, pulsando Suprimir lo eliminamos.
Sello	Genera una copia de la imagen seleccionada.

🔄 Opciones Adicionales

Giro: En la parte superior derecha, encontramos los botones de giro para voltear la selección de izquierda a derecha o de arriba a abajo.
Limpiar: Un botón en la zona central superior para borrar la pantalla completamente si decidimos empezar de nuevo.
Añadir / Importar: Para cargar imágenes de la librería o desde el ordenador.

🌈 Paso 4: El Poder del Color Transparente

Voy a importar una imagen para mostraros algo que comenté antes sobre el color transparente.

Cargamos una imagen (por ejemplo, un personaje como el murciélago).
Pulsa sobre esta imagen para que venga al frente.
Como podéis ver, tiene un fondo de color blanco que no es transparente, y por eso no me deja ver el murciélago con ese fondo.
Usando el color transparente que vimos antes y el bote de pintura, de una forma fácil nos quitaremos todo ese color blanco.
¡Fijaos! Si ahora movemos el objeto, no tapamos al murciélago que tenemos detrás.

🧬 Paso 5: Mapa de Bits vs. Vectores

Otra de las novedades de la última versión de Scratch es que puede dibujar tanto en mapa de bits como en vectores.

📊 Comparativa

Característica	Mapa de Bits	Vectorial
Concepto	La imagen es un montón de píxeles, cada uno con un color diferente.	Guarda la información de los puntos (nodos).
Ampliación	Al ampliar, perdemos calidad y vemos los píxeles.	Podemos ampliar sin perder calidad (escalable).
Edición	Trabajamos con píxeles.	Trabajamos con nodos y curvas.
Herramientas	Herramientas en la parte izquierda.	Herramientas en la parte derecha (al pulsar el botón de abajo).

🖌️ Editor de Vectores

Las herramientas son muy parecidas a las de mapa de bits: lápiz, cuadrado, círculo, texto.
Contamos con una herramienta de selección para elegir objetos, que podremos mover, hacer más grandes o más pequeños.
Tenemos una herramienta para examinar nodos.

🎯 Ventajas del Editor Vectorial

En el editor de mapa de bits, al ampliarlo veríamos los píxeles mucho más grandes y con sus bordes mal definidos.
En el editor vectorial, se analizan los puntos donde cambia la curvatura. Al ampliar el objeto, no pierde calidad.

Ejemplo práctico:

Vamos al gato original y lo marcamos.
Seleccionamos el botón de reformar.
Fijaos que, al acercarnos, cada uno de los objetos del gato tiene esos puntos marcados.
Esto nos permite hacerle las orejas más grandes o cambiar la forma del pie variando sus nodos.

🔊 Paso 6: El Editor de Sonidos

Es momento de revisar cómo funciona el editor de sonidos.

Iniciamos en la ventana de Scratch, viendo a nuestro amigo el gato.
Al lado de la pestaña de "Disfraces" , encontramos la pestaña de "Sonidos". Ahí tenemos el editor de audios.

🎵 Gestión de Sonidos

Como podéis ver, el gato tiene un sonido definido que es un maullido.
Podemos ver la onda del sonido.
Al igual que en el editor de gráficos, podríamos:

Cargar un sonido de la biblioteca (icono de la bocina).
Grabar un sonido (icono del micrófono).
Cargar un audio desde el ordenador (icono de la carpeta) en formato WAV o MP3.

✂️ Herramientas del Editor de Audio

Cuando grabes o cargues un sonido, el editor te permite modificarlo:

Cortar: Selecciona el espacio de silencio delante o detrás y ordénale que lo corte.
Subir/Bajar Volumen: Ajusta la intensidad del sonido.
Efectos:

Reversa: Pone el sonido al revés. Parecerá que estás hablando del revés.
Desvanecer / Aparecer: Para que empiece flojo y vaya subiendo, o que empiece fuerte y vaya bajando.

📊 Resumen de Editores

Editor Gráfico	Editor de Sonido
Disfraces: Imágenes del personaje.	Audios: Sonidos del personaje.
Herramientas: Pincel, formas, texto, bote, goma, sello.	Herramientas: Cortar, volumen, efectos (reversa, desvanecer).
Formatos: Mapa de bits y vectorial.	Formatos: WAV, MP3.
Importación: Librería, dibujo, imagen desde PC, cámara.	Importación: Librería, grabación, audio desde PC.

💡 Conclusión

Con estos editores, cada personaje puede tener:

Sus diferentes disfraces (imágenes) con sus nombres.
Sus diferentes sonidos con sus nombres.

Después podremos utilizar tanto disfraces como sonidos desde los programas hechos en Scratch, dándoles vida e interactividad a nuestros proyectos.

🎯 ¡Tu Turno!

Te propongo una práctica para familiarizarte con los editores:

Editor Gráfico:

Dibuja un personaje propio usando el editor vectorial.
Asígnale al menos 2 disfraces diferentes.
Prueba a importar una imagen y eliminar su fondo con el color transparente.

Editor de Sonidos:

Graba tu voz diciendo "Hola, soy un personaje de Scratch".
Corta los silencios del principio y del final.
Aplica el efecto de reversa y escucha el resultado.

¡Experimenta y diviértete! En el próximo tutorial, empezaremos a programar usando todos estos elementos. 🚀

Explorando el Editor Gráfico y el Editor de Sonido

Duración estimada: 20-25 minutos
Nivel: Principiante / Intermedio
Objetivo: Conocer a fondo las herramientas del editor gráfico (mapa de bits vs. vectores) y el editor de sonido (grabación, edición y efectos) de Scratch 2.0.

1. Introducción

Scratch 2.0 trajo consigo mejoras significativas, especialmente en dos áreas clave: el editor gráfico y el editor de sonido. Estas herramientas nos permiten personalizar completamente nuestros personajes y crear efectos de audio únicos sin necesidad de programas externos.

Editor Gráfico: Ahora podemos dibujar en dos modos diferentes (Mapa de Bits y Vectorial).
Editor de Sonido: Permite grabar, recortar y aplicar efectos a los audios directamente en Scratch.

2. El Editor Gráfico de Scratch 2.0

2.1. Acceso y Disfraces

Abre Scratch 2.0 y haz clic en "Crear".
Cierra la ventana de ayuda si aparece.
Haz clic en el Gato (tu personaje) y ve a la pestaña "Disfraces".
Verás que el gato tiene dos disfraces. La diferencia entre ellos es la posición de las patas. Esto se usa para crear la ilusión de que el gato camina al intercambiar un disfraz por otro.

2.2. Herramientas Básicas del Editor

El editor gráfico de Scratch es similar al Paint de Windows. Estas son sus herramientas principales:

Herramienta	Icono	Función
Pincel	🖌️	Dibuja líneas a mano alzada. Puedes cambiar el grosor y el color.
Línea	➖	Dibuja líneas rectas.
Rectángulo	◻️	Dibuja cuadrados y rectángulos. Puedes elegir si quieres relleno o solo contorno.
Círculo	⭕	Dibuja elipses y círculos. También con opción de relleno o contorno.
Texto	T	Permite escribir texto. Puedes cambiar el tipo de letra y el tamaño después de escribir.
Bote de Pintura	🪣	Rellena un área cerrada con un color sólido.
Goma de Borrar	🧹	Borra partes del dibujo.
Selector / Mover	➡️	Selecciona una parte del dibujo para moverla, redimensionarla o eliminarla (tecla Suprimir).
Sello	🖨️	Crea una copia exacta del objeto seleccionado.

2.3. Herramientas Avanzadas (Parte Superior)

En la parte superior derecha del editor encontramos:

Voltear Horizontal: Invierte la selección de izquierda a derecha.
Voltear Vertical: Invierte la selección de arriba a abajo.
Limpiar: Borra todo el dibujo por completo.

2.4. El Color Transparente y su Utilidad

Uno de los colores más importantes es el que tiene un cuadro blanco con una línea roja diagonal. Este es el color transparente.

¿Para qué sirve? Al pintar con este color, borramos los píxeles, dejando la zona transparente.
Ejemplo práctico: Si importas una imagen con fondo blanco (como un murciélago), puedes usar el bote de pintura con el color transparente para hacer clic sobre el fondo blanco y eliminarlo. Así, el personaje no tendrá un fondo sólido que tape a otros objetos al moverlo.

3. Mapa de Bits vs. Imagen Vectorial

Una de las grandes novedades de Scratch 2.0 es poder elegir entre dos modos de dibujo en la parte inferior del editor.

Característica	Mapa de Bits	Vectorial
Definición	La imagen es un conjunto de píxeles (puntos de color).	La imagen se guarda mediante fórmulas matemáticas (puntos, líneas y curvas).
Calidad al Ampliar	Pierde calidad, se ven los píxeles y los bordes se ven "dentados".	No pierde calidad, se amplía sin distorsión (bordes perfectos).
Herramientas	Pincel, líneas, relleno, etc. Están en la izquierda.	Herramientas similares, pero aparecen en la derecha. Además, incluye:
Herramienta Extra	No aplica.	Examinar Nodos: Permite seleccionar y modificar los puntos de anclaje de las formas para cambiar su silueta.

Ejemplo Práctico: Modificando al Gato

Asegúrate de estar en el modo Vectorial (botón en la parte inferior).
Selecciona el disfraz del gato.
Haz clic en la herramienta "Examinar Nodos" (es la que parece un cursor con un punto).
Haz clic sobre una parte del gato (ej. una oreja). Verás que aparecen pequeños cuadrados (nodos).
Arrastra esos nodos para cambiar la forma: haz las orejas más grandes, cambia la curvatura de la cola o modifica la forma de las patas. ¡Es una herramienta muy valiosa para personalizar personajes!

4. El Editor de Sonido

Ahora vamos a explorar la otra gran mejora de Scratch 2.0: el editor de sonido.

4.1. Acceso y Sonidos por Defecto

Ve a la pestaña "Sonidos" (al lado de la de "Disfraces").
El gato ya tiene un sonido predeterminado: un maullido.
Aquí podemos ver la onda de sonido, que representa gráficamente el audio.

4.2. Cómo Cargar o Crear Sonidos

Al igual que con los disfraces, tenemos tres opciones para conseguir sonidos:

Biblioteca (Bocina 🎺): Muestra una lista de sonidos predefinidos en Scratch (efectos, percusiones, etc.).
Grabar (Micrófono 🎤): Activa el micrófono del ordenador para grabar nuestra propia voz o sonidos.
Importar (Carpeta 📁): Carga un archivo de audio desde nuestro ordenador (formatos compatibles: .wav, .mp3).

4.3. Herramientas de Edición de Audio

Una vez que tenemos un sonido grabado o importado, podemos editarlo con estas herramientas:

Herramienta	Función
Seleccionar	Permite seleccionar una parte de la onda de sonido (silencios al inicio o al final).
Cortar	Elimina la parte seleccionada de la onda.
Subir Volumen	Aumenta la intensidad del sonido (útil si se escucha bajo).
Bajar Volumen	Disminuye la intensidad del sonido.
Efecto "Reversa"	Invierte el sonido (hace que suene al revés).
Efecto "Desvanecer"	Hace que el sonido empiece bajo y suba progresivamente (aparecer) o que empiece fuerte y baje (desaparecer).

4.4. Ejemplo Práctico: Grabar y Editar un Sonido

Haz clic en el icono del Micrófono y permite el acceso.
Presiona el botón de grabar y di "Hola".
Detén la grabación. Verás que hay espacios en blanco (silencio) al principio y al final.
Selecciona la parte del silencio al principio y haz clic en "Cortar". Repite con el silencio al final.
Ahora tenemos un audio limpio.
Prueba el efecto "Reversa" para escuchar "aloH".
Prueba el efecto "Desvanecer" para que el audio suba de volumen poco a poco.

5. Conclusión

Scratch 2.0 nos ofrece herramientas profesionales integradas que antes requerían software externo:

Editor Gráfico: Domina los modos Mapa de Bits (para dibujos simples) y Vectorial (para dibujos escalables y edición de nodos). Aprende a usar el color transparente para eliminar fondos.
Editor de Sonido: Graba, importa y edita audios. Recorta silencios, ajusta el volumen y aplica efectos como reversa o desvanecimiento.

Estas herramientas te permiten dar un toque único a tus proyectos, creando personajes y sonidos totalmente personalizados sin salir de Scratch.

5 Posibilidades del editor gráfico y del editor de audio recorte