Klimatex is a well known producer of sport and hiking clothing from Czech Republic. They specialize in manufacturing functional garments. Apart from supplying teams, clubs and companies, they have their own e-shop with sport clothing.
UX and UI Designer
3 months
Adobe XD, Trusty pen and paper
I was tasked with designing a solution to their new product. T-shirts with custom images or graphic elements. Together, we decided to create online configurator for the clients that would simplify the creating and ordering of the design as well as sending the data to the print.
I mainly worked with the developers of the solution because of the strict restriction on technical possibilities in the current system. I also validated the ideas with the product owner and other designers from our company.
Challenges
Main challenge of this project was to design around the technical restriction of the system and tight budget on the project. It was important to work closely with the developers to create a simple yet usable solution.
Identifying goals
First thing to do was identify the main goals of the solution. We determined that the main steps would be to select the t-shirt, its color and allow users to add image, graphic and/or a text. We also needed to always show the user the current state of the shirt as well as provide a clear way to make order or save a design for later. These goals were identified on a workshop with the stakeholders and product owner.
Card sorting
We held a closed Card Sorting session to validate the structure of the configurator. That way, we were able to create a meaningful ideas of a user interface. Results provided us with a good basis for a structure. We discussed the structure with the developers and refined minor elements to better suit the implementation.
Sketching
After obtaining the broad idea about the configurator, we started to sketch first screens and states of the configurator. We incrementally moved towards the final paper wireframe which consisted of four main sections, navigation bar and thumbnail area.
We decided to remove the t-shirt selection from the configurator and move it before to the special category of the eshop which would offer the ability to configure the product. We also created an additional window with the size selection and and their numbers to meet the need to offer ordering multiple sizes with various quantities.
UI
We designed the high-fidelity prototype based on the accepted wireframes. We kept in mind the branding of the client and designed the prototype to look as a part of the original website.
Testing
We tested the usability of the configurator internally with the help of our colleagues who were not involved in this project. We tested the basic scenarios of buying one and multiple t-shirts with different combinations of designs and texts. The results were satisfactory and the design was accepted by the stakeholders.
Outcomes
The design and implementation was just the beginning of the project. Stakeholders are already planning new functionalities and we are analyzing the data from the configurator regularly to look for potential pain points and potential new features.
Learnings
This project teached my the importance of close cooperation with the developers on the potentially problematic and technically difficult project. I believe we were able to avoid many hurdles along the way thanks to our regular sessions. It was definitely a good test of my communication skills.