لطفا جهت اطلاع از آخرین دوره ها و اخبار سایت در
کانال تلگرام
عضو شوید.
آموزش مقدمه ای بر کدنویسی خلاق با p5.js
Introduction to Creative Coding with p5.js
نکته:
آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره:
ایجاد هنر با کد! آموزش اصول برنامه نویسی از طریق p5js (یک کتابخانه جاوا اسکریپت دوستانه مبتدی) درک اینکه کدنویسی خلاقانه چیست؟ شروع به توسعه و جاوا اسکریپت می کند. همه چیز را در حال حرکت در اینجا خواهید آموخت.
به کلاس کدنویسی خلاق ما خوش آمدید!.
در کارگاه آنلاین کدنویسی خلاق، ایجاد انیمیشن از طریق کد، هنر مولد و موارد دیگر را بررسی خواهید کرد!
دانش قبلی در مورد کد نویسی لازم نیست، این کلاس از اصول اولیه کدنویسی و برنامه نویسی شروع می شود.
یک راه عالی برای توسعه تفکر محاسباتی، منطق و ریاضی، همه در حین ساختن هنر!
این کارگاه شما را با جاوا اسکریپت - زبان وب آشنا می کند.
مفاهیم برنامه نویسی را با استفاده از p5.js بیاموزید - یک کتابخانه جاوا اسکریپت که بر روی آن تمرکز دارد.
در پایان کلاس، میتوانید هنر مولد خود را بسازید و با مفاهیمی مانند متغیرها، توابع و شرطیها راحت خواهید بود.
پروژه های ساخته شده در کلاس شامل
خواهند بود
* پرتره های مولد
* متحرک سازی نقاشی های ساده
* ایجاد یک برنامه ساده شبیه به MS Paint
عالی برای همه افراد بالای 10 سال
این دوره به طور کلی به 4 بخش تقسیم می شود -
1. شکل های ساده و انیمیشن - با اصول اولیه p5، توابع و متغیرها آشنا شوید
2. ساختن یک برنامه رنگ - یاد بگیرید که نسخه خود را در MS Paint بسازید و در عین حال درباره متغیرها و دستورات if اطلاعات بیشتری کسب کنید
3. الگوهای مولد - ما الگوهایی را با کد ایجاد می کنیم و در مورد حلقه ها اطلاعات خواهیم گرفت!
4. پرتره های مولد - با استفاده از کد، تصاویر و دوربین خود پرتره ایجاد کنید! ما چند الگوریتم دیگر را در این ماژول به همراه نحوه استفاده و دستکاری تصاویر با کد یاد خواهیم گرفت.
مواد مورد نیاز
برای مشاهده ویدیوها به رایانه، لپ تاپ یا تلفن دسترسی داشته باشید. لطفاً توجه داشته باشید که در حال حاضر برای iPad و iPhone در دسترس نیست
برای دسترسی به محیط کدنویسی به مرورگر google chrome دسترسی داشته باشید
سرفصل ها و درس ها
سلام! به کدنویسی خلاق خوش آمدید
Hello! Welcome to Creative Coding
کدنویسی خلاق چیست؟
What is creative coding?
ویرایشگر p5
p5 Editor
ماژول 1 - اشکال، رنگ ها و انیمیشن!
Module 1 - Shapes, Colours, and Animation!
مقدمه ای بر ماژول 1
Introduction to Module 1
مفهوم | راه اندازی، طراحی، بوم
CONCEPT | Setup, Draw, Canvas
پروژه | ایموجی هایی با اشکال ساده
PROJECT | Emojis with simple shapes
مفهوم | رنگ ها
CONCEPT | Colours
مفهوم | متغیرها
CONCEPT | Variables
مفهوم | متغیرهای داخلی
CONCEPT | Inbuilt variables
مراجع و اشکال اضافی
References and Additional Shapes
ماژول 2- متغیرها، انیمیشن ها و اپلیکیشن Paint!
Module 2- Variables, Animations and Paint App!
مقدمه ای بر ماژول 2
Introduction to Module 2
مفهوم | اگر بیانیه
CONCEPT | if statement
مفهوم | mouseDragged و mousePressed
CONCEPT | mouseDragged and mousePressed
مفهوم | pmouseX و pmouseY
CONCEPT | pmouseX and pmouseY
مفهوم | ساخت دکمه
CONCEPT | Making a Button
مفهوم | تابع تصادفی
CONCEPT | random Function
پروژه | یک اپلیکیشن Symmetry Painting بسازید
PROJECT | Make a Symmetry Painting App
شبکه ها، حلقه ها و انیمیشن ها!
Grids, Loops and Animations!
مقدمه ای بر ماژول 3
Introduction to Module 3
مفهوم | برای حلقه
CONCEPT | For Loop
مفهوم | Nested For Loop
CONCEPT | Nested For Loop
مفهوم | ترجمه و چرخش
CONCEPT | Translate and rotate
پروژه | 10 چاپ کنید
PROJECT | 10 Print
پروژه | برنامه نقاشی چرخشی
PROJECT | Rotation Painting App
مفهوم | ساخت شبکه با ترجمه
CONCEPT | Making a grid with translate
تصاویر و آثار هنری مولد!
Images and Generative Artwork!
مقدمه ای بر ماژول 4
Introduction to Module 4
مفهوم | استفاده از تصاویر - قسمت 1
CONCEPT | Using Images - Part 1
مفهوم | استفاده از تصاویر - قسمت 2
CONCEPT | Using Images - Part 2
مفهوم | خواندن از روی تصاویر
CONCEPT | Reading from Images
نمایش نظرات