{
  "schemaVersion": "1.0",
  "item": {
    "slug": "horse-sticker-maker",
    "name": "Horse Sticker Maker",
    "source": "tencent",
    "type": "skill",
    "category": "开发工具",
    "sourceUrl": "https://clawhub.ai/jiafar/horse-sticker-maker",
    "canonicalUrl": "https://clawhub.ai/jiafar/horse-sticker-maker",
    "targetPlatform": "OpenClaw"
  },
  "install": {
    "downloadMode": "redirect",
    "downloadUrl": "/downloads/horse-sticker-maker",
    "sourceDownloadUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=horse-sticker-maker",
    "sourcePlatform": "tencent",
    "targetPlatform": "OpenClaw",
    "installMethod": "Manual import",
    "extraction": "Extract archive",
    "prerequisites": [
      "OpenClaw"
    ],
    "packageFormat": "ZIP package",
    "includedAssets": [
      "SKILL.md",
      "assets/horse-blessing-template/app/api/generate/route.ts",
      "assets/horse-blessing-template/app/api/sticker/route.ts",
      "assets/horse-blessing-template/app/globals.css",
      "assets/horse-blessing-template/app/layout.tsx",
      "assets/horse-blessing-template/app/page.tsx"
    ],
    "primaryDoc": "SKILL.md",
    "quickSetup": [
      "Download the package from Yavira.",
      "Extract the archive and review SKILL.md first.",
      "Import or place the package into your OpenClaw setup."
    ],
    "agentAssist": {
      "summary": "Hand the extracted package to your coding agent with a concrete install brief instead of figuring it out manually.",
      "steps": [
        "Download the package from Yavira.",
        "Extract it into a folder your agent can access.",
        "Paste one of the prompts below and point your agent at the extracted folder."
      ],
      "prompts": [
        {
          "label": "New install",
          "body": "I downloaded a skill package from Yavira. Read SKILL.md from the extracted folder and install it by following the included instructions. Tell me what you changed and call out any manual steps you could not complete."
        },
        {
          "label": "Upgrade existing",
          "body": "I downloaded an updated skill package from Yavira. Read SKILL.md from the extracted folder, compare it with my current installation, and upgrade it while preserving any custom configuration unless the package docs explicitly say otherwise. Summarize what changed and any follow-up checks I should run."
        }
      ]
    },
    "sourceHealth": {
      "source": "tencent",
      "status": "healthy",
      "reason": "direct_download_ok",
      "recommendedAction": "download",
      "checkedAt": "2026-04-30T16:55:25.780Z",
      "expiresAt": "2026-05-07T16:55:25.780Z",
      "httpStatus": 200,
      "finalUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=network",
      "contentType": "application/zip",
      "probeMethod": "head",
      "details": {
        "probeUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=network",
        "contentDisposition": "attachment; filename=\"network-1.0.0.zip\"",
        "redirectLocation": null,
        "bodySnippet": null
      },
      "scope": "source",
      "summary": "Source download looks usable.",
      "detail": "Yavira can redirect you to the upstream package for this source.",
      "primaryActionLabel": "Download for OpenClaw",
      "primaryActionHref": "/downloads/horse-sticker-maker"
    },
    "validation": {
      "installChecklist": [
        "Use the Yavira download entry.",
        "Review SKILL.md after the package is downloaded.",
        "Confirm the extracted package contains the expected setup assets."
      ],
      "postInstallChecks": [
        "Confirm the extracted package includes the expected docs or setup files.",
        "Validate the skill or prompts are available in your target agent workspace.",
        "Capture any manual follow-up steps the agent could not complete."
      ]
    },
    "downloadPageUrl": "https://openagent3.xyz/downloads/horse-sticker-maker",
    "agentPageUrl": "https://openagent3.xyz/skills/horse-sticker-maker/agent",
    "manifestUrl": "https://openagent3.xyz/skills/horse-sticker-maker/agent.json",
    "briefUrl": "https://openagent3.xyz/skills/horse-sticker-maker/agent.md"
  },
  "agentAssist": {
    "summary": "Hand the extracted package to your coding agent with a concrete install brief instead of figuring it out manually.",
    "steps": [
      "Download the package from Yavira.",
      "Extract it into a folder your agent can access.",
      "Paste one of the prompts below and point your agent at the extracted folder."
    ],
    "prompts": [
      {
        "label": "New install",
        "body": "I downloaded a skill package from Yavira. Read SKILL.md from the extracted folder and install it by following the included instructions. Tell me what you changed and call out any manual steps you could not complete."
      },
      {
        "label": "Upgrade existing",
        "body": "I downloaded an updated skill package from Yavira. Read SKILL.md from the extracted folder, compare it with my current installation, and upgrade it while preserving any custom configuration unless the package docs explicitly say otherwise. Summarize what changed and any follow-up checks I should run."
      }
    ]
  },
  "documentation": {
    "source": "clawhub",
    "primaryDoc": "SKILL.md",
    "sections": [
      {
        "title": "Horse Sticker Maker",
        "body": "Generate a web app that creates custom animated GIF stickers for Chinese New Year (Year of the Horse 2026)."
      },
      {
        "title": "What It Does",
        "body": "Users input custom blessing text (1-8 chars)\nClient-side Canvas renders a 240px animated GIF with:\n\nRed gradient background with gold sparkle particles\n6-frame gold horse galloping animation (transparent PNG)\nUser's custom text in gold calligraphy at top\n\"立马加薪\" bottom text with color-cycling effect\n\n\nOutput is WeChat sticker compatible (≤500KB, 240px)"
      },
      {
        "title": "Quick Start",
        "body": "Copy the template project:\ncp -r <skill_dir>/assets/horse-blessing-template ./horse-blessing\ncd horse-blessing\nnpm install\n\n\n\nRun locally:\nnpm run dev\n# Open http://localhost:3000/sticker\n\n\n\nDeploy to Vercel:\nvercel --prod --yes"
      },
      {
        "title": "Project Structure",
        "body": "horse-blessing/\n├── app/\n│   ├── page.tsx          # Main page (AI-generated blessing with poem)\n│   ├── sticker/page.tsx  # Sticker maker (Canvas GIF generator)\n│   ├── api/generate/     # AI poem + image generation API\n│   ├── api/sticker/      # Sticker API\n│   └── layout.tsx        # Root layout (red theme)\n├── public/\n│   ├── horse-frame-[1-6].png  # 6-frame transparent gold horse\n│   ├── horse-transparent.png  # Static horse fallback\n│   └── gif.worker.js          # gif.js web worker\n├── package.json\n└── tailwind.config.ts"
      },
      {
        "title": "GIF Generation (Client-Side)",
        "body": "Uses gif.js loaded via CDN (Script from next/script)\n18 frames (6 horse frames × 3 cycles), 85ms delay per frame\nCanvas size: 240×240px for WeChat sticker compatibility\nHorse frames loaded as Image elements, drawn via drawImage"
      },
      {
        "title": "Horse Frame Assets",
        "body": "6 transparent PNG frames in public/horse-frame-[1-6].png\nGenerated via AI image model, backgrounds removed with sharp\nRemoval technique: pixels with R>210, G>210, B>210 → alpha=0"
      },
      {
        "title": "Customization Points",
        "body": "Bottom text: Edit '立马加薪' in sticker/page.tsx\nGIF size: Change const size = 240 (keep ≤240 for WeChat)\nFrame count: Change const frames = 18\nHorse images: Replace public/horse-frame-*.png\nBackground: Modify the radial gradient colors\nSparkle count: Adjust sparkle array size (default 30)"
      },
      {
        "title": "WeChat Sticker Compatibility",
        "body": "Max 500KB file size\nMax 240px recommended dimension\nGIF format required\nSave → WeChat chat → emoji panel → \"+\" → select from gallery"
      },
      {
        "title": "Dependencies",
        "body": "{\n  \"next\": \"^14.0.0\",\n  \"react\": \"^18.2.0\",\n  \"react-dom\": \"^18.2.0\",\n  \"sharp\": \"latest\",\n  \"gif-encoder-2\": \"^1.0.5\",\n  \"html2canvas-pro\": \"^1.6.7\"\n}\n\nExternal CDN: gif.js@0.2.0 (loaded at runtime for client-side GIF encoding)"
      }
    ],
    "body": "Horse Sticker Maker\n\nGenerate a web app that creates custom animated GIF stickers for Chinese New Year (Year of the Horse 2026).\n\nWhat It Does\nUsers input custom blessing text (1-8 chars)\nClient-side Canvas renders a 240px animated GIF with:\nRed gradient background with gold sparkle particles\n6-frame gold horse galloping animation (transparent PNG)\nUser's custom text in gold calligraphy at top\n\"立马加薪\" bottom text with color-cycling effect\nOutput is WeChat sticker compatible (≤500KB, 240px)\nQuick Start\n\nCopy the template project:\n\ncp -r <skill_dir>/assets/horse-blessing-template ./horse-blessing\ncd horse-blessing\nnpm install\n\n\nRun locally:\n\nnpm run dev\n# Open http://localhost:3000/sticker\n\n\nDeploy to Vercel:\n\nvercel --prod --yes\n\nProject Structure\nhorse-blessing/\n├── app/\n│   ├── page.tsx          # Main page (AI-generated blessing with poem)\n│   ├── sticker/page.tsx  # Sticker maker (Canvas GIF generator)\n│   ├── api/generate/     # AI poem + image generation API\n│   ├── api/sticker/      # Sticker API\n│   └── layout.tsx        # Root layout (red theme)\n├── public/\n│   ├── horse-frame-[1-6].png  # 6-frame transparent gold horse\n│   ├── horse-transparent.png  # Static horse fallback\n│   └── gif.worker.js          # gif.js web worker\n├── package.json\n└── tailwind.config.ts\n\nKey Technical Details\nGIF Generation (Client-Side)\nUses gif.js loaded via CDN (Script from next/script)\n18 frames (6 horse frames × 3 cycles), 85ms delay per frame\nCanvas size: 240×240px for WeChat sticker compatibility\nHorse frames loaded as Image elements, drawn via drawImage\nHorse Frame Assets\n6 transparent PNG frames in public/horse-frame-[1-6].png\nGenerated via AI image model, backgrounds removed with sharp\nRemoval technique: pixels with R>210, G>210, B>210 → alpha=0\nCustomization Points\nBottom text: Edit '立马加薪' in sticker/page.tsx\nGIF size: Change const size = 240 (keep ≤240 for WeChat)\nFrame count: Change const frames = 18\nHorse images: Replace public/horse-frame-*.png\nBackground: Modify the radial gradient colors\nSparkle count: Adjust sparkle array size (default 30)\nWeChat Sticker Compatibility\nMax 500KB file size\nMax 240px recommended dimension\nGIF format required\nSave → WeChat chat → emoji panel → \"+\" → select from gallery\nDependencies\n{\n  \"next\": \"^14.0.0\",\n  \"react\": \"^18.2.0\",\n  \"react-dom\": \"^18.2.0\",\n  \"sharp\": \"latest\",\n  \"gif-encoder-2\": \"^1.0.5\",\n  \"html2canvas-pro\": \"^1.6.7\"\n}\n\n\nExternal CDN: gif.js@0.2.0 (loaded at runtime for client-side GIF encoding)"
  },
  "trust": {
    "sourceLabel": "tencent",
    "provenanceUrl": "https://clawhub.ai/jiafar/horse-sticker-maker",
    "publisherUrl": "https://clawhub.ai/jiafar/horse-sticker-maker",
    "owner": "jiafar",
    "version": "1.0.0",
    "license": null,
    "verificationStatus": "Indexed source record"
  },
  "links": {
    "detailUrl": "https://openagent3.xyz/skills/horse-sticker-maker",
    "downloadUrl": "https://openagent3.xyz/downloads/horse-sticker-maker",
    "agentUrl": "https://openagent3.xyz/skills/horse-sticker-maker/agent",
    "manifestUrl": "https://openagent3.xyz/skills/horse-sticker-maker/agent.json",
    "briefUrl": "https://openagent3.xyz/skills/horse-sticker-maker/agent.md"
  }
}