← Back to article

13 motion studies

AI interface animations

Thinking, streaming, generating, and planning — the states Gemini, ChatGPT, Claude, Perplexity, and Cursor actually use.

Cogitating…

Claude Cogitating Starburst

Claude · Loading

Thinking

Gemini Thinking Sparkle

Gemini · Loading

ChatGPT Thinking Dots

ChatGPT · Loading

Searching…

Perplexity Search Orbit

Perplexity · Loading

Streaming a living answer…

Gemini Aurora Text

Gemini · Text

ChatGPT Streaming Caret

ChatGPT · Text

Theanswerarrivesonethoughtatatime.

Claude Word Reveal

Claude · Text

Creating image…

Perplexity Image Matrix

Perplexity · Image gen

Generating image

ChatGPT Image Shimmer

ChatGPT · Image gen

Gemini Image Atmosphere

Gemini · Image gen

Generating video

Gemini Video Storyboard

Gemini · Video gen

Planning next move…
  • Read the current file
  • Plan the animation pipeline
  • Verify the motion timing

Cursor Planning Next Move

Cursor · Agent / IDE

const fade = useSpring().fadeIn()Tab

Cursor Ghost Completion

Cursor · Agent / IDE