Generate MDX mockups with embedded data and frontmatter from user stories.
npx skills add https://github.com/jcteague/wheelbase --skill mockup-jcteague
Please help me install this Agent Skill. Skill: mockup Source: https://github.com/jcteague/wheelbase/tree/main/.claude/skills/mockup Command: npx skills add https://github.com/jcteague/wheelbase --skill mockup-jcteague
This skill should be used when the product-owner skill has just produced a user story, when the user asks to "create a mockup", "generate a mockup for this story", "mockup this feature", or "visualize this user story". Produces a self-contained MDX mockup file using project components first, shadcn/ui primitives second, delegating visual design to the frontend-design skill.
Use the mockup skill to generate an MDX mockup for a given user story.
High-intent search queries and answers about installing and using this skill.
To generate a UI mockup from a user story, provide the story text to produce a self-contained MDX file. The output includes YAML frontmatter, acceptance criteria sections, and embedded JSX with hardcoded data saved to mockups/{story-slug}.mdx.
Visualizing user stories for frontend development is best achieved by generating self-contained MDX mockups. These files embed hardcoded data and JSX components directly, ensuring a static visual representation without live data or external fetches.
Yes, you can use shadcn/ui components when creating MDX mockups. The generation process applies your existing project components first, then falls back to shadcn/ui primitives for UI scaffolding.
Creating self-contained UI mockups with hardcoded data involves generating an MDX file that embeds all content directly. This ensures no live data or external fetches are needed, producing a static visual representation of the feature.
Frontend design requires a separate tool after generating MDX mockups, as visual design is delegated to the frontend-design skill. The mockup generation focuses on structural scaffolding using project components and shadcn/ui primitives.
Lev-itGenerate structured user stories with 3C and INVEST criteria.
shenxingyCreate production-grade frontend interfaces with token-based styling and SEO.
Intense-VisionsGenerate structured product specifications with EARS acceptance criteria from GitHub issues.
partme-aiGuide Axure RP prototyping for wireframes, interactions, and dynamic panels.
