interaction-design

Apply interaction-design principles to component behaviors, user flows, and accessibility.

5|2|Updated Jan 20, 2026
One-click install
npx skills add https://github.com/petekp/agent-skills --skill interaction-design-petekp
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: interaction-design
Source: https://github.com/petekp/agent-skills/tree/main/skills/interaction-design
Command: npx skills add https://github.com/petekp/agent-skills --skill interaction-design-petekp

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Designers need a robust framework to create intuitive interactions that align with user goals, reduce cognitive load, and improve accessibility.

Core Features & Use Cases

  • Direct manipulation patterns enable tangible interactions.
  • Accessibility & keyboard navigation guidelines ensure inclusive design.
  • Flow, feedback, and error prevention strategies support reliable experiences.
  • Use case: Example of modal and focus management in real-world scenarios.

Quick Start

Explain how to apply goal-directed design to a modal with accessible focus management and robust feedback.

Frequently Asked Questions about interaction-design

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

FAQPage Schema
How do I design accessible modal focus management and robust feedback for user flows?

Design accessible modal focus management by applying goal-directed design principles to ensure robust feedback and reliable user flow experiences. This approach validates user experience through comprehensive core patterns and direct manipulation strategies.

What is direct manipulation in interaction design and when should I use it?

Direct manipulation in interaction design enables tangible interactions that align with user goals and reduce cognitive load. Use it when designing component behaviors, touch interactions, and user flows across web and native platforms to improve accessibility.

Does this interaction design framework support keyboard navigation and touch interactions across web and native platforms?

Yes, this interaction design framework supports keyboard navigation and touch interactions across web and native platforms. It provides accessibility guidelines and comprehensive core principles to ensure inclusive, humane interfaces for component behaviors.

What's the best way to reduce cognitive load and prevent errors in user experience design?

Reduce cognitive load and prevent errors by applying flow, feedback, and error prevention strategies that support reliable experiences. This framework guides design decisions for loading states, transitions, and modal versus modeless interactions.

How do I validate user experience and iterate with user feedback for interaction design?

Validate user experience and iterate with user feedback by applying comprehensive measurement approaches and core interaction design principles. This framework guides design decisions for component behaviors, user flows, and feedback systems across platforms.

When should I use modal versus modeless interactions in web and native applications?

Use modal interactions when you need to manage focus and require explicit user action, while modeless interactions allow concurrent tasks. This framework provides real-world scenarios and accessible focus management guidelines for these decisions.