Lottie and web animation
Lightweight vector animations for websites and apps, delivered as Lottie files that stay sharp and load fast.
GradaxEuropean companyOrder outright
Founded 2014·Built and operated in Europe·3 days to 4 weeks
About this service
Lottie animations are vector files that play in websites and apps at a fraction of the size of a video or GIF. We design and animate icons, loaders, onboarding sequences and hero illustrations, export them as Lottie or dotLottie, and check they play correctly in the player your developers use.
Small files, sharp at any size
Animation on a website used to mean a GIF or a video. GIFs are large, limited in colour and blurry on high-resolution screens. Videos are heavy, need a player and cannot respond to the user. Lottie files describe the animation as vector shapes and movement, so a ten-second illustrated animation can weigh a fraction of the equivalent video and stay crisp on any screen.
They can also be controlled by code. An icon can animate when hovered, a loader can loop until data arrives, an illustration can play as the user scrolls past it. That makes Lottie suited to interface details where a video would be too heavy and too passive.
Designing within what Lottie can play
Lottie is exported from After Effects, but it does not support everything After Effects can do. Many effects, blurs, glows, 3D layers and some blending modes either do not export or export in ways that slow playback badly on phones. An animation designed without those limits in mind often has to be rebuilt.
We design for the format from the first frame, using shape layers, simple masks and supported features. Before handover, each file is tested in the player your developers use: lottie-web, the iOS or Android libraries, or dotLottie. Complex animations are also checked for playback on a mid-range phone, since a smooth animation on a laptop can stutter on a cheaper device.
What you get
Everything below is in the price. Nothing here is an upgrade.
- Animation designs in After Effects
- Lottie JSON and dotLottie exports
- Preview videos for sign-off
- Implementation notes for developers
What changes
- Animations that stay sharp on every screen size and density
- File sizes small enough not to slow page load
- Playback tested in the web, iOS or Android player your team uses
- Interactive states such as hover, click or scroll set up where needed
How it runs
Plan
Each animation's purpose, length and trigger agreed.
Animate
Built in After Effects using only features Lottie supports.
Optimise
Shapes and keyframes simplified to keep files small.
Test
Played in your target player on real devices before handover.
Compare the sizes
The standard price for each size. Extras are priced beside it, not hidden behind a call.
| Included | Icon set€2903 to 5 working days | Feature animations€5001 to 2 weeks | Motion system€1,0502 to 4 weeks |
|---|---|---|---|
| Up to five icon animations or one loader | Included | Included | Included |
| Lottie and dotLottie files | Included | Included | Included |
| Two rounds of revisions | Included | Included | Included |
| Playback test | Included | Included | Included |
| Up to three illustrated animations, each up to ten seconds | Not included | Included | Included |
| Hover or click states | Not included | Included | Included |
| Implementation notes | Not included | Included | Included |
| Onboarding sequence of up to five screens | Not included | Not included | Included |
| Scroll-linked or interactive animation | Not included | Not included | Included |
| Motion guidelines: timing, easing and principles | Not included | Not included | Included |
| Order | Select | Select | Select |
Add what you need
Choose the size
Add what you need
Your total€500
ContinueThe standard price, plus whatever you add. Confirmed in writing before anything starts; nothing is charged until you accept it.
Questions
Why Lottie instead of video or GIF?
Lottie files are usually much smaller, scale without blur, have transparent backgrounds and can be controlled by code, such as playing on hover or following scroll.
Can every animation become a Lottie?
No. Lottie supports vector shapes well, but some After Effects effects, blurs and 3D do not export. We design within those limits from the start.
Do you add them to our site?
We supply files and notes for your developer. Implementation can be added if you have no developer.
Related searches
Related work
One-timeIcon designA custom icon set drawn on one grid, so every icon looks like it belongs with the rest.from €290one-time
One-timeMobile app designiOS and Android app screens designed in Figma, with flows, states and a component library ready for build.from €420one-time
One-timeLogo animationYour logo animated in a few seconds of motion that fits the brand, for video, web and social.from €290one-time
Order it
Standardised enough to order on its own. The price is confirmed in writing before anything starts.