강의

멘토링

커뮤니티

Programming

/

Front-end

Creating a First-Person 3D Website with Three.js

This course will teach you how to create a first-person 3D website that works on both desktop and mobile.

(5.0) 7 reviews

253 learners

  • studiomeal
3d웹사이트
3d
three.js
Interactive Web
Three.js
JavaScript
Portfolio

Reviews from Early Learners

What you will learn!

  • Three.js Core Concepts

  • Principles of implementing a first-person 3D web page

This course covers creating a 3D webpage from a first-person perspective.
(Think of the actions in a game like Mine*raft 😊 )

Many of you have been asking me, "How do I make something like this?" after seeing my website, https://studiomeal.com . So, I've created a course that focuses on implementing core movements. It's a no-frills course focused solely on creating 3D space and implementing movements !

Turn your head,

Click on an object to make it move

Create a world where physics applies

An example that works well on mobile too

🤔 How is this different from the previously released "3D Interactive Web with Three.js" course?

The existing lecture, 3D Interactive Web Starting with Three.js, is a 'comprehensive lecture' that covers the basic concepts of Three.js in detail and allows you to study various examples.

This lecture quickly covers the core fundamentals of Three.js and focuses on the 'principles of implementing first-person 3D space' .

🐣 I'm new to Three.js. Can I start this course right away?

While this course focuses on implementing 3D space, it summarizes the core fundamentals in the first section to ensure that even those new to Three.js can understand it. A basic understanding of JavaScript is sufficient for the course. Free sample lectures are available to give you an idea of the course's difficulty level. For those who want to solidify their Three.js foundation, we recommend taking our other course, "3D Interactive Web with Three.js."

🛤 Get a 30% discount coupon on the 1-minute coding Three.js roadmap.

You can get a 30% discount coupon "Apply to entire purchase" from the 1-minute coding Three.js roadmap.
(Even if you are already taking one of the two lectures, if you apply for the new lecture with the roadmap coupon, a 30% discount will be applied. If you want to take both lectures, please apply for them on the roadmap !)

Go to Roadmap

Lecture Features

Use images and animations to make it easier to understand

Since this is a class where understanding the implementation of movements is important, rather than just explaining it with words, we used images and animations to make it easier to understand.

This course focuses on implementing first-person 3D websites.

This course summarizes the fundamental concepts of Three.js and focuses on implementing first-person 3D spaces. It's ideal for those who want to quickly create their own 3D spaces.

Things to note before taking the course

Learning Materials

  • We provide both starting and finished versions of all code so you can follow along and write your own. If you encounter a problem with your code midway through the course and are having trouble progressing, you can download the source code for that chapter and continue learning from that point forward.

  • The source code provided in the lecture can be used in your projects.

  • Directly disclosing the source code provided in the lecture or creating educational materials is not permitted.

Player Knowledge and Precautions

  • A basic understanding of JavaScript is essential for a smooth learning experience. While this isn't a JavaScript course, we'll cover JavaScript concepts that appear throughout, so you shouldn't have much difficulty.

  • This lecture was produced with AI voice, so it may feel a bit different from my previous lectures. Please check out the sample lecture before taking it. 😊

Recommended for
these people

Who is this course right for?

  • Anyone who wants to create their own 3D space

  • People who studied Three.js but find it difficult to apply it

Need to know before starting?

  • JavaScript Basics

Hello
This is

19,485

Learners

1,257

Reviews

1,175

Answers

5.0

Rating

11

Courses

서울에서 웹 개발자/디자이너로 일했고, 제주를 거쳐.. 현재는 말레이시아 페낭에서 열심히 개발도 하고, 교육 콘텐츠도 만들고, 1인 기업으로서 해볼 수 있는 여러가지 시도와 실험들을 해보고 있습니다.
비주얼 임팩트가 있는 인터랙티브 웹에 관심이 많고, 유튜브와 페이스북 "1분코딩"에서 웹 개발 관련 기술들을 공유하고 있어요.

Curriculum

All

43 lectures ∙ (3hr 47min)

Course Materials:

Lecture resources
Published: 
Last updated: 

Reviews

All

7 reviews

5.0

7 reviews

  • hjux님의 프로필 이미지
    hjux

    Reviews 20

    Average Rating 5.0

    5

    100% enrolled

    Tôi nghĩ sẽ tốt hơn nhiều nếu học với một số kiến ​​thức về Three.js. Tôi hài lòng vì tôi đã học được điều gì đó mới mẻ ngoài những điều tôi đã biết. Tôi cũng thực sự thích cách giải thích và các nguyên tắc thực hiện trở nên dễ hiểu hơn bằng hình ảnh và tài liệu trực quan! Tôi rất thích bài giảng chân thành và thân thiện! ☺

    • studiomeal
      Instructor

      Cảm ơn, Hyungjin- Tôi đã thử sử dụng các tài liệu trực quan như hoạt ảnh để làm cho khái niệm này dễ hiểu hơn và tôi rất vui vì bạn cảm thấy hài lòng về điều đó 😊 Hãy làm việc thật tốt!

  • orangewebcenter2238님의 프로필 이미지
    orangewebcenter2238

    Reviews 46

    Average Rating 4.7

    5

    100% enrolled

    Cảm ơn bạn vì lớp học tuyệt vời.

    • studiomeal
      Instructor

      Cảm ơn những lời tốt đẹp của bạn Thomas :)

  • dlsgh24681368님의 프로필 이미지
    dlsgh24681368

    Reviews 1

    Average Rating 5.0

    5

    58% enrolled

    Sau khi nghe bài giảng trước, tôi bắt đầu nghe bài giảng THREE.JS mới ngay khi nó được tải lên. Nó chỉ chứa nội dung cốt lõi để ứng dụng thực tế vào một dự án nên tôi nghĩ nó tốt cho những ai chỉ muốn biết. làm thế nào để thực hiện nó. Mặt khác, những người muốn biết chi tiết hoặc những người mới tìm hiểu có thể sẽ cảm thấy khó hiểu. Sau khi nghe bài giảng trước và bài giảng này, tôi nghĩ nó thậm chí còn tốt hơn vì tôi đã học được điều gì đó mới mẻ về cách phát triển nó!

    • studiomeal
      Instructor

      Cảm ơn bạn đã để lại đánh giá chi tiết, Inho :D Tôi muốn giảng bài này cho những người mới làm quen với Three.js, nhưng cũng cung cấp nội dung mới cho những người đã học bài giảng trước đó - cảm ơn bạn đã cho tôi biết rằng việc lắng nghe rất hữu ích! ^^

  • ohmymoon님의 프로필 이미지
    ohmymoon

    Reviews 5

    Average Rating 5.0

    5

    100% enrolled

    Tôi đã có thể học những nội dung khó một cách dễ dàng.

    • studiomeal
      Instructor

      Cảm ơn vì đánh giá đầu tiên và những lời tốt đẹp của bạn, Jeonghoon 😊 Tôi hy vọng bạn làm việc tốt!

  • jongchanlee2597님의 프로필 이미지
    jongchanlee2597

    Reviews 1

    Average Rating 5.0

    5

    30% enrolled

    $68.20

    studiomeal's other courses

    Check out other courses by the instructor!

    Similar courses

    Explore other courses in the same field!