Desarrollo de juegos web en JavaScript y HTML5 (Phaser)
4.3 (367 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
2,955 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Desarrollo de juegos web en JavaScript y HTML5 (Phaser) to your Wishlist.

Add to Wishlist

Desarrollo de juegos web en JavaScript y HTML5 (Phaser)

Aprende a crear juegos 2D para la web con JavaScript desarrollando 4 juegos clásicos en 3 horas con Phaser.
4.3 (367 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
2,955 students enrolled
Created by Nicolás Rojas
Last updated 2/2016
Spanish
Current price: $10 Original price: $90 Discount: 89% off
1 day left at this price!
30-Day Money-Back Guarantee
Includes:
  • 3.5 hours on-demand video
  • 8 Supplemental Resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Desarrollar juegos 2D para la web con JavaScript y HTML5.
  • Dominar los conceptos básicos del motor de juegos 'Phaser' para el desarrollo de juegos para la web.
  • Crear sus propios juegos desde cero
View Curriculum
Requirements
  • Conceptos básicos de programación
  • Conceptos básicos de JavaScript y HTML5
Description
  • Aprovechamos la última tecnología web para desarrollar juegos en JavaScript desde ceros.
  • En este curso aprenderemos los conceptos básicos del desarrollo de juegos para la web utilizando el motor 'Phaser'.
  • Los conceptos serán explicados con ejemplos cortos y sencillos de implementar. Luego uniremos todo lo aprendido para crear juegos completos.
  • Durante el desarrollo del curso desarrollaremos tres juegos clásicos (Flappy Bird, Space Invaders y Space Defender), que servirán de ejemplos para aplicar los conceptos aprendidos en cada clase.
  • Para desarrollar los juegos del curso utilizaremos únicamente JavaScript y HTML.
  • El curso incluye todo el material visto (código, imágenes, recursos, etc) en cada clase.
  • Este curso enseña todo lo que me hubiera gustado aprender cuando inicié en el mundo del desarrollo de juegos.
Who is the target audience?
  • Emprendedores que están dispuestos a aprender los conceptos básicos para desarrollar juegos para la web
  • Estudiantes con conocimientos básicos de programación
  • Personas que han tenido algún contacto (por más básico que sea) con JavaScript y HTML5
  • NO es para personas que quieran desarrollar juegos en 3D
Students Who Viewed This Course Also Viewed
Curriculum For This Course
Expand All 35 Lectures Collapse All 35 Lectures 03:19:33
+
Introducción
3 Lectures 14:25

En este video descargamos el editor de texto y configuramos el ambiente de desarrollo.

Preview 03:49


+
Sprites (imagenes)
7 Lectures 24:02

En este video aprendemos a asignar una imagen de fondo al juego y a animarla de tal forma que parezca un sidescroller horizontal.

Imagen de fondo y sidescroller
03:38

Aprendemos a insertar imágenes al juego en diferentes posiciones del canvas.

Insertar imagen
02:14

Aprendemos a cambiar el punto de apoyo (anchor point) de una imagen.

Punto de apoyo
04:32

Aprendemos a cambiar las dimensiones de una imagen (sprite) con la función scale.

Escalar una imagen
03:39

En esta clase aprendemos a voltear imágenes.

Voltear imágenes (flip)
01:44

Rotación de sprites
01:55

Este quiz evalúa la comprensión del uso de transformaciones sobre sprites.

Quiz de transformaciones sobre sprites
1 question

En este video aprendemos a animar un sprite.

Animaciones
06:20
+
Movimiento en 2d y colisiones
4 Lectures 22:51

Aprendemos a saber cuándo un usuario presiona una tecla y qué tecla presiona.

Capturar inputs de teclado y movimiento en cuatro direcciones
06:58

Vamos a evitar que el movimiento de un sprite lo lleve a salirse de la pantalla.

Frontera del canvas del juego
02:45

Esta clase sirve para conocer el código que se debe aplicar a la hora de tener más de una animación para cada movimiento de nuestro personaje.

Múltiples animaciones para múltiples movimientos
08:49

Si no se detiene una animación esta va a correr infinitamente. Sin embargo necesitamos saber qué mostrar cuando detenemos una animación.

Detener animaciones
04:19
+
Space Invaders: Disparos, enemigos y detección de colisiones
4 Lectures 22:21
Movimiento de la nave
04:57

Aprendemos a disparar desde nuestro personaje

Disparos
08:11

Aprendemos a crear múltiples enemigos

Enemigos
06:23

En este video aprendemos cómo detectar cuando una bala colisiona con un enemigo.

Colisiones
02:50
+
Space Defender
5 Lectures 31:42

Creamos los archivos del juego, el HTML y los archivos JavaScript.

Configuración de los archivos
07:14

Creamos la nave desde la cual vamos a disparar los proyectiles

Creación de la nave
02:38

Escribimos el código que habilita a la nave para disparar proyectiles.

Manejo de disparos
09:31

Creamos los enemigos y hacemos que aparezcan en partes aleatorias del espacio del juego con una velocidad hacia abajo.

Creación de enemigos
04:13

Manejamos las colisiones entre los proyectiles y los enemigos.

Manejo de colisiones
08:06
+
Flappy Bird
7 Lectures 56:24
Configuración del archivo principal
03:22

En este video escribimos el código del primer estado, el menú.

Estado menú principal
08:12

Creamos al flappy bird y lo mostramos en pantalla, creamos el fondo sidescroller.

Fondo y personaje
07:59

En esta clase agregamos la animación del vuelo al pájaro y asignamos un botón para manejar el salto.

Animación de vuelo y salto
07:56

En esta clase generamos los tubos por los que tiene que pasar el flappy bird.

Creación de tubos
12:39

En este video creamos el estado final de game over y añadimos la función para manejar las colisiones entre el flappy bird y los tubos.

Game over
10:10

En este video aprendemos a añadir un puntaje a nuestro juego, actualizarlo y mostrarlo en el estado de juego terminado.

Puntaje
06:06
+
Runner
5 Lectures 27:48

Configuramos los archivos principales pare el juego y mostramos el fondo de pantalla y al jugador.

Configuración inicial
07:18

Agregamos las variables que manejan las entradas de teclado del usuario y movemos al jugador en el eje x

Movimiento del carro
02:57

Creamos los carros que serán obstáculos para el jugador

Creación de enemigos
06:24

Creamos las canecas de gasolina que sirven para ganar puntos

Creación de ayudas
02:15

Cambiamos la dificultad del juego a medida que el jugador gana puntos

Niveles de dificultad variable, colisiones y puntaje
08:54
About the Instructor
Nicolás Rojas
4.3 Average rating
367 Reviews
2,955 Students
1 Course
Ingeniero - Instructor - Desarrollador web

@NicolasRojas

Hola! Mi nombre es Nicolás Rojas, me gusta presentarme como un solucionador de problemas estudiando ingeniería.

Aprendí a programar hace unos años por mi propia cuenta, en poco tiempo descubrí que la programación y el desarrollo de aplicaciones y juegos era mi pasión.

Cuando empecé a programar no fue fácil encontrar el material necesario para aprender en español, por lo cual me propuse aportar lo que más pudiera para que más hispanohablantes pudiéramos acceder a los recursos educativos que hay en internet. Mis cursos están basados en lo que me hubiera gustado aprender cuando empecé a desarrollar juegos y aplicaciones.

En mis redes sociales estoy atento a cualquier duda o consulta que puedan tener sobre algún curso o cualquier tema en particular, no duden en escribirme!