Design An Interface

What it does

This skill generates multiple user interface mockups based on text descriptions, following a design philosophy that prioritizes iterative improvement and comparison. It leverages parallel sub-agents to produce radically different designs, then presents these options for evaluation. The goal is to synthesize the best possible interface by combining insights from various approaches, rather than relying on an initial idea.

When to use it

• Designing new modules or APIs where a well-defined interface is crucial.
• Exploring alternative design patterns and solutions for existing interfaces.
• When seeking to balance simplicity, flexibility, and implementation efficiency in an interface.
• To avoid settling on the first idea by generating multiple divergent options.

Key capabilities

• Generates multiple (3+) radically different UI designs concurrently using sub-agents.
• Provides detailed output for each design including: interface signature, usage example, internal hiding details and trade-offs.
• Facilitates comparison of designs based on criteria such as simplicity, general purpose nature, implementation efficiency, and depth.
• Supports constraint assignment to individual sub-agents (e.g., minimizing method count, maximizing flexibility).

Example prompts

• "Design an interface for a module that handles user authentication."
• "Generate designs for an API used by external developers to access product data."
• "Create multiple interfaces for a system responsible for processing image uploads."

Tips & gotchas

• Ensure you gather requirements (problem, callers, operations, constraints) before generating designs.
• The skill focuses on interface shape and design; it does not handle implementation details.
• Enforce radical differences between sub-agent designs to maximize the value of comparison.