The range of motion work
Projects often combine several:
- Interface motion. How elements enter, exit, respond and transition, kept small and fast.
- Motion graphics. Animated type, shapes and illustration for explainers, social, presentations and venue screens.
- 3D animation. Modelled scenes, products and environments for campaigns, landing pages and large displays.
- Live-action video. Filmed content, with production scaled to the moment.
- Generative and variable video. Many variations from one system, for different formats, audiences or data.
What connects them is time: the order people see things in, for how long, and how one becomes another.
Motion in interfaces
Good interface motion goes unnoticed: the product just feels clear and responsive.
Interface motion has four jobs:
- Shows cause and effect. A tap gets a response, so you know it registered.
- Explains change. Shows where moving or changing content came from and went.
- Directs attention. A subtle movement draws the eye to what matters now.
- Carries personality. How things ease and settle is as much brand as colour.
Motion principles (durations, easing curves, transition patterns) live in the design system, so motion stays consistent and gets built correctly. Reduced-motion settings are respected, with fades or instant changes instead.
Motion-led layouts, animated masks and scroll-driven sequences can give a whole site a premium feel, if they stay fast and never block what people came for.
Motion graphics and animation
An explainer can make a complicated idea simple in thirty seconds, a loop can set a landing page’s mood, and big-screen graphics can turn a pause in an event into a moment people remember.
We design from the concept outward: what the piece needs to say, where it’s seen, how long people watch. A social clip, an arena loop and a website hero play by different rules of sound, orientation and length.
Video, sized to the moment
Not every video needs a crew. Often the most useful is quick and honest: a phone-shot sketch of a place as it really is, or a short clip answering a common question. Other moments call for directed production: a broadcast commercial, a flagship brand film, a carefully lit product sequence.
We’d rather make several simple videos people watch than one expensive film left unwatched on a homepage. High production, when called for, gets the same care for concept and craft.
Motion at scale
Campaigns now need motion in many formats, sizes and variations, and when each is made by hand, quality slips as the count rises.
So we increasingly design motion as a system: templates with set timing, type animation and transitions that take new content, and generative tools (including AI models working inside the template’s rules) producing variations a designer reviews before they go out.
Performance and accessibility
Motion has costs on the web: large video slows pages and heavy animation can stutter on phones. So we:
- Choose formats and compression carefully.
- Load video only when needed.
- Use code-driven animation where it’s lighter than video.
- Caption speech, and add text alternatives where video carries information.
- Avoid flashing or rapid motion that can cause discomfort.
Sketched early, tuned on the real screen
- Start with the idea and context: what moves, why, and where it’s seen.
- Sketch early, as a rough animatic or quick coded prototype; motion is hard to judge from stills.
- Refine timing, easing and detail on the devices and screens it’s meant for.
