SALT – Empower Transparency
Katarina Harth
UX / UI Designer
Made with

SALT – Empower Transparency

Follow the end-to-end production impact of your clothes.

Project Description

Design a mobile app for consumers of sustainable fashion brands to provide full transparency on sustainable clothing production.

Rationale:

As consumers become more aware of environmental issues and demand greater accountability, industries around the world shift to accommodate. One of the most impacted so far – the fashion industry – is moving fast to respond to consumer demands. Therefore “sustainable clothing production” has become the fastest growing trend in the fashion industry.

Using recycled rubbish, plastic, glass and even algae, the fashion industry races to find new materials and techniques, shifting clothing production for good. However, this is only the tip of the iceberg. Research shows that, more than different materials and techniques, consumers seek transparency when it comes to the end-to-end supply chain.

A demand to understand fully what clients buy and the impact their purchases create on the world inspired Salt.


Objective:

I developed an app that gives consumers of sustainable clothing full transparency on the material, origin, processes and environmental impact of the products they purchase. Using blockchain technology, Salt enables users to track a product’s end-to-end production cycle simply by scanning a specific tag or QR code.

Challenges:

The project required the development of wireframes, mock-ups and an MVP aimed at pitching one of the world’s largest sportswear companies.

After pitching different stakeholders within the organization, the most relevant feedback identified was the lack of sales/business driven features.

My role

  • Product strategy
  • User research & analysis
  • User Flow & Stories
  • Persona creation
  • UI design & prototyping
  • Usability testing

MAPPING THE PROBLEM

SALT – Empower Transparency

Research & Analysis

To address the given challenge of implementing business-driven features into Salt, I started with audits of various applications from the fashion industry. My aim was to gather insights about strategies and best practices when it comes to user-centred versus conversion-centred design. 

SALT – Empower Transparency

Results & Takeaways

After executing a series of audits, I identified a strong pattern in what the most relevant fashion brands do with digital applications and broke the pattern down into a pyramid

  • At the top of the pyramid, I identified the use of storytelling to communicate campaigns and leverage product awareness and identification.

  • At the base of the pyramid, I identified that most brands invest heavily on community features and rewards within the app – as membership programs – aimed at user engagement and retention.

  • All of them emphasize sales and traffic generation, having clear CTAs and clear user journeys, making it easy for users to take action.

Implementing the Results

Based on these three pillars of the pyramid, I defined the following key functions for the app:

Storytelling:

  • Story feature
  • Newsfeed
  • Scan-and- track feature to display the supply chain (using blockchain to support data collection and storage).


Community:

  • User profile
  • Membership program
  • Onboarding
  • Log-in

During my research, I identified the membership program as a key feature pertaining to community building. To implement this feature, I decided to use gamification as a design technique. Users can collect coins through purchases and taking part in events or challenges: the more points, the higher the status; the higher the status, the more benefits the user earns.


Sales traffic:

  • Personalization
  • Campaign and product placement
  • In-app purchase

"But will all that serve user needs, too?"

Personas

To align these new key functionalities with users needs, I set up my persona. While developing the persona, I referred to consumers of sustainable brands and analyzed their behaviour, motivation and pain points. I also conducted research about the consumer market perspective, learning that millennials and Generation Z consumers, especially, affect the fashion industry through strong, sustainable shopping behaviour.

SALT – Empower Transparency

Sophie, 28 years ( Medical Assistant)

"I have a hands-on mindset and want to make a change in the world through sustainability."

Behaviour:

For Sophie, sustainability is an expression of an attitude to life. Environmental awareness characterizes her consumer behaviour, from groceries to cosmetics to travel. Wherever possible, she tries to curb her environmental footprint. When it comes to fashion, she chooses brands or retailers based on their ethical practices, not on their price tags.

Pain Points:

  • Lack of trust and transparency regarding product origin.
  • Desire of community thinking when it comes to environmental issues

Motivations:

  • Desire to be part of a like-minded community 
  • Desire to be hands-on when it comes to contributing to an environmental change
  • Want to see the desired change materialize as a result of her purchasing decisions
  • Quality and longevity of products purchased

SALT – Empower Transparency

User Stories & User Flow

User stories helped me to understand how to align business goals (new functions) with user needs. Therefore, I created stories for each pillar of the pyramid. Following are some examples:

  • Storytelling:
    “As a user, I want to track the supply chain of a product, so I can be certain of its sustainable origin and impact.”

  • Community:
    “As a user, I want to save on in-store and online purchases in my personal account, so I can follow and visualise the change I am contributing to by buying sustainable products.”

  • Drive Sales:
    “As a user, I want to get personalised product suggestions, so I  see just products that interest me.

EXPLORING DESIGN SOLUTIONS

Ideate

Low-fidelity wireframes

At the beginning of the ideation phase, the main function of this app was scanning and tracking a product, but that the idea quickly outgrew that initial intent. I sketched various solutions and ran user tests to find the best way to integrating the newly defined functions.


At this phase of the design process, early user feedback was crucial to eliminate pain points and enhance usability and existing features.

SALT – Empower Transparency

GETTING VISUAL

Developing the Prototype

Mid-fidelity-Wireframes

After creating mid-fidelity wireframes, I converted them into an interactive prototype using Invision software. This prototype was used to run the second round of user tests, remote and in person, that enhanced features and eliminated user pain points. 

SALT – Empower Transparency

Visualising the End-to-End

Designed for Confidence:

This app stands for trust and transparency. Therefore, the interface design strives to instil confidence. I eliminated unnecessary UI elements and kept all design elements consistent throughout the app to ensure a clean and well-spaced design. A strong typographical hierarchy contributes to high readability and orientation within the app.


Designed to Delight:

I wanted my design to go beyond functionality, reliability and usability – I want it to be pleasurable, compelling the user to build an emotional connection to the app. Therefore, this app leverages principles of emotional design to inspire users to keep contributing to a positive change in our environment: 

  • Gamification as a backbone of the membership program 
  • Unexpected moments of humour through illustrations 
  • Inspiring nature imagery 

Designed to Covert:

The whole design process refers to the main challenge of implementing business-driven features or, in other words, sales conversion. Following the principles of conversion-centred design, I implemented the following strategies:

  • Straight forward and clear CTA
  • Visual contrast to make important items stand out.
  • Directional cues to the user to make it as easy as possible to take an action.
  • Targeted white space to orient users and to help them quickly find out where an action should be taken.
  • Consistently pointing out to the membership benefits through the whole app.


I displayed the functionality and design of this app based on the fictional sustainable fashion brand Salt.

SALT – Empower Transparency

Onboarding

Onboarding is one of the most critical phases in an app user’s journey. I built this process to be benefit-oriented:

  • Introducing the cause to get people emotionally involved.
  • Presenting the technology which Salt is based on.
  • Demonstrating benefits and values of the membership. program. 

The Newsfeed

The newsfeed is designed as the main space were user needs meet business needs. Employing conversion-centred with the user-centred needs forms the backbone of this app. A key feature of the Newsfeed, called "Latest Stories", engages users. To help users promptly understand its function, I visualizing according to well-known design conventions.

SALT – Empower Transparency
SALT – Empower Transparency

Scan & Track

The user scans a product’s unique code to access its supply chain. While the "Journey" section gives full transparency about a product’s origin, process and owners, the "Info" section informs specific users who are interested in purchasing the product.

SALT – Empower Transparency

User Profile

The membership program is based on gamification. Therefore, the user can see his or her membership status, badges and attended challenges and events to leverage his or her membership status.

Additionally, the user can save previous purchases on a wardrobe to retrieve its supply chain information at any time.

MATERIALISING THE PRODUCT

SALT – Empower Transparency

User Testing

To ensure seamless usability, I conducted user testing in-person and remotely with nine individuals. In general, participants could navigate easily through the app and enjoyed its simplicity; but testing also detected some pain points:

Newsfeed

  1. On the stories section, participants revealed they could not connect with its appearance. They expected a visual pattern following familiar standards set by Instagram or Snapchat.

  2. The meaning of the challenge and product campaign panel wasn't clear. Users did not perceive it as clickable. The addition of CTA buttons linked users to explanations.

  3. Communication of the membership program was missing from the newsfeed. Users asked to see a link between the actions they could take and the connected rewards. I solved that by displaying the number of coins users would earn by taking a specific action. 

Scan & Track

Some participants struggled with understanding the supply chain timeline due to the chronology of the supply chain entries. The very beginning of the process was shown first, but users revealed they expected to see the latest entry first as is common in social media timelines.



WRAPPING UP

Lessons Learned

  • To create the space where user needs meet business goals I had to dive deeply into understanding the business perspective and figure out how to make salt conversion-centred
  • Gamification is a powerful tool to engage users and to leverage business.
  • Never underestimate design conventions. Creating something new or different is exciting, especially from a designer's point of view, but constant testing is absolutely crucial for success.