adapt

Overview of adapt skill

What adapt does

The adapt skill helps you redesign an existing UI for a different context: mobile from desktop, tablet from phone, print from web, touch from mouse-first, or any other platform shift where the original assumptions no longer hold. In practice, adapt is not just about breakpoints. It is a structured workflow for rethinking layout, interaction, density, navigation, and task flow when the target device or usage context changes.

Who should use adapt

This skill is best for designers, PMs, and AI-assisted builders working on UI/UX design changes across devices or platforms. If you already have a design direction and need to make it work in another context, adapt is a better fit than a generic design prompt because it explicitly asks for source assumptions, target constraints, and adaptation tradeoffs.

The real job-to-be-done

Most users looking for adapt for UI/UX Design are trying to answer a practical question: “How should this existing interface change for a different device or context without losing usability?” The skill is built for that decision. It helps turn a vague request like “make this responsive” into a concrete adaptation plan tied to device type, input method, screen limits, and real usage conditions.

What makes adapt different

The biggest differentiator is that adapt starts with context gathering, not solution dumping. The upstream skill requires prior design context from /frontend-design, and if that context does not exist yet, it tells you to run /teach-impeccable first. That makes the skill more opinionated than ordinary prompts, but also more reliable for non-trivial adaptations where layout, interaction, and user expectations all change together.

Best-fit and poor-fit cases

Use adapt skill when:

• you are moving a known UI to a new device or platform
• you need help identifying what should change versus stay stable
• responsive behavior, touch targets, navigation, or density are core concerns

Do not expect strong results if:

• you provide no source design description
• you have not clarified the target context
• you really need net-new product design, not adaptation of an existing interface

How to Use adapt skill

Install context and where adapt lives

The adapt skill is part of the pbakaus/impeccable repository under .agents/skills/adapt. If your environment supports skill installation from GitHub, use your normal skill install flow for that repo and skill slug. The baseline example is:

npx skills add pbakaus/impeccable --skill adapt

If your agent already has the repo or bundled skills available, you may only need to invoke the skill by name.

Read this file first

Start with:

• .agents/skills/adapt/SKILL.md

This skill has no extra scripts, references, or helper assets in the provided tree, so nearly all of the practical guidance is in SKILL.md. That is good for quick evaluation: low setup overhead, but less built-in automation.

Mandatory dependency before using adapt

A key adoption detail: adapt is not meant to run in isolation. The skill explicitly says to invoke /frontend-design first because it contains design principles, anti-patterns, and the Context Gathering Protocol. If no design context exists yet, you are instructed to run /teach-impeccable before proceeding.

That means your effective adapt install decision is really about workflow fit:

• Are you willing to use the broader impeccable design system?
• Do you want structured design context before adaptation work?
• Can your agent invoke related skills in sequence?

If not, the skill may feel stricter than a one-shot prompt.

What input adapt needs

To use adapt skill well, provide these inputs up front:

• source context: what the current design was made for
• target context: device, platform, or medium you are adapting to
• input method: touch, mouse, keyboard, voice, remote, etc.
• screen constraints: size, orientation, density, viewport limits
• usage context: quick glance, deep work, on-the-go, low bandwidth
• current pain points: what breaks or degrades today
• must-preserve elements: tasks, brand patterns, navigation model, hierarchy

Without these, the skill can only produce generic responsive advice.

How to phrase an adapt request

The skill exposes an argument hint:

[target] [context (mobile, tablet, print...)]

A weak request:

• Use adapt on this dashboard

A stronger request:

• Use adapt for our analytics dashboard from desktop web to mobile touch. Preserve core reporting tasks, quick KPI scanning, and drill-down access. Assume portrait phone, intermittent mobile connection, and one-handed use.

The stronger version works because it gives the skill a source, a target, constraints, and success criteria.

Turn a rough goal into a complete prompt

For better adapt usage, structure your prompt like this:

1. Describe the current interface
2. State the new context
3. Name key tasks users must still complete
4. State environmental constraints
5. Ask for tradeoffs, not just layout changes

Example:

“Use adapt for UI/UX design. We have a desktop SaaS settings page with left-nav, dense forms, inline help, and comparison tables. Adapt it for tablet and mobile touch use. Users mainly update profile, billing, team roles, and API keys. Preserve security-critical clarity. Assume portrait-first mobile, occasional poor connection, and shorter sessions. Recommend what to collapse, reorder, paginate, or defer.”

What adapt is likely to analyze

Based on the skill text, adapt is designed to assess:

• original design assumptions
• target device and usage expectations
• interaction differences between contexts
• adaptation challenges and tradeoffs

Expect the most value when the context shift changes more than viewport size. For example, desktop-to-mobile touch, web-to-print, or mouse-first to keyboard-first are stronger fits than “make this page slightly narrower.”

Practical workflow that reduces guesswork

A reliable workflow for adapt guide usage:

1. Run /frontend-design
2. Gather or create design context with /teach-impeccable if needed
3. Summarize the current UI in task terms, not just visual terms
4. Invoke adapt with target context and constraints
5. Review the proposed changes for preserved tasks, not just aesthetics
6. Re-run with clarified priorities where the first pass is too generic

This sequence matters because adaptation quality depends heavily on whether the agent understands the original design intent.

What users care about most in output quality

Good adapt output should tell you:

• what assumptions in the original design no longer hold
• what must be redesigned versus merely resized
• how input method changes interaction design
• how information hierarchy should shift
• what to simplify, hide, or move for the new context

If the output only talks about breakpoints and flexible grids, you are not getting the full value of the skill.

Where adapt is especially useful for UI/UX Design

adapt for UI/UX Design is particularly helpful for:

• desktop admin tools moving to mobile access
• feature-rich web apps adapting to tablet workflows
• interfaces needing touch target and density changes
• layouts that must support different attention spans or connection quality
• platform shifts where user expectations differ, not just screen size

adapt skill FAQ

Is adapt just a responsive design prompt

No. adapt covers responsive design, but its actual scope is broader: device context, input method, platform expectations, and usage conditions. It is more useful when the adaptation problem involves behavior and task flow, not just CSS layout changes.

Is adapt beginner-friendly

Reasonably, but only if you can describe the current design clearly. The skill is structured, which helps beginners avoid shallow “make it mobile-friendly” requests. The main hurdle is that it expects upstream context from /frontend-design, so total beginners may need to learn that workflow first.

When should I not use adapt

Do not use adapt skill when you are inventing a product from scratch, choosing a visual style, or asking for generic UI inspiration. It is strongest when there is an existing interface to adapt and a concrete target context to design for.

How is adapt different from ordinary prompting

A normal prompt often jumps straight to solutions. adapt forces a more disciplined path: identify source assumptions, define the target context, and reason about what must change. That usually produces fewer surface-level recommendations and better design tradeoffs.

Does adapt include code or implementation assets

From the provided repository evidence, no. The skill appears to be guidance-only, with SKILL.md as the main asset and no supporting scripts or references in this skill folder. That keeps it easy to inspect, but it also means you should not expect automated implementation scaffolding.

Is adapt only for mobile

No. The argument hint and skill text cover mobile, tablet, print, and other contexts. You can use adapt for any meaningful environment shift where layout, input, or user behavior changes.

How to Improve adapt skill

Give better source-context descriptions

The fastest way to improve adapt results is to describe the current interface in terms of:

• primary user tasks
• layout structure
• interaction patterns
• pain points
• assumptions the current design makes

For example, “dense table with hover actions and side-by-side filters” is more useful than “dashboard page.”

Specify target constraints, not just target device

“Mobile” is too broad. Better inputs include:

• portrait phone
• one-handed use
• touch-only
• weak connection
• short sessions
• outdoor glare
• keyboard access required

These details change what the skill should recommend.

Ask for preserved priorities

Tell adapt what cannot break:

• critical workflows
• visibility of key information
• compliance or security clarity
• navigation discoverability
• comparison ability
• editing efficiency

This helps the skill make better tradeoffs when space or interaction limits force simplification.

Watch for the most common failure mode

The main failure mode is shallow adaptation: stacking columns, shrinking cards, and calling it done. If the first output feels like generic responsive advice, ask the skill to revisit:

• changed user intent in the new context
• removed desktop assumptions
• navigation restructuring
• interaction redesign for the target input method

Ask for decisions, not just ideas

To get more useful adapt guide output, ask questions like:

• What should be removed from the first screen?
• What should become progressive disclosure?
• Which tasks need a different flow on touch devices?
• What desktop patterns fail in the target context?

This pushes the skill toward actionable adaptation instead of broad principles.

Iterate with concrete artifacts after the first pass

After the first run, improve the result by pasting:

• a screen inventory
• a component list
• a rough wireframe description
• screenshots summarized in text
• current user complaints

The skill becomes much more specific when it can reason from actual interface structure rather than abstract product labels.

Use adapt alongside, not instead of, design judgment

The best use of adapt is as a structured reviewer and planner. It helps surface assumptions and redesign pressure points, but you should still validate the proposed changes against your product constraints, implementation cost, and user research. That is especially important when adapting complex enterprise or workflow-heavy interfaces.