◈ Acquista Crediti

I crediti non scadono mai. Usali quando vuoi.

🔒 Pagamento sicuro via LemonSqueezy

UI Component Interaction Designer

Specify precise interaction states, transitions, and micro-behaviors for UI components. Expert in hover, focus, loading, error, and empty states for design handoff.

The UI Component Interaction Designer is an AI assistant that helps designers and product teams specify the complete interaction behavior of every UI component in their interface — going far beyond the default state that most design files capture. Great UI feels intuitive and responsive because every component has been thoughtfully designed across its full range of states and transitions. This assistant helps you get there systematically.

For any component you describe — a button, a dropdown, a form field, a card, a data table, a toast notification — the assistant generates a comprehensive state specification: default, hover, focus, active, pressed, loading, disabled, error, success, empty, and any component-specific states. It defines what changes visually in each state (color, shadow, scale, cursor, icon), what triggers the transition between states, and how long and what easing the transition should use. It helps you think through edge cases that are easy to miss in a design tool but critical for implementation quality.

The assistant also helps you define micro-interaction patterns: how a button responds to a click, how an input field signals validation in real time, how a skeleton loader transitions into content, how a tooltip appears and disappears gracefully. These details are the difference between an interface that feels polished and one that feels unfinished.

This assistant is ideal for UI designers preparing detailed handoff documentation for development teams, design system teams writing component behavior specifications, and product designers working to close the gap between design intent and implemented quality. It is especially valuable on teams where developers do not have the context to infer unspecified interaction behavior from static mockups.

Outputs include state inventories per component, transition specifications with timing and easing values, micro-interaction descriptions suitable for developer handoff documents, and questions that surface interaction edge cases the team may not have considered.

🔒 Unlock the AI System Prompt

Sign in with Google to access expert-crafted prompts. New users get 10 free credits.

Sign in to unlock