1. Interfaz de Thunkable: lo básico

Cuando entras en un proyecto verás dos zonas principales:

• Designer (Diseño) 👉 para crear la interfaz visual.
• Blocks (Bloques) 👉 para programar el comportamiento de la app.

Diseño

Bloques (Código)

💡 Consejo: piensa el diseño primero (qué verá el usuario) y luego pasa a los bloques (qué hará la app).

---

2. Botones: interactuar con la app

Los botones permiten que el usuario controle la app.

En el Designer

1. Arrastra desde Add Components (parte izquierda) un Button a la pantalla de tu app.
2. En las propiedades (parte derecha) cambia:
   • Texto
   • Color
   • Tamaño
   • Nombre del componente (ej. btnFoto, btnSonido).

En Blocks

• Usa el bloque when Button Click do…
• Aquí pondrás las acciones que ocurren al pulsar el botón.

📌 Ejemplo:

• Cambiar de pantalla
• Reproducir un sonido
• Activar la cámara
• Modificar una variable

---

3. Navegación entre pantallas

Las apps no suelen tener una sola pantalla.

Crear nuevas pantallas

1. Pulsa en + Add Screen.
2. Ponle un nombre claro (ej. PantallaMenu, PantallaCamara).

Cambiar de pantalla

En bloques:

• navigate to [ScreenName]

📌 Recomendación: Usa botones para moverte entre pantallas.

---

4. Uso básico de variables

Las variables sirven para guardar información: puntos, estados, contadores…

Crear una variable

1. En Blocks → Variables
2. Crea una variable (ej. contador, puntuacion).

Usar variables

• Asignar valor: set variable to
• Cambiar valor: set variable to variable + 1
• Mostrar su valor en un Label.

📌 Ejemplo práctico:

• Contar cuántas veces se pulsa un botón.
• Guardar si el sonido está activado o no.

---

6. Sonidos: dar vida a la app 🔊

El sonido mejora muchísimo la experiencia.

Añadir sonido

1. Arrastra el componente Sound.
2. Sube un archivo de audio o usa sonidos del sistema.

Reproducir sonido

En bloques:

• Sound → play

📌 Buen uso:

• Sonido al pulsar botones.
• Sonido de aviso o error.
• Música de fondo (con cuidado, menos es más).

---

7. Cámara de fotos 📸

Tu móvil es una herramienta potente, y la cámara es clave.

Añadir Imagen

1. Añade un Image para mostrar la foto.

Usar la cámara (En Blocks)

• Al pulsar un botón:
  • Camera → Take Photo
• Cuando se hace la foto:
  • Mostrarla en el componente Image.

📌 Importante:

• Explica siempre para qué se usa la foto (ética y privacidad).

---

8. Sensores: aprovechar el móvil

Thunkable permite usar sensores reales del dispositivo.

Algunos ejemplos:

• Acelerómetro
• Orientación
• Ubicación (GPS)

¿Cómo se usan?

1. Arrastra el sensor deseado.
2. Usa sus eventos o valores en bloques.

📌 Ejemplo:

• Detectar movimiento.
• Cambiar algo en pantalla según la orientación.
• Activar una acción si el móvil se agita.

---

9. Probar la app: prueba, falla, mejora

Thunkable permite:

• Probar la app en el navegador.
• Conectarla al móvil con la app de Thunkable.

💡 Programar es iterar:

1. Pruebas.
2. Algo falla.
3. Lo corriges.
4. Mejoras la idea.

Eso no es un error, es aprendizaje real.