Generate HTML interface mockups for user stories with desktop and mobile parity.
npx skills add https://github.com/rakovi4/continue-framework --skill mockups-rakovi4
Please help me install this Agent Skill. Skill: mockups Source: https://github.com/rakovi4/continue-framework/tree/main/.claude/skills/mockups Command: npx skills add https://github.com/rakovi4/continue-framework --skill mockups-rakovi4
This Skill helps generate HTML interface mockups for user stories, enabling the creation of UI mockups, prototypes, or the use of the /mockups command.
/mockups command to generate mockups by story name, MVP number, or through interactive selection.To generate a mockup for a user story, use the command: /mockups "Story name"
High-intent search queries and answers about installing and using this skill.
To generate HTML mockups from user stories, use the /mockups command followed by the story name or MVP number. This initiates a structured workflow producing production-quality UI mockups with desktop and mobile parity.
The UI mockup workflow involves context gathering, story selection, completing a screen plan, mockup generation, taking screenshots, and a final summary. This structured process ensures predefined design conventions are correctly applied.
Yes, you can create prototypes with desktop and mobile parity. The mockup generation process inherently ensures that the HTML interface mockups adapt and maintain visual consistency across both desktop and mobile screen sizes.
Yes, you need to complete a screen plan before generating HTML mockups. The structured workflow requires this step to define the interface layout before producing the production-quality HTML mockups.
You can select specific user stories for UI mockup generation by using the /mockups command with the story name or MVP number, or by choosing stories through an interactive selection process during the workflow.
The best way to ensure production-quality HTML mockups is to follow the structured generation workflow and utilize predefined design conventions and templates. This guarantees consistency and desktop and mobile parity.
fleurytianTransform vague business issues into structured McKinsey-style analyses and PPT presentations.
hendrax5Create component-separated HTML/CSS/JavaScript mockups with JSON data for Next.js conversion.
dpieterszStandardize CSS practices across projects using Tailwind, BEM, and design tokens.
carlosamesarGenerate UI/UX prototypes from Figma designs or code snippets.