enhance-prompt

Enhance vague UI ideas into structured prompts with design system context.

2|Updated Jan 5, 2024
One-click install
npx skills add https://github.com/wilfriedago/dotfiles --skill enhance-prompt-wilfriedago
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: enhance-prompt
Source: https://github.com/wilfriedago/dotfiles/tree/main/agents/skills/enhance-prompt
Command: npx skills add https://github.com/wilfriedago/dotfiles --skill enhance-prompt-wilfriedago

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill transforms vague or incomplete UI generation ideas into detailed, structured prompts optimized for AI generation tools like Stitch, ensuring better and more consistent design outputs.

Core Features & Use Cases

  • Prompt Refinement: Enhances prompts by adding missing UI/UX keywords, design system context, and structural elements.
  • Design System Integration: Incorporates color palettes, typography, and component styles from a DESIGN.md file for consistency.
  • Use Case: A user provides a basic idea like "create a login page." This Skill expands it into a prompt specifying layout, colors, components (like input fields and buttons), and a clear structure, leading to a much more accurate AI-generated design.

Quick Start

Use the enhance-prompt skill to refine the idea "make a settings page".

Frequently Asked Questions about enhance-prompt

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I write better prompts for AI UI generation?

Better AI UI generation prompts require enhancing specificity by adding missing UI/UX keywords, page structure, and visual style. Transforming vague ideas into detailed prompts ensures improved and consistent design outputs from tools like Stitch.

How do I integrate a design system into my AI generation prompts?

You integrate a design system into AI generation prompts by injecting context from a DESIGN.md file. This incorporates specific color palettes, typography, and component styles into the prompt to ensure visual consistency across generated UI elements.

Can I use vague UI ideas to generate structured design outputs?

Yes, you can use vague UI ideas to generate structured design outputs by applying an enhancement pipeline. The system analyzes your input for missing elements like layout and colors, then expands the basic idea into a structured, optimized prompt.

What UI and UX keywords should I add to my Stitch prompts?

You should add UI and UX keywords related to platform, page type, layout structure, visual style, and colors to your Stitch prompts. Adding these missing elements ensures the AI receives a complete structural definition for accurate generation.

Does prompt engineering work for generating UI design systems?

Prompt engineering works for generating UI design systems by structuring the output with specific design context. It ensures the AI applies defined color palettes, typography, and component styles rather than generating random interface variations.

Why does my AI generated UI lack consistency across different pages?

AI generated UI lacks consistency because prompts often miss design system context. By integrating a DESIGN.md file and injecting specific UI/UX keywords into your prompts, you ensure the AI applies uniform color palettes and component styles.