Skip to main content

Build Animated Physics Game with JavaScript

3h 29m 27s
English
Paid

What makes a great game? Is it about beautiful, polished visuals or engaging gameplay that feels responsive? Could it be about unique ideas, special secrets, and Easter eggs? This course explores the essential ingredients of a perfect game development recipe.

Course Overview

In this class, we will dive deep into sprite animation, interactivity, and 2D physics. You'll learn 10 important techniques every game developer needs to know, applying them in a real project. By the end of this course, you'll have a solid foundation in game development.

Course Materials

Students will receive a wealth of 2D professional high-resolution game art for free. This includes environmental and character art assets as ready-to-use sprite sheets. You'll also get source files with separate pieces, perfect for editing colors, creating your own mushrooms and creatures, or rigging your own animations.

What You'll Learn

  • How to implement a simple AI to make creatures feel alive.
  • Ways to control the FPS of your game and measure time to trigger periodic events.
  • Methods to restart the game by pressing a button.
  • Techniques for applying collision detection to resolve collisions and simulate physics.
  • Using the built-in drawImage method to create randomized game environments and animate characters from a sprite sheet.
  • Capturing mouse positions to animate an 8-directional sprite sheet based on the relative position between the mouse and the player character.
  • Building a game from scratch using HTML5, CSS3, and plain vanilla JavaScript without relying on external frameworks or libraries. You'll write and understand every line of code.
  • ... and much more!

Prerequisites

This course is beginner-friendly, but existing knowledge of HTML, CSS, and JavaScript is needed. If you understand JavaScript basics and are familiar with functions, for loops, and arrays, you'll gain maximum value from this class.

Have fun and start creating your own games today! :)

About the Author: udemy

udemy thumbnail
By connecting students all over the world to the best instructors, Udemy is helping individuals reach their goals and pursue their dreams. Udemy is the leading global marketplace for teaching and learning, connecting millions of students to the skills they need to succeed. Udemy helps organizations of all kinds prepare for the ever-evolving future of work. Our curated collection of top-rated business and technical courses gives companies, governments, and nonprofits the power to develop in-house expertise and satisfy employees’ hunger for learning and development.

Watch Online 36 lessons

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 36 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Introduction
All Course Lessons (36)
#Lesson TitleDurationAccess
1
Introduction Demo
00:47
2
Basic setup
03:52
3
Object Oriented Programming in JavaScript
04:22
4
Drawing the player
07:11
5
Mouse controls
06:00
6
Making the player move
07:40
7
Creating obstacles
06:34
8
Non-overlapping obstacles
06:36
9
Randomized images from a sprite sheet
05:15
10
Positioning rules
06:00
11
Reusable collision detection method
04:05
12
Physics
08:08
13
8 directional sprite animation
04:14
14
Animation angles
07:06
15
Debug mode
03:34
16
Player movement boundaries
02:57
17
FPS
09:40
18
Egg class
04:54
19
Periodically adding new eggs
07:00
20
Egg physics
05:35
21
Draw order
08:18
22
Enemy class
11:20
23
Larva class
03:27
24
Egg hatching
09:59
25
Larva sprites and collisions
04:38
26
Gaining score points
02:41
27
Particle effects
08:56
28
Particle motion
07:05
29
Randomised enemy skins
04:25
30
Win and lose condition
10:32
31
Restart game
06:32
32
Extending enemy class
05:56
33
Simple fullscreen mode
03:08
34
Player sprite sheet full animation
02:37
35
Larva sprite sheet full animation
01:44
36
Enemies sprite sheet full animation
06:39
Unlock unlimited learning

Get instant access to all 35 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription