skills.rest
kihyun1998
kihyun1998COMMUNITY
Explore all skills by this author →
Website𝕏@kihyun1998GitHub

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
One-click install
npx skills add https://github.com/kihyun1998/just-make-logo-web --skill adapt-kihyun1998
Or copy as Structured Prompt for Agent▼
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.

Related Skills

Explore More Design & Creative Skills→
ydnikolaevydnikolaev
8

idea-interview

Extract project information through structured stakeholder interviews into a discovery brief.

Community
Advanced
adperemadperem

adapt

Plan responsive design adaptations across mobile, tablet, desktop, and print contexts.

Community
Advanced
Camilo8902Camilo8902

responsive-design-system

Implement mobile-first responsive design systems with Tailwind CSS breakpoints and fluid typography.

Community
Intermediate
HieubkavHieubkav

Frontend Responsive

Implement responsive mobile-first layouts with fluid containers, breakpoints, and touch targets.

Community
Basic