Illustrations and Animations

About the project
Creating illustrations and animations to reflect specific concepts for different webs and products

All along my journey in design, I have been advocating for the use of animations and illustrations to make the content dynamic. We now know that proper use of graphic elements can increase engagement and retention on a page. Plus, who said that complex ideas couldn’t be get quick and in a fun way?

Over these projects I have learnt that it is all about creating an emotional connection with the user, by allowing the recognition of elements and familiarity through the visual content.

Illustrating industry concepts

Most of the illustrations were for web, apps, and products where the requirement focused on supporting the content or helping to explain complex ideas. I would say that the difficulty relied on finding the right balance between visual appeal and accurate representation.

 

 

Waiting does not need to feel like waiting

Animations not only help to reinforce the brand but also, they are essential in terms of functionality. Adding a loader animation to a website or app can help to distract users from the feeling of waiting, keeping them engaged and informed about the progress of their request.

 

 

 

 

 

Illustrations on product

One of the things that I focused on the most when creating illustrations for products was consistency, which, most of the time, helps to create a flow across the different screens.

While working on Ucheck (an app that allows any user to have a first assessment of their cars), I realised the value of graphics when walking users through a very technical journey. After the design research process, we discovered how helpful they were in supporting content and speeding up the journey. Finally adding a significant improvement to the user experience.

 

 

Animations through Lottiefiles

Vectorised animations
I have been promoting vectorised animations ever since the first time I heard about them. Probably because I have also spent long hours in the past trying to reduce Gifs weight while maintaining their quality. So this felt just like the perfect answer to that problem, without mentioning that they offer the opportunity of interaction…(all my dreams come true!)
Lottiefiles animations
Although it is still not as popular as it should be, Lottie is an app that enables the creation of these «vectorised animations». It also allows you to embed them directly on your page. Producing high-quality, scalable, and lightweight animations.

 

Illustrations vs animations?

Not at all! Illustrations and animations can coexist harmoniously on a page when used with the right balance. Illustrations can convey information and add a touch of personality, while animations can enhance user experience and make the page more dynamic. The key is to ensure they complement each other and serve a purpose in the overall design.

 

 

Dark and light mode illustrations

Having become such a standard having both modes in any product it is something to take into consideration when designing illustrations. They have to work on both modes, keeping the same personality and sending the same message despite the palette they are displayed against. Sounds easy, but extrapolating colours can, and has given me some headaches. Until I finally achieved a result that worked for both (enjoy the journey the said…).

 

 

 

Finish!