
Three.js 3D Interactive Quick Start
coding11
The curriculum is designed so you can use Three.js immediately in practice!
초급
Interactive Web, Three.js
실무에서 자주 사용하는 인터랙티브 개발 스킬
몇 줄로 끝내는 페럴랙스 스크롤 효과
mouse 위치값을 이용한 인터랙티브 효과
모션에 감성을 더하는 easing (가속도)
몇 줄의 코딩으로 인터랙티브 사이트를 개발해보자!
웹 인터랙티브 페이지 개발의 핵심 원리를 임팩트 있게 준비했습니다. 짧고 굵게!
한 번 익혀두면 평생 사용할 수 있습니다.
▲ 인터랙티브를 제작시 필요한 기본기를
초보자 눈높이에서 차근차근 알려드립니다.
(트랜스폼, 트랜지션, 이징(가속도) 처리 방법 등)
▲ 초보자도 이해하기 쉽게 단계적으로 설명
▲ 단 몇 줄의 코드로 구현하는 해외 사이트 클론
(사이트 링크)
▲ 센스있는 마우스 모션 효과 추가
▲ 실무에서 바로 사용할 수 있는 예제
▲ 스크롤 값을 이용한 초간단 페럴렉스 페이지
▲ 다중 레이어 제어를 통한 리얼 페럴랙스 효과
(직접 제작한 이미지를 제공합니다)
▲ translateZ 3D 페럴렉스 페이지
10년 이상 실무에서 반복 사용하고 있는 인터랙티브 스킬 몇 가지를 확실히 배우게 됩니다. 아마 평생 반복해서 사용하게 되실겁니다. (진심!)
완강하시면 평소에 봤던 멋진 사이트들이 어떤 방식으로 만들어지는지 눈에 보이실 겁니다.
학습 대상은
누구일까요?
멋진 포트폴리오 사이트를 만들고 싶은 분
디발자가 되고 싶은 디자이너
디자이너의 감성이 필요한 개발자
"이거 구현 가능해요?" 라는 질문에 스트레스 받아본 분
시간이 없으신 분 (짤고 굵게 구성)
선수 지식,
필요할까요?
html, css 기초
javascript 기초
3,313
명
수강생
225
개
수강평
213
개
답변
4.6
점
강의 평점
3
개
강의
15년 이상 여러 기업과 언론사에서 front-end 개발 및
데이터 시각화, 인터랙티브 사이트 제작을 했습니다.
https://brunch.co.kr/@yahao2512
저와 함께 깃털처럼 가벼운 코딩 함께 해보시죠!
전체
53개 ∙ (5시간 45분)
해당 강의에서 제공:
5. 인트로
06:29
7. 변수 (let, const)
07:38
9. 스타일 변경
03:41
10. 버튼 사용 방법
06:42
11. forEach문 활용
06:07
12. 간단한 계산
06:45
13. 함수와 백틱
04:40
14. input 사용
10:57
15. 과제 풀이
05:03
전체
139개
4.6
139개의 수강평
수강평 3
∙
평균 평점 4.7
4
This is an interaction I've been curious about for a while, and I've improved my understanding through repeated lessons. - It seems like the parts where the sound isn't consistent need to be supplemented ^^
Thank you for your first class review. The sound quality changed because I got a feel for the microphone settings during the filming. I will pay more attention next time~ - I renewed the lecture. Please watch it again~ Both the sound quality and the picture quality have improved.
수강평 18
∙
평균 평점 5.0
5
I am a professional publisher and I am a beginner in JS who is learning as much as I can because I feel the need for JS in reality :) The biggest reason I bought this course is... I saw the site that has a straw in the intro video and paid for it right away. I actually used that site as a reference when I was working on a project at work^^;; That is why I paid for it right away.ㅎㅎ For those of you who are considering buying the course, I will share my personal thoughts. (I have currently completed about 50% of the course, and I am also a beginner in JS.. I will share this from the perspective of a beginner.) 1. Really beginner type - Only heard of Vanilla JS - Only heard of the word addEventListener - Don't know how to get a specific element in JS, etc.. If you think you lack basic knowledge, I recommend that you first listen to other instructors' JS theory lectures and then take this course. 2. The type that still produces results - You can't write high-quality code on your own, but you can still produce results even if you use 100 if statements - You can at least understand the flow of code written by others If this applies to you, then you can listen. I personally think that this is a very efficient lecture. In the field, there are times when you need to quickly catch and apply specific technologies, and this lecture feels just like that. It covers all the key points in a short period of time. The problem is that since it only covers the key points, you may feel that the theory is lacking, but the theory... You don't have to worry because Google is here. I also listen while googling the parts that I'm confused about or want to know more about~ Lastly, I have a small request for the instructor! The VSCode font size on the screen seems small. ㅠㅠ If a new course is registered in the future, could you please increase the font size a little? :) And I think it would be good if there was a resize or mobile version lecture mentioned in the course review as a supplementary course for this lecture. In any case, I'll keep listening until the new lecture comes out. Thank you 👍👍
Wow, this is my first time writing such a long course review. Thank you so much ^^ I actually chose from the questions I received from acquaintances through messengers and made it into a lecture. It's also something that is often used in the field. The code in the class is short, but if you apply it, you can handle a variety of tasks~ I hope it will be helpful for your work. Hehe. Of course, I'm preparing the next lecture with content that can be used right away in the field. Have a great year~ (I want to do a three.js lecture like the straw site someday!)
수강평 2
∙
평균 평점 5.0
5
Teacher, I was very curious about this, thank you for teaching me. I also want to know in detail how to apply it to responsive and mobile web. It was so fun and not boring that I finished it quickly!! I will continue to watch it repeatedly and master it.
Thank you for the review! It's a method for applying to responsive and mobile web... It's roughly similar, but I think I should have made more samples using stageResize. I'll think about the AS method. Thank you.
수강평 1
∙
평균 평점 5.0
5
It's fun!
Thank you for your review! (It really helps me ㅜㅜ) I will do better...
2025 추석맞이 감사할인 중 (7일 남음)
₩26
22%
₩44,000
지식공유자님의 다른 강의를 만나보세요!
같은 분야의 다른 강의를 만나보세요!