videojuegos en javascript con tdd y jasmine

TDD y Videojuegos en Javascript

(básico)

javierj@us.es / @IWT2_Javier

2

• Contar mi experiencia haciendo juegos.

• Explicar cómo aplicar TDD a videojuegos.

Herramientas de Desarrollo

Objetivos

¿Quién soy yo?

4

1. Introducción.

2. TDD y Videojuegos.

3. Probar interfaces públicas.

4. Probar el código que no se ve.

5. Conclusiones.

TDD y Videojuegos

Índice

5

Introducción

Introducción

Introducción

– Sin pruebas

– No veía fácilmente el diseño

– Fallaba por sorpresa sin saber por qué

– Cambiaba por cambiar.

– Apechugar con las malas decisiones.

– No avanzaba.

– Presionado por fecha límite.

– Me sentía mal.

– Un cuadro típico de necesito TDD.

8

Introducción

NO

9

TDD y Videojuegos

TDD y videojuegos

Test-Driven Development

TDD y videojuegos

• Interacción del jugador• Actualización del mundo• Pintar• Cambiar de estado

(nuevo nivel / fin de juego, etc.)

Carga de assets

Se puede probar

TDD y Videojuegos

Filosofía TDD

TDD y videojuegos

TDD y videojuegos

Hazlo fácil de ver / cambiar.

• Pero la UX es importante• Vas a tener que jugar con

tu juego muchoooo.• Procura que sea divertido.• Agiliza los cambios.

15

Probar los actores (diseño botton-up)

Probar los actores

Probar los actores

Gema:Tiene posición X, YEstá visible por defectoPuede volverse invisible

Probar los actores

Probar los actores

Probar los actores

Gema:La primera está en 0,0Tienen un ancho y alto de 50Hay un espacio entre ellas de 3

21

Probar interfaces públicas

Probar Interfaces Públicas

Probar Interfaces Públicas

Contador:Conoce todas las gemas de un tipo.Se incrementa cuando cogemos una gema de dicho tipo.Conocemos ambos valores.

Ahora Todo Junto

Ahora Todo Junto

Juego:Crear las gemas.Ponerlas en posiciones de origen.Crear el marcador.Crear cavas, stage, etc.

26

Probar el código que no se ve

( y hacer que se vea )

Haz visible lo invisible

Movimiento

• Colocamos las gemas.• Actualizamos el mundo.• Comprobamos sus

coordenadas

• Necesitamos el juego creado.

• Posición relativa de una gema

• Duplicamos lógica de juego e la prueba (la lógica que calcula el desplazamiento)

Carga de Assets

Asíncrono (te aviso cuando termine)

Lógica del juego

Combinación:• 4 Valores• En un rango de [1-4]• Valor correcto =

intenta el siguiente.• Valor incorrecto =

vuelve a empezar

Lógica del juego

Combinación:• 4 Valores• En un rango de [1-4]• Valor correcto =

intenta el siguiente.• Valor incorrecto =

vuelve a empezar

Si destapamos el código

Prueba de la IA

Historia de un fracaso

¡¡¡Se puede tener éxito!!!

33

Conclusiones

Conclusiones

• Hemos visto un primer paso… pero aún queda mucho.

• Es difícil probar automáticamente que se pinta lo que se tiene que pintar (gráficoscorrompidos, ficheros equivocados, spreatsheets con coordenadas erróneas, etc.)

• Distintas resoluciones.

• Código multihilo.

Conclusiones

Conclusiones

• Falsa sensación de velocidad.

• Falsa sensación de seguridad.

• No tener claro qué probar

• Set-up complejo.

• Módulos “Dios”

¿Por qué pierdo la fe?

Mal diseño

Tiene solución…..

Conclusiones

Todo por hacer

¿Cómo podemos clasificar las herramientas?

Nivel de detalle

Plataforma

Lenguaje de programación

Tipos de juegos

Unity 3D

Ves lo que haces

Javascript + HTML5