adapt

Transform design systems for mobile, tablet, desktop, and print contexts.

Updated Mar 29, 2026

Search Tags:#cross-device #design-principles #breakpoints #responsive-design #mobile-design #adapt #context-gathering

Ready to run

npx skills add https://github.com/kihyun1998/just-make-logo-web --skill adapt-kihyun1998

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: adapt
Source: https://github.com/kihyun1998/just-make-logo-web/tree/main/.claude/skills/adapt
Command: npx skills add https://github.com/kihyun1998/just-make-logo-web --skill adapt-kihyun1998

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Adapt designs to work across different screen sizes, devices, or contexts by applying adaptive strategies.

Core Features & Use Cases

Breakpoints and fluid layouts to maintain consistency across devices
Touch targets and accessibility considerations for mobile and beyond
Context gathering and adaptation planning to tailor design directions
Use cases include designing for mobile apps, responsive websites, and multi-device workflows

Quick Start

Provide a context-aware adaptation plan for mobile, tablet, and desktop contexts.

Frequently Asked Questions about adapt

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

FAQPage Schema

How do I adapt a design for mobile, tablet, and desktop screen sizes?▼

Responsive design maintains visual consistency across devices by using breakpoints and fluid layouts. Touch target sizing and accessibility considerations are then applied to ensure the interface remains usable on mobile, tablet, and desktop contexts.

What is the best way to plan a responsive layout for a multi-device workflow?▼

Planning a responsive layout requires context gathering to define adaptation strategies for each target device. This produces a tailored design direction specifying when to apply breakpoints, fluid layouts, and touch targets across the product workflow.

When should I apply breakpoints in cross-device design adaptation?▼

Breakpoints are applied during cross-device design adaptation when layout transformations are needed to fit mobile, tablet, or desktop contexts. Context gathering identifies the specific screen widths where structural changes ensure usability and accessibility.

Does responsive design planning include accessibility and touch target validation?▼

Responsive design planning includes accessibility and touch target validation as explicit steps in the adaptation workflow. This ensures touch targets meet accessibility requirements and interfaces remain usable across mobile and multi-device contexts.

Can I use this approach to adapt interface prototypes for print contexts?▼

You can adapt interface prototypes for print contexts using this approach. The adaptation strategy outlines how to transform design systems to fit print alongside mobile, tablet, and desktop, ensuring layout consistency across all specified mediums.