Design and implement microinteractions, motion design, transitions, and user feedback patterns. Use when adding polish to UI interactions, implementing loading states, or creating delightful user experiences.
日本語の概要は準備中です。原文の説明を表示しています。
13 件 ・ 関連度順
概要と使いどころ
Design and implement microinteractions, motion design, transitions, and user feedback patterns. Use when adding polish to UI interactions, implementing loading states, or creating delightful user experiences.
日本語の概要は準備中です。原文の説明を表示しています。
Critique a rendered screen's density — cognitive load, content prioritisation, scanning patterns, and progressive disclosure. Use when a screen feels overwhelming. For the underlying choice-count principle, use `hicks-law` (interaction-design).
日本語の概要は準備中です。原文の説明を表示しています。
Critique a rendered screen's affordances — what looks clickable, state visibility, CTA clarity, and action discoverability. Use when reviewing an existing screen. For sizing and positioning targets in new work, use `fitts-law` (interaction-design).
日本語の概要は準備中です。原文の説明を表示しています。
Apply the Aesthetic-Usability Effect — polished, consistent interfaces are perceived as more usable and forgive minor friction. Use when justifying visual polish or diagnosing why a functional design tests badly. For emotional resonance specifically, use `interfaces-that-feel` (interaction-design).
日本語の概要は準備中です。原文の説明を表示しています。
Design to iOS and Android conventions — what each OS mandates, where they diverge, and when to unify. Use when shipping native apps. For breakpoint adaptation use `responsive-design`; for matching competitor patterns use `jakobs-law` (interaction-design).
日本語の概要は準備中です。原文の説明を表示しています。
Compare UX patterns, features, strengths, and gaps across rival products. Use when you need to know what others actually do. For deliberately adopting their conventions, use `jakobs-law` (interaction-design).
日本語の概要は準備中です。原文の説明を表示しています。
Design content structure, hierarchy, labelling, and the navigation model. Use when organising what exists. For the UI that exposes it use `navigation-patterns` (interaction-design); for user-generated grouping evidence use `card-sort-analysis` (design-research).
日本語の概要は準備中です。原文の説明を表示しています。
Define motion tokens — durations, easing vocabulary, and reduced-motion handling — for consistency product-wide. Use when standardising motion across a system. For crafting one specific animation, use `animation-principles` (interaction-design).
日本語の概要は準備中です。原文の説明を表示しています。
Generates several distinct, clickable HTML interaction prototypes for one product surface into a Design Board and collects selection/remix feedback before implementation. Use for multiple UI versions, interaction alternatives, progressive-disclosure options, or when styling is fine but hierarchy/workflow/interaction feels off. Not for static visual-style calibration (use design-style-picker) or a settled CSS tweak.
日本語の概要は準備中です。原文の説明を表示しています。
Designs user flows, interaction states and mockups for a defined product scope; does not implement UI code.
日本語の概要は準備中です。原文の説明を表示しています。
Creates intuitive user experiences through feedback patterns, microinteractions, and accessible interaction design. Use when designing loading states, error handling UX, animation guidelines, or touch interactions.
日本語の概要は準備中です。原文の説明を表示しています。
Use when designing interface states, feedback, hover/focus/press, gestures, direct manipulation, navigation transitions, loading/error/empty behavior, or deciding where interaction should carry the design concept.
日本語の概要は準備中です。原文の説明を表示しています。
Design low-friction UX, interaction patterns, and comeback loops for AI coding assistant apps, agent consoles, background coding agents, and Port Daddy swarm/operator surfaces. Use when creating flows like prompt-to-diff, context attach, plan/apply/review, checkpoint rollback, background-agent dashboards, visual proof, or multi-agent invocation. NOT for generic landing pages, static dashboards, or implementation-only changes without product flow.
日本語の概要は準備中です。原文の説明を表示しています。