Ifq Design Skills
Route an agent through HTML-first prototypes, decks, landings, and brand assets with export to PDF, PPTX, MP4, and SVG without building a production app.
Overview
ifq-design-skills is an agent skill most often used in Validate (also Build, Launch) that produces HTML-first visual design deliverables with agent routing, template selection, verification, and multi-format export prep.
Install
npx skills add https://github.com/peixl/ifq-design-skills --skill SKILL.mdWhat is this skill?
- Routes requests across deliverable types: prototype, deck, dashboard, landing, infographic, whitepaper, changelog, and s
- Handles design critique, multi-variant exploration, and brand-system directions in one HTML-first workflow
- Prepares exports to MP4, GIF, PPTX, PDF, and SVG from agent-driven templates and verification steps
- Explicitly excludes production web apps, SEO sites, backend systems, and pure copy-only edits
- Reduces prompt-engineering by letting the agent pick templates, verify output, and stage export prep
Adoption & trust: 15 GitHub stars.
What problem does it solve?
You need a credible visual artifact—deck, landing, or prototype—but ad-hoc image or chat output wastes cycles on routing, consistency, and export formats.
Who is it for?
Solo builders who want agent-guided HTML prototypes, pitch decks, launch landings, and brand visuals with structured export paths before engineering a real app.
Skip if: Teams building production web apps, SEO-focused marketing sites, backend services, or jobs that only need copy edits with no visual deliverable.
When should I use this skill?
User asks for an HTML-first visual design deliverable or design judgment—prototype, deck, motion demo, infographic, dashboard, landing, whitepaper, changelog, business card, social cover, brand system, critique, multi-va
What do I get? / Deliverables
You get a verified HTML-first design package and export-ready assets (PDF, PPTX, MP4, GIF, SVG) aligned to the requested deliverable type, without mistaking the result for a production web app.
- HTML-first design artifact for the requested format (prototype, deck page, landing, etc.)
- Verification notes and variant comparison when multi-variant exploration is requested
- Export-ready files (MP4, GIF, PPTX, PDF, SVG) when export is in scope
Recommended Skills
Journey fit
Spans multiple journey phases - primary shelf plus alternate fits below.
Visual exploration and clickable HTML prototypes belong on the validate shelf before you commit engineering to a full product surface. Prototype is where solo builders test layout, motion, and narrative in disposable HTML before ship-ready frontend work.
Where it fits
Spin up three HTML landing variants to test positioning before you wire a real signup flow.
Produce a shareable pricing landing mock with motion and PDF export for early customer conversations.
Generate a dashboard and infographic HTML reference the agent can mirror when implementing components.
Create social covers and a short MP4/GIF motion demo for a Product Hunt or X launch thread.
How it compares
Use for disposable HTML design artifacts and exports—not as a substitute for a shipped frontend repo or a dedicated design tool pipeline.
Common Questions / FAQ
Who is ifq-design-skills for?
Solo and indie builders using Claude Code, Cursor, Codex, or similar agents who need HTML-first visuals—prototypes, decks, landings, infographics, and brand directions—without standing up a full product codebase.
When should I use ifq-design-skills?
Use it in Validate when you need a clickable prototype or pricing landing mock; in Build when you need UI reference pages or changelog/whitepaper layout; at Launch when you need social covers or motion demos for distribution—all as HTML-first outputs with optional MP4, GIF, PPTX,
Is ifq-design-skills safe to install?
Review the Security Audits panel on this Prism page for pass/fail details and file-hash signals before enabling network or export-related agent steps in your environment.
SKILL.md
READMESKILL.md - Ifq Design Skills
Use this skill whenever the user asks for an HTML-first visual design deliverable or design judgment: interactive prototype, slide deck, motion demo, infographic, dashboard, landing page, whitepaper, changelog, business card, social cover, brand system, design critique, multi-variant exploration, or export to MP4, GIF, PPTX, PDF, or SVG. It is optimized to make AI agents do the routing, template selection, verification, and export prep so humans spend less time prompt-engineering. Do not use for production web apps, SEO sites, backend systems, or pure copy edits. # ifq-design-skills { "name": "ifq-design-skills", "description": "Use this skill whenever the user asks for an HTML-first visual design deliverable or design judgment: interactive prototype, slide deck, motion demo, infographic, dashboard, landing page, whitepaper, changelog, business card, social cover, brand system, design critique, multi-variant exploration, or export to MP4, GIF, PPTX, PDF, or SVG. It is optimized to make AI agents do the routing, template selection, verification, and export prep so humans spend less time prompt-engineering. Do not use for production web apps, SEO sites, backend systems, or pure copy edits." }