59 Prototype.
Interactive product mockups — dashboards, apps, landing pages, internal tools. Anything you’d hand a stakeholder and click through.
場景
- 001
部落格文章 長篇文章/部落格——包含頁首、主圖佔位符、帶插圖和引言的正文、作者署名及相關文章推薦。適用於需求中包含'部落格'、'文章'、'貼文'、'隨筆'或'案例研究'等關鍵詞時。 - 002
臨床病例報告 為臨床查房、病例討論會和醫療文件生成結構化病例報告。支援生成SOAP格式或敘述性病例報告,包含生理準確的生命徵象、實驗室數據和實證醫療計畫。 - 003
Codex 互動式能力地圖 將長文、討論串、備忘錄或產品說明轉換為 Codex 風格的可點擊能力地圖,包含工作流程循環、使用案例矩陣和響應式詳情面板。 - 004
設計評審 對專案中的任何 HTML 成品進行 5 維度專家設計評審——哲學/視覺層級/細節/功能性/創新性,每項評分 0-10。輸出包含雷達圖、有據可依的評分以及三個清單(保留/修復/快速優化)的獨立 HTML 報告。 - 005
儀表板 單檔 HTML 管理/分析儀表板。固定左側邊欄,頂部使用者/搜尋列,主區域顯示 KPI 卡片網格和圖表。適用於需要『儀表板』、『管理後台』、『數據分析』或『控制面板』畫面的場景。 - 006
資料視覺化報告 將 CSV、Excel 或 JSON 資料轉換為精美的視覺化報告頁面。 - 007
約會網站 消費級約會/配對儀表板,包含左側導航欄、社群動態跑馬燈、核心KPI指標、30天互相配對長條圖和配對率趨勢模組。編輯風格排版,克制的強調色。適用於約會網站、配對服務、社群儀表板或社交網路等消費類產品介面。 - 008
DCF估值 為上市公司提供現金流折現估值和內在價值分析。適用於DCF、公允價值、內在價值、目標價、低估或高估分析等需求。 - 009
裝置 3D 展示 靜態 iPhone 和 MacBook 3D 風格展示,支援在螢幕上嵌入真實 HTML、玻璃鏡頭折射效果和 360 度轉盤組合。 - 010
數位電子指南 雙頁數位電子指南預覽——第1頁為封面(顯示標題、作者、『內含什麼』統計資訊、目錄預覽);第2頁為內頁(課程正文含引用語和步驟清單)。生活風格/創作者品牌調性。適用於需要『電子指南』、『數位指南』、『lookbook』、『引流素材』、『創作者指南』、『手冊』或『PDF指南』的需求。 - 011
文件頁面 文件頁面 — 側邊導覽、可捲動內文和目錄。當需求提到'文件'、'指南'、'API 參考'或'教學'時使用。 - 012
電子郵件行銷 品牌產品發布電子郵件範本,包含報頭、主圖、斜體強調標題、正文、主要行動呼籲按鈕和規格表格,採用HTML置中單欄佈局。 - 013
工程運維手冊 工程運維手冊 — 包含服務概覽、告警表、儀表板連結、常用指令操作步驟、值班輪換和事故回應清單。適用於需要運維文件、值班指南、SRE 文件或運維手冊的場景。 - 014
財務報告 季度/月度財務報告——包含關鍵指標的報頭、收入與消耗圖表、損益彙總表、重點摘要和展望段落。當需求提到『財務報告』、『Q3報告』、『MRR審查』、『P&L』或『財報』時使用。 - 015
Flowai 即時儀表板範本 FlowAI 風格的團隊管理儀表板,包含三個分頁(團隊成員、團隊詳情、活動記錄)、KPI 統計列、成員表格、角色分佈長條圖、線上狀態和活動趨勢圖、頂級貢獻者面板,支援亮暗主題切換、圖表懸停提示、面板點擊縮放和 CSV 匯出功能。 - 016
遊戲化應用程式 三屏手機原型展示遊戲化應用介面:封面海報、每日任務與經驗值進度條、任務詳情。適用於遊戲化應用、習慣追蹤、RPG 風格生活應用、升級系統、每日任務、XP/連擊應用等需求。 - 017
GitHub 儀表板 GitHub 儲存庫分析儀表板 — 星標、分支、貢獻者、議題、拉取請求、近期活動和主要貢獻者。適用於 GitHub 儲存庫儀表板、開源成長報告、儲存庫健康頁面或 GitHub 分析檢視。 - 018
員工入職 單頁新進員工入職計畫——第一週日程安排、夥伴+主管介紹、學習路徑、設備清單以及「完成標誌」目標。當需求提及「入職」、「新進員工」、「第一週計畫」或「onboarding」時使用。 - 019
Html Ppt Taste Brutalist 16:9 HTML 簡報,戰術遙測 / CRT 終端機風格。失活 CRT 炭黑背景、白色螢光等寬字型、警示紅強調色、掃描線疊加、ASCII 語法,密度優先於裝飾。提取自 Leonxlnx/taste-skill `brutalist-skill`(戰術遙測模式)。 - 020
Html Ppt Taste Editorial 16:9 HTML 簡報,編輯極簡風格。溫暖奶油色投影片,襯線標題 + 無襯線內文,細線規則,等寬中繼資料,寬敞留白,單一強調色。萃取自 Leonxlnx/taste-skill `minimalist-skill`。 - 021
發票 可列印的發票頁面——包含寄件人和收件人資訊區塊、項目明細表、稅費明細、總計和付款說明。當需求提到'invoice'、'bill'、'billing statement'或'發票'時使用。 - 022
Kami Landing 產生印刷級單頁紙質文件——溫暖羊皮紙底色、墨藍強調色、單一襯線字重,無斜體,無冷灰。輸出呈現專業白皮書或工作室單頁效果,而非應用程式 UI。原生多語言支援(EN · zh-CN · ja)。單個獨立 HTML 檔案,零相依性。 - 023
Kami 羊皮紙文件 溫暖的羊皮紙畫布 (#f5f4ed),單色墨藍色強調 (#1B365D),一種襯線字型系列,編輯級排版。 - 024
看板 看板/任務面板,包含多個欄位(待辦/進行中/審核中/已完成)、可拖曳樣式的卡片、成員頭像、泳道和頂部篩選列。當需求中提到'kanban'、'task board'、'sprint board'、'trello'、'看板'時使用。 - 025
最近30天 最近30天的社群和社交趨勢研究。適用於了解當前輿論、近期情緒、社群反應、社交證明、發布反饋、趨勢掃描或最近30天的背景資訊。 - 026
雜誌文章 Huashu / huashu-md-html 風格的雜誌文章版面,可將 Markdown 或筆記轉換為精緻的長篇 HTML 文章。 - 027
雜誌海報 報紙風格的編輯海報,包含新聞紙材質、日期線、超大襯線標題(帶刪除線和斜體)、雙欄正文、6個編號章節及引用註釋。適合需要雜誌海報、編輯排版、新聞紙風格或宣言設計的場景。 - 028
行銷海報 直式海報或限時動態風格分享圖,具有強烈視覺衝擊力。 - 029
會議紀要 會議記錄頁面——包含與會者標題列、議程清單、決策事項區塊、帶負責人和日期的行動項表格,以及'下次會議'頁尾。適用於需要'會議紀要'、'會議記錄'、'1:1 筆記'、'全員會議總結'或'minutes'的場景。 - 030
行動應用程式 在頁面中渲染於像素級精確的 iPhone 15 Pro 框架內的行動應用程式畫面。透過複製種子檔案 assets/template.html 並貼上 references/layouts.md 中的一個畫面原型來建構。當需求提到「行動應用程式」、「iOS 應用程式」、「Android 應用程式」、「手機畫面」或「應用程式 UI」時使用。 - 031
行動端引導 多螢幕行動引導流程,呈現為三個並排的手機框架——啟動頁、價值主張、登入頁。包含狀態列、滑動指示點和主要CTA按鈕。適用於需要『行動端引導』、『iOS引導』、『手機註冊』或『移动端引导』的場景。 - 032
現代履歷 現代簡約風格履歷,單頁 A4 格式,可列印或匯出 PDF。 - 033
Motion Frames 單幀動態設計合成,包含循環 CSS 動畫——旋轉文字環、動畫地球、計時器、視差標籤。渲染為影片封面海報,可直接導入 HyperFrames 或任何基於關鍵影格的匯出工具。適用於動態設計、動畫主視覺、循環影片、影片封面、標題卡等需求,搭配 HyperFrames 實現動態匯出。 - 034
Open Design 著陸頁 使用 Atelier Zero 視覺語言(Monocle / Apartamento / Études 編輯拼貼風格)生成單頁編輯著陸頁。從品牌簡報填充 inputs.json,可選透過 gpt-image-2 生成 16 張拼貼素材,輸出獨立 HTML 檔案,內建捲動動畫和黏性導航。 - 035
Orbit 綜合簡報 當使用者連接兩個或更多連接器時,Orbit 自動調用此技能,彙總過去 24 小時內所有已認證連接器(GitHub、Linear、Notion、Slack、飛書、日曆、Gmail、雲端硬碟、Sentry、Vercel 等)的活動資料,在「我的設計」頂部生成自適應網格儀表板。由 Orbit 每日摘要排程器自動觸發。 - 036
Orbit Github 根據 GitHub 連接器自動生成每日摘要的 Orbit 技能。拉取過去 24 小時的 PR、審查請求、問題、CI 運行和合併記錄,以類似 GitHub 原生通知的佈局呈現。由 Orbit 每日摘要調度器自動調用。 - 037
Orbit Gmail 當 Gmail 是使用者唯一連接的服務或使用者明確指定時,自動提取過去 24 小時的收件匣活動並產生每日摘要。由 Orbit 排程器自動觸發,不應手動呼叫。 - 038
Orbit Linear 當 Linear 是用戶唯一連接的資料來源或用戶明確將每日摘要範圍限定為 Linear 時,由 Orbit 管道自動觸發。提取過去 24 小時的問題動態、狀態變更、任務分配和週期進度,並以 Linear 原生收件匣視覺語言呈現。 - 039
Orbit Notion Open Orbit 簡報技能 — 當 Notion 是使用者唯一連接的連接器或使用者明確將每日摘要範圍限定為 Notion 時由 Orbit 管道選擇。提取過去 24 小時內使用者已認證的 Notion 連接中的文件編輯、評論、提及和資料庫列變更,並將摘要呈現為原生 Notion 頁面(標註/摺疊/資料庫表格元素)。此技能不應手動觸發 — 由 Orbit 的每日摘要排程器針對即時 Notion 資料調用。 - 040
產品規格文件 單頁產品規格文件/PRD——包含問題定義、成功指標、範圍、使用者故事、設計筆記、上線計畫、待解決問題。適用於需求文件、產品規格、功能說明等場景。 - 041
價格頁面 獨立的價格頁面 — 包含頁首、方案層級、功能對比表和常見問題。適用於需要「價格」、「方案」、「訂閱層級」或「對比方案」頁面的需求。 - 042
Reddit 貼文卡片 逼真的 Reddit 貼文卡片,帶有投票欄和留言數,適用於影片疊加層或故事分享。 - 043
SaaS 著陸頁 單頁 SaaS 著陸頁面,包含主視覺區、功能特色、社會證明、定價方案與行動呼籲。遵循當前 DESIGN.md 的顏色/排版/版面配置規範。觸發關鍵字:"saas landing"、"marketing page"、"product landing"。 - 044
社群媒體輪播圖 三張 1080×1080 方形社群媒體輪播卡片——三個富有電影感和品牌調性的面板,配有連貫的展示標題('繼續前進。' → '到下一個。' → '展望未來。')。每張卡片包含品牌標誌、序號/總數、說明文字和'循環'提示。適用於'輪播貼文'、'社群媒體輪播'、'Instagram 輪播'、'LinkedIn 系列'、'X 系列卡片'或'三連發'等需求。 - 045
社群媒體儀表板 創作者社群媒體分析儀表板,單一 HTML 檔案。包含平台切換器(X / LinkedIn / YouTube / Instagram)、KPI 卡片(追蹤者數、互動率、按讚數、轉發數)、追蹤者成長圖表、本週熱門貼文預覽和熱門話題/留言側邊欄。 - 046
Spotify 正在播放卡片 Spotify 風格的正在播放卡片,包含專輯封面、進度條和播放控制,適用於影片疊加層或個人首頁。 - 047
精靈圖動畫 像素風格的動畫解說投影片,配有奶油色背景、粗體年份顯示、像素藝術吉祥物(如花札卡、蘑菇或8位元遊戲機)、動態日文字體和時間軸條帶。純CSS動畫,無需JS,可直接錄製為直式影片。適合像素動畫、8位元解說、復古動畫等需求。 - 048
團隊 OKR OKR 追蹤頁面——季度橫幅,三個目標及其關鍵結果進度條、負責人頭像、狀態標籤,以及「本季度概覽」側邊欄。當需求提及 OKR、關鍵結果、目標時使用。 - 049
即時調參 為任何 HTML 元件添加側面板即時控制器,可調整主題色、字體比例、密度、動效等參數,修改即時同步到 CSS 自訂屬性並儲存到 localStorage,讓使用者無需重新提示即可探索設計變體。 - 050
Twitter 分享卡片 用於搭配貼文的 Twitter 引用或資料卡片。 - 051
候補名單頁面 簡約的預發布著陸頁,支援電子郵件收集、品牌標誌和可選裝飾層。從 DESIGN.md 讀取顏色、排版和佈局規則。適用於產品發布、Beta 測試註冊、搶先體驗計畫和獨立專案。 - 052
網頁原型 通用桌面網頁原型。透過複製種子檔案 `assets/template.html` 並貼上 `references/layouts.md` 中的版面配置生成單一獨立 HTML 檔案。適用於著陸頁、行銷頁、文件或 SaaS 頁面的預設選項。 - 053
Web Prototype Taste Brutalist 瑞士工業印刷風格網頁原型。新聞紙畫布、黑色粗體字、溢出式數字、細線網格分隔、危險紅強調色、ASCII 語法裝飾。源自 Leonxlnx/taste-skill `brutalist-skill`(瑞士工業印刷模式)。 - 054
Web Prototype Taste 編輯風格 極簡編輯風格網頁原型。暖色單色調畫布,襯線標題配無襯線內文,1px 細線邊框,柔和粉彩色塊,大量留白,微妙動效。 - 055
Web Prototype Taste Soft Apple 等級柔和風格網頁原型。銀灰/奶油色畫布,雙邊框卡片,嵌套按鈕 CTA,大圓角,彈性動效和環境網格。基於 Leonxlnx/taste-skill 的 soft-skill 及第 4-8 節。 - 056
線框草圖 手繪風格的線框圖,包含方格紙背景、麥克筆/鉛筆質感、多標籤頁變體、便利貼註解、圖表佔位符和陰影填充。適用於「線框圖」「草圖線框」「手繪」「低保真」「白板」「草稿」「手繪原型」等需求。 - 057
X / Twitter 貼文卡片 逼真的 X 貼文卡片,包含互動指標(按讚、轉發、觀看次數),適用於影片疊加層或可分享的圖片卡片。 - 058
X 研究 針對市場、公司、產品或社群議題進行 X/Twitter 公眾情緒研究。當需要了解 X 或 Twitter 上的輿論、加密社群情緒、專家觀點或股票、產業、公司、產品、市場事件的社群反應時使用。 - 059
小紅書卡片 小紅書風格的知識卡片,以可滑動的多卡輪播形式呈現。