Wolfskin Tech Lab
A microsite for the new Jack Wolfskin collection.
UX/UI, Web design, Art direction
Jack Wolfskin asked us to create an online experience for the new Tech Lab collection — a collection that differs from their usual outdoor wear and focusses on life in the city. The experience should explore this new concept and its innovative technology and provide easy access to the full product range.
To highlight Tech Lab’s innovative approach, we created a standalone microsite, detached from their main online store. A combination of impactful images, video snippets, and animations inside a full-screen format allows the user to dive deep into the world of Tech Lab.
(Concept, art direction and UX/UI)
Microsite, newsletters and web banners
Concept and structure.
We created a flexible flow where the user could decide whether he wants to immerse himself and get inspired or jump directly to a specific section like features or product range
A clean and simple start page features the collection’s brand film in the background to attract attention and create curiosity.
Inspiration vs. direct access.
Vertical scrolling or the left side navigation explores the more conceptual and inspirational pages. The icons on the right take the user straight to more technical pages like a video page, a features overview, and a product range.
The shopping cart is always visible in the top right corner.
Horizontal scroll and modals.
On some pages, the user can encounter a horizontal scroll or overlays for more in-depth information.
Being able to select and add a product to the shopping card directly within the experience was an essential requirement of the user flow.
A slider to explore.
We opted for a slider to showcase the product range because
- we don’t have more than nine products per gender
- a slider allows us to stay within the full-screen format
- it’s easier to compare the products side by side
Selection and purchase.
The user can select the color and size and add the item to the shopping basket.
Technical restrictions prevented us from implementing a checkout process in this microsite — when clicking on the shopping basket, the user is kindly asked to complete the checkout on the main website.