Skip to content

[Feature]: unify motion design across desktop interactions #518

Description

@hiqiancheng

Problem statement

TouchAI desktop interactions use a mix of Tailwind defaults, hardcoded CSS durations/easings, Vue transitions, and motion-v springs. Similar controls respond differently, many state changes have no feedback, reduced-motion handling is inconsistent, and several existing animations feel web-like rather than native.

Proposed solution

Introduce a shared semantic motion scale for the desktop UI, normalize existing animation timing, and add restrained feedback to high-value interactions across Search, Popup, Settings, Tray, and shared controls. Cover anchored menus, dialogs, collapsible content, tabs, icon/state swaps, loading/progress, hover/focus/pressed feedback, and success/error states where the action benefits from confirmation.

Every animation must be scoped to specific properties, avoid layout thrash, preserve keyboard and ARIA behavior, honor prefers-reduced-motion, and avoid route fades, animated native window resizing, decorative bounce, or motion on streaming text.

Alternatives considered

  1. Keep component-local durations: smallest diff, but preserves inconsistency and makes accessibility hard to audit.
  2. Add a new animation library everywhere: creates unnecessary bundle and runtime cost because motion-v and CSS already cover the required cases.
  3. Animate all state changes uniformly: broad coverage, but harms native feel and over-animates frequent interactions.

Main area

frontend

Risk boundaries

No AgentService, conversation runtime, tool execution, session persistence, MCP, or database schema changes.

Mockups, screenshots, or examples

Use the transitions.dev motion-token semantics as the timing vocabulary while adapting behavior to TouchAI's native desktop interaction model.

Metadata

Metadata

Assignees

No one assigned

    Labels

    area:frontendFrontend UI or view-layer changeskind:featureProduct or workflow improvementstatus:triageNeeds maintainer triage

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions