Creative Coding สร้างงานศิลปะจากการเขียนโค้ดด้วย JavaScript
โดย KMITL × Collab by FutureSkill
Course Detail
ข้อมูลหลักสูตร
สิ่งที่คุณจะได้เรียนรู้
- ได้ความคิดสร้างสรรค์ (Creative Thinking) การออกแบบภาพนิ่งหรือภาพเคลื่อนไหวจากการเขียนโปรแกรม
- การใช้อัลกอริธึมจากการเขียนโปรแกรมออกแบบงานภาพ
- แนวคิดพื้นฐานเบื้องหลังกระบวนการที่ใช้ในงานศิลปะ Hard Skill
- การสร้างภาพนิ่งหรือภาพเคลื่อนไหวบนพื้นฐานการเขียนโปรแกรมภาษา JavaScript
- เทคนิคการออกแบบ ภาพนิ่งและภาพเคลื่อนไหวที่สามารถ interective ได้
- เทคนิคการเขียนโปรแกรมเชิงวัตถุและการเขียนโปรแกรมวัตถุ
- เทคนิคการสังเคราะห์ภาพนิ่งและภาพเคลื่อนไหวจากการเขียนโปรแกรม
รายละเอียดหลักสูตร
คอร์สเรียนนี้เหมาะกับใคร
• นักเรียน นักศึกษา คนทั่วไปที่สนใจ
• โปรแกรมเมอร์ที่สนใจนำไปประยุกต์กับงานของตัวเอง
• UX/UI Designer
• Web Developer
วัตถุประสงค์ของคอร์สเรียน
• เพื่อให้ผู้เรียนสามารถสร้างผลงานศิลปะผ่านการเขียนโค้ดได้
• เพื่อให้เรียนรู้การออกแบบงานศิลปะที่สามารถ interective ได้
• เพื่อให้เรียนรู้เรื่องของความคิดสร้างสรรค์ผ่านการเขียนโค้ดได้
• เพื่อเรียนรู้เทคนิคการสังเคราะห์ภาพนิ่งและภาพเคลื่อนไหวในการเขียนโปรแกรม
• เพื่อให้สามารถนำไปประยุกต์ต่อยอดเป็น เว็บไซต์ได้
พื้นฐานที่จำเป็น/สิ่งที่ต้องมี
• พื้นฐานภาษา JavaScript เบื้องต้น
จุดเด่นของคอร์สนี้
• การเขียนภาษา JavaScript เพื่อสร้างงานศิลปะหรือฟังก์ชั่นและฟีเจอร์ต่างๆ ที่เกี่ยวกับการออกแบบการนำงานศิลปะไปประยุกต์ใช้บนเว็บไซต์ได้
โปรแกรมที่ต้องใช้
• P5.js
สอนโดย
• ฐิติวุฒิ สมสา
• สุนทรี ไกรระเบียบ
โครงสร้างหลักสูตร
เนื้อหาทั้งหมด : 32 บทเรียน , เวลารวม 4 ชั่วโมง 14 นาที
Introduction to Course
- Introduction to Course
เอกสารประกอบการเรียน
- Slide Chapter 0 Creative Coding
- Slide Chapter 1 Welcome to Creative Coding
- Slide Chapter 2 Introduction to Creative Coding
- Slide Chapter 3 Dynamic Drawing : Animation
- Slide Chapter 4 External Input and Interactive Sketches
- Slide Chapter 5 Media: Load And Display Images,Shapes And Fonts
- Slide Chapter 6 Workshop
- Slide Chapter 7 Conclusion and What’s next
1. Welcome to Creative Coding
- Welcome to Creative Coding
2. Introduction to Creative Coding
- 1 Introduction to Creative Coding
- 2 ความรู้พื้นฐานในการวาด
- 3 เริ่มวาดครั้งแรกด้วย Code
- 4 Mini Workshop
3. Dynamic Drawing : Animation
- 1 Dynamic Drawing - Animation
- 2 การใช้งานฟังก์ชั่น random และ noise
- 3 Mini Workshop
4. External Input and Interactive Sketches
- 1 การใช้งานและกำหนดตัวแปรด้วย Mouse
- 2 การใช้งานและกำหนดตัวแปรด้วย Keyboard
- 3 Mini Workshop
5. Media: Load And Display Images,Shapes And Fonts
- 1 Setup P5.js for Media
- 2 Media- Load And Display
- 3 รู้จักกับ Pixel
6. Workshop
- 1 สร้าง Interactive Coding Art
- 2 Prepare and Setup Materials
- 3 Game Control
- 4 Meteorites
- 5 Ship and Final Output
7. Conclusion and What’s next
- Conclusion and What’s next
แบบทดสอบ
- แบบทดสอบ
ร่วมส่ง Class Project เพื่อรับ Certificate
- โจทย์ Class Project
- ส่งผลงาน
เกี่ยวกับผู้สอน
DATA PROCESSING LEAD
kizzaraiva@gmail.com
DATA PROCESSING LEAD at Dhammakaya foundation และ FOUNDER of Good Geek Club
EDUCATION
- 2022 : 42 Bangkok Institute Cadet batch 1
- 2007-2010 : Kasetsart University, Bachelor of Aerospace Engineer
Certificated
- AWS DevOps - Professional
- AWS Solution Architect
Collab Brands
KMITL Other Collab Brands
FAQs
Collab คือคอร์สที่สร้างร่วมกับแบรนด์ดังและตัวจริงในวงการ คัดเลือกและออกแบบมาเฉพาะ ไม่ใช่คอร์สทั่วไปใน catalog ปกติ
ได้ — ทุกคอร์ส Collab มี Collab Certificate ให้เมื่อเรียนจบและผ่านเกณฑ์ที่กำหนด
ราคารวมการเข้าถึงเนื้อหาแบบตลอดชีพ เทมเพลตและเครื่องมือประกอบ และใบรับรองเมื่อเรียนจบ
กดปุ่ม "ร่วมเป็นพาร์ทเนอร์" แล้วทีม BD & Partnership ของเราจะติดต่อกลับเพื่อออกแบบ offer ร่วมกัน