How to enhance online user experience on a small handicraft e-commerce?

Developing a new experience to a local producer through UX and branding


Local shops and practitioners are suffering a decrease in the demand of their services and products due to the extreme situation Covid-19 pushed worldwide. This can affect local economies and many families. Alongside this, we can see true intent and a growing trend to support local businesses in many communities. 

Brief: the challenge is to help a local shop or professional improve their online presence to be more competitive in the actual market by designing a desktop e-commerce.
Deliverables: mid-fi desktop prototype
Design sprint: 7 days
Team: Bárbara Accioly, Alice Costa and me
Tools: Figma and Miro

The Brand

As Tintureiras ("The Dyers") are two artisans, mother and daughter, whose studio is located in São Paulo, Brazil.
They sell products made with natural dyeing and botanical printing, such as fabrics, garments, decoration, and also online workshops. The entire production process is 100% natural and environmentally friendly. 

Through their pieces, they seek to transmit the brand's values: sustainability, handcraft, and ancient culture

Tecidos de tons terrosos tingidos naturalmente

Natural dyed fabrics. Photo: reproduction from the brand’s Facebook page.

Affection is key to handicraft markets

To understand deeply the brazilian handcraft market, we conducted a desk research, carried out exploratory interviews, and also kept in touch with the brand's owners throughout the development of the project.

Additionally, through market research and benchmarking, we found out that other artisans in the industry focus a lot on the overall context of the product (what materials were used, how the production process was done, etc), bringing out the unique aspects of the item and also telling a story about it.

Therefore, we discovered that there is a specific characteristic in the handcrafted products niche: people who consume handcrafts seek to establish a relationship with the artisan.

We interviewed eight real and potential clients and the most relevant topics brought up by them were:

  • Demand for unique and quality products

  • Preference to shop in person before the pandemic because they were in direct contact with the artisans and their work

  • Support small producers

  • Handcrafted products carry a narrative and evoke affective memories

  • ​Connection between artisan and consumer valorization

  • All of them practice some kind of handicraft, which brings up a strong sense of belonging to this community

Workshop by As Tintureiras. Photo: reproduction from the brand’s Facebook page.

Also, one of the interviewees said that "buying is a political act", which defines the shopping habits of this niche very well. These consumers want to empower the small producer and support the local economy by purchasing handcrafted products. It's not just about buying for the sake of buying, but for the story behind the product.

Analyzing the points brought by the interviewees and As Tintureiras, we realized that both of them have similar values, having also similar motivations: support the small producer, incentivize local economy and contribute to sustainability. Thus,  

we can see that it is indeed a unique niche, since there is almost total alignment between brand and consumer.

The consumption of handcrafted products is all about creating relationships and connections through stories — Interviewee

Therefore, since affection is key to this market, we conclude that the industry has been deeply affected by the social distancing imposed by the Covid-19 pandemic.

Artisan-costumer relationship

In this way, we noticed that both As Tintureiras and their consumers have very similar values, so they are experiencing the same problems:

  1. The user demands a virtual connection with the artisan to make the purchase. Due to the pandemic, people are no longer able to analyze the products in person and develop emotional attachment with the artisans.

  2. The brand needs to increase sales, which have dropped due to the pandemic, as the artisans are no longer able to present the products live and create affective bonds with the costumers.

Mindmap — relationships between As Tintureiras, consumers and other artisans

Analyzing the current e-commerce, we noted that it doesn't highlight brand's values and also doesn't have elements that promote the development of closer ties between artisan and consumer. The main contributing factors are:

  • The site doesn't highlight the background story of the artisans (it doesn't even have any pictures of them)

  • There isn't enough emphasis on the brand's differentials and values and its impact on the production process of the items

  • Many of the categories and words used are so specific that consumers couldn't understand them, being unable to complete simple tasks like "buy a scarf"

You can see the current e-commerce pages below and, by clicking on them, you'll see a more detailed explanation of the main points corresponding to each one of them.

Thus, we chose to attack both the user's primary pain point, which is not being able to create a relationship with the artisans, and also a secondary pain point, related to the site's navigation itself.

So, we aim to answer the following question: how can we bring the ideals of sustainability, ancient culture and handcrafting to the virtual environment in order to enhance the relationship between brand and consumer?

We believe that by adding products' and artisans' specific information  on the site, we will bring them closer to the customers, who will become brand "advocates", and consequently increase sales.

We'd be able to measure this by analyzing the conversion rate, number of visitors, time on page and number of registrations on the website analytics.

Therefore, biography is a deciding factor in the purchase of handicraft products and it contributes to the construction of the brand.

Developing the solution

We started by reviewing the current sitemap, based on information architecture heuristics, in order to improve user's navigation, which is compromised by some categories that aren't so intuitive.

Sitemap — as is and to be

Next, we mapped out the user flow for making a purchase and identified the main points for improvement, where we could put elements that would favor the connection between artisans and user. The task was to buy a "manta", a fabric that can be used as a scarf but also can be a home decoration item.

User flow: making a purchase through e-commerce

We developed two flows: one that aims to get familiar with the artisans' story and their work, and another that is the purchase of a "manta". Thus, we selected the following pages to be part of them:

  • Home page: it's the brand's first impression, so it's necessary that it transmits the values clearly, creating an atmosphere

  • About: provides some information about the artisans behind the brand and their background

  • Products: contains too much information and is disorganized

  • Product category: add a text explaining about the category and how the products can be used (since some of them serve as both clothing and decoration) to avoid possible doubts 

  • Specific product: information about the production process of the item, which plants were used during the dying, dimensions, composition and etc.

  • Cart: focus on remodeling the page, aiming to improve the information architecture and eliminate repetitive info

  • Purchase confirmation: is a possibility to reinforce to the customer that the purchase is consonant with his ideals

Prototyping & Testing

According to the previous conclusions, we created a mid-fi prototype that enhances the brand's values and promote artisan-consumer relationship.

You can check the detailed changes for each one of the pages by clicking on the images below:

After applying concept and usability tests with five volunteers, we got the following outputs:

  • They had a great reaction to the navigation and were able to accomplish the tasks

  • Some of them suggested to modify some texts

  • Praise for the possibility of calculate shipping costs before entering address data

Through them we were able to incorporate some important points such as text breaks, modify some sentences, and make small adjustments.

You can check out the mid-fi prototype to visualize the flows and all the changes we made in the e-commerce (and you can also access the interactive prototype by clicking here):

Next Steps

For the next steps we are looking forward to put the site online, applying this concept to all product's categories, and continue to perform more tests to improve the solution we have developed.