Three.js & WebGL 3D Programming Crash Course
3.3 (106 ratings)
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.
3,797 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Three.js & WebGL 3D Programming Crash Course to your Wishlist.

Add to Wishlist

Three.js & WebGL 3D Programming Crash Course

Learn how to create 3D web applications and games for web browsers with ease.
3.3 (106 ratings)
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.
3,797 students enrolled
Created by Frahaan Hussain
Last updated 7/2017
English
Curiosity Sale
Current price: $10 Original price: $20 Discount: 50% off
30-Day Money-Back Guarantee
Includes:
  • 1.5 hours on-demand video
  • 9 Articles
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Create interactive 3D web applications
  • Make 3D games
  • Use Three.js to create 3D worlds
  • Create cross platform web applications
  • Over 10 lectures
View Curriculum
Requirements
  • You should already be familiar with JavaScript
  • Passion for web development
Description

Learn how to create interactive 3D experiences such as web application and games. A step by step process is used to show everything from setting up to creating interactive 3D worlds.

Gain a good understanding of the following concepts:

  1. 3D design
  2. Model loading
  3. World/Scene generation
  4. User interaction
  5. Three.js and WebGL programming
  6. Game development

Three.js allows you to create amazing 3D web applications to target the biggest market in the world, THE WEB. Now with the boom of smart phones the audience is growing rapidly.

You will be provided with the full source code to aid in development during and after this course. The source code is free to use in as many projects as you wish.

Who is the target audience?
  • This Three.js course is meant for individuals looking to create 3D web applications and games
  • You should already be familiar with JavaScript programming
  • A basic understanding of Front End Development is also helpful
Students Who Viewed This Course Also Viewed
Curriculum For This Course
20 Lectures
01:32:05
+
Three.js & WebGL 3D Programming
11 Lectures 01:31:57

Introduction to Three.js with examples demonstrated to showcase it's capabilities. Also setup for Three.js will also be covered.

GitHub Source Code Link - https://github.com/SonarSystems/three.js-Crash-Course

Preview 17:27

Covers how to draw basic shapes such as cubes.

GitHub Source Code Link - https://github.com/SonarSystems/three.js-Crash-Course

Preview 08:52

Allow users to resize their browser and dynamically adjust our world to accommodate this change.

GitHub Source Code Link - https://github.com/SonarSystems/three.js-Crash-Course

Update Viewport On Resize
04:28

Implement a control system to easily navigate our 3D world.


GitHub Source Code Link - https://github.com/SonarSystems/three.js-Crash-Course

Controls
04:40

Learn how to make things more exciting with textures.


GitHub Source Code Link - https://github.com/SonarSystems/three.js-Crash-Course

Textures & Colours
07:58

We cover the various lighting techniques Three.js provides:

  • Ambient Lights
  • Point Lights
  • Spot Lights
  • Directional Lights


GitHub Source Code Link - https://github.com/SonarSystems/three.js-Crash-Course

Lighting
22:11

In this video we learn how to load external models to make your world more vibrant.

GitHub Source Code Link - https://github.com/SonarSystems/three.js-Crash-Course

Preview 06:45

Learn how to measure the performance of your 3D application.


GitHub Source Code Link - https://github.com/SonarSystems/three.js-Crash-Course

FPS (Frames Per Second/Framerate)
02:27

Learn the wonders of Anaglyphic 3D and how to easily implement it into your project.

GitHub Source Code Link - https://github.com/SonarSystems/three.js-Crash-Course

Anaglyphic 3D
04:56

Learn how to use skyboxes to revolutionise your game.

GitHub Source Code Link - https://github.com/SonarSystems/three.js-Crash-Course

Free skyboxes - http://www.custommapmakers.org/skyboxes.php

Skybox
10:29
+
Useful Learning Links
5 Lectures 00:07

Three.js Homepage

https://threejs.org/

Three.js Homepage
00:01

GitHub Link

https://github.com/mrdoob/three.js/

GitHub Code Repository
00:01

Aerotwist link

https://aerotwist.com/tutorials/getting-started-with-three-js/

Aerotwist
00:01

David Scott link

http://davidscottlyons.com/threejs/presentations/frontporch14/#slide-5


Intro By David Scott
00:01

Learning Three.js

http://learningthreejs.com/

Learning Three,js or WebGL For Dummies
00:01
+
Three.js Plugins
4 Lectures 00:06

Physijs Link

http://chandlerprall.github.io/Physijs/

Physijs (Physics Plugin)
00:01

Game extensions link:

http://www.threejsgames.com/extensions/


List of Game Extensions
00:01

tQuery API Link:

https://jeromeetienne.github.io/tquery/

tQuery API (Three.js & jQuery)
00:01

whs.js Link:

https://whsjs.io/

whs.js
00:01
About the Instructor
Frahaan Hussain
4.2 Average rating
420 Reviews
40,759 Students
10 Courses
CEO and Lead Developer at Sonar Systems

I am CEO of Sonar Systems which is the world leader in educational material for the game engine Cocos2d-x, one of the best and most popular game engines in the world. With years of experience programming and running an online education platform (Sonar Learning) I can help and support new programming like you.

I am also a University Lecturer teaching a variety of topics in Games Programming from Games Design to OpenGL Shader Programming.

I am also a published author of games design and soon to be released Responsive Web Design. I have all the facets required to educate and inspire.