CodePen Designs - 41 : Traffic Run Game with Three.js

We are excited to introduce our new series that will explore the best design ideas from the Codepen community.

We will be publishing these each day and hope you find them insightful and inspiring as we showcase some of the most talented designers in this space.

Video Tutorial

Don't miss the amazing video we've embedded in this post! Click the play button to be inspired

Codepen Design - 41

Three.js video tutorial explaining the source code

Youtube: https://youtu.be/JhgBwJn1bQw

In the tutorial, we go through the source code of this game. We cover, how to set up a Three.js scene with box objects, how to add lights, how to set up the camera, how to add animation and event handlers. We also add textures with HTML Canvas and learn how to draw 2D shapes in Three.js then how to turn them into extruded geometries.

Check out my YouTube channel for other game tutorials: https://www.youtube.com/channel/UCxhgW0Q5XLvIoXHAfQXg9oQ

The game in the video is heavily inspired by the mobile game Loop Driver: https://apps.apple.com/us/app/loop-drive-crash-race/id992442150

For more information

1. Check my GitHub profile
   https://github.com/amitSharma7741

2. Check out my Fiver profile if you need any freelancing work
   https://www.fiverr.com/amit_sharma77

3. Check out my Instagram
   https://www.instagram.com/fromgoodthings/

4. Linktree
   https://linktr.ee/jonSnow77

5. Check my project

• EVSTART: Electric Vehicle is the Future https://evstart.netlify.app/
• News Website in react https://newsmon.netlify.app/
• Hindi jokes API https://hindi-jokes-api.onrender.com/
• Sudoku Game And API https://sudoku-game-and-api.netlify.app/