آموزش یک الگوی متحرک با استفاده از GLSL ایجاد کنید

Create An Animated Pattern Using GLSL

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره:

این کلاس مقدمه‌ای بر برنامه‌نویسی سایه‌زن GLSL برای وب از طریق ایجاد یک الگوی متحرک پیچیده است.

در طول این کلاس با مفهوم اصلی برنامه نویسی شیدر فرگمنت و نحوه استفاده از آن در صفحه وب خود آشنا خواهید شد.

ما اصول طراحی را با استفاده از پیکسل هایی مانند شکل، رنگ، انیمیشن و تصادفی پوشش خواهیم داد.

این کلاس برای کسانی است که می خواهند یاد بگیرند که چگونه گرافیک های مولد ایجاد کنند و دانش متوسطی از برنامه نویسی گرافیکی از طریق استفاده از زبان یا فریم ورک های مبتنی بر CPU دارند. به عنوان پردازش، openFrameworks یا جاوا اسکریپت.

مواد/منابع

ویرایشگر متن: Atom. می توانید آن را در اینجا پیدا کنید:

بسته‌ها: شما باید دو بسته را برای atom دانلود و نصب کنید: glsl-language
می‌توانید اطلاعات بیشتری درباره نحوه نصب بسته‌ها پیدا کنید

الگوی HTML و مثال‌هایی برای هر درس: 

تکلیف شما ایجاد یک الگوی تولید متحرک برای وب با استفاده از GLSL خواهد بود.

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

ما با کاوش در اشکال، رنگ‌ها، حرکت و سپس الگو شروع می‌کنیم.

منابع: 

ویرایشگر متن: Atom. می توانید آن را در اینجا پیدا کنید:  

بسته‌ها: شما باید دو بسته را برای atom دانلود و نصب کنید:       glsl-languageمی‌توانید اطلاعات بیشتری درباره نحوه نصب بسته‌ها بیابید  

الگوی HTML و مثال‌هایی برای هر درس: 


سرفصل ها و درس ها

درس ها Lessons

  • کشف Fragment Shader Discovering Fragment Shader

  • اضافه کردن نویز تصادفی Add Random Noise

  • الگوی ضربدر شکل شما Pattern Multiplying Your Shape

  • ترجمه، چرخش و مقیاس بندی Translation, Rotation and Scaling

  • نتیجه Conclusion

  • عملکرد اصلی شکل دهی در GLSL Basic Shaping Function in GLSL

  • برنامه نویسی Fragment Shader با استفاده از Atom Programming Fragment Shader Using Atom

  • شیدر چیست و چگونه کار می کند؟ What is a Shader and How Does it Work?

  • آشفتگی تصادفی را اضافه کنید Add Random Chaos

  • فراتر از محدودیت های خود Going Beyond Your Limits

  • Shader را به صفحه وب خود اضافه کنید: قسمت 2 Add Shader to Your Webpage: Part 2

  • با استفاده از رنگ Using Color

  • Shader را به صفحه وب خود اضافه کنید: قسمت 1 Add Shader to Your Webpage: Part 1

  • ترسیم اشکال اصلی با توابع Drawing Basic Shapes with Functions

  • مقدمه Introduction

  • الگوی تغییر شکل شبکه Pattern Deforming the Grid

نمایش نظرات

آموزش یک الگوی متحرک با استفاده از GLSL ایجاد کنید
جزییات دوره
1h 47m
16
Skillshare (اسکیل شیر) Skillshare (اسکیل شیر)
(آخرین آپدیت)
214
4 از 5
ندارد
دارد
دارد
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Alexandre Rivaux Alexandre Rivaux

طراح مولد و رهبر خلاق

من یک طراح و فناوری هستم که علاقه زیادی به طراحی مولد و حرکتی دارم.
در حال حاضر به عنوان سرپرست خلاق و شریک موسس در ; یک استودیو مستقر در فرانسه که به تصور و تولید تجربه تعاملی با فناوری هنر اختصاص دارد.