# IEH 程式隊 2026第一學季 Workshop005

## 🎓 程式課程規劃（7堂）

### 📅 上課日期
3/7、3/14、3/21、3/28、4/11、4/18、<span style="color:red; font-weight:bold;">4/25</span>

## 線上網頁程式編輯器
https://editor.p5js.org/

## 網頁程式學習資源
https://p5js.org/tutorials/

### Texture and Camera 視角切換


let xPos = 0, zPos = 0;
let cameraMode = 0; // 0 是跟隨，1 是全局
let imgRobot, imgGround;

function preload() {
  // 載入兩張圖片即可
  imgRobot = loadImage('https://images.pexels.com/photos/235731/pexels-photo-235731.jpeg?auto=compress&cs=tinysrgb&w=200');
  imgGround = loadImage('https://images.pexels.com/photos/413195/pexels-photo-413195.jpeg?auto=compress&cs=tinysrgb&w=500');
}

function setup() {
  createCanvas(windowWidth, windowHeight, WEBGL);
  debugMode();
  angleMode(DEGREES);
}

function draw() {
  background(30);

  // --- 1. 鏡頭切換 (最精簡版) ---
  if (cameraMode === 0) {
    camera(xPos, -300, zPos + 500, xPos, 0, zPos, 0, 1, 0);
  } else {
    orbitControl(); 
  }

  // 光源
  ambientLight(200);
  directionalLight(255, 255, 255, 1, 1, -1);

  // --- 2. 移動控制 ---
  if (keyIsDown(UP_ARROW))    zPos -= 5;
  if (keyIsDown(DOWN_ARROW))  zPos += 5;
  if (keyIsDown(LEFT_ARROW))  xPos -= 5;
  if (keyIsDown(RIGHT_ARROW)) xPos += 5;

  // --- 3. 繪製物體 ---
  
  // 地板
  push();
  translate(0, 40, 0);
  rotateX(90);
  texture(imgGround);
  plane(2000, 2000);
  pop();

  // 機器人
  push();
  translate(xPos, 0, zPos);
  texture(imgRobot);
  box(60, 100, 40);
  pop();
}

// --- 4. 按 C 切換 ---
function keyPressed() {
  if (key === 'c' || key === 'C') {
    cameraMode = (cameraMode + 1) % 2;
    
    // 如果切換到全局模式，把鏡頭拉遠一點才看得見全貌
    if (cameraMode === 1) {
      camera(1000, -1000, 1000, 0, 0, 0, 0, 1, 0);
    }
  }
}

## 專題

### 💻 專題規範
***必須使用到3D技術***

### 💡 發想資源

https://p5js.org/examples/
https://openprocessing.org/discover/#/3D

### 🏅 成果發表評分準則

| 評分項目 | 說明 | 滿分 |
|----------------|----------------------------------------------|------|
| 💡 創意表現 | 有自己的想法，作品有趣、有特色 | 20 分 |
| 🛠️ 技術內容 | 有實作功能，使用 JS 技能，運作順利 | 20 分 |
| 🗣️ 表達清楚 | 介紹有邏輯、口齒清楚、說明完整 | 20 分 |
| 🎨 視覺設計 | 畫面整齊、顏色字型清楚、有美感 | 20 分 |
| ❤️ 報告態度 | 有準備、自信上台、全程參與 | 20 分 |

> ✅ **總分：100 分，將頒發：**
> - 第一名 🥇
> - 第二名 🥈
> - 第三名 🥉
> - 創意特別獎 💡

### 報告回報文件夾

| 姓名 | 企劃文件 |
|---|---|
| 顏嘉宥 | [企劃文件](https://docs.google.com/document/d/1__DRJJMe_ZcdCIfD8D5RJR38qxQJXsTYcxGz1Ydzob8/edit?usp=drive_link) |
| 鄧安序 | [企劃文件](https://docs.google.com/document/d/1Hm_daB9_R75IWsRt5WXTGvEiN3HdQ9RtKf3MnoG7xuQ/edit?usp=drive_link) |
| 王睿森 | [企劃文件](https://docs.google.com/document/d/18lfKJ_ejMT1Tl5OFuOKmIFUbt1Xd-cZTFr1f1jC-lEw/edit?usp=drive_link) |
| 郭芫銘 | [企劃文件](https://docs.google.com/document/d/1vIH7RzAIExP_tAmX6XPXNP_1MPzo90S1Jl9Tl94cCEk/edit?usp=drive_link) |
| 張加樂 | [企劃文件](https://docs.google.com/document/d/1A_JL0JQs_SKtjAiNHFsLqicJJ-aEQKkO8T8LVKczo7o/edit?usp=drive_link) |
| 黃以勒 | [企劃文件](https://docs.google.com/document/d/1MZ6gBf_0r9NzRx676KKLbbCGAQN5URKWaEjdOlv1x5Y/edit?usp=drive_link) |