Sprites y Disfraces en Scratch

Sprites y Disfraces en Scratch 🎭

Los sprites son los personajes y objetos de tus proyectos en Scratch. Son los “actores” que dan vida a tus historias, juegos y animaciones. En esta guía aprenderás todo sobre sprites, disfraces, y cómo crear personajes increíbles que capturen la imaginación.

¿Qué es un Sprite? 🎪

Un sprite es cualquier objeto que puede moverse, cambiar de apariencia, reproducir sonidos y ejecutar código en Scratch. Piensa en los sprites como los personajes de una obra de teatro digital.

Componentes de un Sprite

Cada sprite está compuesto por cuatro elementos principales:

🎨 Disfraces

Las diferentes “ropas” o apariencias que puede tener el sprite. Como cambiar de ropa en la vida real.

🔊 Sonidos

Los efectos de audio que el sprite puede reproducir, desde voces hasta efectos especiales.

📝 Scripts

El código que controla el comportamiento del sprite - qué hace y cuándo lo hace.

📍 Propiedades

Características como posición, tamaño, dirección, visibilidad y efectos especiales.

El Sprite del Gato (Scratch Cat)

Cuando inicias un nuevo proyecto, Scratch incluye automáticamente el famoso Gato de Scratch. Este sprite viene con:

2 disfraces predeterminados para animación de caminar
1 sonido “Miau”
Posición inicial en el centro del escenario (0, 0)

Creando y Agregando Sprites 🎨

Métodos para Agregar Sprites

Scratch te ofrece varias formas de agregar nuevos sprites a tu proyecto:

La forma más fácil de empezar

Haz clic en el ícono del sprite en la esquina inferior derecha
Selecciona “Elegir un Sprite”
Explora las categorías:
- Animales: Gatos, perros, peces, pájaros, etc.
- Personas: Diferentes personajes y profesiones
- Fantasía: Dragones, unicornios, elementos mágicos
- Deportes: Pelotas, equipos deportivos
- Transporte: Carros, aviones, barcos
- Objetos: Frutas, herramientas, elementos cotidianos

Ventajas:

Sprites profesionales y bien diseñados
Múltiples disfraces incluidos
Sonidos apropiados incluidos
Listos para usar inmediatamente

Gestión de Sprites

Lista de Sprites: Todos tus sprites aparecen en la parte inferior derecha de la pantalla. Desde aquí puedes:

Seleccionar: Haz clic para trabajar con un sprite específico
Duplicar: Clic derecho → “duplicar” para copiar un sprite
Eliminar: Clic derecho → “borrar” o arrastra a la papelera
Exportar: Clic derecho → “exportar” para guardar el sprite
Mostrar/Ocultar: Usa el ícono del ojo para controlar visibilidad

Trabajando con Disfraces 👗

¿Qué son los Disfraces?

Los disfraces son las diferentes apariencias que puede tener un sprite. Son como un guardarropa digital que permite a tu sprite cambiar de look instantáneamente.

Usos Comunes de Disfraces

🚶 Animación de Caminar

Alternar entre disfraces para simular movimiento de piernas y brazos.

😊 Expresiones Faciales

Diferentes emociones: feliz, triste, sorprendido, enojado.

🔄 Estados del Juego

Normal, dañado, power-up, invencible, etc.

🎬 Secuencias de Acción

Saltar, atacar, defenderse, celebrar.

🌈 Variaciones de Color

Mismo sprite en diferentes colores o estilos.

📈 Niveles de Progreso

Mostrar crecimiento, evolución o mejoras.

Creando y Editando Disfraces

Acceder al Editor de Disfraces:

Selecciona tu sprite
Haz clic en la pestaña “Disfraces”
Aquí verás todos los disfraces del sprite actual

Herramientas del Editor:

Pincel 🖌️

Dibujo libre con diferentes grosores
Perfecto para detalles y trazos orgánicos

Línea 📏

Líneas perfectamente rectas
Mantén presionado Shift para líneas horizontales/verticales

Círculo ⭕

Círculos y óvalos
Mantén presionado Shift para círculos perfectos

Rectángulo ⬜

Rectángulos y cuadrados
Mantén presionado Shift para cuadrados perfectos

Técnicas de Animación con Disfraces

1. Animación Básica de Caminar:

// Alternar entre disfraces para simular caminar
al presionar ⚑
por siempre
  mover (3) pasos
  siguiente disfraz
  esperar (0.2) segundos
fin

2. Animación Controlada por Movimiento:

// Solo animar cuando se mueve
al presionar ⚑
por siempre
  si <tecla [flecha derecha] presionada?> entonces
    cambiar x por (5)
    siguiente disfraz
    esperar (0.1) segundos
  si no
    cambiar a disfraz [parado]
  fin
fin

3. Secuencia de Acción:

// Animación de salto completa
al presionar tecla [espacio]
cambiar a disfraz [preparando-salto]
esperar (0.1) segundos
cambiar a disfraz [saltando]
repetir (10) veces
  cambiar y por (3)
fin
repetir (10) veces
  cambiar y por (-3)
fin
cambiar a disfraz [aterrizando]
esperar (0.2) segundos
cambiar a disfraz [normal]

4. Cambio de Estado Visual:

// Mostrar daño recibido
al recibir [jugador-dañado]
cambiar a disfraz [dañado]
repetir (5) veces
  fijar efecto [fantasma] a (50)
  esperar (0.1) segundos
  fijar efecto [fantasma] a (0)
  esperar (0.1) segundos
fin
cambiar a disfraz [normal]

Propiedades y Configuración de Sprites ⚙️

Propiedades Básicas

Cada sprite tiene propiedades que puedes modificar tanto con bloques como manualmente:

Posición:

X: Posición horizontal (-240 a 240)
Y: Posición vertical (-180 a 180)
Dirección: Hacia dónde apunta el sprite (0-360 grados)

Apariencia:

Tamaño: Porcentaje del tamaño original (1% a 500%)
Visibilidad: Mostrado u oculto
Capa: Orden de visualización (adelante o atrás)

Efectos Especiales:

Color: Cambio de matiz
Ojo de pez: Distorsión circular
Remolino: Efecto de torbellino
Pixelar: Efecto de píxeles grandes
Mosaico: Efecto de caleidoscopio
Brillo: Luminosidad
Fantasma: Transparencia

Panel de Información del Sprite

En la esquina superior derecha, puedes ver y modificar:

Información Básica:

Nombre del sprite
Posición X e Y actual
Dirección actual
Visibilidad (mostrado/oculto)
Tamaño actual

Configuraciones Especiales:

Modo de rotación: Cómo rota el sprite
- Todo alrededor: Rotación completa (360°)
- Izquierda-derecha: Solo voltea horizontalmente
- No rotar: Mantiene orientación fija

Interacción Entre Sprites 🤝

Detección de Colisiones:

// Detectar cuando dos sprites se tocan
si <tocando [Sprite2]?> entonces
  decir [¡Nos tocamos!]
fin

// Detectar colisión con color específico
si <tocando color [#FF0000]?> entonces
  decir [¡Toqué algo rojo!]
fin

// Detectar si un color del sprite toca otro color
si <color [#0000FF] tocando [#00FF00]?> entonces
  decir [¡Azul tocando verde!]
fin

Comunicación Entre Sprites:

// Sprite 1: Envía mensaje
al hacer clic en este objeto
enviar [sprite-clickeado]

// Sprite 2: Recibe y responde
al recibir [sprite-clickeado]
decir [¡El otro sprite fue clickeado!]
tocar sonido [ding]

Seguimiento y Persecución:

// Hacer que un sprite siga a otro
por siempre
  apuntar hacia [Jugador]
  mover (2) pasos
  si <(distancia a [Jugador]) < [30]> entonces
    // Muy cerca, hacer algo especial
    decir [¡Te atrapé!]
  fin
fin

Técnicas Avanzadas de Disfraces 🎨

Diseño de Disfraces Efectivos

1. Principios de Diseño:

🎯 Claridad

El sprite debe ser fácil de reconocer incluso en tamaño pequeño.

🌈 Contraste

Usa colores que se destaquen contra el fondo del escenario.

⚖️ Proporción

Mantén proporciones consistentes entre diferentes disfraces.

🎭 Personalidad

El diseño debe reflejar la personalidad y función del sprite.

2. Técnicas de Animación Avanzadas:

Animación de Ciclo Suave:

// Crear animación fluida con múltiples disfraces
fijar [frame-actual] a (1)
fijar [total-frames] a (4)
fijar [velocidad-animacion] a (0.1)

por siempre
  cambiar a disfraz (frame-actual)
  esperar (velocidad-animacion) segundos

  si <(frame-actual) < (total-frames)> entonces
    cambiar [frame-actual] por (1)
  si no
    fijar [frame-actual] a (1)
  fin
fin

Animación Condicional:

// Diferentes animaciones según el estado
si <(velocidad) > [0]> entonces
  // Animación de movimiento
  si <(disfraz #) < [4]> entonces
    siguiente disfraz
  si no
    cambiar a disfraz [caminar1]
  fin
si no
  // Animación de reposo
  cambiar a disfraz [parado]
fin

Efectos de Transformación:

// Transformación gradual
al recibir [transformar]
repetir (20) veces
  cambiar tamaño por (5)
  girar ↻ (18) grados
  cambiar efecto [color] por (10)
  esperar (0.05) segundos
fin
cambiar a disfraz [forma-final]
fijar tamaño a (100) %
fijar dirección a (90)
quitar efectos gráficos

Optimización de Disfraces

1. Gestión de Memoria:

Usa el menor número de disfraces necesarios
Optimiza el tamaño de las imágenes
Elimina disfraces no utilizados
Considera usar efectos en lugar de múltiples disfraces

2. Organización:

// Nombra los disfraces de manera descriptiva
// Ejemplos:
// - "caminar-1", "caminar-2", "caminar-3"
// - "saltar-inicio", "saltar-aire", "saltar-aterrizaje"
// - "normal", "dañado", "invencible"
// - "pequeño", "mediano", "grande"

3. Reutilización Inteligente:

// Usar el mismo disfraz para múltiples propósitos
// Cambiar solo el color o efectos
cambiar a disfraz [base]
si <(tipo-powerup) = [fuego]> entonces
  fijar efecto [color] a (25)  // Rojo
si no
  si <(tipo-powerup) = [hielo]> entonces
    fijar efecto [color] a (200)  // Azul
  fin
fin

Resolución de Problemas Comunes 🔧

Problemas de Disfraces

Problema: El sprite “salta” cuando cambia de disfraz

Causa: Los disfraces tienen diferentes puntos centrales

Solución:

Ve al editor de disfraces
Selecciona la herramienta “Seleccionar”
Haz clic en “Establecer centro del disfraz”
Coloca el punto central en el mismo lugar para todos los disfraces

Consejo: Usa una referencia visual (como los pies del personaje) para mantener consistencia

Problema: La animación se ve demasiado rápida o lenta

Causa: Tiempo de espera inadecuado entre cambios de disfraz

Solución:

// Ajusta el tiempo de espera
siguiente disfraz
esperar (0.2) segundos  // Aumenta para más lento, disminuye para más rápido

// O usa variables para control dinámico
siguiente disfraz
esperar (velocidad-animacion) segundos

Problema: Los disfraces no se muestran correctamente

Causas Posibles:

Sprite está oculto
Tamaño demasiado pequeño
Fuera del escenario
Efecto fantasma al 100%

Soluciones:

// Resetear propiedades
mostrar
fijar tamaño a (100) %
ir a x: (0) y: (0)
quitar efectos gráficos

Mejores Prácticas

1. Planificación de Disfraces:

Diseña todos los disfraces antes de empezar a programar
Mantén un estilo visual consistente
Considera todas las animaciones necesarias
Planifica el flujo entre diferentes estados

2. Nomenclatura Consistente:

// Buenos nombres de disfraces:
"idle-1", "idle-2"           // Estados de reposo
"walk-1", "walk-2", "walk-3" // Secuencia de caminar
"jump-start", "jump-air", "jump-land" // Secuencia de salto
"normal", "damaged", "powered-up"     // Estados del juego

3. Documentación Visual:

Usa el primer disfraz como “referencia” o “normal”
Organiza los disfraces en orden lógico
Agrupa disfraces relacionados
Elimina disfraces de prueba o no utilizados

Clones: Multiplicando Sprites 👥

¿Qué son los Clones?

Los clones son copias temporales de un sprite que pueden actuar independientemente. Son perfectos para crear múltiples objetos similares sin duplicar código.

Usos Comunes de Clones

🎯 Proyectiles

Balas, flechas, bolas de fuego que se disparan.

👾 Enemigos

Múltiples enemigos con el mismo comportamiento.

⭐ Objetos Coleccionables

Monedas, gemas, power-ups distribuidos por el escenario.

🎆 Efectos de Partículas

Explosiones, lluvia, nieve, chispas.

🍎 Elementos de Juego

Plataformas, obstáculos, elementos interactivos.

🎨 Decoración

Elementos visuales que se repiten.

Trabajando con Clones

Crear Clones:

// Crear un clon del sprite actual
crear clon de [mí mismo]

// Crear múltiples clones
repetir (10) veces
  crear clon de [mí mismo]
  esperar (0.5) segundos
fin

// Crear clon de otro sprite
crear clon de [Enemigo]

Comportamiento del Clon:

// Este código se ejecuta cuando se crea el clon
al empezar como clon
// Configuración inicial del clon
ir a x: (número al azar entre (-200) y (200)) y: (150)
apuntar en dirección (180)  // Hacia abajo
fijar [velocidad] a (número al azar entre (2) y (5))

// Comportamiento del clon
repetir hasta que <(posición y) < [-180]>
  mover (velocidad) pasos
  girar ↻ (5) grados
fin

// Eliminar el clon cuando termine
borrar este clon

Gestión de Clones:

// Eliminar todos los clones de este sprite
al presionar tecla [r]
borrar clones de [mí mismo]

// Eliminar clon específico
al empezar como clon
si <tocando [Jugador]?> entonces
  cambiar [puntos] por (10)
  tocar sonido [ding]
  borrar este clon
fin

Patrones Avanzados con Clones

1. Sistema de Proyectiles:

// Sprite principal: Disparador
al presionar tecla [espacio]
crear clon de [Proyectil]

// Sprite Proyectil: Comportamiento
al empezar como clon
// Posición inicial en el disparador
ir a x: (posición x de [Disparador]) y: (posición y de [Disparador])
// Dirección hacia el ratón
apuntar hacia (puntero del ratón)

// Movimiento
repetir hasta que <tocando [borde]?>
  mover (10) pasos
  // Verificar colisiones
  si <tocando [Enemigo]?> entonces
    enviar [enemigo-golpeado]
    borrar este clon
  fin
fin
borrar este clon

2. Generador de Partículas:

// Crear explosión de partículas
al recibir [explotar]
repetir (20) veces
  crear clon de [Partícula]
fin

// Comportamiento de cada partícula
al empezar como clon
// Posición aleatoria cerca del centro
ir a x: ((posición x) + (número al azar entre (-20) y (20))) y: ((posición y) + (número al azar entre (-20) y (20)))
// Dirección aleatoria
apuntar en dirección (número al azar entre (1) y (360))
// Velocidad aleatoria
fijar [velocidad] a (número al azar entre (3) y (8))

// Movimiento y desvanecimiento
repetir (30) veces
  mover (velocidad) pasos
  cambiar [velocidad] por (-0.2)  // Desaceleración
  cambiar efecto [fantasma] por (3)  // Desvanecimiento
fin
borrar este clon

3. Enemigos Inteligentes:

// Crear enemigo en posición aleatoria
al presionar ⚑
repetir (5) veces
  crear clon de [mí mismo]
  esperar (2) segundos
fin

// Comportamiento de cada enemigo
al empezar como clon
// Posición inicial aleatoria
ir a x: (número al azar entre (-200) y (200)) y: (número al azar entre (100) y (150))
fijar [vida] a (3)
fijar [velocidad] a (número al azar entre (1) y (3))

por siempre
  // IA simple: perseguir al jugador
  si <(distancia a [Jugador]) < [150]> entonces
    apuntar hacia [Jugador]
    mover (velocidad) pasos
  si no
    // Movimiento aleatorio
    si <(número al azar entre (1) y (50)) = [1]> entonces
      girar ↻ (número al azar entre (-45) y (45)) grados
    fin
    mover (1) pasos
  fin

  // Verificar límites
  rebotar si toca un borde

  // Verificar si fue derrotado
  si <(vida) < [1]> entonces
    // Efecto de muerte
    repetir (10) veces
      cambiar efecto [fantasma] por (10)
      esperar (0.05) segundos
    fin
    borrar este clon
  fin
fin

Efectos Especiales y Transformaciones ✨

Efectos Visuales Dinámicos

1. Efectos de Aparición:

// Aparición gradual
al empezar como clon
fijar efecto [fantasma] a (100)  // Invisible
mostrar
repetir (20) veces
  cambiar efecto [fantasma] por (-5)  // Más visible
  cambiar tamaño por (5)  // Creciendo
  esperar (0.05) segundos
fin

2. Efectos de Movimiento:

// Movimiento con estela
por siempre
  crear clon de [Estela]
  mover (5) pasos
  esperar (0.1) segundos
fin

// Comportamiento de la estela
al empezar como clon
fijar tamaño a (50) %
fijar efecto [fantasma] a (30)
repetir (10) veces
  cambiar efecto [fantasma] por (7)
  cambiar tamaño por (-3)
  esperar (0.1) segundos
fin
borrar este clon

3. Transformaciones Dinámicas:

// Cambio de forma suave
al recibir [transformar]
repetir (30) veces
  // Cambio gradual de tamaño
  fijar tamaño a ((100) + ((sen de (temporizador * 180)) * 50)) %
  // Cambio de color
  fijar efecto [color] a (temporizador * 10)
  // Rotación
  girar ↻ (6) grados
  esperar (0.05) segundos
fin

Sprites Dinámicos

Sprites que Cambian Según el Contexto:

// Sprite que se adapta al entorno
por siempre
  si <tocando color [#0000FF]?> entonces  // Agua
    cambiar a disfraz [nadando]
    fijar efecto [color] a (200)  // Azulado
  si no
    si <tocando color [#00FF00]?> entonces  // Hierba
      cambiar a disfraz [caminando]
      fijar efecto [color] a (50)  // Verdoso
    si no
      cambiar a disfraz [normal]
      quitar efectos gráficos
    fin
  fin
fin

Sprites Reactivos:

// Sprite que reacciona a la proximidad del ratón
por siempre
  fijar [distancia-raton] a (distancia a [puntero del ratón])

  si <(distancia-raton) < [50]> entonces
    // Muy cerca: asustado
    cambiar a disfraz [asustado]
    fijar tamaño a (80) %
    apuntar hacia (puntero del ratón)
    girar ↻ (180) grados  // Dar la espalda
  si no
    si <(distancia-raton) < [100]> entonces
      // Cerca: curioso
      cambiar a disfraz [curioso]
      fijar tamaño a (110) %
      apuntar hacia (puntero del ratón)
    si no
      // Lejos: normal
      cambiar a disfraz [normal]
      fijar tamaño a (100) %
    fin
  fin
fin

Conclusión 🎉

¡Felicitaciones! Ahora dominas el arte de trabajar con sprites y disfraces en Scratch. Has aprendido:

✅ Qué son los sprites y sus componentes principales
✅ Cómo crear y gestionar sprites de diferentes maneras
✅ Técnicas de animación con disfraces
✅ Propiedades y configuración avanzada
✅ Interacción entre sprites y comunicación
✅ Uso de clones para efectos dinámicos
✅ Efectos especiales y transformaciones
✅ Resolución de problemas comunes

Próximos Pasos

Experimenta creando diferentes tipos de sprites
Practica las técnicas de animación mostradas
Crea un proyecto que use múltiples sprites interactuando
Explora efectos especiales y transformaciones
Comparte tus creaciones con la comunidad

¿Listo para explorar variables y datos? ¡Tu aventura en Scratch continúa! 🚀