Udemy
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
Development
Web Development Data Science Mobile Development Programming Languages Game Development Database Design & Development Software Testing Software Engineering Development Tools No-Code Development
Business
Entrepreneurship Communications Management Sales Business Strategy Operations Project Management Business Law Business Analytics & Intelligence Human Resources Industry E-Commerce Media Real Estate Other Business
Finance & Accounting
Accounting & Bookkeeping Compliance Cryptocurrency & Blockchain Economics Finance Finance Cert & Exam Prep Financial Modeling & Analysis Investing & Trading Money Management Tools Taxes Other Finance & Accounting
IT & Software
IT Certification Network & Security Hardware Operating Systems Other IT & Software
Office Productivity
Microsoft Apple Google SAP Oracle Other Office Productivity
Personal Development
Personal Transformation Personal Productivity Leadership Career Development Parenting & Relationships Happiness Esoteric Practices Religion & Spirituality Personal Brand Building Creativity Influence Self Esteem & Confidence Stress Management Memory & Study Skills Motivation Other Personal Development
Design
Web Design Graphic Design & Illustration Design Tools User Experience Design Game Design Design Thinking 3D & Animation Fashion Design Architectural Design Interior Design Other Design
Marketing
Digital Marketing Search Engine Optimization Social Media Marketing Branding Marketing Fundamentals Marketing Analytics & Automation Public Relations Advertising Video & Mobile Marketing Content Marketing Growth Hacking Affiliate Marketing Product Marketing Other Marketing
Lifestyle
Arts & Crafts Beauty & Makeup Esoteric Practices Food & Beverage Gaming Home Improvement Pet Care & Training Travel Other Lifestyle
Photography & Video
Digital Photography Photography Portrait Photography Photography Tools Commercial Photography Video Design Other Photography & Video
Health & Fitness
Fitness General Health Sports Nutrition Yoga Mental Health Dieting Self Defense Safety & First Aid Dance Meditation Other Health & Fitness
Music
Instruments Music Production Music Fundamentals Vocal Music Techniques Music Software Other Music
Teaching & Academics
Engineering Humanities Math Science Online Education Social Science Language Teacher Training Test Prep Other Teaching & Academics
AWS Certification Microsoft Certification AWS Certified Solutions Architect - Associate AWS Certified Cloud Practitioner CompTIA A+ Cisco CCNA Amazon AWS CompTIA Security+ AWS Certified Developer - Associate
Graphic Design Photoshop Adobe Illustrator Drawing Digital Painting InDesign Character Design Canva Figure Drawing
Life Coach Training Neuro-Linguistic Programming Mindfulness Personal Development Personal Transformation Life Purpose Meditation Emotional Intelligence Neuroscience
Web Development JavaScript React CSS Angular PHP WordPress Node.Js Python
Google Flutter Android Development iOS Development Swift React Native Dart Programming Language Mobile Development Kotlin SwiftUI
Digital Marketing Google Ads (Adwords) Social Media Marketing Google Ads (AdWords) Certification Marketing Strategy Internet Marketing YouTube Marketing Email Marketing Retargeting
SQL Microsoft Power BI Tableau Business Analysis Business Intelligence MySQL Data Analysis Data Modeling Big Data
Business Fundamentals Entrepreneurship Fundamentals Business Strategy Online Business Business Plan Startup Freelancing Blogging Home Business
Unity Game Development Fundamentals Unreal Engine C# 3D Game Development C++ 2D Game Development Unreal Engine Blueprints Blender
30-Day Money-Back Guarantee
Development Game Development SVG

Crea sistemas de juegos en línea con canvas y PHP 7

Aprende a crear juegos en línea con canvas, gráficos SVG con datos JSON, javascript con POO y PHP con bases de datos SQL
Rating: 4.6 out of 54.6 (292 ratings)
1,980 students
Created by Juan Fernando Urrego
Last updated 11/2020
Spanish
Spanish [Auto]
30-Day Money-Back Guarantee

What you'll learn

  • Aprenderás a hacer gráficos dinámicos a través de javascript y a utilizar javascript con programación orientada a objetos.
  • Aprenderás el uso de los gráficos SVG mezclados con CANVAS, y hacer colisiones físicas para tus juegos.
  • Aprenderás a construir un juego de plataforma al mejor estilo de Mario Bros (enemigos, colisiones, trampas, saltos, vidas, entre otros elementos que caracterizan los juegos de plataforma).
  • Aprenderás a utilizar el patrón Modelo-Vista-Controlador con PHP orientado a objetos para que nuestros juegos sean multi-usuarios, seguros y se pueda llevar registros de puntajes.
  • Aprenderás a construir tus propios juegos en línea con registro multi-usuario desde la red social de facebook para generar estrategias y campañas de masificación de tus juegos en la web. Además estos juegos que vas desarrollar en línea los podrán jugar desde diversas plataformas como laptop, tablet o móvil sin necesidad de instalar ninguna extensión.
Curated for the Udemy for Business collection

Course content

5 sections • 87 lectures • 20h 39m total length

  • Preview10:50
  • Contáctame
    00:12
  • Antes de comenzar
    01:09
  • CANVAS
    02:28
  • Preparando nuestro lienzo - parte 1
    15:12
  • Preparando nuestro lienzo - parte 2
    10:49
  • Dibujando figuras geométricas - parte 1
    13:15
  • Dibujando figuras geométricas - parte 2
    10:45
  • Dibujando figuras geométricas - parte 3
    16:28
  • Creando nuestro primer dibujo en CANVAS - parte 1
    12:52
  • Creando nuestro primer dibujo en CANVAS - parte 2
    06:53
  • Utilizando gráficos Mapa de Bits en CANVAS - parte 1
    08:45
  • Utilizando gráficos Mapa de Bits en CANVAS - parte 2
    14:18
  • Utilizando línea de tiempo en CANVAS - parte 1
    15:09
  • Utilizando línea de tiempo en CANVAS - parte 2
    07:33
  • Utilizando línea de tiempo en CANVAS - parte 3
    02:47
  • Programación Orientada a Objetos en Javascript
    04:19
  • POO en CANVAS
    14:01
  • Eventos de teclado en CANVAS
    20:55
  • Preview17:47
  • Colsiones - parte 2
    10:37
  • Colsiones - parte 3
    12:05
  • Creando nuestro primer juego en CANVAS - Laberinto
    17:19
  • Pon en práctica lo aprendido
    6 questions

  • Preview09:56
  • Organizando el proyecto bajo el patrón MVC - parte 2
    16:24
  • Organizando el proyecto bajo el patrón MVC - parte 3
    14:45
  • Haciendo el registro de Usuarios - parte 1
    24:50
  • Haciendo el registro de Usuarios - parte 2
    20:55
  • Haciendo el registro de Usuarios - parte 3
    20:06
  • Revisar usuarios repetidos
    10:03
  • Iniciar Sesión - parte 1
    18:20
  • Iniciar Sesión - parte 2
    11:41
  • Cerrar Sesión
    04:37
  • Archivo HTACCESS y url's amigables
    08:56
  • Llamando los niveles y puntajes
    13:23
  • Llamando los mejores puntajes
    19:59
  • Graficando el CANVAS - parte 1
    26:13
  • Graficando el CANVAS - parte 2
    21:32
  • Graficando el CANVAS - parte 3
    18:31
  • Haciendo un Preload
    21:00
  • Llamando datos JSON
    15:00

  • Preview18:01
  • Moviendo el escenario con el teclado - parte 2
    16:53
  • Generando efectos de profundidad
    20:52
  • Habilitando niveles y actualizando puntajes
    18:07
  • Subiendo nivel y puntajes a la base de datos
    23:01
  • Aplicando fullscreen al navegador
    20:28
  • Agregando la gravedad y las colisiones - parte 1
    20:16
  • Agregando la gravedad y las colisiones - parte 2
    08:01
  • Agregando la gravedad y las colisiones - parte 3
    20:52
  • Agregando el salto de nuestro jugador
    12:45
  • Agregando los sprites al jugador
    19:25
  • Corrigiendo algunos detalles de colisión
    13:37

  • Agregando las monedas - parte 1
    17:29
  • Agregando las monedas - parte 2
    13:55
  • Colisionando con las monedas
    08:26
  • Agregando las trampas
    18:30
  • Agregando movimiento a las trampas
    13:56
  • Agregando los enemigos
    15:15
  • Agregando disparos de los enemigos
    20:09
  • Colisionando con las balas del enemigo
    09:13
  • Agregar disparos del jugador
    22:43
  • Colisiones entre disparo jugador y disparo enemigo
    19:04
  • Maquetando el tablero del juego
    22:14
  • Activando nuestro tablero - parte 1
    18:41
  • Activando nuestro tablero - parte 2
    11:48
  • Agregando los sonidos - parte 1
    15:39
  • Agregando los sonidos - parte 2
    23:27
  • Agregando el panel final - parte 1
    06:15
  • Agregando el panel final - parte 2
    17:30
  • Habilitando los controles del sonido
    13:09

  • Optimizando los sonidos
    09:52
  • Optimizando las imágenes
    07:31
  • Agregar todos los gráficos a la precarga
    20:40
  • Adquiriendo un hosting para nuestro juego
    13:33
  • Inicio de Sesión con Facebook - parte 1
    21:32
  • Inicio de Sesión con Facebook - parte 2
    14:24
  • Cerrar Sesión de Facebook
    07:34
  • Compartir puntajes con Facebook
    20:23
  • Agregando nuestro juego al escritorio de los dispositivos touch
    22:18
  • Creando inicio de Sesión desde dispositivos touch
    14:54
  • Creando los controles para dispositivos touch
    14:50
  • Cambiar etiqueta <meter> por etiqueta <progress>
    03:52
  • Subiendo nuestro juego al servidor remoto
    17:49
  • Probando nuestro juego desde un IPAD
    02:29
  • Despedida
    02:41
  • Clase Extra
    02:49

Requirements

  • Es recomendable que los estudiantes que tomen este curso estén familiarizados con JAVASCRIPT y PHP, más no es un requisito.

Description

¿DE QUÉ SE TRATA EL CURSO?

Hoy en día el desarrollo de vídeo juegos ha traspasado las barreras en plataformas, ahora puedes hacer tus juegos orientados a la web, con registro de usuarios e integración de redes sociales para estrategias de negocios o sólo para entretenimiento. 

En este curso vas a aprender a generar gráficos dinámicos por medio de javascript a través del elemento HTML5 llamado CANVAS. Un recurso que ha revolucionado los gráficos en la web gracias a sus contextos 2D y 3D. Además vamos a utilizar la ventaja de los vectores SVG para ser importados a través de datos JSON y así poder generar interacciones más enriquecidas en Javascript con programación orientada a objetos.

Finalmente incluiremos datos SQL con PHP utilizando el patrón Modelo-Vista-Controlador para hacer registro de usuarios a través de la red Social Facebook y así impulsar nuestros juegos en forma masiva. ¡Anímate a subir de nivel!

¿CÓMO ES EL CURSO?

El curso se divide en varias secciones. En una primera sección nos introduciremos en CANVAS, allí aprenderás a hacer gráficos dinámicos a través de javascript y a utilizar javascript con programación orientada a objetos.

Luego aprenderemos el uso de los gráficos SVG mezclados con CANVAS, allí aprenderás hacer colisiones físicas para tus juegos.

En las siguientes secciones construiremos un juego de plataforma al mejor estilo de Mario Bros (enemigos, colisiones, trampas, saltos, vidas, entre otros elementos que caracterizan los juegos de plataforma), utilizaremos el patrón Modelo-Vista-Controlador con PHP orientado a objetos para que nuestros juegos sean multi-usuarios, seguros y se pueda llevar registros de puntajes.

En la última sección subiremos nuestro juego a un hosting gratuito y conectaremos nuestro juego con los perfiles de Facebook para publicar puntajes y compartirlos de forma masiva.

¿CUÁNTO SE TARDA EN COMPLETAR EL CURSO?

Depende de ti. Estimo que menos de tres semanas puedes completar el curso, pero dependerá de tu ritmo de trabajo y de tu disponibilidad.

¿CUÁLES SON LOS REQUISITOS?

Descargar el material que se encuentra en los recursos de la primera clase de cada sección. Tener principios en HTML5 y CSS3, curso gratuito que puede realizar en UDEMY: "Aprende HTML5 y CSS3 desde cero". No es indispensable pero sería bueno para la construcción del juego y almacenamiento de datos tener bases en Javascript y PHP, además te recomiendo descargar el servidor local XAMPP para cualquier sistema operativo, con versión PHP mínimo 5.6.28, lo puedes descargar desde la página web directa de XAMPP.

¿A QUIÉN VA DIRIGIDO ESTE CURSO?

Este curso va dirigido a personas que deseen desarrollar juegos en línea con HTML5, personas que deseen subir de nivel en la programación y adquirir competencias en el desarrollo de video juegos orientado a plataformas web.

Who this course is for:

  • Este curso de CANVAS va dirigido a las personas que deseen aprender a crear sus propios juegos en plataformas web de una forma nativa sin ayuda de plugins o extensiones

Instructor

Juan Fernando Urrego
Diseñador Visual y Desarrollador Web
Juan Fernando Urrego
  • 4.5 Instructor Rating
  • 35,260 Reviews
  • 193,501 Students
  • 33 Courses

Mi nombre es Juan Fernando Urrego, soy profesional en Diseño Visual, programador y especialista en Administración de la Informática Educativa. Dedicado tiempo completo a la docencia en Desarrollo Web y Diseño Interactivo. Fundador del portal de cursos Tutoriales a tu Alcance. Soy un convencido de que la internet es la oportunidad del conocimiento, la educación y los empleos del futuro.

  • Udemy for Business
  • Teach on Udemy
  • Get the app
  • About us
  • Contact us
  • Careers
  • Blog
  • Help and Support
  • Affiliate
  • Terms
  • Privacy policy
  • Cookie settings
  • Sitemap
  • Featured courses
Udemy
© 2021 Udemy, Inc.