🧑‍💻 Day 03: Zoom Facilitation Guide

🎯 Purpose

Support the VibeCoding + AI Video hybrid session when teaching fully online via Zoom. This guide ensures students can collaborate effectively even if they have no coding background.

---

🧩 1️⃣ Pre-Class Setup

💻 Tools

• Zoom with Breakout Rooms enabled.
• p5.js Web Editor → editor.p5js.org (no installs needed).
• Prepare 3–4 starter sketches with tweakable parameters (color, motion, density, etc.) and share the links in advance.
• Set up a shared Google Drive folder or Padlet for teams to upload screenshots or short loops.

🧠 Roles Overview

Send these before class:

Role	Description
🎛 Tuner	Edits numbers or color values in code.
🎨 Vibe Director	Describes aesthetic or emotional changes verbally.
🧠 Observer / Recorder	Takes notes, screenshots, or logs parameter changes.

---

🧱 2️⃣ Sorting Students into Teams

⚡ Quick Skill Survey (5 min)

Ask in chat or poll:

“Who feels comfortable changing small numbers or colors in code?”

• Raise hand → Tuners.
• Others → Vibe Directors or Observers.

🧭 Pairing

• Goal: 2–3 students per team → 1 Tuner + 1 Director (+1 Observer optional).
• Assign each team to a Breakout Room (labeled Team 1, Team 2…).

• Share a specific p5.js starter link per room. Example:

  Team 1 → https://editor.p5js.org/yourname/sketches/vibe-A
  Team 2 → https://editor.p5js.org/yourname/sketches/vibe-B
  

---

🧪 3️⃣ Inside Breakout Rooms (~35 min)

Team workflow:

1. Vibe Director: Suggests changes (e.g. “make it calmer,” “add chaos,” “fade slowly”).
2. Tuner: Adjusts small parameters (numbers, colors, speed) accordingly.
3. Observer: Records changes and screenshots best frames.

💡 Encourage them to rename variables to match mood:

let vibe = "calm waves";
let chaos = 0.3;
let colorShift = 0.02;

You (and any assistant) can rotate through rooms to provide help and inspiration.

---

📸 4️⃣ Collecting Results (10 min)

• Each team exports 1–2 frames via File → Save Image or screen capture.
• Upload to the shared Drive/Padlet folder.
• Optionally select 1 image per team to run through Replicate video models for short clips.

---

🪩 5️⃣ Main Room Showcase (15–20 min)

1. Return all to main room.
2. Share screen → cycle through team images or short clips.

3. Facilitate short feedback discussion:

   • “What visual element most affected the vibe?”
   • “Did it move the way you imagined?”
   • “Which aesthetic decisions surprised you?”

Optionally hold a quick poll:

• 💫 Most Hypnotic Vibe
• ⚡ Best Chaos Energy
• 🌿 Most Organic Flow

---

🧰 6️⃣ Facilitation Tips

• Encourage experimentation: no need to understand syntax.
• Emphasize iteration and description → prompting, not coding.
• If bandwidth issues occur, only the Tuner shares screen while others direct verbally.
• Keep extra starter links in the chat in case a sketch breaks.
• Record the showcase portion for reflection or documentation.

---

✅ Summary Workflow

Step	Action	Tool
Skill survey	Identify Tuners & Directors	Zoom poll/chat
Form teams	Assign Breakout Rooms	Zoom rooms
Create	Edit shared sketches	p5.js editor
Collect	Upload screenshots	Drive / Padlet
Showcase	Discuss results	Zoom main room

---

✨ Goal

Students experience the joy of live, collaborative “prompting through code”, even without coding skills, and see how descriptive language drives computational aesthetics.