Motion Design

Prompting Motion

Static UIs are boring. In MockaUI, you can describe how things feel when they move. Use specific physics terms to get the perfect snappiness.

The Physics of Motion

Direct
150ms

Instant feedback for toggles and checkboxes.

Snappy
300ms

The gold standard for hover states and modal openings.

Smooth
500ms

Best for page transitions and large sliding panels.

Dramatic
800ms+

Attention-grabbing entrance for hero elements.

Interaction Triggers

Be specific about when an animation happens in your prompt:

On EntranceWhile loading the page.
"Add a staggered fade-in for all cards in the grid."
On HoverUser interaction.
"When I hover, lift the card and add a bright outer glow."
On ScrollRevealing content.
"Slide section from bottom as user reaches the fold."

Advanced Effects

Describe the style of motion using these advanced phrases:

Floating / Levitation
Parallax layers
Pulse / Heartbeat
Text Gradient Wave
Skeleton Loading
Blur-in reveal
Pro Vocabulary

Instead of "move," use: Glide, Impact, Burst, Drift, or Snap.

A Note on Accessibility

Too much motion can make users feel physically ill (vestibular issues). MockaUI supports prefers-reduced-motion by default, but it's your job to keep transitions purposeful. If an animation doesn't help the user understand the UI, delete it.