seikaikyo/sketch
skills/sketch/SKILL.md
拋棄式 HTML mockup 比稿：產出 2 到 3 個設計立場不同的變體（密度 / 版式 / 強調軸，不是換色），各附取捨說明，最後給有立場的對比結論。適用：「畫個草圖」「比較 A 版 B 版」「先看方向再做」「給我看幾種做法」。要 production 元件或設計已定案時不適用。
$ install --global
skillsauthnpx skillsauth add seikaikyo/dash-skills sketchInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Jul 21, 2026, 5:43 AM342.6s1 file scanned
SKILL.md
- name:
- sketch
- description:
- 拋棄式 HTML mockup 比稿：產出 2 到 3 個設計立場不同的變體（密度 / 版式 / 強調軸，不是換色），各附取捨說明，最後給有立場的對比結論。適用：「畫個草圖」「比較 A 版 B 版」「先看方向再做」「給我看幾種做法」。要 production 元件或設計已定案時不適用。
- source:
- adapted from openclawyhwang-hub/tGD tgd-sketch (Apache-2.0，上游改作自 gsd-build/get-shit-done MIT)
- updated:
- 2026-07-13
Sketch（拋棄式 mockup 比稿）
核心
在投入實作前，用 2 到 3 個可互動的拋棄式 HTML mockup 比較設計方向。每個變體是一個自足的 HTML 檔：inline CSS、擬真內容、基本互動。目的是視覺比較，不是可出貨的程式碼。
只做一版是原型不是比稿，比稿的價值在正面對決。兩個變體多一倍工，消掉八成重做風險。
何時使用
- 使用者想在動工前探索 UI / UX 方向
- 「畫個草圖」「X 長什麼樣給我看看」「比較版型 A 跟 B」「給我 2 到 3 種做法」
- 早期設計探索，速度比打磨重要
不適用：要 production 元件（走 frontend-design / interface-design 正規做）、要單一精緻 HTML 成品、要圖表或架構圖、設計已定案（直接做）。
流程
intake → 變體 → 正面對決 → 選出勝者（或再一輪）
1. Intake（使用者已給足就跳過）
產變體前先拿到三件事，一次一題：
- 感覺：「這東西該是什麼感覺？形容詞、情緒、vibe。」（「安靜、編輯感、像 Linear」比「極簡」有用得多）
- 參照：「哪些 app 或網站有你想像中的感覺？」實際參照勝過抽象描述
- 核心動作：「使用者在這個畫面上最重要的一件事是什麼？」變體都要把它做好，否則只是裝飾
2. 變體（2 到 3 個，絕不 1 個，極少 4 個以上）
每個變體要有不同的設計立場，不是不同的像素值。可用的立場軸：
- 密度：緊湊 / 留白 / 超高密度（挑兩個對立端）
- 強調：內容優先 / 動作優先 / 工具優先
- 美感：編輯感 / 工具感 / 玩心
- 版式：單欄 / 側欄 / 分割面板
- 落地方式：卡片式 / 裸內容 / 文件式
挑一條軸拉開距離。只差主色的兩個變體是浪費，使用者無法區辨。
3. 做成真的 HTML
每個變體是單一自足 HTML 檔：
- inline
<style>，不需建構步驟 - 系統字型（拋棄式草圖可用 CDN 字型或 Tailwind CDN，此豁免僅限 sketch，production 禁 CDN 的規矩照舊）
- 擬真假內容：真的句子、真的名字，不用 lorem ipsum
- 有互動：連結可點、hover 有反應、至少一個狀態轉換（開合、篩選、切換）。凍結的靜態圖比粗糙但會動的草圖更糟
寫完用 agent-browser 開 file:// 截圖實看，抓純看原始碼看不出的版面問題（字型載入失敗、flex 容器塌掉），修到每個變體看起來是對的。
4. 每個變體附 README
## 變體：<立場名>
### 設計立場
一句話講驅動這個變體的原則。
### 關鍵選擇
版式 / 字型 / 色彩 / 互動各一行。
### 取捨
強在哪、弱在哪。
### 適合誰
這個變體實際服務的使用者或情境。
5. 正面對決
全部做完後給對比，不能只列清單，要有立場：
| 維度 | 安靜編輯感 | 工具感高密度 | 玩心分割版 |
|------|-----------|-------------|-----------|
| 密度 | 低 | 高 | 中 |
| 主動作可見度 | 低 | 高 | 中 |
| 掃讀性 | 高 | 中 | 低 |
我的判斷：重度使用者選工具感高密度，內容導向選安靜編輯感。
玩心分割版最弱，兩頭想抓、兩頭不沾。
讓使用者選勝者、合併兩案成混血、或再來一輪。
產物位置
- 預設放 session scratchpad 或使用者指定位置，禁寫進 code repo root：草圖是拋棄式產物不是 source
- 告訴使用者怎麼開：macOS 用
open <路徑>/index.html - 保持拋棄式：捨不得丟的草圖該升級成真的專案程式碼，不是收藏
互動門檻
草圖夠互動的標準：主動作點下去有可見反應（狀態變化、modal、toast）、至少一個有意義的狀態轉換、可辨識的元件有 hover。超過這些是過度打磨拋棄品，低於這些是截圖。
紅旗
- 變體只差色彩或主色：那是換色不是方案
- 沒有互動：能點的 wireframe 都比靜態截圖好
- 跳過 intake 就生成：不懂感覺 / 參照 / 核心動作，產出必然平庸
- 超過 3 個變體：報酬遞減，使用者無法有效比較
- production 等級的程式碼：草圖是拋棄式的，不要過度投資
- 對比表沒有立場：要明講哪個最強、為什麼
驗證
- [ ] 每個變體在瀏覽器實際開過、截圖看過、渲染正確
- [ ] 每個變體有不同的設計立場（不只是換色）
- [ ] 基本互動可用（點擊、hover、狀態轉換）
- [ ] 對比表有立場：明講哪個變體最強、為什麼
- [ ] README 講清楚取捨，不是羅列功能
- [ ] 產物在 scratchpad 或使用者指定位置，沒進 repo root
Related Skills
seikaikyo/conducting-gdpr-compliance-assessment
tools
VerifiedTrustedCommunity
Conduct comprehensive GDPR compliance assessments by evaluating data processing activities against EU Regulation 2016/679, including Article 30 records of processing, lawful basis validation, data subject rights implementation, Data Protection Impact Assessments (DPIAs) under Article 35, breach notification procedures, international transfer safeguards (SCCs, adequacy decisions), and technical/organizational measures under Article 32. Use when processing personal data of EU residents, preparing for supervisory authority audits, implementing privacy-by-design for new systems, scoping compliance gaps for M&A due diligence, assessing third-party processors, or responding to data subject access requests at scale. Incorporates 2026 guidance from ICO, EDPB, and post-Data (Use and Access) Act 2025 UK-GDPR considerations. Do not use for implementing specific Article 32 controls — use implementing-gdpr-data-protection-controls; or for DSAR automation — use implementing-gdpr-data-subject-access-request.
2SKILL.mdUpdated Sep 11, 2026
seikaikyo/parsing-artifacts-with-eric-zimmerman-tools
tools
VerifiedTrustedCommunity
Parse Windows forensic artifacts—$MFT/$J (MFTECmd), Prefetch (PECmd), registry hives (RECmd), shellbags, and Amcache—into normalized CSV/JSON with Eric Zimmerman's EZ Tools, then load results into Timeline Explorer for analysis. Use during DFIR/incident-response investigations, after triage collection (e.g. with KAPE), to establish program execution, file/folder access, and persistence evidence from acquired forensic images.
2SKILL.mdUpdated Jun 23, 2026
seikaikyo/orchestrating-llm-attacks-with-pyrit
development
VerifiedTrustedCommunity
Build automated multi-turn adversarial attacks against conversational LLM targets using Microsoft PyRIT's RedTeamingOrchestrator, CrescendoOrchestrator (gradual escalation), and TreeOfAttacksWithPruningOrchestrator (adaptive branching), with scorer feedback loops and persisted conversation memory. Use when single-shot LLM scanning is insufficient and you need multi-turn, scorer-driven AI red-team campaigns against a chatbot or agent.
2SKILL.mdUpdated Jun 23, 2026
seikaikyo/operationalizing-misp-threat-feeds
testing
VerifiedTrustedCommunity
Stand up MISP, enable and cache curated threat feeds (CIRCL, abuse.ch, Feodo Tracker), apply warninglists to suppress false positives, query indicators with PyMISP, and export attributes as auto-generated Suricata/Sigma/Wazuh detection rules. Use when maturing a MISP instance to actively drive detection, curating threat feeds with quality controls, or automating IOC-to-detection pipelines for the SIEM/IDS.
2SKILL.mdUpdated Jun 23, 2026