IMMERSIVE MEDIA CLASS

ELECTIVE CLASS

Interactive Immersive
Projection Mapping

จาก “ภาพบนจอ” สู่ “พื้นที่ที่ตอบสนองคนดู” — และเข้าใจในระบบการทำงาน

ตัวอย่าง immersive environment ที่เปลี่ยนทั้งพื้น ผนัง และบรรยากาศของห้องให้กลายเป็น “ประสบการณ์” ไม่ใช่แค่ภาพบนจอ

CLASS MAP

วันนี้เราจะเดินทางอย่างไร?

45 นาที

Lecture

ภาพรวม ระบบ อุปกรณ์ และตัวอย่าง

พัก15 นาที

45 นาที

Live Demo

TouchDesigner

พัก15 นาที

Workshop participants working on a laptop

45 นาที

Studio Workshop

ลองทำด้วยตัวเองดูหน่อย

15 นาที

Show & Talk

นำเสนอ แลกเปลี่ยน และสรุป

มีพักเบรก 2 ช่วง ช่วงละ 15 นาที คั่นระหว่างช่วงใหญ่ — เวลาที่เหลือเผื่อไว้สำหรับจัดกลุ่ม เซ็ตอุปกรณ์ และแก้ปัญหาหน้างาน

WARM-UP / DISCUSSION

Immersive ≠ แค่ภาพใหญ่

คำว่า Immersive ไม่มีนิยามเดียว แต่สามารถมองได้หลายมิติ — ลองคลิกแต่ละการ์ดเพื่อเปิดคำถามชวนคุย

👀

Sensory

สื่อกระตุ้นประสาทสัมผัสหลายด้าน เช่น ภาพ เสียง แสง การสั่น หรือกลิ่น จนความสนใจถูกดึงเข้าไปในงาน

ชวนคุย: ต้องใช้หลายประสาทสัมผัสเสมอไหม หรือภาพอย่างเดียวก็ immersive ได้?

🧭

Spatial

พื้นที่รอบตัวกลายเป็นส่วนหนึ่งของสื่อ ผู้ชมไม่ได้มองเพียงกรอบจอ แต่รับรู้ภาพผ่านสเกล ระยะ และตำแหน่ง

ชวนคุย: จอใหญ่เต็มผนัง กับภาพที่เปลี่ยนรูปทรงห้อง ต่างกันตรงไหน?

🫳

Interactive

ระบบรับรู้การกระทำของผู้ชมและตอบกลับ ทำให้คนดูรู้สึกว่าตนเองมีผลต่อสิ่งที่เกิดขึ้น

ชวนคุย: ถ้างานไม่ตอบสนองคนดูเลย ยังเรียกว่า immersive ได้หรือไม่?

🧠

Psychological Presence

ผู้ชมรู้สึกว่า “อยู่ในเหตุการณ์” จนลืมพื้นที่จริงชั่วขณะ แม้งานอาจไม่ได้ล้อมรอบทั้งหมด

ชวนคุย: หนังที่ทำให้เราลืมเวลา นับเป็น immersive ในเชิงจิตวิทยาไหม?

✨

Narrative & Emotion

เรื่องเล่า บรรยากาศ และอารมณ์ทำให้ผู้ชมเชื่อมโยงกับโลกของงาน ไม่ใช่เพียงเห็นเทคโนโลยีที่น่าตื่นตา

ชวนคุย: งานเทคนิคอลมาก แต่ไม่รู้สึกอะไร ยัง immersive อยู่หรือเปล่า?

คำถามเปิดคลาส

ในมุมมองของคุณ “Immersive” คืออะไร? เลือกมา 1–2 มิติที่สำคัญที่สุด และยกตัวอย่างงานหรือประสบการณ์ที่เคยเจอ

สรุปสำหรับผู้สอน: Immersive ไม่จำเป็นต้องมีครบทุกมิติ งานแต่ละประเภทให้น้ำหนักต่างกัน จุดสำคัญคือผู้ชมรู้สึกว่า “สื่อไม่ได้อยู่แค่ตรงหน้า แต่กำลังเกิดขึ้นรอบตัวหรือกับตัวเขา”

REFERENCE 01

โลกของงานศิลป์ที่ “ไม่มีขอบเขต”

ตัวอย่างพื้นที่ immersive ที่ภาพวิ่งต่อเนื่องบนผนังและพื้น ทำให้ผู้ชม “เข้าไปอยู่ในภาพ” จริง ๆ

สิ่งที่ควรสังเกต

ภาพไม่ได้อยู่เฉพาะกรอบสี่เหลี่ยม

ผู้ชมกลายเป็นส่วนหนึ่งขององค์ประกอบ

แสง สี เสียง และสเกล สร้าง “อารมณ์” ของพื้นที่

งานแบบนี้มักใช้หลายโปรเจคเตอร์หรือ media server คุมภาพรวม

ชวนคุยกับนักศึกษา

ถ้าเราเข้าไปอยู่ในห้องนี้ เราจะรู้สึกว่าเป็น นิทรรศการ, เวทีโชว์ หรือ โลกอีกใบ?

Space as canvasAudience as actorNarrative by environment

REFERENCE 02

Architecture becomes a screen

Building Projection Mapping

ใช้อาคารจริงเป็นทั้ง “ข้อจำกัด” และ “แรงบันดาลใจ” หน้าต่าง เสา ซุ้ม และผิวอาคารจะกลายเป็นภาษาของภาพโดยอัตโนมัติ

PerspectiveScaleStoryMask / Geometry

ให้สังเกตอะไร

ภาพต้องตรงกับรูปทรงอาคาร

คอนเทนต์มักใช้เส้นสถาปัตย์เป็นจังหวะ

ต้องคุมความสว่างและระยะฉายอย่างแม่น

Projection mapping บนอาคาร: งานประเภทนี้ช่วยให้นักศึกษาเข้าใจเรื่อง geometry, alignment และเรื่องเล่าที่อาศัยพื้นที่จริง

REFERENCE 03

Data can become atmosphere

เมื่อภาพตอบสนองกับคนดู “ข้อมูล” จากการเคลื่อนไหวก็กลายเป็นประสบการณ์ของพื้นที่ได้ทันที

ไม่จำเป็นต้องเป็นวิดีโอเล่นวน

ข้อมูล เสียง การเคลื่อนไหว หรือค่าจากเซนเซอร์ สามารถสร้างภาพใหม่แบบเรียลไทม์ ทำให้ผู้ชมแต่ละรอบเจอประสบการณ์ไม่เหมือนกัน

Input

ตำแหน่งคนเดิน, เสียง, มือ, ระยะ

Output

คลื่นน้ำ, สี, particles, ความเร็ว, ทิศทาง

ประเด็นสำคัญ

จากมุมมองนิเทศฯ งาน immersive ที่ดีไม่ได้เก่งแค่ “ภาพสวย” แต่เก่งที่ “แปลข้อมูลให้เป็นอารมณ์”

REFERENCE 04

Immersive ใช้ได้มากกว่างานศิลปะ

🏛️

Museum

เล่าเรื่องประวัติศาสตร์หรือธรรมชาติให้เข้าใจง่ายขึ้น

🎤

Event

เปิดตัวสินค้า, stage opener, live show, opening ceremony

🛍️

Retail

ทำแบรนด์ให้จดจำและน่าแชร์บนโซเชียล

🎓

Learning

ใช้เพื่อทดลอง สาธิต หรือจำลองสถานการณ์

ในคลาสเรียน เราใช้สิ่งเดียวกันนี้เพื่อสอนเรื่องระบบ, interaction และ storytelling ได้

IMMERSIVE CASE STUDY 01

Prismverse — เมื่อ “กระจก” ทำให้พื้นที่ไร้ขอบเขต

XEX / honhim × Dr.Jart+

งาน installation แบบ audio-visual ที่ใช้ผนังกระจกทรงเรขาคณิตเรียงซ้ำแบบ tessellation ทำให้ภาพ แสง และเงาสะท้อนแตกตัวไปทั่วห้อง ผู้ชมจึงรู้สึกราวกับเดินอยู่ภายในอัญมณีที่เคลื่อนไหวได้

Spatialรูปทรงจริงของผนังเป็นส่วนหนึ่งของภาพ ไม่ใช่แค่พื้นรับภาพ

Visual Multiplicationกระจกช่วยขยายภาพและสร้างพื้นที่เสมือนที่ดูใหญ่กว่าความจริง

Audio + Visualเสียงและภาพกำหนดจังหวะการรับรู้ร่วมกัน

Brand Experienceเปลี่ยนการสื่อสารแบรนด์ให้เป็นประสบการณ์ที่เดินเข้าไปสัมผัสได้

ชวนคุย: งานนี้ยัง immersive อยู่ไหม หากปิดเสียง หรือเปลี่ยนกระจกเป็นผนังทึบ?

Source summary: Design Milk — Prismverse: An Installation of Geometrical Tessellated Mirror Walls

กระจกแบบ tessellated ทำให้ภาพดิจิทัลแตกตัวและสะท้อนไปทั่วทุกทิศทาง

IMMERSIVE CASE STUDY 02

Art Aquarium Museum GINZA
สิ่งมีชีวิตจริงในโลกศิลปะ

Goldfish × Art × Japanese Culture

พื้นที่จัดแสดงนำปลาทองจริงมาเล่าเรื่องใหม่ผ่านตู้ปลารูปทรงต่าง ๆ แสง ดนตรี กลิ่น และการจัดวางที่ได้รับอิทธิพลจากวัฒนธรรมญี่ปุ่น ทำให้ผู้ชมไม่ได้เพียง “ดูปลา” แต่เดินผ่านโลกที่มีบรรยากาศเฉพาะตัว

Five Sensesภาพ เสียง กลิ่น แสง และการเคลื่อนที่ของปลา ช่วยสร้างการดื่มด่ำพร้อมกัน

Living Contentปลาทองเป็นคอนเทนต์ที่คาดเดาไม่ได้ ทำให้ทุกช่วงเวลาต่างกัน

Cultural Layerหยิบประเพณีชมปลาทองมาตีความใหม่เป็นศิลปะร่วมสมัย

Designed Journeyแต่ละโซนใช้รูปทรงตู้ปลาและแสงต่างกัน เพื่อกำกับจังหวะการเดินชม

ชวนคุย: งาน immersive จำเป็นต้องใช้จอภาพหรือ projection เสมอไปหรือไม่?

Source summary: Kiji — Art Aquarium Museum GINZA

IMMERSIVE CASE STUDY 03

teamLab SuperNature Macao
ร่างกายเข้าไปเป็นส่วนหนึ่งของงาน

Body Immersive Art Space

teamLab อธิบายพื้นที่นี้ว่าเป็นงานแบบ “body immersive” ซึ่งศิลปะไม่ได้เล่นเป็นวิดีโอที่บันทึกไว้ล่วงหน้า แต่ถูกสร้างขึ้นแบบเรียลไทม์ และเปลี่ยนไปจากการเคลื่อนไหวหรือการมีอยู่ของผู้ชม ทำให้เหตุการณ์เดิมไม่สามารถเกิดซ้ำในรูปแบบเดิมได้

Whole Bodyผู้ชมรับรู้ผ่านการเดิน ระยะ ความสูง พื้นผิว และการทรงตัว ไม่ใช่แค่สายตา

Real-timeภาพและสภาพแวดล้อมเกิดขึ้นใหม่อย่างต่อเนื่องจากโปรแกรมคอมพิวเตอร์

Material + Digitalภาพดิจิทัลทำงานร่วมกับหมอก น้ำ พื้น และวัตถุทางกายภาพ

Boundary Dissolveเส้นแบ่งระหว่างตัวเรา งานศิลปะ และพื้นที่รอบตัวพร่าเลือน

ชวนคุย: ถ้าผู้ชมยืนเฉย ๆ และงานไม่ตอบสนองทันที เรายังเรียกว่างาน interactive ได้หรือไม่?

Source summary: Official teamLab SuperNature Macao

IMMERSIVE CASE STUDY 04

Bubble Universe
จักรวาลของแสงสะท้อนและการรับรู้

Mirrors × Light Spheres × Infinite Reflection

พื้นที่ที่เต็มไปด้วยลูกแก้วเรืองแสงและผนังกระจก ทำให้ผู้ชมรู้สึกราวกับอยู่ในจักรวาลที่ไม่มีจุดสิ้นสุด งานประเภทนี้ใช้หลักง่าย ๆ คือ “วัตถุจริง + แสง + ภาพสะท้อน” แต่สร้างประสบการณ์เชิงพื้นที่ที่ทรงพลังมาก

Infinite Spaceกระจกและพื้นสะท้อนช่วยขยายห้องจริงให้ดูไร้ขอบเขต

Atmosphereผู้ชมถูกโอบล้อมด้วยแสงและจังหวะการเปลี่ยนสี มากกว่าการมองวัตถุชิ้นเดียว

Embodied Viewingเมื่อเดินเข้าไป ตำแหน่งของร่างกายทำให้มุมมองและความรู้สึกเปลี่ยนทันที

Simple but Powerfulไม่จำเป็นต้องมี interaction ซับซ้อนเสมอไป หากการรับรู้พื้นที่ถูกออกแบบมาดีพอ

ชวนคุย: ถ้างานนี้ไม่มีปฏิสัมพันธ์โดยตรง แต่ทำให้คน “จม” อยู่กับพื้นที่ เรายังเรียกมันว่า immersive ได้ไหม?

Case summary for classroom discussion

ลูกแก้วเรืองแสง + กระจกสะท้อน = พื้นที่ที่รู้สึกเหมือนไม่มีที่สิ้นสุด

IMMERSIVE CASE STUDY 05

teamLab SuperNature
ธรรมชาติจริงและดิจิทัลหลอมรวมกัน

Flowers × Real Space × Reflective Floor

โซนดอกไม้และพืชจริงที่ห้อยลงมาล้อมตัวผู้ชม แสดงให้เห็นว่าคำว่า immersive ไม่ได้อยู่ที่จอหรือโปรเจคเตอร์เท่านั้น แต่รวมถึงการจัดองค์ประกอบของ “ธรรมชาติจริง” ให้ผู้ชมรู้สึกเข้าไปอยู่ภายในงานโดยตรง

Real Natureใช้พืชและดอกไม้จริงเป็นวัสดุหลักของประสบการณ์

Mirror Floorพื้นสะท้อนทำให้มวลดอกไม้ดูขยายลงไปอีกชั้น เกิดความรู้สึกโอบล้อม

Spatial Emotionสี กลิ่น และความหนาแน่นของพื้นที่ สร้างอารมณ์ร่วมโดยไม่ต้องมีคำอธิบายมาก

Immersion Beyond Screensเป็นตัวอย่างที่ดีว่า immersive อาจเกิดจากการจัดพื้นที่ มากกว่าการฉายภาพเพียงอย่างเดียว

ชวนคุย: หากไม่มีภาพเคลื่อนไหวเลย แต่งานทำให้เรารู้สึก “เข้าไปอยู่ข้างใน” เราควรนิยาม immersive อย่างไร?

Case summary for classroom discussion

เมื่อพื้นที่จริงถูกจัดวางอย่างตั้งใจ ร่างกายของผู้ชมจะกลายเป็นส่วนหนึ่งขององค์ประกอบทันที

IMMERSIVE CASE STUDY 06

Flowers Bloom in an Infinite Universe
inside a Teacup

Interactive Table Experience

งานชิ้นนี้ย่อขนาดจักรวาลศิลปะให้อยู่บนโต๊ะชา ผู้ชมสัมผัสถ้วยหรือเคลื่อนย้ายภาชนะ แล้วภาพดอกไม้ ปลา หรือองค์ประกอบดิจิทัลจะเปลี่ยนไปตามการกระทำ กลายเป็น interaction ที่จับต้องได้และเข้าใจง่ายมาก

Object-based Interactionถ้วยชาและโต๊ะเป็น input ของงาน ไม่ใช่แค่ของตกแต่ง

Intimacyจาก immersive ห้องใหญ่ เปลี่ยนเป็น immersive ขนาดเล็กที่เกิดใกล้มือผู้ชม

Cause & Effectแตะ ยก หรือขยับวัตถุแล้วเห็นผลลัพธ์ทันที ทำให้ logic ของ interactive ชัดมาก

Experience Designเชื่อมอาหาร ภาชนะ แสง และภาพดิจิทัลเข้าด้วยกันเป็นเรื่องเดียว

ชวนคุย: งาน interactive ที่ดีต้องให้ผู้ชม “ควบคุมได้มาก” หรือแค่ “มีผลบางอย่าง” ก็พอ?

Case summary for classroom discussion

IMMERSIVE CASE STUDY 07

Botanic Garden
Resonating Microcosms

Outdoor Interactive Installation

เมื่อนำงาน immersive ออกจากห้องดำไปสู่สวนหรือพื้นที่กลางแจ้ง การออกแบบต้องคิดใหม่ทั้งเรื่องแสงธรรมชาติ ระยะมอง การเดินชม และความสัมพันธ์กับภูมิทัศน์เดิม งานนี้ใช้วัตถุเรืองแสงเหมือนสิ่งมีชีวิตเล็ก ๆ ที่ตอบสนองต่อผู้ชมและกันเองในพื้นที่

Site-specificงานพึ่งพาบริบทของสวนจริง ต้นไม้จริง และการเดินสำรวจแบบอิสระ

Ambient Interactionปฏิสัมพันธ์เกิดแบบค่อยเป็นค่อยไป เหมาะกับการเดินชมมากกว่าการกดปุ่ม

Night Experienceความมืดของพื้นที่ช่วยให้แสง สี และวัตถุเรืองแสงเด่นชัดขึ้น

Landscape as Interfaceเส้นทาง พื้นดิน และระยะห่างระหว่างวัตถุ กลายเป็นส่วนหนึ่งของงาน

ชวนคุย: งาน immersive ในพื้นที่กลางแจ้งต่างจากงานในห้องปิดอย่างไรบ้าง?

Case summary for classroom discussion

วัตถุเรืองแสงในสวนทำให้ผู้ชมเดินเข้าไป “อ่าน” พื้นที่ด้วยร่างกายและระยะห่าง

IMMERSIVE CASE STUDY 08

Sphere Las Vegas
จากอาคารสู่สื่อขนาดยักษ์

Exterior Media + Interior Immersive Venue

Sphere เป็นตัวอย่างสำคัญของ immersive ที่เกิดทั้งภายนอกและภายใน ด้านนอก อาคารทั้งลูกกลายเป็นสื่อที่มองเห็นได้ระดับเมือง ส่วนด้านในเป็นโรงละครจอโค้งมหึมาที่ห่อหุ้มสายตาผู้ชมเกือบทั้งหมด พร้อมระบบเสียงและเอฟเฟกต์ร่วม

Urban Scaleอาคารกลายเป็นสื่อสารสาธารณะขนาดมหาศาลที่คนมองเห็นได้ทั้งเมือง

Wraparound Screenภายในใช้จอทรงโดมขนาดใหญ่ ทำให้ภาพอยู่เหนือและรอบตัวผู้ชม

Architecture + Mediaโครงสร้างอาคารและระบบแสดงผลถูกออกแบบให้เป็นเรื่องเดียวกัน

Immersion at Scaleแสดงให้เห็นว่าความดื่มด่ำสามารถขยายไปถึงระดับสถาปัตยกรรมและเมืองได้

ชวนคุย: เมื่อสื่อมีขนาดใหญ่มากขึ้น “ความน่าทึ่ง” กับ “ความหมาย” ยังสมดุลกันอย่างไร?

Case summary for classroom discussion

IMMERSIVE CASE STUDY 09

Flying Theater
ภาพโอบล้อม + ที่นั่งเคลื่อนไหว

Motion Seats × Giant Screen × Ride System

Flying Theater รวมภาพขนาดใหญ่มากเข้ากับระบบที่นั่งเคลื่อนไหว เพื่อให้ผู้ชมรู้สึกเหมือนกำลังบินหรือเคลื่อนที่จริง เป็นตัวอย่างที่ชัดเจนของ immersive ที่ใช้ทั้งภาพ มุมมอง การเคลื่อนไหวของร่างกาย และวิศวกรรมเครื่องกลทำงานร่วมกัน

Screen as Horizonจอภาพครอบคลุมลานสายตา ทำให้ผู้ชมไม่เห็นขอบของสื่อชัดเจน

Motion Synchronizationการขยับของที่นั่งต้องตรงกับภาพ เพื่อให้สมองเชื่อว่ากำลังเคลื่อนที่

Engineering + Mediaงานนี้ไม่ได้มีแค่คอนเทนต์ภาพ แต่รวมถึงกลไก โครงสร้าง และความปลอดภัย

Multi-sensory Rideหลายระบบมักเพิ่มลม กลิ่น หรือแรงสั่น เพื่อให้ประสบการณ์สมจริงขึ้น

ชวนคุย: ถ้าไม่มีเก้าอี้เคลื่อนไหว งาน Flying Theater จะยังทรงพลังเท่าเดิมไหม?

Case summary for classroom discussion

HCI · UBIQUITOUS COMPUTING

Human Computer Interaction

ตอบทันทีช้าเกิน 0.1 วิ คนจะไม่รู้ว่าตัวเองเป็นคนทำ

เดาออกเองของที่ดีบอกวิธีใช้ด้วยรูปร่างของมันเอง ไม่ต้องมีคู่มือ

เงียบและหายไประบบที่ดีที่สุดคือระบบที่คนลืมว่ามันอยู่ตรงนั้น

งาน interactive projection mapping ที่เรากำลังจะทำ คือ ubiquitous computing รูปหนึ่ง — ผู้ชมไม่ได้ถือคอนโทรลเลอร์ แต่ใช้ร่างกายและตำแหน่งของตัวเองเป็นอินพุต โดยไม่ต้องเรียนวิธีใช้มาก่อน

THE SYSTEM

อธิบายให้เข้าใจง่ายๆรับรู้ → คิด → แสดงผล

INPUT

Mouse

Keyboard

Microphone

Webcam

PROCESSคอมพิวเตอร์ + ซอฟต์แวร์

OUTPUT

Monitor

Speaker

แก่นของ Interactive Media คือการออกแบบ “ความสัมพันธ์” ระหว่าง Input และ Output

COMPUTER

คอมพิวเตอร์คือครัวกลาง

CPU

ตรรกะ คำนวณระบบ และอ่านข้อมูลจากเซนเซอร์

GPU

สร้างและประมวลผลภาพแบบเรียลไทม์

I/O Port

HDMI, DisplayPort, USB, Network และ Audio

งาน Immersive ไม่ได้ต้องการเพียง “เครื่องแรงที่สุด” แต่ต้องเหมาะกับ Resolution, จำนวน Output และความซับซ้อนของภาพ

OUTPUT LANDSCAPE

ภาพจะออกไปอยู่ที่ไหน?

Display

คม สว่าง ติดตั้งง่าย เหมาะกับระยะใกล้และงานที่อยากได้ภาพนิ่งคมชัด

Projector

ยืดหยุ่นเรื่องขนาดและพื้นผิว เหมาะกับ projection mapping และพื้นที่ทดลอง

LED wall

สว่างมาก ต่อขนาดได้ เหมาะกับเวที งานอีเวนต์ และพื้นที่ที่มีแสงแวดล้อมสูง

เวลาเลือก Output ให้ดูทั้งความสว่าง ระยะมอง ขนาดพื้นที่ และความยืดหยุ่นในการติดตั้ง ไม่ใช่ดูแค่ภาพสวยอย่างเดียว

DISPLAY NAMES

ชื่อเทคโนโลยีจอ กำลังบอกอะไรเรา?

LCD / LED TV

ภาพเกิดจากชั้น Liquid Crystal ส่วนคำว่า “LED TV” มักหมายถึงไฟ Backlight ที่เป็น LED

OLED

แต่ละพิกเซลเปล่งแสงเอง สีดำลึก คอนทราสต์สูง และมุมมองกว้าง

LED, Mini LED and Micro RGB emitters compared

Micro LED

LED ขนาดจิ๋วระดับพิกเซล เปล่งแสงเองได้ ส่วน Mini LED ยังทำหน้าที่เป็น backlight

หลายคำในตลาดเรียกคล้ายกัน แต่จริง ๆ แล้วกำลังพูดถึง “คนละชั้นของเทคโนโลยี” บางคำบอกระบบสร้างภาพ บางคำบอกระบบส่องสว่าง

LED WALL

คำสำคัญ: Pixel Pitch

Pitch

Pixel Pitch คือระยะจากจุดกึ่งกลางของ LED เม็ดหนึ่ง ไปยังเม็ดถัดไป วัดเป็นมิลลิเมตร — P10 คือห่างกัน 10 มม.

Pitch เล็กลง → เม็ดถี่ขึ้น → ยืนใกล้ได้มากขึ้น → ราคาสูงขึ้น

0 ม.3 ม.6 ม.9 ม.12 ม.

P1010 มม.

90 มม.

จอ

10 ม.

เม็ดห่างกัน 10 มม. ยืนใกล้จะเห็นเป็นจุด ๆ ต้องถอยออกไปราว 10 เมตร ภาพจึงกลืนเป็นภาพเดียว

จอกลางแจ้ง เวทีคอนเสิร์ต ป้ายโฆษณาริมถนน

P55 มม.

90 มม.

จอ

5 ม.

ความหนาแน่นเพิ่มเป็น 4 เท่าของ P10 ในพื้นที่เท่ากัน ระยะยืนที่สบายตาลดเหลือราว 5 เมตร

งานอีเวนต์ในร่ม ฉากหลังเวที บูธขนาดกลาง

P1.31.3 มม.

90 มม.

จอ

1.3 ม.

เม็ดชิดจนแทบมองไม่เห็นช่องไฟ ยืนห่างเพียง 1.3 เมตรก็ยังเนียน แลกมาด้วยราคาที่สูงขึ้นมาก

ห้องประชุม สตูดิโอ ฉาก LED ที่กล้องถ่ายใกล้

กฎง่าย ๆ: ระยะมองที่สบายตาขั้นต่ำ ≈ ค่า pitch เป็นเมตร (P10 ≈ 10 ม.) — คำถามก่อนเลือก: คนดูใกล้สุดกี่เมตร · ในร่มหรือกลางแจ้ง · Resolution รวมเท่าไร · Processor รับสัญญาณรูปแบบใด

PROJECTOR BASICS

Projector 4 ค่าที่ควรรู้

Lumensความสว่าง

ตัวเลขลูเมนไม่ได้อ่านเดี่ยว ๆ ต้องอ่านคู่กับแสงในห้อง ห้องยิ่งสว่าง ภาพยิ่งจาง จึงต้องใช้ลูเมนสูงขึ้น

Resolutionจำนวนพิกเซลจริง

4K มีพิกเซลมากกว่า Full HD 4 เท่า — ระวังคำว่า “รองรับสัญญาณ 4K” เพราะเครื่องอาจรับได้แต่แสดงผลจริงต่ำกว่า

Throw Ratioระยะฉายต่อความกว้างภาพ

ภาพกว้างเท่ากัน แต่เลนส์ต่างกันทำให้ระยะติดตั้งต่างกันเกือบเท่าตัว วัดพื้นที่จริงก่อนเลือกเลนส์เสมอ

Lens Shiftเลื่อนภาพด้วยชุดเลนส์

Lens Shift ขยับภาพโดยไม่แตะรูปทรง ส่วน Keystone บิดภาพด้วยซอฟต์แวร์ ควรใช้เป็นทางเลือกสุดท้าย

อ่านสเปกให้ครบสี่ค่านี้พร้อมกัน แล้วค่อยเทียบกับ พื้นที่จริง · แสงในห้อง · ระยะคนดู — สเปกสวยแต่ติดตั้งไม่ได้ ก็ใช้งานไม่ได้

RESOLUTION

Resolution ต้องคิดเป็น “พื้นที่ภาพรวม”

ผนังจริง12 × 2.5 ม.อัตราส่วน 4.8 : 1

→

ภาพต่อ 1 เครื่อง1920 × 1080ตั้งสูงเต็ม 2.5 ม. → กว้าง 4.44 ม.

→

ความละเอียดต่อเมตร1920 ÷ 4.44= 432 พิกเซล/เมตร

→

แคนวาสรวม12 × 432 / 2.5 × 432= 5184 × 1080 px

→

ขนาด 1 พิกเซลบนผนัง4440 มม. ÷ 1920= 2.31 มม./พิกเซล

5184 × 1080100%

ตรงกับพื้นที่ฉายจริง ใช้เมื่อเครื่อง render ไหว

3840 × 80074%

ย่อลงให้ render ง่ายขึ้น อัตราส่วนยังเป็น 4.8 : 1

1920 × 40037%

สำหรับ preview หรือเทสต์ระบบให้เร็ว

ทุกความละเอียดต้องคง 4.8 : 1 ไว้เสมอ ไม่งั้นภาพจะยืดหรือโดนครอปเมื่อขึ้นผนังจริง — โปรเจคเตอร์รุ่นนี้พาเนลจริงคือ 1920 × 1200 แต่ผนังเตี้ยกว่า จึงใช้จริงแค่ 1080 แถว และเม็ดพิกเซลบนผนังกว้าง 2.31 มม. ซึ่งยืนห่างเกิน 4 เมตรก็แทบมองไม่เห็นเม็ดแล้ว

RESOLUTION + THROW DISTANCE

คำนวณ Resolution และระยะติดตั้ง

ผนังกว้าง (ม.) ผนังสูง (ม.) จำนวนโปรเจคเตอร์ ความละเอียดต่อเครื่อง

ตัวเลขทั้งสองฝั่งต้องสอดคล้องกัน — ได้ Resolution แล้วยังต้องมีระยะติดตั้งพอ ไม่งั้นต้องเปลี่ยนเลนส์หรือเพิ่มจำนวนเครื่อง

GEOMETRY

แก้ภาพให้พอดี: อะไรควรใช้ก่อน?

วางเครื่องให้ถูก

แก้ที่ต้นทางก่อนเสมอ ตำแหน่ง ระดับ และความสูงของเลนส์ ไม่มีอะไรมาชดเชยการวางที่ผิดได้ดีเท่าการวางให้ถูก

Lens Shift

ขยับภาพด้วยชุดเลนส์ ภาพทั้งแผ่นเลื่อนไปพร้อมกัน ไม่มีการคำนวณพิกเซลใหม่ จึงไม่เสียความคมชัด

Warp / Keystone

ทางเลือกสุดท้าย เพราะเป็นการบิดภาพด้วยซอฟต์แวร์ ฝั่งที่ถูกบีบจะสูญเสียรายละเอียดอย่างเห็นได้ชัด

ไล่จาก 1 → 2 → 3 เสมอ ทุกขั้นที่ข้ามไป จะไปโผล่เป็นภาระของขั้นถัดไป และขั้นที่ 3 คือขั้นเดียวที่แลกด้วยคุณภาพของภาพ

LIVE MINI DEMO

ลองลากมุมให้ภาพ “เกาะ” พื้นผิว

ผนัง 3 ด้านคือ 3 พื้นผิวที่ต้องแมปแยกกัน — ลากมุม เพื่อดัดภาพให้เกาะผนัง หรือ กดกลางกรอบแล้วลากขึ้น-ลง เพื่อเลื่อนทั้งภาพ นี่คือหลักการของ Corner Pin / Quad Warping — เริ่มต้นภาพจะล้นออกนอกผนังเหมือนโปรเจคเตอร์จริงที่ยังไม่ได้ปรับ

LIGHTING OUTPUT

DMX: ภาษากลางของไฟเวที

ค่าสีปัจจุบัน#FF5AC8

DMX255 / 90 / 200

Red255

Green90

Blue200

Dimmer85%

Preset สี

Effect / Scene

ทุกปุ่มบนหน้านี้คือการส่ง ตัวเลข 0–255 ออกไปตาม channel เท่านั้น — ไฟ PAR และ LED Strip รับเลขชุดเดียวกันจึงเปลี่ยนสีพร้อมกัน นี่คือทั้งหมดที่ DMX ทำ

INPUT

เซนเซอร์ในชีวิตประจำวันมีอะไรบ้าง?

Accelerometerมือถือรู้ว่าหมุนไปทางไหนได้อย่างไร?

ค่าที่อ่านได้ตอนนี้

X—

Roll—

Y—

Pitch—

Z—

Yaw—

ภายในชิปมีมวลเล็ก ๆ ที่ขยับตามแรงโน้มถ่วง → ระยะห่างของแผ่นเปลี่ยน ทำให้ค่าความจุไฟฟ้าเปลี่ยน → วงจรอ่านออกมาเป็นตัวเลข 3 แกน → ระบบคำนวณว่าเครื่องเอียงกี่องศา แล้วสั่งหมุนจอหรือนับก้าว

Proximity / IRประตูเปิดเองได้อย่างไร?

ค่าที่อ่านได้ตอนนี้

ระยะที่วัดได้—

สถานะ—

ตัวส่งยิงแสงอินฟราเรดออกไป → เจอวัตถุแล้วสะท้อนกลับ ตัวรับวัดเวลาหรือความเข้มที่กลับมา → แปลงเป็นระยะเป็นเซนติเมตร → ถ้าต่ำกว่าค่าที่ตั้งไว้ ระบบสั่งมอเตอร์เปิดประตู

Light Sensorไฟถนนติดเองตอนค่ำได้อย่างไร?

ค่าที่อ่านได้ตอนนี้

แสงแวดล้อม—

หลอดไฟ—

แสงแดดตกกระทบโฟโตไดโอดในตัวเซนเซอร์ แล้วถูกเปลี่ยนเป็นกระแสไฟฟ้า → แดดแรงกระแสมาก → แปลงเป็นค่า lux → เมื่อค่าต่ำกว่าเกณฑ์ที่ตั้งไว้ ระบบสั่งจ่ายไฟให้หลอดติดเองโดยไม่ต้องมีคนกด

Microphoneภาพเต้นตามเสียงได้อย่างไร?

ค่าที่อ่านได้ตอนนี้

ความดัง—

ย่านที่เด่น—

คลื่นเสียงสั่นแผ่นไดอะแฟรม → การสั่นถูกแปลงเป็นแรงดันไฟฟ้าขึ้นลง → สุ่มค่าเป็นตัวเลขนับหมื่นครั้งต่อวินาที → แยกออกเป็นความดังและย่านความถี่ แล้วส่งไปขับพารามิเตอร์ของภาพ

ทุกเซนเซอร์ทำงานแบบเดียวกันหมด — รับปรากฏการณ์ทางกายภาพ → เปลี่ยนเป็นสัญญาณไฟฟ้า → แปลงเป็นตัวเลข หน้าที่ของนักออกแบบคือตัดสินใจว่าจะเอาตัวเลขนั้นไปทำอะไรต่อ

TOUCH EVOLUTION

จาก “กดให้ชั้นฟิล์มแตะกัน” สู่ “อ่านสนามไฟฟ้า”

ต้องออกแรงกด ชั้นฟิล์มบนจึงยุบลงไปแตะชั้นล่าง
จุดที่แตะกันทำให้เกิดวงจรแบ่งแรงดัน อ่านค่า X แล้วสลับไปอ่าน Y
ใช้ปากกาหรือถุงมือได้ แต่รับได้ทีละจุดเท่านั้น

ผิวจอเคลือบตัวนำบาง ๆ ที่มีประจุกระจายสม่ำเสมอทั้งแผ่น
นิ้วดึงประจุออกไปเล็กน้อย ทำให้มีกระแสไหลไปยังมุมทั้งสี่
อัตราส่วนกระแสของสี่มุมบอกตำแหน่ง แต่ได้จุดเดียว

ใต้กระจกมีอิเล็กโทรดวางเป็นตาราง แถวนอนกับแถวตั้ง
ตัวควบคุมไล่สแกนทีละแถว วัดค่าความจุที่ทุกจุดตัด
จุดที่ค่าเปลี่ยนคือตำแหน่งนิ้ว จึงอ่านหลายนิ้วพร้อมกันได้

ขอบจอฝัง LED อินฟราเรดยิงข้ามไปยังตัวรับฝั่งตรงข้าม
นิ้วบังลำแสงแนวนอนหนึ่งเส้นและแนวตั้งหนึ่งเส้น
จุดตัดของเส้นที่ถูกบังคือพิกัด — ไม่ต้องแตะผิวจอก็ได้

เจอที่ไหน — เครื่องรูดบัตร ตู้กดบัตรคิว เครื่องจักรในโรงงาน ที่ต้องใช้ถุงมือหรือปากกากด และไม่ต้องการความละเอียด

เจอที่ไหน — จอสัมผัสรุ่นเก่า ตู้ ATM บางรุ่น ที่ต้องการนิ้วเปล่าแตะเบา ๆ แต่ยังรับได้ทีละจุด

เจอที่ไหน — มือถือ แท็บเล็ต จอ interactive ทุกวันนี้ เพราะรับหลายนิ้วพร้อมกันและแตะเบามาก

เจอที่ไหน — จอใหญ่ในห้องเรียนและงานอีเวนต์ ทำเป็นจอยักษ์ได้ในราคาถูก และใช้อะไรแตะก็ได้ ไม่ต้องเป็นนิ้ว

จำลองสองนิ้ว

คลิกหรือลากบนจอทางขวาเพื่อวางนิ้ว

พิกัดที่ระบบอ่านได้—

วิธีที่ได้ค่านี้มา—

จำนวนจุดที่แยกได้—

COMPUTER VISION

กล้องไม่ได้ “เข้าใจภาพ” — จนกว่าเราจะสอนวิธีอ่าน

กล้องไม่ได้ “เห็น” อะไรเลย มันส่งมาเป็นตารางตัวเลขความสว่างและสีของทุกพิกเซล
อัลกอริทึมคือกติกาที่เราเขียนว่า ตัวเลขแบบไหนจึงนับเป็นสิ่งที่เราสนใจ

สิ่งที่อยู่หน้ากล้อง: คน

สิ่งที่อยู่หน้ากล้อง: มือ

หาโซนที่ "น่าจะเป็นคน" แล้วตอบกลับเป็นกรอบสี่เหลี่ยมหนึ่งกรอบ
ได้ตำแหน่ง ขนาด และค่าความมั่นใจ แต่ยังไม่รู้ว่าแขนขาอยู่ตรงไหน
เหมาะกับงานที่ถามแค่ว่า “มีคนอยู่ตรงไหน กี่คน”

โมเดลถูกฝึกให้ทายตำแหน่งข้อต่อหลักของร่างกายราว 15–33 จุด
เชื่อมข้อต่อเข้าด้วยกันเป็นโครง แล้วคำนวณมุมของแขนขาได้
ใช้เมื่อสนใจ “ท่าทาง” ไม่ใช่แค่ตำแหน่ง

ตรวจเฉพาะฝ่ามือ ตอบกลับเป็นกรอบเดียวพร้อมค่าความมั่นใจ
เร็วและเบา เหมาะกับการรู้ว่ามือเข้ามาในเฟรมหรือยัง
ยังบอกไม่ได้ว่ากำลังชี้นิ้วไหนหรือกำมืออยู่

ทายจุดสังเกตของมือ 21 จุด ตั้งแต่ข้อมือถึงปลายนิ้วทุกนิ้ว
ระยะระหว่างจุดบอกได้ว่ากำมือ ชี้ หรือหุบนิ้ว
ใช้ทำ gesture control ได้ละเอียดที่สุดในกลุ่มนี้

แปลงภาพเป็นขาว–ดำด้วยค่าตัดสิน (threshold) ทีละพิกเซล
พิกเซลสว่างที่ติดกันถูกจับรวมเป็นก้อนเดียว เรียกว่า blob
ได้พื้นที่กับจุดศูนย์กลาง — ไม่รู้ว่าเป็นคนหรือมือ รู้แค่ว่ามีของ

เลือกให้ตรงกับงาน — ยิ่งอัลกอริทึมละเอียด ยิ่งกินแรงเครื่องและยิ่งช้า งานจริงจึงเลือกวิธีที่หยาบที่สุดเท่าที่ยังตอบโจทย์ เช่น ถ้าถามแค่ “มีคนไหม” ก็ใช้ Blob ก็พอ ไม่ต้องถอดโครงกระดูกทั้งตัว

เลื่อนเมาส์บนภาพเพื่อขยับสิ่งที่อยู่หน้ากล้อง — ฝั่งขวาคือสิ่งที่อัลกอริทึมสรุปได้จากภาพฝั่งซ้าย

VISIBLE vs IR

ภาพธรรมดา กับ Infrared ต่างกันอย่างไร?

กล้องปกติอ่าน แสงที่สะท้อนจากวัตถุ — ห้องมืดเมื่อไร ภาพก็มืดตาม
คำว่า “กล้อง IR” มีสองแบบที่ทำงานคนละหลักการกันเลย

กล้องมีไฟ IR ในตัว ยิงแสงที่ตามองไม่เห็นออกไป แล้ววัดปริมาณที่สะท้อนกลับ
ความสว่าง ≈ การสะท้อนของวัสดุ ÷ ระยะยกกำลังสอง — คนใกล้จึงสว่างกว่าคนไกลชัดเจน
ผนังลึกเข้าไปในห้องก็มืดลงด้วยเหตุผลเดียวกัน ไม่ใช่เพราะสีผนังต่างกัน

ไม่ได้ยิงแสงอะไรออกไป แต่รับรังสีความร้อนที่ร่างกายแผ่ออกมาเอง
คนไกลยังสว่างเท่าคนใกล้ เพราะอุณหภูมิผิวเท่ากัน — ระยะแทบไม่มีผล
ผนังกับพื้นเย็นกว่าคน จึงกลายเป็นฉากหลังมืดโดยอัตโนมัติ

แสงในห้อง 70%

ภาพจริงจากกล้องเทอร์มอล — แกนลำตัวและใบหน้าร้อนที่สุด ไล่เย็นลงเรื่อย ๆ จนถึงปลายแขนขา

LIDAR / DEPTH

วัด “ระยะ” ด้วยเซนเซอร์

LiDAR2D Laser Scan

กวาดลำเลเซอร์ จับเวลาที่แสงสะท้อนกลับในแต่ละมุม แล้วเก็บเป็นจุดทีละจุดจนได้รูปร่าง
สแกนทุก 0.25° ที่ระยะ 5 ม. → จุดข้างกันห่างกัน 5 × (0.25 × π/180) = 2.18 ซม.

RadarRadio Echo

ส่งคลื่นวิทยุออกไปเป็นชุด แล้ววัดว่าคลื่นใช้เวลาไป-กลับนานเท่าไร ระยะ = ความเร็วคลื่น × เวลา ÷ 2

Stereo VisionTwo Cameras

ใช้กล้องสองตัวห่างกันคงที่ วัตถุจะปรากฏคนละตำแหน่งในสองภาพ ความต่างนั้นบอกระยะได้

กล่องใบเดียวกันขยับเข้า-ออกระหว่าง 3–7 เมตร ทั้งสามเซนเซอร์จึงวัดสิ่งเดียวกัน — ต่างกันที่ วิธีได้ตัวเลขมา และ รายละเอียดของรูปร่างที่ได้ติดมาด้วย

SENSOR QUIZ

รู้จัก “Sensor” รอบตัวเรากันหน่อย

Digital Door Lock

RFID Scanner

Digital Scale

Load Cell

Smoke Detector

CO₂ / Smoke Sensor

Automatic Door

PIR Sensor

Faucet

IR Sensor

Robot Cleaner

IR Depth Camera

Car IACC

LiDAR

Car Sensor

Ultrasonic Sensor

Camera

CMOS Sensor

Map / Navigation

GPS Receiver

ลองทายก่อนว่าอุปกรณ์แต่ละชิ้นใช้เซนเซอร์อะไรทำงาน — คลิกที่การ์ด เพื่อพลิกดูเฉลย

SOFTWARE STACK

เลือกซอฟต์แวร์ให้ตรง “หน้าที่”

สร้างภาพแบบเรียลไทม์Realtime Creation

TouchDesigner

Notch

Unreal Engine

Unity

สร้างภาพขึ้นสด ๆ จากโหนดหรือโค้ด และข้อมูลจากเซนเซอร์ — ภาพเปลี่ยนตามผู้ชมได้

แมพลงพื้นผิวจริงMapping / Output

MadMapper

Resolume Arena

HeavyM

ดัดภาพให้เกาะรูปทรงของสถานที่ ตัดขอบ ผสมรอยต่อ แล้วส่งออกหลายเครื่องพร้อมกัน

คุมโชว์หน้างานPlayback / Show Control

Resolume Arena

Smode

Watchout

เล่นสื่อเป็นเลเยอร์ ไทม์ไลน์ สั่งคิว คุมหลายจอหลายเครื่องพร้อมกันระหว่างการแสดง

สร้างภาพ→ส่งภาพข้ามโปรแกรม→แมพลงพื้นผิว→ออกจอ / โปรเจคเตอร์

งานจริงแทบไม่เคยใช้โปรแกรมเดียวจบ — เลือกให้ตรง หน้าที่ แล้วต่อกันเป็นสายงาน จะเร็วกว่าฝืนใช้ตัวเดียวทำทุกอย่าง

SOFTWARE FEATURES

เลือกซอฟต์แวร์จาก “ฟีเจอร์” ที่ต้องการใช้งาน

ฟีเจอร์ที่งานต้องใช้คลิกเลือกได้หลายข้อ

เข้าเกณฑ์

TouchDesigner

เข้าเกณฑ์

Resolume Arena

เข้าเกณฑ์

MadMapper

เข้าเกณฑ์

HeavyM

เข้าเกณฑ์

Smode

เข้าเกณฑ์

Watchout

–

จุดเด่นของโปรแกรม ทำได้– ไม่ใช่ทางของมันลองคลิกฟีเจอร์ทางซ้าย — คอลัมน์ที่ครบทุกข้อจะสว่างขึ้น

WORKING TOGETHER

จับหลายโปรแกรมมาทำงานร่วมกัน

โปรแกรมที่สร้างภาพเลือกหนึ่งตัว

ส่งภาพด้วยโปรโตคอลมาตรฐานภาพวิ่งในเครื่อง ไม่ต้องเซฟไฟล์

โปรโตคอลมาตรฐาน คือข้อตกลงเรื่องวิธีส่งภาพ — โปรแกรมไหนรองรับตัวเดียวกัน ก็ต่อกันได้ทันที ไม่ต้องเป็นค่ายเดียวกัน

โปรแกรมที่ปิดงานเลือกหนึ่งตัว

ไม่ต้องยึดติดโปรแกรมเดียว — จับคู่ฝั่งไหนกับฝั่งไหนก็ได้ ตราบใดที่ทั้งสองตัว พูดโปรโตคอลเดียวกัน แล้วดึงจุดเด่นของแต่ละตัวมาใช้ร่วมกัน

TOUCHDESIGNER

ต่อบล็อกก็ได้ภาพ — ไม่ต้องเขียนโค้ด

ไม่ต้องเขียนโค้ดสักบรรทัด

ลากกล่องมาวาง แล้วลากเส้นต่อกัน — ภาพออกทันทีทุกครั้งที่ต่อ ไม่ต้องกดรัน ไม่ต้องรอคอมไพล์

TOPภาพ / เท็กซ์เจอร์

CHOPค่าตัวเลข เสียง เซนเซอร์

SOPรูปทรง 3 มิติ

DATข้อความ ตาราง ข้อมูล

COMPกล่องรวมหลายโหนด

ฟรีรุ่น Non-Commercial ใช้ได้ไม่จำกัดเวลา

1280×1280ข้อจำกัดความละเอียดของรุ่นฟรี

Spout / Syphon / NDIส่งภาพต่อเข้าโปรแกรมแมพปิ้งได้เลย

Network — ต่อทีละกล่อง กล่องแต่ละใบโชว์ภาพของตัวเอง

ภาพตัวอย่างสด

สำหรับนักศึกษานิเทศฯ นี่คือข้อได้เปรียบที่สุด — คิดเป็นภาพและความสัมพันธ์ ได้เลย โดยไม่ต้องข้ามกำแพงไวยากรณ์ของภาษาโปรแกรมก่อน

INTERACTIVE PARTICLES

ขยับเมาส์ แล้วดูระบบตอบสนอง

แนวคิดเดียวกันนี้สามารถเปลี่ยน Input จากเมาส์เป็นกล้อง, LiDAR, OSC, MIDI หรือข้อมูลออนไลน์

MINI LIVE DEMO

ตำแหน่งเมาส์ = Input · Particle = Output

ถ้ายังไม่ได้เปิด TouchDesigner จริง ใช้สไลด์นี้แทนได้ — logic เดียวกันเป๊ะ: รับตำแหน่ง Input แล้ววาดภาพ Output แบบเรียลไทม์ ปล่อยมือไว้เฉย ๆ ระบบจะวิ่งเองเป็นวงรี

LIVE CAMERA · REAL TRACKING

กล้องจริง อัลกอริทึมจริง — ขยับตัวแล้วภาพตอบสนอง

อัลกอริทึม

เอฟเฟกต์

70%

particleขนาดbuild 18ส.ค. 21:10

กดเปิดกล้อง แล้วอนุญาตให้เบราว์เซอร์ใช้กล้อง

นี่คือระบบเดียวกับสไลด์ 39–40 ทุกอย่าง ต่างกันแค่ Input — เปลี่ยนจากเมาส์เป็นร่างกายจริงที่กล้องมองเห็น ส่วน Process กับ Output เหมือนเดิมทั้งหมด

SPEECH TO TEXT · PHYSICS

พูดใส่ไมค์ แล้วคำที่พูดกลายเป็นวัตถุจริง

กดเปิดไมโครโฟนแล้วอนุญาตให้เบราว์เซอร์ใช้ไมค์

Speech-to-Text คือเซนเซอร์อีกชนิดหนึ่ง — เสียง → ข้อความ → วัตถุที่มีมวลและแรงโน้มถ่วง เปลี่ยนต้นทางเป็นกล้อง เซนเซอร์ระยะ หรือข้อมูลออนไลน์ ก็ใช้โครงเดียวกันนี้ได้ทั้งหมด

DESIGN THINKING

เริ่มจาก “คน” ไม่ใช่ “เซนเซอร์”

เครื่องมือนิยามโจทย์ — เขียนโจทย์ให้จบในประโยคเดียว

เมื่อผู้ชมงานจะเพื่อให้รู้สึก

คลิกที่ช่องเพื่อเปลี่ยนทีละคำ — ได้ประโยคแล้วถามต่อว่า “ใช้เซนเซอร์อะไรถึงจะรู้?”

ใบงาน — กรอกให้ครบก่อนแตะซอฟต์แวร์ ประโยคด้านบนคือคำตอบข้อ 2 กับ 4 กับ 5

1 Audience2 Action3 Sensor4 Response5 Meaning

เช็กก่อนเปิดงานจริง

Spaceแสงแวดล้อมเงาคนและตำแหน่งเครื่องทางเดินและความปลอดภัย

SystemResolution / Refresh RateAuto-start / Recoveryอุณหภูมิและไฟฟ้า

Experienceคนรู้ไหมว่าต้องทำอะไร?ระบบตอบเร็วพอไหม?หลายคนเล่นพร้อมกันได้ไหม?

Design Thinking ไม่ใช่เส้นตรง — ทุกครั้งที่ทดสอบแล้วพัง ให้กลับไปแก้ประโยคก่อน อย่าเพิ่งแก้โค้ด

WRAP UP

KEY TAKEAWAYS — จำ 5 เรื่องนี้ แล้วเริ่มได้เลย

คำถามทิ้งท้ายจากวันนี้ คุณอยากทำให้ “พื้นที่ไหนมีชีวิต” ?

ถามเรื่องอุปกรณ์ ซอฟต์แวร์ วิธีเริ่มต้น หรือไอเดียโปรเจกต์ได้เลย — และอย่าลืมว่าเริ่มจากผนังบ้านตัวเองก็ได้

PART 2 — LIVE DEMO

TOUCH
DESIGNER

INTRODUCTION TO INTERACTIVE DESIGN

เป็น session ที่จะเริ่มต้นการใช้โปรแกรม TouchDesigner ให้นักศึกษาเห็นตั้งแต่หน้าจอเปล่า ๆ จนได้ภาพที่ตอบสนองได้จริง แล้วนำไปต่อยอดทำเองต่อได้

1 / 50F Fullscreen

Interactive ImmersiveProjection Mapping

วันนี้เราจะเดินทางอย่างไร?

Lecture

Live Demo

Studio Workshop

Show & Talk

Immersive ≠ แค่ภาพใหญ่

Sensory

Spatial

Interactive

Psychological Presence

Narrative & Emotion

คำถามเปิดคลาส

โลกของงานศิลป์ที่ “ไม่มีขอบเขต”

สิ่งที่ควรสังเกต

ชวนคุยกับนักศึกษา

Architecture becomes a screen

Building Projection Mapping

ให้สังเกตอะไร

Data can become atmosphere

ไม่จำเป็นต้องเป็นวิดีโอเล่นวน

Input

Output

ประเด็นสำคัญ

Immersive ใช้ได้มากกว่างานศิลปะ

Museum

Event

Retail

Learning

Prismverse — เมื่อ “กระจก” ทำให้พื้นที่ไร้ขอบเขต

Art Aquarium Museum GINZAสิ่งมีชีวิตจริงในโลกศิลปะ

teamLab SuperNature Macaoร่างกายเข้าไปเป็นส่วนหนึ่งของงาน

Bubble Universeจักรวาลของแสงสะท้อนและการรับรู้

teamLab SuperNatureธรรมชาติจริงและดิจิทัลหลอมรวมกัน

Flowers Bloom in an Infinite Universeinside a Teacup

Botanic GardenResonating Microcosms

Sphere Las Vegasจากอาคารสู่สื่อขนาดยักษ์

Flying Theaterภาพโอบล้อม + ที่นั่งเคลื่อนไหว

Human Computer Interaction

อธิบายให้เข้าใจง่ายๆรับรู้ → คิด → แสดงผล

คอมพิวเตอร์คือครัวกลาง

CPU

GPU

I/O Port

ภาพจะออกไปอยู่ที่ไหน?

Display

Projector

LED wall

ชื่อเทคโนโลยีจอ กำลังบอกอะไรเรา?

LCD / LED TV

OLED

Micro LED

คำสำคัญ: Pixel Pitch

Projector 4 ค่าที่ควรรู้

Resolution ต้องคิดเป็น “พื้นที่ภาพรวม”

คำนวณ Resolution และระยะติดตั้ง

แก้ภาพให้พอดี: อะไรควรใช้ก่อน?

วางเครื่องให้ถูก

Lens Shift

Warp / Keystone

ลองลากมุมให้ภาพ “เกาะ” พื้นผิว

DMX: ภาษากลางของไฟเวที

Preset สี

Effect / Scene

เซนเซอร์ในชีวิตประจำวันมีอะไรบ้าง?

ค่าที่อ่านได้ตอนนี้

ค่าที่อ่านได้ตอนนี้

ค่าที่อ่านได้ตอนนี้

ค่าที่อ่านได้ตอนนี้

จาก “กดให้ชั้นฟิล์มแตะกัน” สู่ “อ่านสนามไฟฟ้า”

กล้องไม่ได้ “เข้าใจภาพ” — จนกว่าเราจะสอนวิธีอ่าน

ภาพธรรมดา กับ Infrared ต่างกันอย่างไร?

วัด “ระยะ” ด้วยเซนเซอร์

รู้จัก “Sensor” รอบตัวเรากันหน่อย

เลือกซอฟต์แวร์ให้ตรง “หน้าที่”

เลือกซอฟต์แวร์จาก “ฟีเจอร์” ที่ต้องการใช้งาน

จับหลายโปรแกรมมาทำงานร่วมกัน

ต่อบล็อกก็ได้ภาพ — ไม่ต้องเขียนโค้ด

ขยับเมาส์ แล้วดูระบบตอบสนอง

ตำแหน่งเมาส์ = Input · Particle = Output

Interactive Immersive
Projection Mapping

Art Aquarium Museum GINZA
สิ่งมีชีวิตจริงในโลกศิลปะ

teamLab SuperNature Macao
ร่างกายเข้าไปเป็นส่วนหนึ่งของงาน

Bubble Universe
จักรวาลของแสงสะท้อนและการรับรู้

teamLab SuperNature
ธรรมชาติจริงและดิจิทัลหลอมรวมกัน

Flowers Bloom in an Infinite Universe
inside a Teacup

Botanic Garden
Resonating Microcosms

Sphere Las Vegas
จากอาคารสู่สื่อขนาดยักษ์

Flying Theater
ภาพโอบล้อม + ที่นั่งเคลื่อนไหว

TOUCH
DESIGNER