Three.js یک کتابخانه قدرتمند جاوا اسکریپت است که فرآیند ایجاد گرافیک های سه بعدی در مرورگر را ساده می کند.

ما به تازگی یک دوره ویدیویی در کانال YouTube freeCodeCamp.org منتشر کردیم که با راهنمایی شما در ساخت پنج پروژه، نحوه استفاده از Three.js را به شما آموزش می دهد. این دوره آموزشی طراحی شده است تا شما را با دنیای گرافیک های سه بعدی وب با استفاده از Three.js آشنا کند، ابزاری ضروری برای ایجاد تجربیات بصری خیره کننده در وب. بابی رو این دوره را ایجاد کرد.

Three.js پیچیدگی‌های WebGL (کتابخانه گرافیک وب) را خلاصه می‌کند و ایجاد و نمایش گرافیک‌های کامپیوتری متحرک سه بعدی را در یک صفحه وب برای توسعه‌دهندگان آسان‌تر می‌کند. با Three.js می‌توانید همه چیز را از مدل‌های سه‌بعدی ساده تا تجربه‌های تعاملی پیچیده ایجاد کنید.

آنچه شما یاد خواهید گرفت

در این دوره آموزشی، Three.js را با ساختن پنج پروژه عملی یاد خواهید گرفت. هر پروژه برای آموزش جنبه های مختلف کتابخانه و نحوه استفاده از قابلیت های آن برای ایجاد گرافیک های سه بعدی خیره کننده طراحی شده است.

شروع شدن

نمای کلی: این پروژه شما را با اصول Three.js آشنا می کند. شما یاد خواهید گرفت که چگونه محیط توسعه خود را راه اندازی کنید و اولین صحنه سه بعدی خود را بسازید.

موضوعات تحت پوشش:

راه اندازی یک پروژه Three.js

ایجاد صحنه، دوربین و رندر

اضافه کردن اشکال و مواد اولیه

نور و سایه

زمین را با Three.js بسازید

بررسی اجمالی: شما یک مدل سه بعدی از زمین، با بافت و نور کامل می سازید.

موضوعات تحت پوشش:

بارگذاری و اعمال بافت ها

استفاده از نور برای افزایش واقع گرایی

ایجاد و متحرک کردن چرخش زمین

از طریق یک کرم چاله Wireframe پرواز کنید

بررسی اجمالی: این پروژه به شما یاد می دهد که چگونه یک افکت کرم چاله فریم سیمی مسحورکننده ایجاد کنید.

موضوعات تحت پوشش:

کار با هندسه وایرفریم

متحرک سازی حرکات دوربین

ساخت انیمیشن های پویا و تعاملی

یک افکت انتقال ایجاد کنید

نمای کلی: بیاموزید که چگونه جلوه های انتقال صاف بین صحنه ها یا حالت های مختلف را در پروژه سه بعدی خود ایجاد کنید.

موضوعات تحت پوشش:

بیشتر بخوانید

همانطور که شایعات معامله به گوش می رسد، Alphabet و HubSpot یک جفت عجیب خواهند بود




استفاده از سایه زن برای جلوه های سفارشی

ایجاد انتقال بدون درز

مدیریت چندین صحنه و اشیاء

با Rapier، Physics را به Three.js اضافه کنید

نمای کلی: در این پروژه نهایی، با استفاده از موتور فیزیک Rapier، فیزیک را در صحنه های سه بعدی خود ادغام خواهید کرد.

موضوعات تحت پوشش:

راه اندازی Rapier با Three.js

گفت ن خصوصیات فیزیکی به اشیا

شبیه سازی تعاملات و برخوردهای واقع بینانه

چرا Three.js را یاد بگیریم؟

Three.js دنیایی از امکانات را برای توسعه دهندگان وب باز می کند. با یادگیری Three.js، می‌توانید تجربه‌های تعاملی و جذابی ایجاد کنید که کاربران را مجذوب خود کند و راه‌های جدیدی برای تجسم داده‌ها و محتوا ارائه دهد. چه یک توسعه دهنده وب باشید که به دنبال گسترش مهارت های خود هستید یا یک سرگرمی علاقه مند به گرافیک سه بعدی، این دوره دانش و تجربه عملی مورد نیاز را در اختیار شما قرار می دهد.

دوره کامل را در کانال YouTube freeCodeCamp.org (تماشا 1.5 ساعته) تماشا کنید.

خبرکاو