Desarrolla juegos para dispositivos móviles
5.0 (1 rating)
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.
19 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Desarrolla juegos para dispositivos móviles to your Wishlist.

Add to Wishlist

Desarrolla juegos para dispositivos móviles

Crea juegos con HTML5, JavaScript y Phonegap
5.0 (1 rating)
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.
19 students enrolled
Last updated 1/2017
Spanish
Current price: $10 Original price: $20 Discount: 50% off
1 day left at this price!
30-Day Money-Back Guarantee
Includes:
  • 16.5 hours on-demand video
  • 5 Articles
  • 13 Supplemental Resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Have a coupon?
What Will I Learn?
El alumno aprenderá las bases del uso de Phonegap
El alumno aprenderá a crear los certificados necesarios para el desarrollo de aplicaciones en dispositivos móviles con Phonegap
El alumno creará un archivo config.xml con los parámetros necesarios para crear su aplicación en PhoneGap
El alumno comprenderá los principios básicos en el manejo del Canvas de HTML5
El alumno creará una sencilla aplicación responsiva y la instalará en su dispositivo móvil
El alumno desarrollará un juego de memória numérica y lo instalará en un dispositivo móvil
El alumno desarrollará el juego conocido como "Gato" y lo instalará en un dispositivo móvil.
El alumno desarrollará un juego de tipo "Busca minas" con canvas y lo instalará en un dispositivo móvil.
El alumno realizará un juego de deducciones por colores para dispositivos móviles.
El alumno desarrollará un juego de "caja de número" para un dispositivo móvil.
El alumno desarrollará un rompecabezas tomando al azar diferentes imágenes.
El alumno aprenderá a utilizar los sonidos en un dispositivo móvil.
View Curriculum
Requirements
  • Conocimientos básicos de programación
  • Una máquina Windows o Mac OS
  • Un dispositivo móvil (opcional)
Description

Actualmente hay más dispositivos móviles inteligentes en el mundo, que computadoras, por lo que es indispensable aprender a programar en ellos. Una forma estupenda de aprender a hacerlo, es desarrollando juegos. En este curso aprenderemos a desarrollar juegos por medio del Canvas de HTML5 y JavaScript, lo cual nos permite aprovechar nuestros conocimientos en el desarrollo web. Si usted tiene experiencia en otros lenguajes, verá que JavaScript es un lenguaje muy sencillo de aprender.

Para poder instalar nuestras aplicaciones las empaquetaremos con Phonegap, el cual es una herramienta muy poderosa y prácticamente gratuita. Otra ventaja de Phonegap es que podemos utilizar nuestro mismo código para iOS, Android y Windows Phone, a parte que cuenta cn muchos "plugins" para aprovechar las funcionalidades del dispositivo.

Este curso no es un curso para aprender las bases de la programación en JavaScript. Debes de tener conocimientos básicos en programación, ya que no se explicará lo que es una varable, una función o un arreglo. Este curso está pensado en programadores que deseen desarrollar  en dispositivos móviles, de preferencia con conocimientos en JavaScript, HTML5 y CSS3.

Para aprovechar este curso deberás contar con una computadora con conexión a Internet, un navegador moderno (opcional) y un editor de código (Aptana, SublimeText, Dreamweaver, etc.).

Los objetivos del presente curso son:

  • El alumno aprenderá las bases del uso de Phonegap

  • El alumno aprenderá a crear los certificados necesarios para el desarrollo de aplicaciones en dispositivos móviles con Phonegap

  • El alumno creará un archivo config.xml con los parámetros necesarios para crear su aplicación en PhoneGap

  • El alumno comprenderá los principios básicos en el manejo del Canvas de HTML 5

  • El alumno creará una sencilla aplicación responsiva y la instalará en su dispositivo móvil

  • El alumno aplicará los conocimientos básicos del Canvas y desarrollará un juego de memoria numérica básico.

  • El alumno desarrollará un juego de memoria numérica y lo instalará en un dispositivo móvil.

  • El alumno desarrollará el juego conocido como "Gato" y lo instalará en un dispositivo móvil.

  • El alumno desarrollará un juego de tipo "Busca minas"  con canvas y lo instalará en un dispositivo móvil.

  • El alumno realizará un juego de deducciones por colores para dispositivos móviles.

  • El alumno desarrollará un juego de "caja de número" para un dispositivo móvil.

  • El alumno desarrollará un rompecabezas tomando al azar diferentes imágenes.


Who is the target audience?
  • Desarrolladores que deseen programar aplicaciones para dispositivos móviles
Students Who Viewed This Course Also Viewed
Curriculum For This Course
Expand All 155 Lectures Collapse All 155 Lectures 16:37:11
+
Bienvenida al curso de Desarrollo de juegos para dispositivos móviles
1 Lecture 03:00
+
Introducción a Phonegap
4 Lectures 23:27

2009: Creado por Nitobi

2011: Comprado por Adobe

2011: Donado por Adobe a Apache Foundation

2011: Renombrado como Cordova

Frameworks para desarrollar en dispositivos móviles:

  • jQuery Mobile

  • AngularJS  

  • Kendo UI

  • PhoneJS

  • DOJO

  • IceNium

  • Sencha  

  • backbond.js

Preview 09:21

Crear una cuenta de PhoneGap Build

  • Tienes que entrar a la página de PhonegapBuild
  • Entrar al esquema de los planes.
  • Debes tener una cuenta de Adobe.
Crear una cuenta de PhoneGap Build
05:47

Primero debes de afiliarte como desarrollador de Apple, para lo cual debes de entrar  la página de desarrolladores de esta empresa.

Crear una cuenta de desarrollador iOS
08:16

En esta clase puedes encontrar los apuntes de las sección del curso.
Apuntes a la sección 1: Introducción a Phonegap
00:03
+
Certificados PhoneGap
10 Lectures 24:38
  • Crear el archivo P12

  • Crear el ID de la aplicación
  • Identificar el dispositivo
  • Crear el perfil provisional
  • Instalar el perfil provisional
  • Cargar el certificado a PhoneGap Build
Preview 02:34

Ya que tenemos nuestro certificado, debemos crear el certificado P12:

  • Abrir el “Acceso a las llaves”

  • Acceso a llaveros >  Asistente para certificados > Solicitar un certificado  a una autoridad de certificación

  • El archivo ha sido creado en este caso  en el escritorio. Hay que subirlo de nuevo a la página.

  • Hay que subir el archivo

  • El archivo CSR ya fue creado

  • Ya se tiene tu certificado CSR

  • El certificado de desarrollo está listo

  • Crear el archivo P12

Crear el certificado P12 para el desarrollo en iOS
04:04

Una vez generado el archivo P12, hay que subirlo a la página para generar el identificador de la aplicación.

Crear el ID de la aplicación para el desarrollo en iOS
02:50

Obtener el identificador del dispositivo o dispositivos que vamos a trabajar o device's unique device identifier o UDID.

Identificar el dispositivo con iOS
03:04

Debemos ahora crear un identificador que liga nuestra aplicación con el dispositivo y almacenarla en el mismo.

Permitirá ejecutar la aplicación en modo prueba en el dispositivo.

Ahora tenemos el perfil provisional

Preview 03:41

Ahora debemos instalar el perfil provisional en el dispositivo por medio de iTunes.

Instalar un perfil provisional de la aplicación iOS
02:15

El siguiente paso es subir el perfil a PhoneGap Build.

Entra la página de PhoneGap Build y registrate como ya hemos visto.

Entrar a Account Options y seleccionar Edit Profile

Cargar los certificados iOS a la página de PhoneGap Build
03:01

Para permitir bajar aplicaciones a su teléfono o tableta Android, sólo debe permitirlo en la configuración, que por omisión está apagada.

Vaya a “Settings application”

Seleccione “Security menu”

Active la opción de instalación por fuentes desconocidas o “Unknown sources”

Crear un perfil de Android para crear aplicaciones
03:03

Apuntes a la sección 2: Certificados para Phonegap en los archivos anexos.
Apuntes a la sección 2: Certificados para Phonegap
00:03

Apuntes a la sección 2: Certificados para Phonegap en los archivos anexos.
Apuntes a la sección 2: Certificados para Phonegap​ iOS.​
00:03
+
Crear el archivo config.xml
9 Lectures 33:37

El archivo config.xml es un archivo de texto plano en formato xml, bajo el estándar widget de la W3C.

Preview 06:48

Las preferencias son valores adicionales que las configuramos con los parejas “nombre” de la preferencia y su valor.

Las preferencias no son compatibles para todas las plataformas.

El manejo de las preferencias en el archivo config.xml
02:39

Para extender las funcionalidades de Phonegap/Cordova requerimos importar librerías externas o “plugins”.

Los plugins pueden ser “core”, de terceros o propios.

Utilizamos en el archivo config.xml la etiqueta <plugin>, por ejemplo:

El manejo de las librerías o plugin en una aplicación config.xml
04:57

Muy importante: La aplicación (por lo general index.html) debe tener una de las siguientes llamadas a phnegap.js o cordova.js.

El archivo phonegap.js dentro del archivo index.html
03:12

Los iconos dependen de la plataforma que se desarrolle.

Existen dos formas de especificar la plataforma. Primero es como atributo:

El segundo modo (recomendado) es introducirlo en la etiqueta de la plataforma.

Configuración de los iconos para la aplicación
04:09

Phonegap soporta classic, retina, iPhone 5 y iPad displays.

El manejo de los iconos para iOS
03:17

Android maneja “calificadores” para sus iconos.

El manejo de los iconos para Android
02:58

Puedes tener o no tener una pantalla de entrada. Debe ser un “png” y puedes contar con los atributos src, width, height o platform.

El manejo de la pantalla inicial o "splashscreen"
05:34

Apuntes a la sección 3: "La configuración de la aplicación" en los archivos anexos.
Apuntes a la sección 3: La configuración de la aplicación.​
00:03
+
Introducción al Canvas de HTML5
16 Lectures 01:40:57

En este video estableceremos las etiquetas y los parámetros para manejar el CANVAS de HTML5

Preview 05:45

Un punto muy importante es verificar si el navegador soporta el HTML5 y por lo tanto el canvas, ya que no todos los navegadores, ni todas las versiones lo hacen.

Verificación del canvas en un navegador
05:13

El contexto es la variable con la que manipularemos al canvas. Puede ser 2d o 3d, aunque la especificación de esta última aún no existe.

El contexto en canvas
04:18

Uno de los conceptos fundamentales cuando dibujamos en el CANVAS de HTML5 es el relleno (fill) y el contorno (Stroke), los cuales son muy similares a otros paquetes como Flash e Illustrator.

Crear rectángulos con Canvas
08:21

La forma más sencilla para dibujar es la línea. Tendremos que mover primero las coordenadas y luego indicarle al API de dibujo, en qué coordenada deseamos terminar la línea.

Crear líneas con canvas
07:05

Las líneas dentro de Canvas de HTML5 tienen ciertas propiedades que nos pueden ser de utilidad, como lineCap y lineJoin

Las propiedades de las líneas en Canvas HTML5
05:29

Podemos almacenar, al igual que las calculadoras muy sencillas, una
memoria con los colores que estamos utilizando. Si llegamos a
cambiarlos, podemos "restaurarlos" en forma muy sencilla, volviendolos a
llamar.

Estados en canvas: guardarlo y recuperarlo
06:17

Otra forma de dibujar en el canvas de HTML5, es por medio de los arcos y
de unir varias líneas, lo cual lo llamaremos un "camino" o path.

Hacer trazos con líneas con Canvas HTML5
06:30

Al menos al crear este video, canvas no tiene una instrucción para crear
círculos, pero podemos realizar arcos, y con él podremos hacer
círculos.

Crear arcos y círculos con Canvas HTML5
06:26


Curvas Bézier cuadráticas en canvas HTML5

A parte de hacer arcos, podemos dibujar curvas bezier y curvas bezier cuadráticas, ya sean de tres puntos o de cuatro. En este video mostraremos cómo dibujar curvas a base de coordenadas.
Curvas Bézier cuadráticas en canvas HTML5
05:16

Las curvas bezier cúbicas constan de cuatro puntos: el inicial, el final y dos puntos de control, ancla o tangentes.

Curvas Bézier cúbicas en Canvas HTML5
05:31

Por medio del canvas podemos hacer gradientes lineales y radiales de manera sencilla pero muy potente.

Crear gradientes lineales con Canvas
07:08

Para definir la dirección de un gradiente, definimos una linea, que nos brinda la magnitud y dirección del gradiente.

Las direcciones de los gradientes lineales con Canvas HTML5
08:24

Los gradientes radiales se basan en definir dos circulos, los cuales pueden tener el mismo punto origen, o diferente.

Crear gradientes radiales con Canvas HTML5
07:46

En canvas podemos cargar una figura y utilizarla como patrón. Por lo general utilizamos pequeñas imagenes PNG para aprovechar la transparencia.

Utilizar los patrones de diseño en Canvas HTML5
05:34

Con el canvas podremos crear sombras a objetos y textos.
Sombras en objetos y textos
05:54
+
Crear una aplicación responsiva con Canvas HTML5
7 Lectures 49:37

Por medio del CANVAS de HTML5 podemos animar objetos, tal como lo
hacemos con Flash (snif, snif), peo nosotros nos debemos encargar de
borrar y volver a dibujar las figuras. No resulta tan complicado, como
se verá en las siguientes vídeos.

Preview 01:44

Para que la pelota se mueva necesitamos un “motor”, el cual nos lo proporcionará JavaScript. Para ello utilizaremos la función setInterval, que es de uso general, pero nos servirá para hacer animaciones básicas.

Animación de una pelotita con Canvas
07:58

Para que la pelota se mueva necesitamos un “motor”, el cual nos lo proporcionará JavaScript. Para ello utilizaremos la función setInterval, que es de uso general, pero nos servirá para hacer animaciones básicas.

Borrar y re-dibujar la pelotita
06:38

Las colisiones son fundamentales para cualquier animación. Para ello utilizaremos un viejo truco que es primero calcular la nueva posición y luego la verificamos. También determinaremos los límites del movimiento izquierdo y derecho.

Detectar las colisiones en el eje X
11:51

El proceso de animar en el eje de las “yes” es similar al de las “equis”. Calculamos los límites de arriba y abajo, calculamos la nueva dirección y ajustamos. Con ello tendríamos una animación sencilla por medio del canvas de HTML5.

Terminar la animación básica con canvas
07:34

Una vez que tenemos nuestra sencilla animación en formato fijo, la convertiremos en un formato flexible para que se adapte a los diferentes tamaños de pantalla, o viewport, de los dispositivos móviles.

Convertir la animación en responsiva
08:47

Ya que tenemos nuestra aplicación adaptada a los diferentes dispositivos móviles, procedemos a empaquetarla con Phonegap y a instalarla en un dispositivo móvil para su prueba.

Empaquetar la aplicación y subirla a un dispositivo móvil
05:05
+
El juego de memoria numérica
12 Lectures 01:38:47

Un juego muy pedagógico, y que tiene muchas variaciones es el de memoria. En esta unidad haremos una primera versión utilizando el CANVAS de HTML5.

Preview 03:09

Para almacenar la información de las cartas, utilizaremos un objeto de JavaScript. Ahi almacenaremos las coordenadas de la carta, el valor del número, así como una función muy sencilla para dibujar la misma.

Crear el objeto JavaScript para almacenar la información del juego
09:26

Por medio del objeto carta, y algunas coordenadas iniciales, pintaremos en el canvas las cartas del juego, así como crear el arreglo donde almacenaremos la referencia de los objetos, con lo cual crearemos la  lógica del juego de Memoria.

Pintamos el tablero del juego
11:27

Ahora que ya tenemos creadas las cartas en el tablero, tenemos que barajarlas ya que de momento, tienen el orden de origen, lo cual no es divertido como juego. Utilizaremos un algoritmo sencillo de intercambio de valores.

Barajar las cartas del juego de memoria
06:33

El único evento que podemos utilizar, ya que canvas no maneja objetos,  es cuando el usuario hace clic sobre el canvas. A estas coordanas necesitamos ajustarlas, ya que están consideradas como el punto origina, la esquina superior izquierda del navegados, no del canvas.

Ajustar las coordenadas del canvas
07:44

Ya con las coordenadas ajustadas, nos bastará con recorrer todas las cartas (que las tenemos en el arreglo) y determinar en cuál de ellas se encuentra el punto con una simple sentencia condicional. A partir de ahi, nuestro algoritmo es el mismo que utilizamos en otros paquetes, como Flash o jQuerys.

Detectar la carta seleccionada con el apuntador del ratón
08:22

Una vez que ya sabemos la carta que fue seleccionada por el usuario, tenemos que proceder a “voltearla”, es decir, pintarla de un color diferente y dibujar el número en ella. Utilizaremos una variable booleana para determinar si es la primer selección del usuario.

Seleccionar la primer carta del juego de memoria
11:21

El proceso de selección de la segunda carta es muy similar al de la primera, solo que después de seleccionar las cartas, debemos de “voltearlas” antes que decidir si las dos cartas son “iguales”

Selecciona la segunda carta del juego de memoria
04:57

El proceso de selección de la segunda carta es muy similar al de la  primera, solo que después de seleccionar las cartas, debemos de  “voltearlas” antes que decidir si las dos cartas son “iguales”.

Comparar las cartas seleccionadas en la mano del juego de memoria
08:36

Para terminar esta parte del juego, crearemos un contador de cartas pares encontradas, con lo cual sabremos cuando el juego ha terminado.

Crear un contador en el juego
10:36

Una vez que tenemos nuestra sencilla animación en formato fijo, la convertiremos en un formato flexible para que se adapte a los diferentes tamaños de pantalla, o viewport, de los dispositivos móviles.
Convertir el canvas en adaptativo del juego de memoria numérica
11:42

Ya que tenemos nuestra aplicación adaptada a los diferentes dispositivos móviles, procedemos a empaquetarla con Phonegap y a instalarla en un dispositivo móvil para su prueba.

Empaquetar la memoria y subirla a un dispositivo
04:54
+
Crear un juego de memoria con imágenes
5 Lectures 33:57

Una vez que tenemos el juego de memoria con números nos será muy sencillo el hacer variaciones sobre el mismo tema... en este caso haremos un juego de memoria con imágenes.

Preview 01:45

Los últimos ajustes serán al momento de barajar las imágenes y de terminar el juego. Con esto damos por concluida la sección de crear juegos de memoria con CANVAS-HTML 5.

Crear el arreglo múltiple de JavaScript para las imágenes
09:55

Para concluir el juego, debemos de modificar la información que intercambiamos al azar y verificar la fora en que concluimos el juego. Con ello damos por finalizado la sección de desarrollo de un juego de memoria con el canvas de HTML5.

Concluir el juego de memoria con imágenes en formato fijo
09:54

Una vez que tenemos nuestra sencilla animación en formato fijo, la convertiremos en un formato flexible para que se adapte a los diferentes tamaños de pantalla, o viewport, de los dispositivos móviles.


Modificar el canvas de la memoria con imágenes
08:52

Ya que tenemos nuestra aplicación adaptada a los diferentes dispositivosmóviles, procedemos a empaquetarla con Phonegap y a instalarla en un dispositivo móvil para su prueba.

Empaquetar la aplicación e instalarla en un dispositivo
03:31
+
Crear el juego del Ahorcado
10 Lectures 01:17:24

Una vez que sabemos los “objetos” que se seleccionan el el canvas, nos será muy fácil hacer otros juegos, como el clásico juego de ahorcados.

Preview 03:19

Para realizar este juego, utilizaremos dos objetos: uno para la tecla y otra para la letra de la palabra. Para cada uno de los objetos necesitamos un arreglo y un arreglo para las palabras que se buscarán en el juego.

Las variables y objetos para el juego de ahorcado
09:38

En este video crearemos un pequeño teclado del tipo QWERTY con el cual el usuario podrá seleccionar la tecla por medio del apuntador del ratón.

Crear el tablero QWERTY para el juego
13:34

Tomando el mismo esquema que en videos anteriores, haremos objetos para cada una de las letras de la palabra a encontrar y la desplegaremos en el canvas. Posteriormente, al ser encontrada la letra, la desplegaremos en la misma.

Desplegar la palabra letra por letra en el canvas
09:02

El cadalso, y las diferentes partes del ahorcado son piezas fundamentales en el juego. En este caso, haremos la carga de imágenes png con transparencia para simplificar su manejo.

Colocar el cadalso del ahorcado en el canvas
04:36

Utilizando el método de los objetos, y de sus coordenadas, determinaremos si el punto pulsado sobre el canvas se encuentra dentro del mismo, ya que como tal, no contamos con “objetos”, como en otros paquetes como Flash.

Detectar la tecla seleccionada por el usuario
09:59

Ya una vez que sabemos la letra seleccionada por el usuario tendremos que analizar la palabra letra por letra, y de coincidir, dibujamos la letra. Si la palabra no contiene la letra, incrementaremos la variable de errores y aumentaremos una pieza al ahorcado.

Empatar la tecla seleccionada con la palabra
07:27

Por último, borraremos la tecla seleccionada y verificaremos si el jugador completó la palabra o si completó al ahorcado. De ser asi, lo mandaremos a la función gameOver para finalizar´el juego.

Verificar el fin del juego: Game Over
08:28

Una vez que tenemos nuestra sencilla animación en formato fijo, la convertiremos en un formato flexible para que se adapte a los diferentes tamaños de pantalla, o viewport, de los dispositivos móviles.


Modificar el canvas en el juego de "ahorcados"
08:15

Ya que tenemos nuestra aplicación adaptada a los diferentes dispositivosmóviles, procedemos a empaquetarlacon Phonegap y a instalarla en un dispositivo móvil para su prueba.

Empaquetar el juego de "ahorcados" e instalarlo en un dispositivo móvil
03:06
+
Crear el juego del "Gato" con Canvas de HTML5
18 Lectures 02:14:44

Otro juego clásico es de jugar al "gato" (tiene nombres diferentes el juego, dependiendo el país) entre la computadora y un jugador.


Preview 03:13

Este juego tiene más código que los anteriores, por lo que necesitamos platicar la lógica, antes de aventurarnos a escribir el código.

La lógica del juego
07:20

Al igual que otros ejercicios que hemos desarrollado, utilizaremos un objeto de tipo JavaScript para las fichas, y un arreglo para contener todos los elementos del juego. Crearemos las variables globales antes de dibujar la grilla del gato.

La estructura de datos y las variables del juego
08:39

En este video crearemos la grilla para el juego del "gato" y los objetos para crear las fichas del mismo.

Dibujar la grilla del juego y las fichas en el arreglo
09:12

Crear la función para escribir mensajes en el canvas
05:02

Una vez que sabemos la casilla que fue seleccionada en el tablero del “gato”, tenemos que pintar la “x” en ella y marcar su valor con el valor correspondiente.

Seleccionar la ficha por el usuario para iniciar la partida
12:40

Una vez que sabemos la casilla que fue seleccionada en el tablero del “gato”, tenemos que pintar la “x” en ella y marcar su valor con el valor correspondiente.

Pintar la ficha que seleccionó el jugador en el tablero
06:28

Iniciar la función que seleccionará la jugada de la máquina

Iniciar la función que seleccionará la jugada de la máquina
09:10

Dentro de nuestro algoritmo de pesos, verificaremos ahora los renglones de la cuadrícula del "gato" para irlo sumando a los pesos totales por  cada casilla.

Hacer la función que verifica los pesos en los renglones
09:56

En este video determinaremos el algoritmo para seleccionar la ficha con mayor peso y decidir la jugada de la computadora.

Calcular el peso de las fichas para la jugada de la computadora
08:41

En este video escribiremos las funciones necesarias para determinar el peso de cada una de las celdas.

Escribir las funciones de soporte al cálculo de los pesos
05:50

En este video verificaremos nuestro código por medio de sus salidas a la consola del navegador.

Verificar el código con console.log()
07:20

Ahora verificaremos las columnas de cada una de las casillas con el mismo criterio: encontrar la ficha con l¡mayor peso.

Verificar el peso de las fichas en las columnas
07:04

En este video verificaremos las dos diagonales para tener ya los tres caminos: columnas, renglones y diagonales y determinar cuál es la mejor jugada para la máquina.

Verificar el peso de las fichas en las diagonales
09:36

Una vez que recorrimos la grilla del "gato" en todas direcciones, nos será muy sencillo seleccionar cuál de las casillas debemos de seleccionar: la que tenga mayor peso.

Seleccionar la mejor jugada
08:42

En esta clase terminaremos de armar nuestro juego del gato, determinando si se gana, pierde o empata (gato).

Game Over: termina el juego
02:30

Una vez que tenemos nuestra sencilla animación en formato fijo, la convertiremos en un formato flexible para que se adapte a los diferentes tamaños de pantalla, o viewport, de los dispositivos móviles.


Modificar el canvas del juego del "gato"
10:29

Ya que tenemos nuestra aplicación adaptada a los diferentes dispositivos móviles, procedemos a empaquetarla con Phonegap y a instalarla en un dispositivo móvil para su prueba.

Empaquetar el juego del "gato" e instalarlo en un dispositivo móvil
02:52
6 More Sections
About the Instructor
Francisco Javier Arce Anguiano
4.4 Average rating
832 Reviews
12,739 Students
36 Courses
Lic. Matemáticas Aplicadas y Computación

Soy licenciado en matemáticas aplicadas y computación por parte de la Universidad Nacional Autónoma de México e instructor certificado de Adobe desde 2002. He trabajado para diferentes centros autorizados de Adobe en México y da clases en universidades de la Ciudad de México. Asimismo, he publicados cuatro libros sobre ActionScipt 2 y 3, con la editorial AlfaOmega de Méxicoasi como un libro de desarrollo de juegos con ActionScript con la misma editorial. He desarrollado aplicaciones para Android, iPhone, Windows Phone y BlackBerry. Actualmente preparo un libro para el desarrollo de juegos con HTML5 y para el desarrollo de aplicaciones a dispositivos móviles con esta tecnología. También he desarrollado múltiples aplicaciones con PHP, CSS, MySQL y JavaScript en mi vida profesional. Me he especializado en el desarrollo de aplicaciones educativas con Adobe Air y su desarrollo para dispositivos móviles. He estado pendiente de la evolución de HTML5 y CSS3 casi desde los inicios de estas tecnologías.