Endura - Jersey customizer

Agency: Pentland Brands / Role: Senior UX Designer

—————————-

Pentland Brands is a UK based parent company to many consumer and ecommerce brands that include: Speedo, Lacoste, Karen Millen, and Cantebury to name a few. In this line up of brands Pentland also owns Endura; a leader in cycling apparel and gear across all cycling styles and disciplines.

One thing that separates Endura from other competitors in the space is that they offer custom jersey and bib services to their consumers. It was done through a form field that gave a sales representative and email lead to follow up on. The process was drawn out and more difficult than it needed to be for both parties involved. So Endura wanted to create a mobile-first, web based jersey customization tool that would allow users to design jerseys for their team in real time on a 3d bust.

Discovery and whiteboard session

A majority of the data gathering and stakeholder interviews had been conducted by our internal research team. They passed along their qualitative and quantitative research to us and we started to make out wants and needs into features and an ideal ‘happy path’ user journey.

By utilizing sticky notes and whiteboarding we were able to quickly sketch ideas and understand the problem space further. Following the whiteboarding session we moved some of our key ideas into a Figma to further solidify a direction.

In addition to creating the over all tool, we also brainstormed around whether or not we would educate the user via a in-experience wizard or to utilize an onboarding experience to showcase what was possible within the tool and to serve as a source of inspiration and base for what the user would ultimately create.

Our research showed that the onboarding experience was more effective with users and allowed for the perception of a more powerful tool as we could utilize a database of pre-existing designs that the user could start from.

Graphics libraries and technical considerations

The Endura graphics team provided libraries of patterns, colors and fonts for our team to incorporate into the tool for the users to select from. This allowed for an easier way for their design team to keep the users from attempting to design something that their DTG printers would struggle to accomplish.

Our team partnered with a 3rd party development team to implement the 3D model of both the male and female busts of the jerseys. We met with this team regularly to make sure that our proposals were possible and if they were not, we could collaborate on how to make them work or adjust them.

In order for the development teams to be able to have vectors overlay on parts of the jersey, we segmented out individual panels that the user would work on, rather than the user being able to just drop patterns and graphics freely.

The user uses the main tool bar (sticky to the bottom of the page) to select a category to edit with ie. color, shapes, graphics, etc followed by a prompt or subsequent navigation where they would select the part of the jersey to design on.

Menu Logic

Due to the complexity of how the menus interact with one another and can eventually effect how they are displayed, the UX team broke down each menu and how it would display during any given instance of use.

Feature sets

Once users place a graphics or patterns they can move, rotate, scale, change color and layer other graphics. By isolating parts of the jersey the user has more ability to easily build upon designs and it allowed for our backend team to treat the 3D model as a flat image during the design process.