原文：Threads
摘要
作者用 Claude 付費版（模型應是 Opus 5）把 Notion 上的旅遊行程做成一個單一 HTML 檔的網站，貼文飄出去後分享了完整指令。
指令的核心是先把 Notion 網址給 AI，再用「風格、內容、動畫、技術限制」四段把需求寫清楚：風格指定到色碼、線框粗細、字型，內容列出網站該有的區塊，動畫連無障礙設定都顧到。
這是一個很好的範例，示範非工程師怎麼用具體的設計語言，讓 AI 一次產出有風格、可用的網頁。
重點
- 先給資料再給指令：先把 Notion 行程網址分享給 Claude，再貼指令，要求做成「單一 HTML 檔」的旅遊行程網站。
- 風格寫到色碼等級：日系繪本風、可愛簡約、只用淺色底；底色和紙白
#FFFCF6，3px 墨灰粗線框#3E3A39，大圓角，平塗不用漸層。 - 配色四色：珊瑚粉
#F2A497、山吹黃#F6D27A、水色#A8D3E6、若竹綠#B9DAA5。 - 字型與插圖：Google Fonts「Huninn」（粉圓體，支援繁體中文的圓體字型）；插圖要 AI 用 SVG 自己畫，題材配合目的地特色（地標、交通工具、風景），不用外部圖片。
- 內容區塊：頂端固定選單、首頁插圖＋標題＋出發倒數、航班卡片、每日行程（上方日期切換、下方時間軸，交通方式用彩色小標籤，重點行程標「必去」）、可打勾的待辦清單、住宿資訊。
- 動畫與無障礙：插圖輕輕動、切換日期有彈跳效果，但要支援「減少動態效果」設定（作業系統裡讓動畫減少的無障礙選項，網頁用
prefers-reduced-motion偵測）。 - 技術限制：手機優先、繁體中文介面、單一 HTML 檔，拿到就能直接開或丟上任何靜態空間。
- 貼文數據：約 6 萬次瀏覽、750 讚、529 次分享。
個人洞見
這段指令的寫法跟 impeccable 給 AI 設計規範 和 用 Design Skill 治 AI Slop 講的是同一件事：AI 做出來的網頁有沒有「罐頭味」，取決於你有沒有把風格講到色碼、線框、字型這種具體程度。
差別是它不靠 skill 或外掛，一段白話指令就做到，很適合直接套成自己的旅遊行程模板，下次出門前把 Notion 行程丟進去就有一個手機版網頁。