Mango Lakay E-Commerce Website

Discovering new directions and attracting fresh customers

User Research
UX/UI Design
We Design
E-Commerce

My Role

UX Researcher & Designer

Methods

Contextual Interview, Affinity Diagrams, UI Design

Software

Miro, Figma

Duration

Sep - Dec 2021 (4 months)

Client Needs

The Association of Haitian Professionals (AHP) approached us with the aim of increasing its website  Mango Lakay’s transaction volume, but they faced a challenge due to insufficient website users.

Solution Overall

We investigated the issues that led to the lack of popularity of the Mango Lakay (ML) website and conducted user research to redesign the website, discovering a completely new development direction for the brand.

Jump to Final Design

Old Version Looks Like a Scammer Website

Outdated design exudes an unprofessional impression, and cultivating a professional atmosphere is crucial for instilling trust in customers when using an e-commerce website.

Go to Old Version Website

Old Landing Page

The design of the old landing page looks like a scamming website without serious developments, exuding an untrustworthy impression, reminiscent of potential scams.

Old About Page

Using a question mark as an icon for the "About" page is unusual, and there are also issues with broken pictures.

Old Event Page

Event listings have remained stagnant since 2021.

Old Product Page

This website doesn't facilitate shopping; users need to visit other websites to make their purchases.

User Research Process

We commenced by conducting stakeholder interviews to gain insight into their perceptions and sentiments regarding Mango Lakay.

Contextual Inquiry
Interpretation Sessions
Affinity Diagrams

Interviews & Affinity Diagrams

We engaged in contextual interviews with three distinct stakeholder groups: customers, vendors, and the internal Mango Lakay team. Following these interviews, we conducted interpretation sessions with our research team members to transcribe and document the interview responses as affinity notes. Employing the affinity diagram method, we systematically organized these notes into clusters based on their related meanings within each stakeholder group.

Upon completing the grouping process, we extracted one idea from each cluster. Specifically, we derived two ideas from two clusters of customer notes, one idea from the vendor notes, and three ideas from three clusters of Team Mango Lakay notes.

Detailed Affinity Diagram

Customers

Mango Lakay did not resonate with my like I expected or hoped it would.
I trust the shared connection my community provides.

Vendors

I understand the importance of working with the Haitian community to improve my business but I don’t see how ML fits into that.

Team Mango Lakay

Our efforts alone cannot continue to sustain the vision we see for Mango Lakay.
We must depend on the greater community of vendors and customers for Mango Lakay to grow.
Our unique identity is critical to our success.

Within the affinity notes, we identified shared opinions and commonalities among various stakeholders.

Affinity Diagrams

Shared Stakeholders’ Opinions

In addition to the ideas within each stakeholder group, we identified four shared opinions that were consistent across all stakeholder roles by examining clusters of affinity notes from different stakeholders.

As the third shared opinion, we uncovered internal connections between AHP and Mango Lakay that could impede Mango Lakay's development. Consequently, we initiated an in-depth study of their internal relationship.

Stakeholder Analysis

Mango Lakay's visibility to potential vendors and customers is hindered by AHP's internal system. While existing customers and vendors are channeled to Mango Lakay through AHP, potential customers and vendors not affiliated with AHP are inadvertently excluded from the platform.

Based on the insights gleaned from affinity diagrams and stakeholder analysis, we proposed new identities.

Generating Hot Ideas

Mango Lakay's New Brand

We recommend five identities to facilitate Mango Lakay's continued market development and serve as a guiding framework for future website design.

Once we established the overarching directions, we delved into specific website details that could be modified to enhance the user experience for customers.

Experience Modeling

User Journey Map

Through user journey modeling, we examined four distinct phases that users go through when interacting with the Mango Lakay website. This involved mapping out their actions and gauging their feelings based on their quotes from contextual interviews. As a result, we identified design opportunities within these four phases.

The ultimate design recommendations are derived from the insights gleaned from the New Identities and User Journey Map.

Building Product Concepts

Updated Deliverables

New Landing Page

We added a 'Directory' tab in the website header, clarifying its directory nature to users.

To position Mango Lakay as a Haitian culture ambassador, we crafted a culture-rich landing page.

New Vendor Recommendation System

To expand Mango Lakay's reach beyond AHP members, we suggest a vendor recommendation system, where customers can refer their preferred vendors, enriching the platform's vendor resources.

New Vendor Categories & Vendor Cards

In our efforts to position Mango Lakay as a relationship directory, we developed vendor cards and identity-based categorization.

We created categories that allow customers to filter by the vendors’ missions to ease their experience while looking through services.

Jump to Top
© 2024 Designed on Figma and built using Webflow by Jialun Yang