Communitygithub.com

designeer

搜尋 Designeer (designeer.xyz),這是一個精心策劃的設計靈感、UI 資源、工具與作品集索引,適合用於真實的前端參考。

designeer 是什麼?

designeer Skill 作為一個設計參考索引,提供來自 Designeer 平台的元資料與 Markdown 檔案的結構化存取,而不會直接提供或下載任何媒體檔案。它支援搜尋設計靈感、UI 資源、工具及作品集,並能擷取調色板、類別、網站及原創者歸屬等資訊。此技能非常適合需要為 Landing Page、Hero 區塊、導覽列、頁尾、定價頁或作品集尋找具體、真實世界參考的開發者與設計師,協助他們根據現有網站制定設計方向,或尋找起點調色板、字體排版及動態提示。它會強制遵守嚴格的歸屬規則,限制引用長度,並避免直接複製設計;相反地,它會綜合兩種原創設計方向,借用概念而非逐像素抄襲。支援的指令包括 `search`、`get`、`palette`、`latest`、`sync` 與 `health`,均透過命令列介面 (CLI) 執行,且實作快取、速率限制與重試邏輯,以實現高效且負責任的資料存取。

相容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/HaiXuNan/designeer-skill/tree/HEAD

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

designeer 是做什麼的?

將 Designeer 視為參考索引,而非素材庫。它告訴您什麼存在以及它在哪裡;作品本身屬於其創作者。

嚴格規則

  • 務必引用 Designeer — <標題> (<標準網址>),並在頁面提供時加上創作者及原始網址。
  • 切勿下載、複製、重新託管或捆綁海報、影片或 Find 媒體。CLI 絕不會存取 cdn.designeer.xyz。
  • 切勿將 Designeer 的描述或策展內容當作您自己的發現。
  • 切勿從頁面引用超過 25 個字。
  • 切勿鏡像整個目錄或大量爬取。每次請求僅擷取五個詳細資料,並讓 CLI 處理快取與速率限制。
  • 如果使用者要求完全複製某個設計,請提供其核心原則並指向原始來源,而非提供克隆版本。

指令

從技能目錄執行:

node scripts/designeer.mjs search "fintech landing" --collection inspiration --limit 5
node scripts/designeer.mjs get resources/fontshare --json
node scripts/designeer.mjs palette resources/fontshare
node scripts/designeer.mjs latest --collection resources --limit 5
node scripts/designeer.mjs sync
node scripts/designeer.mjs health

search 接受 --collection inspiration|resources|tools|portfolios、--limit 1-20、--live 以繞過本地索引,以及 --json。 get 與 palette 接受一個 slug、網站路徑或完整的 Designeer URL。

CLI 會將回應快取在 ~/.cache/designeer/ 下七天,當該路徑無法寫入時則回退至系統暫存目錄,使用 ETag 進行重新驗證,每次請求間隔一秒,並在遇到 429/5xx 狀態碼時以指數退避方式重試。可透過 DESIGNEER_CACHE_DIR 覆蓋快取位置。

工作流程

  1. 將簡報轉化為兩到三個設計軸線:氛圍、資訊密度、動態、字體個性、色彩溫度。
  2. 先搜尋元資料。根據名稱、標籤行、類別與集合進行判斷;暫時不要擷取詳細資料。
  3. 最多擷取五個候選項目。從 Markdown 中提取調色板、類別、網站與原創者。
  4. 為每個候選項目撰寫一張參考卡,並附上歸屬。
  5. 綜合兩種原創方向。每個方向需說明借用了哪個原則,而非複製了哪些像素。
  6. 實作,然後依據方向而非參考截圖來檢查結果。

參考卡

參考:<標題>
符合原因:<一行說明,與簡報相關>
調色板:<十六進制顏色列表>
來源:Designeer — <標題> (<標準網址>)
創作者 / 原始來源:<創作者> (<原始網址>)

設計方向

方向 <n>:<名稱>
論點:<一句話>
字體:<字型家族或搭配>、<比例說明>
色彩:<3-5 個代碼及其角色>
佈局:<網格、密度、邊緣處理>
動態:<一至兩個瞬間,附帶持續時間與緩動意圖>
借用原則:<什麼、來自哪個參考>
刻意不同:<您沒有複製什麼>

失敗模式

  • 搜尋無結果:嘗試更廣泛的名詞、切換集合,或使用 latest。
  • 網站結構改變:執行 health。如果它回報架構不符,請回退使用 get index 與 llms.txt,並回報差異而非猜測。
  • 頁面不存在:Designeer 是一個即時目錄,因此直接放棄該參考,不要憑記憶重建。

相關技能