Skill

Design Fluid Interfaces

Shape interaction as a continuous exchange between person and interface.

Use in Claude Code
/cupertino-taste:design-fluid-interface

Treat interaction as a continuous exchange optimized for control, continuity, and clear intent, with motion as supporting evidence. Trace each action through cue, contact, recognition, tracking, commitment, release, settlement, and escape, then evaluate it through response, agency, continuity, intent, feedback, character, and comfort. Never invent numeric motion values; keep parameters symbolic and tune in prototype.

Key Insights

Evidence-Calibrated Findings

Classify what each artifact can prove—from static image to runnable prototype to real device—and deliver only the partial result the evidence supports, separating confirmed findings, hypotheses, and runtime checks.

Full Interaction Lifecycle

Map every important action through cue, contact, recognition, tracking, commitment, release, settlement, and escape as a compact state/transition table rather than a list of animation durations.

Seven Fluidity Lenses

Evaluate traced paths against response, agency, continuity, intent, feedback and teaching, character, and comfort and reach—covering cancellation, interruption, retargeting, and Reduce Motion meaningfully.

No Invented Motion Values

Use only project, system, documentation, or measured-prototype values; otherwise name parameters symbolically and mark them tune in prototype, so guidance never ships fabricated thresholds or stale APIs.

How It Works

1

Establish the task

Follow the user's verb to set review, design, or implement mode.

Determine platform, framework, inputs, goals, states, outcomes, and cancellation paths; infer from the project and ask one focused question only when a missing choice would materially change behavior.

2

Read required references

Load fluid principles and current Apple guidance first.

Read fluid-principles.md and current-apple-guidance.md before recommending; current Apple documentation overrides the 2018 session examples.

3

Calibrate the evidence

Classify what the artifact can actually prove.

Map static image, spec, source, recording, runnable prototype, or real-device evidence to the claims it supports; distinguish symptoms from observed behavior and label causes as hypotheses until confirmed.

4

Map and judge the interaction

Trace the lifecycle and apply the fluidity lenses.

Represent nontrivial interactions as state/transition tables and evaluate each path through response, agency, continuity, intent, feedback, character, and comfort lenses.

5

Produce and verify the result

Deliver review, design, or implementation per the verb.

Lead with highest-impact findings or deliver a full spec with prototype scenarios; keep parameters symbolic when no numeric evidence exists and exercise the interaction through its runnable interface when available.