دوره آموزشی یادگیری گرافیک سه بعدی در وب با Three.js

جزئیات دوره

گرافیک سه بعدی بخش اصلی تجسم داده ها، واقعیت مجازی، واقعیت افزوده و بازی هستند - همه زمینه هایی که به سرعت در حال رشد هستند! یاد بگیرید که از کتابخانه جاوا اسکریپت three.js برای ایجاد گرافیک های سه بعدی برای وب استفاده کنید. نحوه ایجاد اشیاء سه بعدی و سفارشی کردن خواص آنها، کار با انواع مختلف نورها، متحرک سازی صحنه خود، افزودن مواد و بافت ها و ساختن سیستم های ذرات را کشف کنید. نویسنده انگین ارسلان همچنین به دانش‌آموزان آموزش می‌دهد که چگونه صحنه را رندر کنند و افکت‌ها و سایه‌زن‌ها را پس از پردازش اضافه کنند. این دوره به شما درک فنی و مفهومی برای ایجاد تصاویر پیشرفته با three.js و به طور کلی کار با گرافیک سه بعدی را می دهد.

اهداف یادگیری
ساخت یک صحنه ساده
ایجاد اشیاء سه بعدی three.js
اضافه کردن نور و سایه
متحرک سازی با Tween.js
کار با متریال و بافت
ویرایش و وارد کردن هندسه ها
ایجاد یک سیستم ذرات
پس پردازش با افکت و سایه زن

سرفصل ها

مقدمه

خوش آمدید
آنچه باید بدانید
استفاده از فایل‌های تمرین

ساختن یک صحنه ساده

مقدمه ای بر three.js
محیط را تنظیم کنید
ملزومات صحنه
صحنه را پر کنید
یک هواپیمای زمینی ایجاد کنید

Three.js Scene Object

اشیاء Three.js
تابع requestAnimationFrame()
سایر ویژگی‌های Object3D
افزودن مه به صحنه

چراغ ها

نورپردازی در three.js
انواع نور
dat.GUI
کنترل مدار
سایه ها
اشیاء بیشتری به صحنه اضافه کنید
SpotLight
DirectionalLight
نور محیطی
RectAreaLight

انیمیشن

تابع تصادفی ()
Math.sin() و Math.cos()
نویز اضافه کنید
دوربین
دکل انیمیشن
دکل انیمیشن قسمت 2
Tween.js

مواد و بافت

MeshBasicMaterial
MeshLambertMaterial و MeshPhongMaterial
MeshStandardMaterial
نقشه‌های بافت
نقشه‌های ناهمواری
نقشه‌های محیطی

هندسه ها

هندسه‌های اولیه
دستکاری رئوس
هندسه‌های خارجی

ذرات

ایجاد سیستم ذرات
متحرک سازی سیستم ذرات
سیستم ذرات از هندسه
Stats.js

پس پردازش

پس پردازش
افکت کامپوزر
ساير سايدرها

نتیجه

مراحل بعدی