Back to Motion Prompt examples
Motion graphics moves · #06
Typewriter
Text appears one character at a time, as if typed. Text is typed into an input field one character at a time, then the send button lights up and is pressed.
Entrances & texttypewritertypingtextcursorinputpromptchattype-on
Full motion specification
How the movement works
Use it to show someone typing: a prompt, a search query, a chat message.
- 01One pass per 4.7 s. Nine characters appear in a white input field (471 × 92, radius 30), one every 0.24 s starting at 0.3 s (typing ends at 2.46 s).
- 02Each new character settles from scale 1.35 to 1: 1 + 0.35·e^(−16t).
- 03Cursor (coral, 5 × 44) sits after the last character: solid while typing, otherwise blinking with a 0.94 s period (on for 0.5 s).
- 04Send button (radius 30): grey, then a blue disc appears from 2.58 s with spring 1 − e^(−6.5t)·cos(15t).
- 05Press: the button shrinks by up to 20% at 2.96–3.21 s (half sine). At 3.13–3.41 s the text moves 70 px up while fading out.
- 06The cursor returns to the start once the text is half faded (about 3.27 s); at 3.51–3.81 s the blue fades.
Prompt
Show this sentence with a typewriter effect, 0.05 s per character, with a cursor at the end.