Ariel Nguyen

A purpose led brand that promotes artisanal craftsmanship. The site features a collection of sustainably-sourced, ethically-made pieces ranging from home décor to fashion accessories.

My Role

Product Designer (team of 4)


6 weeks


Problem Statement

Brands get frustrated when sourcing artisanal products from Africa. The communication between buyers and suppliers in the artisan craft sector who want to purchase wholesale quantities is cumbersome. The manual administrative process involved in sourcing and managing the process is outdated. There are many kickbacks, which results in suppliers earning less and middlemen gaining a higher margin.

Designing Process

We follow IDEO’s Human-Centered Design and Lean UX Design Thinking process to make sure that my design decisions were supported by user research and feedback.


User Research

The first thing we focused on was our research strategy. In order to identify the flaws in the current UX and UI, we conducted a usability test by interviewing people that fit our user archetype. These were owners of small businesses, who are looking for suppliers, preferably from Africa. Before we began our interviews we first needed to do two things.

  1. First we conduct a competitor analysis. Aside from using and understanding SAFI Label, this also gave us an insight in the market space and provided additional context for the problem we are working on.
  2. Secondly we create an interview guide in preparation for Usability Testing. This enabled us to conduct our interviews in a consistent and controlled manner.

Competitive Analysis

As part of our Competitor Analysis, we conducted an analysis on four websites with similar product offerings to SAFI Label. These were: Urban Zen, Goodee, Powered by People, and Novica.
We focused our research on Site Map, User Interface elements and User Experience Flows – including the Sign Up process, Check Out Process, Browsing, and the Features.

Urban Zen key findings

  • Strengths
    • Easy product discovery w/ links to each category
    • Prominent CTA for “Add To Shopping Bag”
    • Secondary navigation guides users to content nearby
  • Weaknesses
    • The mention of artisans buried within the “initiatives” link is not easy to find. Information is top-level, with no detail about individual makers.
  • Action Items
    • Create a “Meet The Makers” section to help buyers learn more about each artisan’s design process, where they find inspiration and learn more about the positive economic & social impact each artisan has on their local region.

Goodee key findings

  • Strengths

    • Call to action button is clearly visible

    • Search results display items with pricing, details

    • Organized gallery layout with product images

  • Weaknesses

    • On the landing page, very hard to read the paragraph text with the images as background

    • The decorative font is hard to read at times when there’s a busy background

    • Font varies from regular to bold. Needs to be consistent

  • Action Items

    • Include an option to order large quantities of a product

    • Clear, stand out a call to action buttons

    • Incorporate hover action over product image (when
      gallery layout) to quickly add to cart

Powered by People key findings

  • Strengths
    • Simple and intuitive UI design
    • Buyers profile has all the information, including the company profile, payment methods, and the tax ID
    • CTA prompts users to sign in/sign up to see the wholesale price of the product they are currently viewing
  • Weaknesses
    • The user’s website is mandatory
    • The navigation menu doesn’t indicate the current page
    • No clear affordance or signifiers of how to finalize the purchase
  • Action Items
    • Make artisans’ profiles front and center
    • CTA for signing up
    • Simplify potential buyers’ signing up process

Novica key findings

  • Strengths
    • Organize products based on regions and artisans
    • Artisan’s description is in story format
    • The order is trackable.
  • Weaknesses
    • Site structure is based on the type of product.
    • Doesn’t have information about artisans’ specialties.
    • Doesn’t have consistent look throughout the site.
  • Action Items
    • Tag each product with its region and artists for filtering and searching purposes.
    • Add an option to customize orders for wholesalers.
    • Have consistent look throughout the site. Stick to branding guidelines.

Empathy map

To start off, I created a provisional persona of potential SAFI users based on a selection of current SAFI users and my understanding of people I knew that used wholesale websites.


Owner of small business


Fashion, art, and craft


To find suppliers of raw materials for their art and craft


Being able to monitor order online


  • "It's difficult to find brands that I trust"
  • "I want to connect with skilled artisans"
  • "Purchasing from brands who share my social and ethical values is important"


  • Clicks on the search bar and types a keyword for the product they’re seeking.
  • Clicks on a topic in navigation and takes the user to the general product page.
  • Clicks on a product and is taken to a product details page.
  • Selects quantity of product and adds product to shopping cart.
  • Proceeds through proper registration and checkout process.


  • The user thinks the supply chain system is unclear. In order to gather information, the user needs to do intensive research.
  • The user thinks Africa has beautiful products compared to others.
  • The user thinks Africa’s middlemen are not as reliable as others.
  • The user thinks the current manual administrative process involved in outsourcing and managing orders is outdated.


  • Hard to find the right suppliers in Africa
  • Frustrated when suppliers delay production
  • Obsessed with crafts of artisans in Africa
  • Excited about finding affordable distribution partners


User Personas

After feedback from user interviews and competitive usability testing, I created three lightweight user personas for SAFI Label based on their different shopping behaviors:

  1. Anna, a Conservative Shop Owner, has a value-based budget.
  2. Tim, an Explorer Shop Owner, has a love for exotic and unique products.
  3. Hadiza, a Home Supporting Shop Owner, has a strong urge to support her hometown.
Start up small business, SME female owner checking order online to prepare to pack a box of goods

Conservative Shop Owner


Want to find a new source of artisanal products. Origin of the products are not as important as the quality and value.


  • Keep the supply at a value-based budget.
  • Find artisans that can support her creative mind at a reasonable price.
Flower shop business owner working service

Explorer Shop Owner


Want to find supply sources that provide unique materials. Willing to pay a premium price for premium quality.


  • Find unique materials
  • Find artisans that can support his creative mind. 
authentic ethnic africa america sellerwoman working in shop

Home Supporting Shop Owner


Want to find artisans from her origin. Willing to pay more to support her hometown and promote her traditional designs.


  • Promoting design and material that are from her hometown.
  • Find artisans to support a cause at her hometown.

After doing guerilla usability testing with our candidates, we reviewed the recordings and used affinity mapping to group the pain points into similar categories, which came down to the below HMW question:

How might we design a seamless purchasing experience for wholesale buyers?

Key Features

Most wanted features people wish existed

  • Able to review artisans’ portfolios before placing an order
  • Collaborate with artisans to create fully customized items
  • Have history, sourcing information, and quality of the material ready
  • Track order process
  • Discount code

Features will be included in the MVP

  • Able to review artisans’ portfolios before placing an order
  • Collaborate with artisans to create fully customized items
  • Track order process



I first created a sitemap to structure the MVP content. Besides having a list of products, and information about the company, I added featured products, gift guides, and artisans’ information to the menu.

User Flows

We identified the 3 red routes for this website:

  1. Onboarding flow: how do people sign up and sign in to the page?
  2. Search Artisans flow: how do users search and filter the artisans they are looking for?
  3. Place Order flow: how do user search for products and place the order?

Onboarding Flow

Search Artisans Flow

Place Order Flow


Header Menu

Included a mega dropdown menu into the design. This allows quicker results for users, especially since Safi has many products.

Home Page

Top panel with short blurb and CTA, following with story panel to introduce SAFI backstory.

Sign In & Sign Up

When click on Account button, the page will take the user to sign in/ sign up page.

All Artisans Screen

Grid view for all artisans

Sort & Filter

Option to search for artisans with filters and sort option.

Artisan's Profile

Artisan profile page provides stories, products, reviews, and option to contact for custom order.

List of Products

Grid view of all products and filters. A CTA for custom order is placed below the filters side panel.

Product Page

Besides details about the product, there are sections that link to the artisan, more product from the artisan, and more product that user might like.

Place Order

Once the item is in the cart, the user can start placing the order with the process of putting in information and get confirmation.

Style Guide


We performed usability testing on 5 users who fit the persona. There were 5 tasks during the testing:

  1. Sign up for an account
  2. Search for artisans
  3. Finding product
  4. View product details
  5. Add to bag

Below are key takeaways from our usability testing.

Would like to have breadcrumbs to go back to previous find.

Able to search for desired artisans.

Able to place custom order from various locations. Would love to have pre-filled options when placing order.

Would like to be able to track orders.

Would like to have an account view to see history of orders, save account profile, etc...


After analyzing the usability testing notes, we made changes to the wireframes and incorporated the style guide to bring forth the Hi-fi prototype. Below are the before and afters of our key screens.

Removing bullets in the listing detail. Update new fonts and logos. 

00_sitemap00-nav bar

Apply Google and Facebook button styles.

02_sign in02-sign in

Listing the badges of socially and ethically conscious values/artisan missions. This adds a solution to the statement in the brief mentioning Safi’s aim to connect socially and ethically conscious consumers to artisans.

Breadcrumbs are added to help go back to the search page.

12_product page13-product detail

Apply photos on the homepage, and changed the content overlay.


Added the artisan’s specific areas of design. This will ease the experience buyers/consumers have when searching for products to purchase wholesale

09_artisan detail_review10-artisan detail-review

Changed from black text to white text overlay. Updated the filter list and adding visual.

07_all artisans_filter detail08-all artisans-filterdetails

Updated the filter and custom order CTA

11_shop12-all products

Custom order form with more visual and verbiage updated.

17_custom order19-custom order
Clickable Prototype
All Hi-Fi Screens

Next Step

Remaining Questions

What are the outstanding accessibility issues that we want to address? For example, will users of the webstie validate that the skills and badges aspect of the website is useful? The people I interviewed liked the feature but did not note a personal need for it.
How will we create a seamless experience for users to track all of their orders?
How will we encourage users to engage with the website?

New Feature

I plan to integrate a profile page that provides all needed information to the users such as order history, point system, and message portal to talk to artisans or SAFI customer service.