加入主畫面可獲得全螢幕沉浸體驗；繼續用瀏覽器則會保留 Safari 工具列。
在 Safari 點「分享」圖示（方框向上箭頭）。
在選單中選擇「加入主畫面」。
點「加入」，關閉此分頁，從主畫面啟動星際工坊。
從主畫面啟動後就是全螢幕，不會顯示網址列或分頁列。
五個基礎概念，對應五件展品。改一個數字，整個世界就會回應。
任何 Three.js 場景都需要三個角色：Scene 是舞台，Camera 是眼睛，Renderer 負責把畫面畫到 canvas。缺一不可。
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(45, w / h, 0.1, 100);
const renderer = new THREE.WebGLRenderer({ antialias: true });Geometry 決定形狀的頂點，Material 決定表面看起來如何。把兩者交給 Mesh，就得到一個可放進場景的物件。
const mesh = new THREE.Mesh(
new THREE.IcosahedronGeometry(1, 0),
new THREE.MeshStandardMaterial({ color: 0x5ff3ff })
);每個 Object3D 都有 position、rotation、scale。它們都是三分量向量；旋轉的單位是弧度，縮放則是相對倍率。
mesh.position.set(2, 1.5, -1);
mesh.rotation.y = THREE.MathUtils.degToRad(70);
mesh.scale.set(1.5, 2, 1);StandardMaterial 需要光。環境光提供底光，方向光塑造明暗，點光源與聚光燈則能做出局部氣氛。多盞燈的顏色與強度會相加。
const key = new THREE.DirectionalLight(0xffe2bd, 2.4);
key.position.set(6, 9, 7);
scene.add(key);
redLight.intensity = 1.75;Clock.getElapsedTime() 回傳已經過的時間。把它乘上角速度，再放進 cos / sin，就能得到穩定、不受幀率影響的圓周運動。
const t = clock.getElapsedTime();
const a = t * 0.55;
probe.position.x = Math.cos(a) * 2.9;
probe.position.z = Math.sin(a) * 2.9;這是一個純前端作品：Three.js r170 以 ES Module 載入，沒有外部圖片或音效檔。星星、光暈、環境反射都用程式生成；音效則由 Web Audio API 即時合成。
即時程式碼面板會跟著你的操作更新。試著把某個數字改大，觀察畫面的變化——這正是學習 Three.js 最快的方式。
星際工坊以橫向操作設計。
請把裝置轉成橫向，繼續修復天文台。