Your product. With a better future.

About

Perfectial needed a way to educate their customers on how important User Experience is for their product. We created an interactive web page where customers could explore User Experience basics with a use of simple metaphors.

Challenge

The idea was to create an illustrated storytelling website where the user could manipulate the process using default browser scrolling.

Our solution

Metaphors

We wondered: How can we illustrate any product with one image? The answer was easier than we thought – a box! Any product could be inside of the box. The box is something abstract and can relate to anyone. We started with simple on-paper sketches.

A lot of time has passed and after plenty of sketching and brainstorming we finally had what we wanted. The box has been finished! Yay!

Hand drawn illustrations

We created a set of hand drawn pencil illustrations – drawings of ourselves, our friends, our hands and heads. This made it easy to create the assets we had in mind to showcase the scenery for the story.

Animations controlled by users

Using default browser scrolling users can manipulate the state of which the animation is at. This makes the story fun to watch because you can pause at any given time by just simply stopping scrolling.

Don't forget mobile. We haven't.

Of course it had to be simplified according to mobile tech specs and all that... But it came along real nice in the end. And we’ve also added easy-to-use navigation.

Check out the result.