What you'll learn

Build a completely randomized, intelligent 2D memory game with stellar design with javascript, HTML5 & CSS3
Learn how to design the game logic for the game and implement it as code
Learn how to make the game intelligent and interesting by introducing a randomization element into it. Make it unpredictable for even the programmer of the game.
Learn how to set up the skeleton of a web app or web game using HTML5
Learn how to design a sophisticated 2D game using advanced CSS and CSS3 concepts
Learn how to make a 2D game playable using javascript concepts
Build a fully featured timer for your game
Learn how to make CSS3 card flipping work
Learn how to create completely customized popup boxes - you can use this knowledge in a number of other projects as well
Build a score display for your game
Learn how to make completely customized alert boxes (or popup boxes) - the game's final display
Understand how 2D game development works in the web (with javascript and HTML5)
Understand the basics of HTML5 & CSS3 (I'll explain the concepts as we code the project)
Understand the basics of javascript (we have separate modules for this topics)
Improve your web app development, 2D game development & javascript skills
Improve your logical problem solving skills
Improve your front end design and development skills

Requirements

You can come to this course with absolutely no coding knowledge. I explain everything you need to create your very first 2D web game.
A PC or laptop to practice what I teach

Description

Practice makes perfect.

Start your journey into becoming a professional 2D Game Developer for the Web and a front end web developer here!

Learn how to create a real world Dynamic, intelligent Memory Game with Timer & Score cards with Web 2D Game development concepts!

At DigiFisk, we like making learning fun. Our courses are interactive and fun with a ton of practical elements to it. We've decided to take it a step further with our Front end Web app development practice series.

Once you learn the syntax of a programming language, the next logical step is to start creating software and apps. But that's where most students get stuck. Problem solving isn't as easy as learning a bunch of syntaxes.

But we aim to make it easy for you. We also aim to teach you intermediate programming topics like object oriented programming while at it.

What will you learn in this course?

In this course, you'll learn how to build your Randomized Dynamic 2D Memory Game with Timer, Score card & Customized result display from the ground up with just HTML5, javascript and CSSS and 2D Game Development concepts in just a couple of hours.

You'll learn:

1. How to build a completely randomized, intelligent 2D memory game with stellar design with javascript, HTML5 & CSS3

2. How to design the game logic for the game and implement it as code

3. How to make the game intelligent and interesting by introducing a randomization element into it. Make it unpredictable for even the programmer of the game.

4. How to set up the skeleton of a web app or web game using HTML5

5. How to design a sophisticated 2D game using advanced CSS and CSS3 concepts

6. How to make a 2D game playable using javascript concepts

7. How to build a fully featured timer for your game

8. How to make CSS3 card flipping work using CSS3 transitions and css3 transformations.

9. Logical problem solving

10. How to create completely customized popup boxes - you can use this knowledge in a number of other projects as well

11. How to build a score display for your game that dynamically updates itself.

12. How 2D game development works in the web (with javascript and HTML5)

13. The basics of HTML5 & CSS3 (I'll explain the concepts as we code the project)

14. The basics of javascript (we have separate modules for this topics)

15. Front end design and development

By the end of the course, you'll be one step closer to creating web based 2D games and front end web apps like a pro. You could even try creating other web apps and games from the concepts you learn in this course.

How is this course designed?

I've made this course as easy to understand as possible. I've structured it in such a way that each section will handle one of the 3 languages covered here.

Introduction: This is where I'll explain how the game works, it's various features and what we'll be using to achieve the same results.

Module 1: We'll be teaching you how to create the bare bones of the game with HTML5. The result will be a page with all the elements we need in our game, devoid any colors or design elements.

Module 2: Here, we'll "beautify" our game. We'll be using both basic and Advanced CSS & CSS3 elements, including CSS3 Transformation & CSS3 Transitions, to give our app colors and styles (including 3D styles), and make the card flip happen. At the end of this module, we'll have a Memory game that'll look like the final result, albeit one that is not playable yet yet. We'll cover that in the javascript module.

Module 3: We'll be covering some basic concepts of javascript in this module. We'll only cover concepts that we'll need for our app's javascript code though. If you already know the basics, you can skip this module.

Module 4: This would be the meat of the course. We'll be delving into javascript & Web 2D Game development of our game in this module, and We'll teach you how to make the game playable (make the card flip, the timer, the randomized card load feature and the customized result display work) in here.

Final section: Finally, We'll give you some ideas on how to improve/enhance the app further and make it your own in terms of design and functionalities.

This course is for you if:

1. If you're completely new to web 2D game development & Web development and you want to learn by creating a real world 2D game.

2. If you're a complete newbie to the world of web development or 2D game development, or just programming in general, and would like to start creating games and web apps with the help of a beginner-friendly course. You'll learn the basics of everything used in this project (HTM5, CSS3, javascript, CSS transitions & transformations). I'll be explaining every single line of code I'll be using in this course, so you won't feel lost.

3. If you have the passion for programming, and if you know the basics of HTML5 and CSS3, but you're stuck on the practical aspects of it. Turn your theoretical knowledge into practical knowledge with our course.

4. If you want to learn web game development the fun way - by doing, rather than just listening and taking notes.

5. If you want to delve into the exciting world of 2D game development for the web, this course will take you a couple steps further in the right direction.

6. If you're a javascript web developer who just wants to try out a new project. Our course welcomes coders of every level, from absolute beginners, to pros.​

7. If you know the theoretical concepts of javascript but would like to learn how to apply your knowledge in the real world.

8. If you want to add a real-world project/game to your resume - to get a promotion or find a new job.

9. If you want to pad your portfolio with a cool project to bag more freelance web development and 2D game development projects.

10. If you'd like to go from a complete beginner to an intermediate web programmer and 2D web game developer.

11. If you'd like to learn something that can be used in your university coursework (project).

So, what are you waiting for? Get this course today, and begin your journey into the wonderful world where 2D game development meets front end web development with the help of CSS3 transitions & transformations!

Who is the target audience?

If you're completely new to web 2D game development & Web development and you want to learn by creating a real world 2D game
If you want to learn web development the fun way - by doing, rather than just listening and taking notes. If you love learning by creating, and don't like to listen to hours of theory, this course is for you
If you'd like to pad your resume or portfolio with an impressive project
If you'd like to learn something that can be used in your university coursework (project)
If you'd like to go from a complete beginner to an intermediate web programmer and 2D web game developer
If you're a javascript web developer who just wants to try out a new project. Our course welcomes coders of every level, from absolute beginners, to pros.​
If you have the passion for programming, and know the basics of HTML5 and CSS, but you're stuck on the practical aspects of it. Turn your theoretical knowledge into practical knowledge with our course.

Download Part 01
Download Part 02