How Hervé uses Jitter to create delightful interactive experiences
for clients

The old way

Historically, Hervé had been using traditional animation tools, like Adobe After Effects, for all things motion: from product design to social media posts. This meant that creating any kind of animation – even if it's a prototype to quickly validate ideas with clients – required hours, sometimes days of work. It also meant that only the few designers on the team who had experience with After Effects were able to create these animations. As a result, Hervé couldn't always justify doing as much motion work for every project as they would have liked.

The new way

When the Hervé team discovered Jitter, they realized every designer on their team could now use it to create animations for clients.

For both the less and more experienced motion designers, Jitter saves Hervé a lot of time because instead of relying on keyframes (like tradition motion design tools), it works with instructions. Keyframes are defined with values that are absolute in space and time, making the animations cumbersome to set up, edit, and reuse. Jitter’s instructions don’t alter your designs – they are more flexible and scalable because they work with relative space and time values. This means you can edit your layers without breaking the animation, and reuse your animations across different layers and files.

Because Jitter is web-based, there’s also no lagging or waiting for your videos to render, which lets you create simple animations in just a few minutes, from start to finish.

Animated prototypes and concepts

The Hervé team likes to include clients in their creative process early on to validate ideas and get feedback on concepts. The team found that doing that via static prototypes and storyboards misses the important aspect of capturing the experience of navigating a website or interacting with a product. Interactive Figma prototypes can sometimes serve the purpose, but even with those, clients won’t always click the right buttons and navigate the files in the way you expect them to, which can ruin the “wow” effect you're looking for when you're trying to get sign-off for a concept or win a project proposal.

With Jitter, Hervé are able to present their ideas in action with quick animations to illustrate what interacting with a website or product will feel like. By sharing a prototype that is essentially a video, the team is in control of the narrative and the aspects they want to emphasize. This gives clients a good idea of what the final result will look like and dramatically reduces the number of questions and feedback rounds.

Interactive websites

Another common use case Hervé has for Jitter is web design. The team uses Jitter’s Figma plugin to design interactive websites they can present to clients for review and, later, hand off to developers. This allows the team to design experiences that are truly immersive and on-brand.

One example of this is A year of Cartier, an interactive website Hervé worked on that transcribes a paper edition of 29 articles into an interactive digital yearbook.

Production-ready website animations

Hervé doesn’t only use Jitter to build prototypes and animated designs; they also use it to create production-ready motion graphics and animations for the clients’ websites and social media. By exporting these files in the Lottie or .webm formats, the team is able to add life to the clients’ websites without making them slower for the end user.

The results

With Jitter, the Hervé team was able to integrate motion into every stage of their creative process, from prototyping to product and visual design. With Jitter, the designers with no motion design experience can now add motion to their designs, and the ones who specialize in motion can save hours of time on creating animations. All of this lets the team effortlessly do what they do best – create experiences and brands that look and feel alive.