TechMoon 科技月球
WordPress、SEO 與 AI 工具實測指南
Pixel Plays 開源像素遊戲：不用任何圖片檔，畫面由程式算出
開源專案 Pixel Plays 用 3,557 行純 JavaScript 做出五個瀏覽器像素遊戲，零圖片檔、零外部套件，畫面由 360×280 畫布上的軟體繪圖核心逐點算出。「Claude 做的」宣稱目前只有作者貼文標題與兩筆未簽章提交裡的共同作者行，專案內找不到提示詞。本文回 GitHub 原始檔逐項核對，含授權例外與兩個社群 PR。
用 AI 摘要這篇文章：
10 月 31 日晚上，開發者 Amir Mushich 在 X 丟出一段遊戲影片和一個 GitHub 連結：五個打開瀏覽器就能玩的像素小遊戲，整包開源，貼文標題寫著「3D pixel games with Claude Opus 5.5 (OS)」。截至 11 月 13 日，這個倉庫累積 462 顆星、46 個 fork，貼文有 2,202 個讚、88 則回覆。把專案的全部 19 個檔案抓下來逐項核對後，最硬的幾個宣稱全部成立：圖片檔 0 張、外部套件 0 個、五個遊戲加共用引擎合計 3,557 行純 JavaScript，畫面是程式在 360×280 的小畫布上一個點一個點算出來的。
「用 Claude 做的」這半句得拆開看。專案檔案裡找不到 Claude 的蹤影：14 個文字檔裡「Claude」出現 0 次，也沒有任何提示詞。它只出現在兩筆提交說明的最後一行：Co-Authored-By: Claude Opus 5.5。兩筆提交都沒有簽章，GitHub API 的驗證欄位回 false。那行字是提交的人自己寫進去的，所以目前站得住的說法是：作者宣稱用 Claude Opus 5.5 做的，並在自己倉庫的提交裡掛了共同作者標記。獨立的第二來源不存在，反對的證據同樣不存在。
一個晚上成形，最後一筆提交比貼文早 22 分鐘
整個專案的公開歷史只有兩筆提交，時間都以台北時間計。20:09 那筆一次新增 19 個檔案、3,663 行，訊息寫「Add Pixel Plays: five isometric pixel mini-games」，五個遊戲、共用引擎、說明文件全在裡面；三分鐘後另一筆只改 README，把試玩網址連上；再過 22 分鐘，20:34，X 貼文發出。倉庫的建立時間與第一筆提交同一分鐘，也就是說公開可見的東西在 25 分鐘內全部就位，main 分支此後沒有再動過。11 月 1 日，兩個外人提交的 PR 出現，至今未合併，授權一節會談到。
這則貼文把來源交代得很乾淨。全文三行：標題「3D pixel games with Claude Opus 5.5 (OS)」、開源與試玩兩個連結、靈感出處「Inspo credits: @awwbhi2 / @zzzzshawn」。兩個帳號與 README 的署名一一對得上：概念出自 abhi，畫風視覺參考是 shawn 的 Small plays 系列，並註明沒有複製任何素材或主題。宣稱用 Claude 的只有標題那一行，內文沒有多說一句怎麼用。
這種一次成形的提交形態，對「AI 做的」兩邊解讀都使不上力：它與「模型一次生成全部」相容，也與「作者在本地做完才首次上傳」相容。提交時間戳記錄的是上傳，不是生成。
五個遊戲，各守一個動作
README 對這個系列的定位是「用等角像素立體模型呈現的小型瀏覽器遊戲」，對每個遊戲的要求是「一個看得懂的物理動作」。下面每個遊戲在玩什麼，取自遊戲內建的 Rules 視窗，不是第三方轉述：
| 遊戲 | 在玩什麼 | 操作 |
|---|---|---|
| Balote | 滾球對電腦：紅球要比藍球更靠近黃色小球，八球投完計分，先到 5 分贏 | 拉回後放開投出，拉越長投越遠；方向鍵加空白鍵 |
| Stari Most | 老橋跳水五次：身體越垂直入水分越高，每翻一圈加乘數，平拍入水 0 分，風會推旋轉 | 按住蹲下、放開起跳；空中按住縮身翻轉、放開伸展 |
| Rooftop Laundry | 暴風雨來前把曬衣繩上的衣服拖進籃子：大件分數高但拖得慢，陣風會吹走衣服，雨會淋濕還沒收的 | 拖曳；空白鍵把下一件送進籃子 |
| Tie-Break | 紅土搶七：球員自己跑，你只決定擊球時機；掃過的圈顯示落點，黃圈界內、黑圈界外，先到 7 分且領先 2 分 | 點一下或空白鍵；發球分拋球與擊球兩段 |
| Mini Ramp | 60 秒滑板坡道：像盪鞦韆，下坡按住、上坡放開來蓄速度，飛出坡道後按住抓板加分，乘數最高 x5，落地前要放開 | 按住與放開；空白鍵 |
試玩入口在 pixel-plays-ruby.vercel.app，首頁直接導向第一個遊戲，頂部中央有選單、右下角是靜音開關，背景音樂在第一次點擊後才載入。五個遊戲頁都打開核對過，HTTP 狀態 200，頁面位元組數與 GitHub 上的檔案完全相同：線上玩的就是倉庫那份程式，沒有另一份。每個遊戲的畫布還帶英文 aria-label 操作說明，螢幕閱讀器讀得到玩法。
計分規則藏著這個系列的手感設計。Balote 的投球順序由局勢決定：誰離目標球遠誰先投，八球結束後只比「比對手最好的球更近」的那幾顆；Stari Most 把入水姿態換算成分數與倍率，風會持續干擾旋轉，逼你在翻轉圈數與入水垂直度之間取捨；Tie-Break 的發球有兩次失誤的限制，來回球會越打越快；Mini Ramp 摔倒一次乘數歸零，抓板放太晚就摔。五個遊戲的輸入都收斂在「按住與放開」的節奏上，這正是 README 說的「一個看得懂的物理動作」：規則視窗三五行就講完，剩下的交給手感。
沒有圖片檔，畫面從哪裡來
先盤點 19 個檔案。6 個網頁（首頁加五個遊戲各一）、3 個腳本（共用的 engine.js、shell.js，與本機伺服器 serve.mjs）、5 個設定與文字檔（README、LICENSE、MUSIC.md、.gitignore、vercel.json）、5 個 mp3 音樂檔。圖片檔 0 張：沒有 .png、.jpg、.svg、.gif、.webp，程式裡也沒有 new Image、img 標籤或 data:image；整個專案唯一出現「.png」字樣的地方，是 serve.mjs 裡給本機伺服器用的 MIME 對照表。外部套件 0 個：沒有 package.json，僅有的四個 import 全是 Node 內建模組，遊戲頁載入的腳本只有相對路徑的 ../engine.js 與 ../shell.js，連字型檔都不載。
畫面是老派軟體繪圖做出來的，這種做法的名稱是 software rasteriser（軟體點陣繪圖）。engine.js 第 5 行寫死 const W = 360, H = 280：開一塊 360×280 的 ImageData，逐點計算顏色填入，再用一張 Float32Array 當深度緩衝，決定每個點看到的是地面、物體還是影子。算完貼上 canvas，CSS 用 image-rendering: pixelated 以最近鄰內插放大，每個點都是邊緣清楚的方塊，沒有糊邊。放大倍率也是算出來的：程式取視窗能容納的最大倍率，無條件捨去到裝置像素的整數倍，這就是 README 寫的 integer device-pixel scale。
「30 度鏡頭」同樣是常數：SIN = 0.5、COS = Math.sqrt(3) / 2，正好是 30° 的正弦與餘弦；投影是正交的，沒有近大遠小，鏡頭不轉也不縮。貼文標題裡的「3D」要這樣理解：畫面看起來像 3D，技術上是固定角度投影的 2D 畫布，加上深度緩衝做前後排序。配色刻意偏色：暗部往紫（COOL = [46, 38, 84]）、亮部往暖黃（WARM = [255, 232, 180]），中間的漸層用 4×4 的 Bayer 抖點表排出規律點陣；影子方向 SHADOW_X 預設 1.3，一律往畫面右邊倒。植物是場景裡唯一會動的東西：WIND_FPS = 8，程式註解寫「刻意逐格，擺動要像手調動畫而非模擬」，而且第 156 行偵測 prefers-reduced-motion，開啟減少動態的使用者會看到植物停住。README 那十條視覺規則，本質上就是把這些常數翻譯成英文散文。
兩個小出入值得記下，讀程式碼時以 engine.js 為準。README 一處寫「四階明暗」，程式裡的色階陣列是 5 個顏色；README 另一處寫每個遊戲「帶自己的軟體繪圖程式」，但 engine.js 檔頭自述是「每個遊戲共用的繪圖核心」，README 後文也說引擎由五個遊戲共用。兩處都不影響畫面結果，只是文件與程式的口徑沒對齊。
深度緩衝與抖點值得多用兩句白話，因為它們就是「零素材還有立體感」的全部秘密。深度緩衝是一張與畫布同大小的表格，每算一個點就記下那個點離鏡頭多遠；之後再有人要畫在同一個位置，先比距離，遠的自動讓位。物與物的前後、地面上的影子、物體壓出的輪廓，都靠這張表決定，不需要任何場景圖或建模檔。抖點（dither）則解決「色階很少還要有漸層」的老問題：兩個色階交界處，按 4×4 表格的固定花樣交錯落點，遠看就是中間色。這套手法在八十年代的個人電腦遊戲是常規操作，Pixel Plays 把它接回現代瀏覽器的 canvas，配上偏色色階與長影子，就成了辨識度極高的畫風。
想照著做的人，README 的十條視覺規則比任何形容詞都好用，每一條都對得上 engine.js 裡的常數。這種把風格寫成可逐條驗收規則的思路，跟網頁效果名稱換成行為義務的提示詞寫法是同一套：名稱只買到外觀，規則才買到行為。
| 視覺規則（README） | 程式對應 |
|---|---|
| 小場景浮在純白底上，四周沒有介面 | 頁面背景純白，選單與分數是畫布外的小字 |
| 360×280 低解析畫布，最近鄰整數倍放大 | W = 360, H = 280；image-rendering: pixelated；倍率無條件捨去到裝置像素整數倍 |
| 固定 30 度正交鏡頭，邊緣點狀溶進白底 | SIN = 0.5、COS = √3/2；正交投影不轉不縮 |
| 深度緩衝、色階、Bayer 抖點 | Float32Array 深度表；5 色色階；4×4 BAYER 表 |
| 又長又硬的影子往畫面右邊 | SHADOW_X 預設 1.3 |
| 暗處偏紫、亮處偏暖黃 | COOL = [46,38,84]、WARM = [255,232,180] |
| 前後物體有深度邊線，左上緣暖色輪廓光 | 深度差取邊、上緣混 WARM |
| 大平面用相近色階，色階差太大會變棋盤格 | 色階陣列間距刻意接近 |
| 人物平整色塊、不加抖點、花紋至少 3 像素寬 | 人物繪製路徑略過抖點表 |
| 只有植物會動，每秒 8 格整像素擺動，減少動態時停止 | WIND_FPS = 8；第 156 行偵測 prefers-reduced-motion |
「Claude 做的」：證據停在作者這一側
能確認的線索有四條，全部出自作者本人。貼文標題寫著 Claude Opus 5.5；兩筆提交說明最後一行都是 Co-Authored-By: Claude Opus 5.5 <[email protected]>；倉庫的具名貢獻者只有作者帳號，GitHub contributors API 只列出 amirmushichge 一人，repo 頁面原始碼裡 Claude 出現 0 次；README 對 Claude 隻字未提。正面與反面，目前都只有作者生產的材料。
共同作者行是這個宣稱裡最接近證據的東西，值得看清它的力道。Co-Authored-By 是提交說明裡的一行文字，GitHub 會據此在提交頁把掛名者列成共同作者，機制本身是真的。但這行字由提交者寫入，內容不被任何人審核；如果提交有 GPG 或 SSH 簽章，頁面會出現 Verified 標記，證明提交確實出自簽章鑰匙的主人，這兩筆都沒有簽章，API 的 verified 欄位是 false，reason 欄位寫 unsigned。共同作者行也不記錄對方寫了幾行、改了幾輪；有些 AI 工具提交時會自動加上這行，這裡是誰加的、Claude 實際參與多少，全部不可考。把「機制存在」錯當成「宣稱已驗證」，與把普通文字當成程式開關是同一門功課。
還缺一塊拼圖：提示詞。倉庫與貼文都沒有提示詞或對話紀錄，14 個文字檔裡 prompt 一詞出現 0 次。想重現「怎麼叫 Claude 做出這個」的讀者，目前最接近的東西是 README 那十條視覺規則。這也是這類宣稱的共同形狀：成品可以驗證，過程不可考。同型的案例可以對照 SILENCIO 得獎網站被說成 Claude Code 打造的查核：最後能定奪的都是證據鏈在哪裡斷掉，而非作品真偽。
MIT 直接拿，音樂要換掉
LICENSE 是標準 MIT，版權行寫 Copyright (c) 2026 Amir Mushich。README 的授權段一句話講完：「The code is under the MIT License. The music is not.」五個 mp3 是用 Suno 為這些遊戲生成的，MUSIC.md 寫明不在 MIT 範圍內、不授權在專案之外重複使用；好消息是缺了音樂檔遊戲照跑，只少背景音樂，fork 的人換上自己的曲子就乾淨了。這五個 mp3 合計 12,298,667 位元組，是專案裡僅有的大檔案，也是唯一不能直接重用的部分。
兩個開著的 PR 剛好補在缺口上。#1 來自 Steve Ruiz（GitHub 個人檔案自述 tldraw 執行長）：新遊戲 Fresh Paint，玩法是重新粉刷停車場褪色的標線，狀態標 WIP。#2 把背景音樂改成程式合成，動機寫得很直白：MUSIC.md 要求 fork 者換掉 Suno 的曲子，合成音樂屬於程式碼，自然落在 MIT 裡。兩筆都還沒合併，當作社群動向看就好。
想在本機跑，需要 Node.js，沒有套件要裝：node serve.mjs 之後打開 http://127.0.0.1:5300/ ，用任何靜態檔案伺服器也一樣，站本身就是一群靜態檔。加新遊戲的步驟 README 寫了四步：建資料夾放 index.html；載入 ../shell.js 並呼叫 PixelPlays.mount()；設定 window.PP_SCENE 後載入 ../engine.js；把遊戲加進 shell.js 的 GAMES 清單。頁面記得放一個 #mute 按鈕，背景音樂放在 <id>/<id>.mp3。
查不到的四件事，與回查的時機
Claude 的實際貢獻量、共同作者行由誰加上：不可考，專案與貼文都沒有記錄。「沒有複製任何素材或主題」：README 為概念出處（abhi）與視覺參考（shawn 的 Small plays）都署了名，並自述沒有抄襲，本站未比對原作，這句停在作者說法。熱度數字會動：文中引用的 2,202 讚、88 則回覆、462 顆星、46 個 fork 都是 2026 年 11 月 13 日的值。回查的觸發點有三個：任一 PR 合併、作者釋出提示詞或新遊戲、授權條款變動，出現任何一個，這篇的結論就該重查一次。
至於要不要玩：五個遊戲各花兩分鐘就摸得到底，打開 Balote 拉一顆球，再按頂部選單跳下一個。想看門道的，直接開 engine.js 找 const W = 360, H = 280 那一行，整個視覺風格都是從這 360×280 個點長出來的。
