Blog
-
Service Worker 寫好了，離線卻還是恐龍頁 —— 三個 PWA 的離線與安裝踩雷
幾個小專案要做成可安裝、能離線的 PWA。最離譜的坑：service worker 從頭到尾沒被啟動過，sw.js 裡卻已經來回調了三輪快取策略。這篇把這些坑、真因、和一行字的修法老實記下來。
-
給赤壁 3D 加上電影級音訊 —— 讓 AI 代聽海選 CC0 配樂、用同音字替身馴服破音字
我要 AI 幫一個 3D 戰場配電影級音樂。它接了。但它沒有喇叭——它聽不到自己選的任何一首曲子。
-
一段 prompt，讓 AI 做出一個 3D 互動的赤壁之戰
我給 Claude Code(Fable 5,effort medium)一段中文需求，它在一次對話裡交付了一個單一 HTML 檔的赤壁之戰 3D 戰場 —— 九幕時間軸、電影運鏡、火攻特效，還自己用瀏覽器逐幕檢查、抓修六個 bug。...
-
Mori Canvas:講話，AI 幫你把會議整理成白板
自架、零授權成本(全 MIT)的語音共筆白板 — 講話或貼逐字稿，AI 自動整理成便利貼+關係圖，多人即時協作。v0.1.0 已發行，Docker 一行或下載安裝檔就能跑。
-
ChingTech Case Hub:把我們做過的工具，整理成一個能打開來試的入口
擎添工業的案例展示資料庫 — AGV / RGV 動線模擬、產線與製程模擬器、HMI 手冊、IO 點位對照工具、CTOS Lite，全部收進一頁。每個案例都保留可操作的 GitHub Pages demo、repo 與應用場景，客戶能...
-
AI 應用實作營:8 個能跑的 starter，先手刻看懂底層，再換框架放大
把我做過、上線過的 AI 應用拆成 8 個公開 starter-template repo、4 個系列。每個模組都用 Part1 從零手刻誠實 baseline → Part2 換真工具/框架對照的教法，程式碼公開、手冊免費。Hub ...
-
Web Effects Collector:我把 90 個最驚艷的開源網頁特效彙整成一頁
純靜態單頁的網頁特效蒐集器 — 90 個特效分 12 類(流體、GLSL Shader、Three.js 3D、捲動敘事、粒子、生成藝術…)，每張卡片附 Demo、原始碼連結與整合說明，還內建一個點開即跑的 Playground。
-
行銷頁健檢器：貼個網址，30 秒看你的活動頁哪裡漏分
貼上活動頁網址，檢查分享卡(OG)、被 AI / 搜尋找到、轉換 CTA、圖片速度、基本體質、追蹤六大類，給分數 + 白話修法 —— 每一項還附一段可以直接複製給 AI 的修正 prompt。前端 GitHub Pages + Clo...
-
wip:一個指令，讓 AI agent 一秒看懂每個專案做到哪
跨 repo 的開發狀態板 — 一條指令掃完所有在飛的專案：current branch、last commit、dirty/unpushed、open PRs/issues，加上每個 repo progress.md 的尾巴。人看 ...
-
mori-meeting-recorder:一場會議，錄成兩份不同的記錄
雙軌會議錄音 — 系統軌(會議裡所有人，含客戶)+ 麥克風軌(我方私下討論)，停止後 whisper.cpp 雙軌轉錄，匯出一份給客戶的 public 記錄、一份含內部評估的 internal 記錄。Mori 的會議身體部件。