threejs-journey.com Open in urlscan Pro
109.234.160.172  Public Scan

Form analysis
0 forms found in the DOM

Text Content

Home Lessons Community Challenges Selection Highlights
Login Start learning now
Lessons Challenges Selection Highlights
Login Start learning now
by Bruno Simon


BECOME A THREE.JS DEVELOPER

Everything you need in one place:

72 hours of video to go from absolute beginner to advanced Three.js developer.

35,603 Students already enrolled and they love it

Start learning now $95VAT incl. It's for a gift
Level 00 01 02 03 04 05

Click to explore

Get good at Three.js with only one course

Joining Three.js Journey will give you lifetime access to a complete and easy to
access course with 53 lessons.

Want to see what's included? Check out the video down below:

0
chapters

0
lessons

0
hours of videos
0:00/2:17

1920x1080 1920x1080
nonefr (auto)en
subtitles subtitles


3:22
2:17




Each lesson begins with a starter folder to download.
Then, simply follow the tutorial!

If you don't like videos, each lesson is also available as text with
screenshots, video previews, snippets with syntax coloration, etc.

Plus, you can slow down or speed up the videos!


WHAT WILL YOU LEARN?

The course is complete, yet accessible for beginners. We will start by
discovering what WebGL is and why using the Three.js library is a must. We will
then discover the various components of Three.js and once the basics are
acquired, we will move on to more advanced techniques to display millions of
particles, add physics, add interactions, create a galaxy, animate a raging sea,
etc.

At the end of the course, you will have a deep understanding of Three.js and
enough experience to start your own projects.

As a bonus, we will also learn how to use the 3D software Blender to be able to
create our own models.


02


CLASSIC TECHNIQUES

Illuminate your scene with various lights, start practicing environment creation
and create millions of particles.

6 lessons — 6h 20mn

14 Lights preview 42mn 15 Shadows preview 1h 00mn 16 Haunted House preview 1h
15mn 17 Particles preview 49mn 18 Galaxy Generator preview 1h 08mn 19 Scroll
based animation preview 1h 23mn


04


SHADERS

Using Three.js materials is great but creating your own is even better.
Learn the shader language to unleash the true power of WebGL and create stunning
experiences!

5 lessons — 7h 29mn

27 Shaders preview 2h 17mn 28 Shader patterns preview 1h 49mn 29 Raging sea
preview 1h 15mn 30 Animated galaxy preview 1h 14mn 31 Modified materials preview
51mn


06


PORTAL SCENE

Learn how to create a cool scene using Blender and discover the baking technique
to get the best looking lights and shadows.

4 lessons — 6h 38mn

36 Creating a scene in Blender preview 2h 04mn 37 Baking and exporting the scene
preview 2h 11mn 38 Importing and optimizing the scene preview 46mn 39 Adding
details to the scene preview 1h 34mn


01


BASICS

Create your first scene and understand fundamentals like cameras, geometries,
materials, textures.
Add a debug panel to tweak your environment and animate everything.

13 lessons — 10h 12mn

01 Introduction free 35mn 02 What is WebGL and why use Three.js free 23mn 03
First Three.js Project free updated 1h 19mn 04 Transform objects preview 46mn 05
Animations preview 30mn 06 Cameras preview 57mn 07 Fullscreen and resizing
preview 30mn 08 Geometries preview 35mn 09 Debug UI preview updated 48mn 10
Textures preview 1h 14mn 11 Materials preview updated 1h 21mn 12 3D Text preview
44mn 13 Go live free 24mn


03


ADVANCED TECHNIQUES

Add physics to your world so that objects start to collide and stumble. Then
import your own model made with Blender and make it look as realistic as
possible.

7 lessons — 12h 34mn

20 Physics preview 1h 57mn 21 Imported models preview 1h 07mn 22 Raycaster and
Mouse Events preview 1h 07mn 23 Custom models with Blender preview 1h 59mn 24
Environment map preview 1h 49mn 25 Realistic render preview 1h 12mn 26 Code
structuring for bigger projects preview 3h 19mn


05


EXTRA

Once you know shaders, it's the opportunity to go even further and try new
techniques.
But it's also important to make sure your projects are working on most devices
by monitoring and optimising performance.

4 lessons — 4h 37mn

32 Post-processing preview 1h 36mn 33 Performance tips preview 1h 12mn 34 Intro
and loading progress preview 49mn 35 Mixing HTML and WebGL preview 58mn


07


REACT THREE FIBER

Did you know that Three.js integrates well in React?
Thanks to React Three Fiber (R3F) you can create awesome Three.js experiences in
React with just a few lines of code.

14 lessons — 23h 58mn

40 What are React and React Three Fiber free 25mn 41 First React Application
preview 4h 23mn 42 First R3F Application preview 2h 05mn 43 Drei preview 1h 14mn
44 Debug preview 51mn 45 Environment and Staging preview 2h 02mn 46 Load models
preview 1h 29mn 47 3D Text preview 59mn 48 Portal Scene preview 41mn 49 Mouse
Events preview 47mn 50 Post-processing preview 1h 53mn 51 Fun and Simple
Portfolio preview 51mn 52 Physics preview 2h 11mn 53 Create a game preview 4h
01mn

MEET BRUNO SIMON

Bruno Simon is a French creative developer specialized in WebGL. He has worked
on many projects for renowned clients to create interactive 3D experiences
accessible to everyone from their browser.

Bruno has been teaching web development and WebGL in various schools for more
than 7 years, making him a pedagogical trainer, alternating theory and practice.

50k+ followers 15k+ followers 4k+ connections
Bruno's projects
Madbox

Chartogne Taillet

Portfolio

Scout

Orano experience

Prior
Madbox

Chartogne Taillet

Portfolio

Scout

Orano experience

Prior
Madbox

Chartogne Taillet

Portfolio

Scout

Orano experience

Prior
Madbox

Chartogne Taillet

Portfolio

Scout

Orano experience

Prior


IS THIS COURSE FOR YOU?


THE COURSE IS BEGINNER FRIENDLY

You don't need to have done WebGL or Three.js before.

This training is intended for absolute beginners and will explain the basics
before tackling more advanced topics.

You don't have to be good at mathematics.

Yes, we're going to do mathematics, but at a simple level and we will explain
how it works with drawings and practice slowly.

You don't need to know how to use 3D software.

Together we will learn the basics of the 3D software Blender to create a model
and import it into our scene.

You don't need to be good at JavaScript.

All you need are JavaScript basics like variables, objects, arrays, loops,
functions and events. We will learn the rest together.

You don't need a crazy ass computer.

In some lessons, we will tackle performance limits, and learn how to handle and
optimize our code to get good frame rates.


35,603 STUDENTS HAVE JOINED THE COURSE!
HAVE A LOOK AT THEIR WORKS


Discover more


SOME PROFESSIONALS TALKING ABOUT THE COURSE

I'm in awe with the quality of Bruno's course. I can't imagine a funner way to
start with 3d programming ✨

Mr.doob
Three.js creator



We’re so lucky we have people like @bruno_simon spending the time to make this
content for others to learn. 🙌🏻

Amelie Maia
Senior Creative Developer @Jam3



I Have been teaching alongside @bruno_simon for many years and I can tell he is
one of the most passionated mentor you can find. So if you want to master
ThreeJS there is only one place 👇

Martin Charpentier
CEO @source_paris



Probably the most complete threejs course out there, wish I had this when I
started.
And it has a text version as well!

Florian Morel
Freelance creative developer

Here it is ! The #threejsJourney course by @bruno_simon is finally out ! 🔥🤩
I've had access to it for a few days, and I can already tell you that it's
UNIQUE ! I never been that hyped to learn something !
I'm such impressed by this course quality, give it a look ! 🧙‍♂️

Jordan Marcon
Full-Stack Developer



Everything you need to know about WebGL & Three.js to create amazing online 3D
experiences. By @bruno_simon 🔥🔥🎉

Samuel Medvedowsky
Principal designer @Metalab



The guy who gave me the taste to code just released his first course about
#threejs. You (really) should give it a deep look 👇👇👇

Antoine Lin
Freelance



It's finally live! I highly recommend it if you want to get into 3D WebGL and
one concise source for it all

Jason Bradley
Freelance Creative Developer

As one of his former student in development, I can assure you @bruno_simon is an
outstanding teacher.
I can count him in the few people that made me the developer and the teacher I
am today.
If you're interested in learning 3D WebGL it's totally worth it 👍

Louis Chenais
Specify Co-Founder



Ok, I was able to do @bruno_simon course early. As an intermediate WebGL/ThreeJS
level person I felt the course is complete. It can aid ppl at various levels to
start mastering 3D on the web. The plus ⏤ endless inspiration after all
beautiful creations one makes while learning ⚡️

ilithya
Digital artist, creative developer, designer



If you want to get into webgl, or want to learn even more. This is an Instant
buy.

Daniel Velasquez
Creative developer



Countless hours of work from Bruno to offer a super high-quality course, for a
really low price. If you wanted to dig into three.js this won't disappoint.

Quentin Gauvrit
Freelance UX Designer


FREQUENTLY ASKED QUESTIONS

What are the prerequisites?

Even if the course is beginner friendly, you need to know JavaScript basics like
variables, objects, arrays, loops, functions, conditions and events.

The code editor used in the lessons is Visual Studio Code but you can use any
editor you like.

The browser used in the lessons is Chrome but you can use any browser you like.
However, it is recommended to use one with a good developer tools panel like
Chrome or Firefox.

Eventually, you will have to install Blender, but the software is free and works
on all major OS.

Can I use Three.js with React?

Yes, thanks to the React Three Fiber renderer, we can write Three.js application
directly in React.

And it doesn't stop there. React Three is a huge ecosystem with many tools and
features that will improve your developer's life.

It's so big that a whole chapter is dedicated to the topic.

And if you don't know React, the course includes a 4 hours long lesson that will
teach you the basics of React.

Is the content up to date?

All the dependencies used throughout the lessons are updated multiple times a
year and the content is adjusted accordingly.

New lessons are also regularly added in order to cope with the latest features
and to answer community requests.

What if I need help?

With the course, you will also get access to a private Discord server. If you
get stuck or you don't understand a specific part of a lesson, you can share
your problem to get help.

I don't speak English very well. Will it be a problem?

Although the lessons are in English, they have all been captioned.
For a better comprehension, the technical terms are perfectly written and
highlighted.
And if the video is going too fast, you can slow down the pace.

French, Spanish, and Hindi subtitles are available as well.

To test and see how difficult it is for you to follow, all beginnings and some
full lessons are available for free.

Finally, all the lessons are available as text right below the video with the
exact same content (screenshots, code snippets, video previews, etc.)

Can I offer it?

Yes, you can gift the course to someone else by clicking on this link.

You can pick an option between letting us email the gift to the receiver or you
can share the gift yourself.

You'll receive an invoice by email and the recipient won't have access to your
billing information.

Can I test the lessons?

The first lessons are free! Have a look and see for yourself if you like the
content.

And if it's not enough, the beginning of every other lesson is also free.

What if I don't like the course?

If you are not happy with the course, whatever the reason is, you can ask for a
refund at any time by sending an email at contact@threejs-journey.com.

Following the refund, your account will be deleted.

Is there a way to get a discount?

The price of the course has already been calculated to be as low as possible in
order to be accessible for everyone and the VAT is included.

You pay only once and get access to all the lessons, a members-only Discord
server and upcoming updates!

Still, if it's too expensive for you, discounts might happen at some occasions.
Follow @bruno_simon on Twitter to be alerted.

Do I have to do the entire course to start my own project?

No! Once you feel comfortable, you can start working on your personal
experiences by yourself. You won't have to wait until the end of the course, but
obviously, you will be able to jump back to the course at any time where you
left it.

And if you struggle on any project, whether it is personal or professional, the
Three.js Journey community will always be happy to help.

Do you provide a certificate of completion?

Yes! Each lesson comes with a quiz. Completing all quizzes will grant you access
to a public certificate that you can print or share with the world.

Failing on answering a quiz will result in a few minutes time out, letting you
time to find the information before answering again.

Can I ask for a VAT refund?

If your company is in the EU (outside of France), you can ask for a VAT refund.

To do that, after buying the course, go to your account settings and fill the
VAT refund request form. Information will be reviewed and proof that you work at
the company might be requested.

Can I have an invoice?

Once you've bought the course, you get access to an invoice. You can add any
additional data you need on the document.


START LEARNING NOW


ONLY $95 FOR A 72 HOUR COMPLETE COURSE


Start learning now It's for a gift

© 2023. All rights reserved.
Navigation
 * Home
 * Login
 * Join
 * Gift the course

Contact
 * contact@threejs-journey.com
 * bruno_simon
 * Discord
 * LinkedIn
 * Youtube

Other
 * Mux (video streaming)

Legal
 * Legal notice
 * General Conditions of Sale and Use
 * 
 * Mentions légales (fr)
 * Conditions Générales de Vente et d'Utilisation (fr)