The Design Museum 'Sneakers Unboxed' exhibition interface design

An immersive real life trainer builder

What we did:

The Design Museum is dedicated to showcasing the very best in product, industrial, graphic, fashion, and architectural design artifacts. We have been working with the West London institution for over ten years, supporting them with an array of services including UI/UX design, branding and marketing. 

The challenge

As part of the ‘Sneakers Unboxed: Studio to Street’ exhibition in collaboration with the Pensole Design Academy, the Design Museum asked Make it Clear to create an interactive tool to enrich the experience and enable visitors to design their own trainers. In addition, Pensole would also be selecting one lucky designer to have their creation made for real. 

Our approach

Make it Clear created the user experience and user interface design, with our partner Purr Digital constructing the platform’s frontend development. The interactive element of the exhibition was designed directly with Pensole in order to be a real-life educational tool for visitors. Users could select everything needed for a stand-out design such as trainer profile, material, texture and colour. 

Due to COVID restrictions, the original plan to use shared tablets positioned within the exhibition for visitors to create designs had to be revised and the project pivoted to enable visitors to use their own device, such as their mobile, tablet or computer while visiting the exhibition 

 

Information architecture

Utilising data gathered from our extensive research and experience within the field, and in conjunction with our developer Purr Digital, we generated the structure of the tool and initial platform build. During this stage, MiC also mapped out and refined the user functionality.

 

Wireframing

From the initial platform structure, a set of wireframe mock-ups were devised and iterated on. The use of wireframes is a vital part of the design process and assists in establishing screen content, structure and navigation. Here at MiC, we create precise wireframes that are then presented on the prototyping platform InVision, which provides client teams access to preview and request any changes to the prototype. 

 

Interface design

In line with the original exhibition brand guidelines, the final part of the MiC project phase was to create the design system that brought the site to life. This included areas such as font and image selection, button design and styling, and image choice. The designs produced were created to be responsive across device screen sizes.

 

Development  

The team at Purr built the platform in Laravel and Vue.js which allowed them to segregate the large vector files used as part of the shoe design. This ensured the files could be compressed and isolated on different pages to ensure that all functions loaded quickly and displayed the shoe material – no matter what kind of device the user was on. Despite the complex layers and large files, the site was built to load on the user side quickly and ensure that the activity of customising the sneakers felt natural and fluid. 

Business impact

The platform allows users to easily create their own unique designs, then share on social media. The interactive site gives visitors of the exhibition an immersive experience into the trainer design industry. 

 

The exhibit launched on the 18th May 2021 and we look forward to seeing amazing shoe designs and hearing what visitors think of the interactive. 

Associated capabilities

UX and digital

A UI UX design is the design of a user interface (UI) for machines and software to optimise the user experience (UX).

UX and digital

UX testing is a research activity or task that investigates the user experience almost exclusively.