CASE STUDY: Design Your Own Socks in 3D

Case Study

SocksFactory is a Polish factory operating in the knitting industry since 1998.

Currently, the factory manufactures products for international brands, mostly they produce socks for wholesale, events and marketing campaigns.

Client Requirements

In the first phase, the company needed a 3D sock configurator for their new websites. Customers need the ability to select the type and size of the sock, select the colors from an available fabric catalog, the option to upload their own sock designs using template, share the project using a unique URL link and order page where customers can submit their sock project. The configurator needs to support multi-language since it will be found in 3 different countries.

The second phase requires a login/account module with Gmail and Facebook login, for users to save their projects and have access to an order history, a 2D template editing tool for users that don’t use a graphic editor software, switch left/right sock, shopping cart system, packaging and label options.

Solution

We used React to quickly create the front-end and three.js to enable the 3D viewport with all its presets already built in-house. In order for users to share the project to someone else using unique URL links, we used Firebase. We allowed with the help of UV mapping for users to upload their own graphics for the socks. Finally, when submitting a sock project, the configurator will trigger emails using Twillio API, a SMTP web service.

The phase 2 implementations, we will use a 2D canvas javascript library for users to edit a sock template without a graphic editor software. Users can directly upload images, crop, drag, rotate, add text and basic shapes to design their own socks directly in the app.

We integrate the sock configurator with WooCommerce to finalize orders.

Results

The sock company has an easy way for customers to design their own sock with a few clicks directly from the websites. The sock configurator is found in English, Deutsche and Polish languages therefore the 3d configurator can be used in 3 countries. 

Currently, the project is ongoing implementing other features such as: coupon system, chat integration, labels and adding new 3D models.

Gallery

Client Review

“Easy to design your order, very good socks shape, very good mapping, project visual improvement and customer understanding.”
Tomasz Gromelski
CEO, SocksFactory