USM working essentials

On the microsite working.usm.com, the visitor learns in a playful way about the “USM Modular Furnitures”. By scrolling (or swiping on a tablet) the sets can be rotated and viewed from different angles.

Idea
The microsite consists of two parts: “essential topics” highlights the added value of the USM Modular Furniture, “essential solutions” shows the variety and flexibility of the products. By interacting in a playfull way the visitor gains useful information about the USM products and philosophy. For “essential solutions” 6 categories and 35 different furniture sets are presented. By scrolling (or swiping on a tablet) all the sets can be rotated and viewed from different angles and be displayed in different colors. For each element in a set, the User can access additional information or save it to favorites.

Technology / Making of
The micro-site “working essential” is based on the latest Web technologies like HTML5, CSS3 and JavaScript frameworks. The site layout is handled dynamically according to plattform and devices (Responsive Design).

To create the animation effect in “working solutions” frames are swapped based on scrolling interaction by the user. This way the user can scrub foreward and backward through each set. The benefit of using this animation technique lies in wide browser and device support (IE 7, IOS and Android).

An intelligent loading mechanism allows instant browsing without long waits. To improve the loading time, animation-images are shown in low-resolution. Once the animation stops, the respective high-resolution image is loaded.

Designer: Gold Interactive
Country: Switzerland