Designer

What This Skill Does

The Designer skill is a comprehensive toolkit for AI-driven visual creation, focused on establishing professional-grade branding and user-centric interfaces. It embeds a rigorous set of design principles—ranging from the 60-30-10 color rule to responsive 8px grid layouts—directly into your agent's creative workflow. Whether you are generating high-fidelity logo concepts, defining a cohesive design system, or architecting intuitive web layouts, this skill ensures that every output adheres to modern UX/UI standards. It prioritizes readability, accessibility, and visual harmony, ensuring that the visual assets you create are not just aesthetically pleasing but technically robust and scalable.

Installation

To integrate this professional design capability into your agent, run the following command in your terminal:

clawhub install openclaw/skills/skills/ivangdavila/designer

Use Cases

• Brand Development: Creating logo variants that maintain legibility at 16px while retaining high-end appeal at larger scales.
• Interface Design: Structuring dashboard or landing page layouts using established hierarchy principles to guide user attention.
• Accessibility Auditing: Evaluating color palettes for 4.5:1 contrast compliance and checking for colorblind inclusivity.
• Design System Documentation: Creating reusable component libraries with functional naming conventions (tokens) to ensure consistency across complex projects.
• Rapid Prototyping: Generating wireframes that follow mobile-first responsive design rules, ensuring touch targets and spacing are optimized for real-world usage.

Example Prompts

1. "Design a modern, minimalist logo for a fintech startup named 'LedgerFlow' that works in monochrome and maintains clarity at a 16px favicon size."
2. "Create a mobile-first dashboard layout for an analytics app, adhering to an 8px grid and ensuring all interactive elements meet the 44px touch target requirement."
3. "Review this color palette [Insert Colors] for accessibility; ensure it follows the 60-30-10 rule and maintains a 4.5:1 contrast ratio for body text."

Tips & Limitations

• Always iterate: Use the 'Five users test 80%' rule—prototype early and gather feedback rather than seeking the 'perfect' design on the first pass.
• Context matters: When requesting designs, always specify the medium (e.g., mobile app, billboard, print). The agent's output will adjust based on these constraints.
• Beyond pixels: The skill is a guide; always review the final build. The best design lives in the implementation, not just the static mockup. Remember that this skill excels at providing structure and principles, so provide as much context regarding your brand personality as possible to get the best results.