The Short Answer
For a tech or SaaS company, the brand is not primarily encountered on packaging or in print. It is encountered in an interface, thousands of times, by people who are trying to get something done. Everything in that interface moves — panels open, states change, data loads, errors arrive — and how it moves communicates something about you whether or not anyone designed it.
Motion branding is the decision to design that rather than inherit it from framework defaults. It is cheaper than most companies expect and does more than a launch film.
Why Software Brands Are Different
A consumer goods brand is seen for a moment on a shelf. A software brand is used for forty minutes a day. That inverts the usual priorities of identity work.
The logo matters less than you would think, because it sits in a 32-pixel corner the user stopped noticing in week one. What they do notice, without being able to name it, is whether the product feels responsive or laggy, deliberate or arbitrary, calm or twitchy. Those impressions come almost entirely from timing and easing — and in most products they were never chosen, they are the default values of whatever component library was installed.
The Four Places Motion Earns Its Cost
- Interface response. The unglamorous majority. Menus, modals, toggles, tab changes, validation. Consistent timing here is what makes a product feel like one product rather than several teams' work stapled together.
- Onboarding and empty states. The moments where a new user has nothing to look at and every reason to leave. Motion carries attention across the gap between signing up and having something worth seeing.
- The marketing site. Where a product that cannot be touched has to be demonstrated. Scroll-driven sequences and interface animation do the work a photograph does for a physical product. We have covered how to build these without wrecking Core Web Vitals.
- Sales and lifecycle assets. Demo loops, release notes, in-app announcements, conference screens. These multiply once a motion system exists, because each one stops being a bespoke project.
Timing and Easing Are Brand Properties
Two products can use identical colours and typefaces and feel completely different because one settles into place and the other snaps. Motion carries personality more reliably than palette does, and it is far less contested internally because nobody has an opinion about a cubic-bezier curve at a board meeting.
A usable motion language is small. Most products need three or four durations and three easing curves with clear jobs.
| Token | Typical value | Used for |
|---|---|---|
| Instant | 100 – 150ms | Hover states, toggles, anything the user is waiting on to feel direct. |
| Standard | 200 – 300ms | The default. Panels, dropdowns, tab transitions, most state changes. |
| Deliberate | 350 – 500ms | Full-screen transitions, first-run moments, anything meant to be noticed once. |
| Expressive | 600ms+ | Marketing surfaces only. Never inside a tool people use daily. |
The single most common mistake in product motion is using marketing durations inside the application. Motion that reads as premium in a launch film reads as slow on the two-hundredth repetition, and the user cannot articulate why the product annoys them.
The Performance Budget
Motion has a cost measured in milliseconds of main-thread work, and the interactions users notice most are the ones competing with it.
- Animate transform and opacity. These are handled by the compositor. Animating width, height, top, or margin forces layout recalculation on every frame.
- Do not animate during input. Anything running while a user is typing or scrolling shows up directly in Interaction to Next Paint.
- Honour reduced motion. A prefers-reduced-motion fallback is an accessibility requirement, not a nicety, and it belongs in the specification rather than being added later.
- Budget the weight. A Lottie file is usually a fraction of the equivalent video, but a complex one still costs parse time. Our comparison of animation file formats covers where each one belongs.
What to Produce First
In order, for a team that has not done this before.
- A motion specification. Durations, easing curves, entrance and exit patterns, choreography rules, reduced-motion behaviour. Delivered as tokens a developer implements, not as a video. Two to three weeks, and it immediately improves everything already built.
- A loading and skeleton language. Every product spends real time waiting on data. That interval is currently either a spinner nobody chose or nothing at all, and it is one of the most-seen moments in the product.
- Three or four marketing sequences. Hero, one feature demonstration, one transition between sections. Built on the same tokens so the site and the product feel continuous.
- A logo and identity motion. Last, not first. It is the most requested and the least used.
That order is deliberately the reverse of how most companies buy motion. The logo animation is tangible and easy to approve; the specification is abstract and does ten times the work.
How to Tell Whether It Worked
The honest test is not whether anyone compliments the animation. Nobody compliments good interface motion, in the same way nobody compliments a door that opens smoothly. The signals are indirect: whether new interface work now feels consistent without anyone policing it, whether the marketing site and the product read as the same company, and whether the team has stopped debating transition timings in code review because the answer is already written down.
If your product currently moves in whatever way its component library moves, there is a considerable amount of brand sitting unclaimed. Show us the product and we will tell you which of the four items above is worth doing first.