nw  

Garment Size Recommendation Plugin for Online Shops

Summary

The Garment Size Recommendation Plugin offers a novel user experience which makes it possible to find the perfect size for a garment even before the first try-on.

Keywords

UX Design, e-Commerce, Computer Vision, Vue.js

Objective

The primary objective of this project is to develop a user experience for an online shop plugin, which helps customers to find the ideal size for a garment. Leveraging data from the MOST body scanning app (developed in a different project), the exact fit of a specific garment size on the customers’ body is visualized, allowing them to make an informed purchase decision.

The resulting UX prototype is then validated and improved upon, and a reference implementation is created to provide a starting point for a future commercial product.

Starting point

Helping customers choose the correct size of a garment to achieve the desired fit is one of the biggest challenges in the e-commerce industry.

Unclear sizing information and the large variance between different manufacturers and regions lead to many returns, which could be prevented if the correct size was initially ordered. These inefficiencies not only entail costs but also have a significant impact on the environment and reduce customer satisfaction.

The company Sublime Technology is working together with the Institute for Interactive Technologies of the FHNW on the project MOST ("My own Sizing Technology"), which leverages LIDAR sensors in smartphones to enable users to easily determine their exact body measurements. The personalized body profile generated by the app shall then be used on various e-commerce platforms to provide individual size recommendations.

Results

In our research, we used the insights gathered from a fashion industry expert as a starting point and explored different aspects of e-commerce garment size recommendation technology. We evaluated other products which provide similar features and concluded that their user experience often has a low level of integration with the webshop UI and visualizes size recommendations poorly.

Different fit visualization approaches were analyzed and evaluated based on multiple criteria. Based on the outcome of this analysis, we designed a novel visualization style that integrates directly with the product image. In this new approach, the fit of a garment is shown using indicators that are drawn on the image of a model wearing it.

Size recommendation overlay on Zimmerli online shop
Size recommendation overlay on Zimmerli online shop

As this visualization style requires advanced computer vision technology to work on a large scale, a feasibility test was conducted, where different human pose estimation algorithms were tested with fashion product images. The results from this test show that the new visualization style is technically viable.

Comparison of different human pose estimation algorithms
Comparison of different human pose estimation algorithms

We designed multiple different UI versions, conducted usability tests, and created a final UX concept focused on a high level of integration with the online shop. A mix of inline and overlay elements is used to enhance the online shopping experience, without creating interruptions. Our usability tests show that the new visualization approach and a more integrated user flow provide a more valuable user experience to online shop customers.

To provide a starting point for a technical implementation, we created a reference implementation of the online shop plugin, and make suggestions of how the supporting software infrastructure may be designed and implemented. One of the key components of our implementation is a javascript framework, which is able to manage multiple interactive user interface elements that are attached to elements of a host website. This enables the implementation of a highly integrated user interface, without interfering with the programming of the host website.

To achieve a fully functional product which serves the needs of both online shop operators and end-users, further development is required in all areas of the MOST ecosystem. However, we are confident that besides the innovative body scanning technology being developed in the MOST project, our solution can add a unique selling point to the final product.

Project info

Project Duration: 21. September 2021 - 25. March 2022
Time budget: 720 Person-hours
Team size: 2 Persons
Bachelor Thesis

Client

Sublime Technology
Lars Kirchhoff
Alessandro Galatolo
https://mostfit.ch/

Project team

Hanna Lisa Franz
Dario Breitenstein

Contact

Prof. Dr. Doris Agotai (doris.agotai@fhnw.ch)
Tabea Eggler (tabea.eggler@fhnw.ch)

<< zurück