Learn HTML 5 Game Development - Create Cross Platform Games

Learn HTML 5 Game Development : Create Cross Platform Games, available at $19.99, has an average rating of 0.5, with 65 lectures, based on 1 reviews, and has 253 subscribers.

You will learn about Create a complete 2d game in HTML 5 Create your own Canvas Understand how co-ordinates works Create Variables Create Functions Understand conditional statements This course is ideal for individuals who are Beginner HTML5 Game developers or Anyone interested in new skills It is particularly useful for Beginner HTML5 Game developers or Anyone interested in new skills.

Enroll now: Learn HTML 5 Game Development : Create Cross Platform Games

Summary

Title: Learn HTML 5 Game Development : Create Cross Platform Games

Price: $19.99

Average Rating: 0.5

Number of Lectures: 65

Number of Published Lectures: 65

Number of Curriculum Items: 65

Number of Published Curriculum Objects: 65

Original Price: $54.99

Quality Status: approved

Status: Live

What You Will Learn

Create a complete 2d game in HTML 5

Create your own Canvas

Understand how co-ordinates works

Create Variables

Create Functions

Understand conditional statements

Who Should Attend

Beginner HTML5 Game developers

Anyone interested in new skills

Target Audiences

Beginner HTML5 Game developers

Anyone interested in new skills

HTML 5 Game Development is what we call game development that runs in a browser, that uses the exact same languages and tools of front-end development. By knowing HTML, CSS and JavaScript it is already possible to create simple games able to run on your every platform equipped with a browser. But that has been possible for a long time and, although some pretty addictive games can be created using that technology, to talk about HTML 5 game development is to talk about the canvas API.

Canvas is a simple yet powerful api that allows to draw graphics via scripting, having control on every single individual pixel. It can be used for both 2D graphics and 3D graphics (through webgl), but in this series of articles I will focus on 2D since it is the only context I have experience with and doesn’t require use to learn to use a completely different language.

This course will teach you how to create an HTML 5 2d game from scratch that will run on all platforms and devices that have a web browser.  What this means is that HTML games are cross platform. The huge advantage of creating your games in HTML 5 is that you can use completely free tools to create the games. Also you only have to write the code once and use it on any device or platform with a web browser.

To have a better understanding of this course you are expected to have a basic working knowledge of Html, Css and JavaScript. I will be including some refreshers as a guide.   

In this course our project will be to create a complete 2d HTML game that can be played on any device or platform.  We will be rendering our game inside HTML 5 canvas element of which you get some basic training on what is a canvas and how to create one and also draw on it.   

What you’ll learn in this course:

 

What is a canvas?

HTML Refresher quick course

CSS Refresher quick course

JAVASCRIPT   Refresher quick course

Understanding Co-ordinates

How to draw graphics

Create a complete 2d HTML Game

After completing this course you will have enough creative skills to create your own games and web apps using HTML 5.

 

Thank you and welcome to the course.

Course Curriculum

Chapter 1: Introduction

Lecture 1: Introduction

Lecture 2: The Benefits of using developing games in HTML 5

Lecture 3: Note on text editors

Lecture 4: Plain Text Editors

Lecture 5: Install Visual Studio Code text editor for Windows

Lecture 6: Install Visual Studio Code text editor for Macs

Chapter 2: HTML 5 Refresher

Lecture 1: Creating Folder Structure

Lecture 2: HTML Document Structure

Lecture 3: HTML Heading Tags

Lecture 4: Creating Paragraphs

Lecture 5: HTML5 Comments

Lecture 6: HTML Elements | Attributes | Links

Chapter 3: CSS Refresher

Lecture 1: CSS Syntax Rule

Lecture 2: Internal CSS

Lecture 3: External CSS

Lecture 4: Id Attribute

Lecture 5: Class Attribute

Lecture 6: CSS Margin Property

Lecture 7: CSS Padding Property

Lecture 8: CSS Comments

Lecture 9: CSS Font -Family

Lecture 10: CSS Font-Weight Property

Lecture 11: Css Font Size Property

Lecture 12: CSS Background -Color

Chapter 4: JavaScript Refresher

Lecture 1: JavaScript Syntax

Lecture 2: Changing Content

Lecture 3: Conditional Satements

Lecture 4: Data Types

Lecture 5: Operators

Lecture 6: Variables

Lecture 7: Functions

Lecture 8: Javascript Comments

Lecture 9: Housing Javascript

Chapter 5: Introduction To Canvas

Lecture 1: What is Canvas

Lecture 2: Canvas is Popular

Lecture 3: Create a Canvas

Lecture 4: Create a canvas continued

Lecture 5: Learning the Co-ordinates

Lecture 6: Create Graphic on Canvas

Chapter 6: Project: Complete HTML 5 2D Game Development Part 1

Lecture 1: Have a peek at what we will create

Lecture 2: Creating the game Canvas

Lecture 3: Referencing the game canvas

Lecture 4: Creating the game ball

Lecture 5: Creating movement for the game ball

Lecture 6: Clearing ball obstruction

Lecture 7: Getting the ball to bounce Part 1

Lecture 8: Getting the ball to bounce part 2 : Collision Detection

Chapter 7: Complete HTML 5 2D Game Development Part 2: Paddle and Keyboard Controls

Lecture 1: Introduction

Lecture 2: Create Variables for the paddle

Lecture 3: Create function to draw the paddle

Lecture 4: Create event listeners for keyUP and keyDown events

Lecture 5: Create functions to control the events

Lecture 6: Create variables to store left and right movement

Lecture 7: Create logic to move the paddle

Lecture 8: Create Game Over Logic

Chapter 8: Complete HTML 5 2D Game Development Part 3: Building The Bricks

Lecture 1: Introduction

Lecture 2: Create variables for building the brick

Lecture 3: Create Arrays to hold the bricks

Lecture 4: Create function to draw the bricks

Lecture 5: Implementing Collision detection for the bricks

Lecture 6: Activating the collision detection

Lecture 7: Creating a Score and Wining The Game

Lecture 8: Implementing Mouse Controls

Lecture 9: The Amazon App Store

Lecture 10: Some games made with HTML 5

Instructors

Skill Tree
Skill based learning

Rating Distribution

1 stars: 1 votes

2 stars: 0 votes

3 stars: 0 votes

4 stars: 0 votes

5 stars: 0 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!