adapt

Name: adapt
Availability: InStock
Author: raphaelmans

Create context-driven UI adaptation plans with responsive layouts and interaction changes.

Updated Feb 28, 2026

Search Tags:#design #usability #interaction #adaptation #responsive-design #cross-context

Ready to run

npx skills add https://github.com/raphaelmans/agent-skills --skill adapt-raphaelmans

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: adapt
Source: https://github.com/raphaelmans/agent-skills/tree/main/adapt
Command: npx skills add https://github.com/raphaelmans/agent-skills --skill adapt-raphaelmans

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Adapt existing designs to work effectively across different contexts - different screen sizes, devices, platforms, or use cases.

Core Features & Use Cases

Mobile Adaptation: Layout and interaction adjustments for small screens and touch-first devices.
Tablet/Desktop Adaptation: Multi-column layouts, side panels, and grid-based responsiveness to leverage larger displays.
Content & Navigation: Progressive disclosure, accessible targets, and context-appropriate navigation patterns.

Quick Start

Provide a context-driven adaptation plan for a given UI by outlining responsive layouts, interaction changes, and content adjustments.

Frequently Asked Questions about adapt

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

FAQPage Schema

How do I adapt my UI design for different screen sizes and devices?▼

To adapt your UI design, apply responsive breakpoints, multi-column layouts for larger displays, and progressive disclosure for small screens to ensure effective cross-context usability.

What is cross-context UI adaptation?▼

Cross-context UI adaptation is adjusting layouts, interactions, and navigation so a single design functions effectively across mobile, tablet, desktop, print, and email environments.

How do I implement responsive design for mobile and tablet interfaces?▼

Implement responsive design by defining breakpoints, optimizing touch targets for mobile, and utilizing grid-based multi-column layouts to leverage the larger display space of tablets.

Does this adaptation approach work for print and email contexts?▼

Yes, cross-context adaptation applies to print and email by generating concrete layout adjustments and content strategies tailored for those specific output formats.

What's the best way to adjust navigation patterns for touch-first devices?▼

The best way to adjust navigation for touch devices is implementing context-appropriate patterns with accessible touch targets and progressive disclosure to manage content visibility.

When do I need progressive disclosure in responsive design?▼

You need progressive disclosure when adapting content for small screens, allowing users to access complex information sequentially without overwhelming the limited display area.