[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-1514":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":8,"htmlUrl":8,"language":9,"languages":8,"totalLinesOfCode":8,"stars":10,"forks":11,"watchers":12,"openIssues":13,"contributorsCount":13,"subscribersCount":13,"size":13,"stars1d":14,"stars7d":15,"stars30d":16,"stars90d":13,"forks30d":13,"starsTrendScore":12,"compositeScore":17,"rankGlobal":8,"rankLanguage":8,"license":8,"archived":18,"fork":18,"defaultBranch":19,"hasWiki":20,"hasPages":18,"topics":21,"createdAt":8,"pushedAt":8,"updatedAt":22,"readmeContent":23,"aiSummary":24,"trendingCount":13,"starSnapshotCount":13,"syncStatus":15,"lastSyncTime":25,"discoverSource":26},1514,"svg-hand-drawn-skill","shaom\u002Fsvg-hand-drawn-skill","shaom",null,"JavaScript",218,30,3,0,1,2,10,42.47,false,"main",true,[],"2026-06-12 04:00:10","# SVG Hand-Drawn Preview Skill\n\nAn agent-oriented skill for turning an SVG into a hand-drawn animation deliverable.\n\nThis repository is intentionally small. It contains only the skill definition, reusable assets, and one example demo.\n\n![Hand-drawn preview](docs\u002Fhand-drawn-preview.gif)\n\nDefault deliverables:\n- `preview.html`\n- `player.js`\n\nDefault behavior:\n- draw SVG paths first\n- reveal fills afterward\n- preserve source colors as closely as possible\n\n## Repository Structure\n\n```text\n.\n├── README.md\n├── .gitignore\n├── examples\n│   └── svg-player-demo\n│       ├── 975549_OGFB9T1.svg\n│       └── svg-player-demo.html\n└── skills\n    └── svg-hand-drawn-preview\n        ├── SKILL.md\n        ├── assets\n        │   ├── player.js\n        │   └── preview-template.html\n        └── references\n            ├── html-preview-guidelines.md\n            └── output-contract.md\n```\n\n## Main Files\n\n- Skill entry: `skills\u002Fsvg-hand-drawn-preview\u002FSKILL.md`\n- Reusable player asset: `skills\u002Fsvg-hand-drawn-preview\u002Fassets\u002Fplayer.js`\n- Preview template: `skills\u002Fsvg-hand-drawn-preview\u002Fassets\u002Fpreview-template.html`\n- Output contract: `skills\u002Fsvg-hand-drawn-preview\u002Freferences\u002Foutput-contract.md`\n\n## How To Use This Skill\n\nTypical agent-driven usage:\n\n1. Provide a local SVG file path or an SVG URL.\n2. Ask the agent to generate the final deliverables.\n3. Expect these default outputs:\n   - `preview.html`\n   - `player.js`\n\nTypical request examples:\n\n- \"Turn this SVG into a hand-drawn preview page.\"\n- \"Generate a preview.html and player.js from this SVG.\"\n- \"Apply a hand-drawn path and fill animation to this SVG.\"\n\n## Example\n\nA concrete example is included in:\n\n- `examples\u002Fsvg-player-demo\u002F975549_OGFB9T1.svg`\n- `examples\u002Fsvg-player-demo\u002Fsvg-player-demo.html`\n\nThis example is useful for showing the intended result shape of the skill output and for quick manual inspection in a browser.\n\n## What The Skill Produces\n\nBy default, the agent should generate:\n\n1. `preview.html`\n2. `player.js`\n\n`preview.html` is for direct preview.\n\n`player.js` is for embedding the playback core into another webpage.\n\n## Minimal Web Embed\n\n```html\n\u003Cdiv id=\"svg-player\">\u003C\u002Fdiv>\n\u003Cscript src=\".\u002Fplayer.js\">\u003C\u002Fscript>\n\u003Cscript>\n  createSvgHanddrawPlayer(\"#svg-player\", {\n    svgMarkup: \"\u003Csvg>...\u003C\u002Fsvg>\",\n    speed: 1\n  });\n\u003C\u002Fscript>\n```\n\nCurrent player API:\n- `play()`\n- `pause()`\n- `seek(ratio)`\n- `setSpeed(value)`\n- `destroy()`\n\n## Notes\n\n- This repository keeps the skill independent from any project-specific demo page.\n- The intended workflow is agent-driven output generation.\n- End users should not need Python, Node, or another local build step unless a self-serve workflow is added later.\n- The example demo is included for quick manual inspection, not as a required runtime dependency of the skill.\n","该项目是一个将SVG转换为手绘动画效果的工具。它通过JavaScript实现，能够首先绘制SVG路径，然后展示填充效果，并尽可能保持原始颜色。项目结构简洁，主要包含技能定义、可复用资源和一个示例演示。适用于需要将静态SVG图形转换为具有手绘风格动态展示的场景，如网页设计、产品展示或教育内容制作等。使用时只需提供SVG文件路径或URL，即可生成`preview.html`和`player.js`两个默认输出文件，便于直接预览或嵌入到其他网页中。","2026-06-11 02:44:25","CREATED_QUERY"]