Trade Up

UX Case Study

No trash, only treasure!

Project Overview

My role
Sole contributor
Project type
Mobile-first responsive website
Duration
6 weeks
Tool
Figma
My role
Sole contributor
Project type
End-to-end mobile application
Duration
6 weeks
Tool
Figma

Problem

People struggle to discover and engage in straightforward and safe trade practices for items and services as current solutions are cumbersome and known to be untrustworthy.

Objective

The purpose of this project was to design a modern solution that allows users to easily trade items or services.

Solution

Introducing Trade Up! A platform that simplifies the trading process by allowing users to create listings, browse for items, and propose trades in a secure environment.

Research Background

Research Goal

To thoroughly understand the behaviors, needs, and challenges that individuals face when discovering, and trading items with others.

Research Methods

Secondary Research

Collected data on current marketplaces as well user behaviors and preferences to gain insights into the bartering landscape. This research showed the need for a modern and safe solution for bartering.

User Interviews

Conducted in-depth interviews with patients to gain firsthand insights into their experiences, challenges, and expectations when engaging in bartering practices.

  • Participants: 5 individuals (2 women, 3 men)
  • Age Range: 31 to 70 years old
  • Methodology: Conducted semi-structured user interviews to explore experiences with bartering, eco-consciousness, and challenges in trading.

Competitive Analysis

Examined popular online marketplaces that specialize in trading to identify their strengths, weaknesses, and opportunities that could be exploited within the industry. This provided inspiration for the design to ensure it was unique.

Freecycle
Promotes sustainability
Strong community engagement
All transactions are free
Large volunteer network
Sustainability-focused
Strong community trust
No mobile app
Outdated messaging and UI
Lacks user verification/security
Listia
Points-based marketplace
Rewards store with new products
Auction-style bidding system
Unique credit-based trade system
Auctions and tiered categories
Retail partnership trade options
Poor customer support
Outdated mobile experience
Heavy reliance on ads and fees
Trade Made
Trades both items and services
Badges promote sustainability
Community-driven platform
Flexible trade options
Mobile-first design
Eco-friendly partnerships
Small user base
Non-local trades are difficult
Reported bugs and glitches

Based on the data above, a new competitor could successfully enter the bartering space by offering a secure, gamified trading platform with trust-building features, item authentication, eco-conscious incentives, seamless trade logistics, and a community-driven marketplace for both goods and services.

Affinity Mapping

I used affinity mapping to organize and analyze data from my user interviews, grouping insights into key themes and patterns to better understand patient pain points and needs in the healthcare navigation process.

Affinity Map Insights

Eco-conscious focus

Participants value eco-consciousness, but dedication varies, with most limiting efforts to recycling

Dealing with unwanted goods

Participants usually donate or throw items away as dealing with clutter is time consuming

Bartering experience

Participant’s experience varies but was generally minimal consisting of smaller or low-value trades

Reasons for bartering

Participants trade for convenience, money saving opportunities, and waste reduction

Challenges with bartering

Participants encounter scams and difficulties coordinating logistics which decreased the likelihood of trading

Importance of trust and fairness

Participants highly value trust within trades, while fairness is ensured through item value research

Exchange and evaluation methods

Participants prefer in-person exchanges for item verification with a preference for public meeting places

Communication and notifications

Participants felt that messaging is essential for trades with real-time notifications enhancing visibility

Bartering preferences

Participants want a simple, streamlined bartering process with item valuation and authenticity checks

Empathy Map

Says
"I want a fair, straightforward way to trade items without worrying about scams."
Feels
"I feel frustrated with how complicated trading can be, but I’m excited when it works out fairly."
Pains
”It’s hard to trust people, and coordinating big trades takes a lot of time."
Thinks
"Is this trade worth it? Can I trust the other person and the item's quality?"
Does
"I research values, donate items, or try to trade small things to see how it goes."
Gains
"I love the idea of trading safely and walking away with something valuable."

Customer Journey Map

The customer journey map was created using insights from secondary research, five interviews, an affinity map, and an empathy map. It outlines the key actions, goals, emotions, and challenges users experience throughout each stage of the bartering process.

Awareness
Dan browses online marketplaces to explore trade opportunities.
Consideration
Dan joins local trading groups and reads community boards looking for potential trades.
Service
Dan arranges exchange logistics and meets in a safe location to complete the trade
Acquisition
Dan compares potential trades, researches item values, and evaluates reliability of other traders.
Loyalty
Dan continues trading and builds long-term relationships within the trading community.

POVs and HMWs

I created POV (Point of View) and HMW (How Might We) statements to clearly define the user's needs and challenges.

Research takeaways

Clutter challenges

Most people struggle with excess items and find it difficult to dispose of them efficiently.

Eco-conscious mindset

Reducing waste is a priority, but commitment to sustainability varies among individuals.

Bartering motivations

Individuals trade to save money, reduce waste, and access items not available in traditional marketplaces

Trust is essential

Fairness, transparency, and reputation are critical factors in successful trades.

Logistical barriers

Coordinating trades, verifying item authenticity, and agreeing on value can be time-consuming.

In-person meet-up preferences

Most users prefer face-to-face trades to inspect item quality and ensure safety.

Need for streamlined process

A centralized platform with messaging, valuation tools, and trade tracking would enhance the experience.

Item verification matters

Users want tools for authenticity checks, condition verification, and fair value assessments.

Security concerns

Scams and fraud are major concerns, especially for high-value trades.

Gamification and engagement

Features like points, user ratings, and location-based listings could enhance participation.

Product Roadmapping

Project Goals

Based on my research, I formulated the following goals to guide the direction of the design.

  • Make trading items and services seamless, efficient, and user-friendly
  • Provide a centralized space for users to discover, negotiate, and complete trades
  • Implement verification methods and community driven user ratings to ensure safe and fair trades
  • Encourage users to trade rather than discard to promote eco-conscious habits
  • Simplify coordination, messaging, and logistics to make bartering more practical

Feature Matrix

I had to narrow down the list of features for this project due to time constraints, focusing on those that would deliver the most immediate value to users. To achieve this, I created a feature matrix, ranking features as high, medium, or low priority.

User reviews
Ratings system
In-app messaging
User account
Trader profiles
Listing capabilities
Trade proposals
Real-time notifications
Search and filtering capabilities
Browsable trade categories
Trade status tracking
User identity verification
Item authenticity checks
Public trade history
User-created digital storefronts
User-created lists
Trade recommendations
Trade streaks and milestones
Trade groups
Environmental impact tracking
Logistic management tools
Points system for transactions
Batch item listings
Local bartering events
Customer support
Trade safety guidelines
Fraud and scam prevention
High priority

User reviews

Ratings system

In-app messaging

User account

Trader profiles

Listing capabilities

Trade offers

Real-time notifications

Search and filter functions

Browsable trade categories

Medium priority

Trade status tracking

User identity verification

Item authenticity checks

Public trade history

User-created digital storefronts

User-created wish-lists

Trade recommendations

Trade streaks and milestones

Trade groups

Environmental impact tracking

Logistic management tools

Points system for transactions

Low priority

Batch item listings

Local bartering events

Customer support

Trade safety guidelines

Fraud and scam prevention

Key Features

Based on the insights from the card sort exercise, I narrowed down the key features to four main options, focusing on those that aligned most closely with user preferences and would deliver the highest impact in improving the healthcare navigation experience.

Listing creation

Easily post items or services for trade with detailed descriptions, images, and trade preferences.

Review-based merit system

Build trust by allowing users to rate and review past trade experiences.

Communication methods

Enable direct messaging and negotiation tools to facilitate smoother trade discussions.

Trader profiles

View verified user profiles with trade history, ratings, and past transactions for added transparency.

Trade proposals

Seamlessly propose and accept trade offers while reviewing item details and conditions.

Card Sorting

I conducted an open card sorting exercise, allowing users to organize and prioritize elements based on their preferences, which helped shape an intuitive navigation structure.

Methodology

  • Open card sort
  • 53 topics
  • 3 participants
  • Ages 31 - 35
  • Completed on UX Metrics website

Findings

  • Participants grouped topics into around 9 categories on average
  • Participants used different naming conventions but were generally similar in their grouping
  • Common categories centered around trust, security, logistics, communication, rewards, item information, and item categorization
  • Some participants preferred more granular categories while others preferred broader categories

Opportunities

  • Focus on integrating logistics, communication, and security features
  • Provide comprehensive item information as that was a commonly considered theme among the results
  • Utilize gamification elements like rewards and achievement badges to engage and retain users
  • Consider the naming conventions participants used to include intuitive terminology throughout the design
  • Include robust security features as that seemed to be the most common theme among the results

Information Architecture

Sitemap

I created a sitemap based on results of the open card sort to establish the information architecture, ensuring a logical and intuitive structure for the platform that allows users to easily navigate and access key features.

UI Components

Brand Values

Trade Up is built on the principles of trust, sustainability, fairness, and community, ensuring a secure and engaging bartering experience.

The primary colors of navy blue and coral red establish a sense of reliability and urgency, while orange accents bring energy and excitement to the platform. A set of neutral grays ensures balance and readability.

Typography

Trade Up utilizes Poppins, a modern and approachable font that enhances readability and conveys a clean, professional, and friendly user experience.

Color Pallet

H1 Main Title: 32px
H2 Section Title: 28px
H3 Sub-Section Title: 20px
Body Text: 16px
Captions: 12px
Neutral
Primary
Secondary

Brand Logo

After much iteration, I designed the Trade Up logo to symbolize growth and exchange, with an upward arrow representing progression through bartering. The bold, modern design reflects Trade Up’s mission to make trading smarter, more accessible, and community-driven.

Final design

Initial ideas

Low-fidelity Wireframes

I created low-fidelity wireframes to outline the basic layout and structure, allowing me to quickly visualize and refine the overall design before moving into more detailed iterations.

Homepage

“You” Page

Storefront

Search Results

Listing Page

Low-fidelity Usability Testing

I conducted low-fidelity usability testing to evaluate the core functionality and user flow, allowing me to identify key pain points and make necessary refinements before progressing to high-fidelity iterations.

  • Participants: 5 individuals (1 woman, 4 men)
  • Age Range: 31 to 70 years old
  • Methodology: Conducted usability testing with the low-fidelity prototype to evaluate the ease of use, functionality, and overall user experience of key features
  • The goal was to identify usability issues, gather feedback, and suggest improvements based on user interactions with the platform.

Tasks to be completed

  • Create a listing for your Logitech Bluetooth Keyboard
  • Search for a red lava lamp that you’re interested in
  • Submit a trade proposal to the seller of the red lava lamp

Insights

  • Users felt that the listing creation process was intuitive
  • Some users felt the labeling of the plus button could be clearer
  • Searching for items was straightforward for all users
  • Submitting trade proposals was “simple and clear”
  • Some confusion over terminology in various sections

Next steps

  • Consider adding clear labels to buttons such as the create listing button (+)
  • Rename the “Payment Details” section to be clearer
  • Include help text in the “Preview Listing” screen for increased clarity
View Low-Fidelity Prototype

High-fidelity Wireframes

I developed high-fidelity wireframes to provide more detailed visual elements and interactions, ensuring the design was ready for prototyping and user testing.

Homepage

“You” page

Storefront

Search Results

Listing page

High-fidelity Usability Testing

I conducted high-fidelity usability testing to assess the final design’s functionality, usability, and overall user experience, ensuring a polished and intuitive interface before implementation.

  • Participants: 5 individuals (2 women, 3 men)
  • Age Range: 31 to 70 years old
  • Methodology: Conducted usability testing with the high-fidelity prototype to assess the visual design, interaction flow, and overall user experience of key features.
  • The goal was to validate design decisions, refine functionality, and gather user feedback to enhance clarity, efficiency, and engagement before final implementation.

Tasks to be completed

  • Create a listing for your bluetooth keyboard
  • Locate a red lava lamp you are seeking to acquire
  • Submit a trade proposal for the lava lamp, offering your keyboard in exchange
  • Check if there have been any updates regarding your offer
  • Organize pick-up details with the other trader

Insights

  • Creating a listing was intuitive for most participants
  • Searching was straightforward for all participants
  • Participants submitted trade proposals easily, but desired larger images and a list view option
  • Some participants struggled to find updates surrounding their pending trades
  • Messaging and communication was clear for all participants
  • Some participants mistook the “action required” status as an interactive button

Next steps

  • Consider adding clearer button text so users better understand their purpose
  • Add larger images or labels for trade items to make them more identifiable
  • Provide additional access points to view pending trades from the “You” and notifications page
  • Include a banner on the home page to alert users about action required for pending trades
  • Include a button to the Trade Details page to allow users to execute on the action required
View High-Fidelity Prototype

Iterations

Priority Revisions

I iterated on the design based on feedback from usability testing, addressing issues like improving navigation, clarifying button labels, and enhancing the appointment management process for a smoother user experience.

Testing revealed difficulty with accessing pending trades. A section was added at the top of the homepage for updates and streamlined trade management.
Testing revealed that users often mistook the “Action Required” status for a clickable button. A button was added to clarify its functionality and guide users.
Testing revealed difficulty with accessing pending trades. A section was added at the top of the quick-view list on the “You” page for easy access.
Testing revealed that users felt images were too small when submitting offers. A pop-up feature with larger images and text was added for better clarity.

Final Design

After implementing priority revisions based on usability testing feedback, I finalized the design, ensuring a seamless user experience, improved functionality, and a visually cohesive interface.

Check out the final design!