06
Moooi started out in 2001 and set the goal for themself to create a legendary brand. The way they wanted to achieve this was in close collaboration with designers.
Moooi presents a life extraordinary, a unique journey through the unexpected
Moooi started out in 2001 and set the goal for themself to create a legendary brand. The way they wanted to achieve this was in close collaboration with designers. In 2019 they asked Build in Amsterdam to create a new website that would comply with the Web Content Accessibility Guidelines (WCAG).
Because of the pandemic happening in 2020 the Salone del Mobile in Milan was canceled. Normally Moooi launches their new line of products on this event. To still show their new designs Moooi asked Build in Amsterdam for a campaign page on their website.
This needed to be an experience where the visitor could explore the products as they would’ve done on the furniture fair.
For each room there is a specific animation introducing the theme of the room. These were made by a motion designer to be unique for each room. Based on these animations created, I translated them for web using timeline based animations.
These animations feature a combination of HTML elements and Canvas elements. For the larger textures in the animations HTML elements were not performant enough. To solve this we render the larger images into a canvas so gpu can be better utilised during these animations.
In every room the user can explore the different interactions and links. The dots around the room help the user find the products in the rooms but there are also stories hidden in objects.
So add to the idea that the visitor is exploring the room we added a parallax effect that moves the room when the user moves their mouse. By changing the speed of the parallax on different objects we create a depth to the scene.
