MOBILE DESIGN

mechmarket

    Role
    UI/UX Designer

    Tools
    Figma, Google Forms, Optimal Workshop

    Timeline
    10 weeks (Mar - May 2023)

mechmarket is a dedicated marketplace app where users can buy and sell keyboard related products. mechmarket currently thrives as a subreddit with close to 300,000 members. Recognizing the potential for improvement, I believe the development of a dedicated mobile app would not only streamline the buying and selling experience, but also unlock a plethora of new features that were previously hindered by the traditional scope of Reddit's functionality.

I managed the entire user experience process for this project from start to finish over the course of 10 weeks. I designed and delivered a working prototype for mechmarket.

mechmarket home screen

Product page

Market listings

Offer screen


FINAL SOLUTION
A dedicated mobile marketplace app featuring a better user experience for buying and selling keyboard related products

View current market trends to get a better estimate of current prices before buying and selling

Effortlessly streamline transactions by sending and receiving offers, simplifying your deal-making process for optimal efficiency

Effortlessly locate the products you desire with convenient access to filters that refine and customize your search criteria


USER RESEARCH
Evaluating the buying and selling experience on the mechmarket subreddit
First click test

In the initial phase, I assessed the ability of 8 participants to navigate the mechmarket subreddit. Testing two distinct user flows, I aimed to determine their proficiency in completing a purchase or listing an item for sale. It's important to highlight that participants had no prior experience with the mechmarket subreddit in this specific test.

Survey results

Approximately 13% of the users were able to complete both tasks. This insight suggests that the user flow may be too difficult for new users.

A word from our participants

"I wasn't too familiar with buying and selling on Reddit. I only use it to browse content surrounding communities that pique my interests. Reddit is the last place I'd look at for marketplace activities"

"Exploring community guides and rules provided insights, but as a new user, the numerous steps felt overwhelming, making a smooth experience seem intricate, especially on mobile


PROBLEM STATEMENT
How can a dedicated mobile marketplace app effectively address and enhance the user experience, overcoming the challenges identified in the current Reddit platform?
Insights
Lack of User Intuitiveness

The buying and selling process on Reddit is not user friendly and poses challenges to new users

Limited Functionality

Reddit's platform is primarily designed for discussion rather than commerce. As a result, features and tools are limited compared to dedicated e-commerce platforms.


USER PERSONA
Introducing Amy & Alex
A look from a different perspective
Amy

Amy is new to the mechanical keyboard hobby. She wants to acquire a new keyboard with a budget cap of $500. However, she finds the current lack of price filtering options quite frustrating on the subreddit. The absence of this feature makes it cumbersome for her to navigate through various products, as they may not align with her specific budget constraints.

Alex

Alex is a veteran on mechmarket. He loves building and collecting keyboards. He wishes there was a dedicated mobile app where he can easily track and view market data. This would spare him the effort of needing to consistently sift through numerous posts on the subreddit, making it seamless to obtain an accurate overview of prevailing market prices.


COMPETITIVE ANALYSIS
Analyzing Popular E-commerce platforms
Digging deeper

I conducted a comprehensive analysis of top marketplace apps to inspire enhanced design concepts for mechmarket. This involved a evaluation of their user interfaces and userflows, aimed at gaining deeper insights into staple design principles.

Findings
Filtering Options

These leading marketplace platforms offer users the capability to sort by crucial metrics like price range. In contrast, mechmarket lacks this functionality, resulting in notable limitations in its filtering options

Direct Image Upload

These platforms empower users to effortlessly upload and capture images of their products for sale, eliminating the need for third-party image hosting services currently required on mechamarket

Offers

These platforms allow users to propose a price for a product, a feature currently unavailable on mechmarket. Currently, users must engage directly with sellers to discuss pricing options


INFORMATION ARCHITECTURE
Laying out the floor plan
Creating the flow

Given the confined space in mobile design as opposed to desktop, I had to carefully consider actions that are touch-friendly and effortlessly tappable. My goal was to create a streamlined user flow that offers easy navigation.

Sitemap

User purchases a product

User sells a product

User edits a submitted offer


WIREFRAMING
Low-mid fidelity prototypes
A look back

These initial designs mark the beginning stages of mechmarket's development journey. Informed by user surveys and ongoing design iterations, the evolution of the design reflects a collaborative effort driven by real-world feedback and continuous refinement


USABILITY TESTING
Evaluating the mechmarket prototype
First click test

In a first-click test with the same 8 participants, I evaluated their grasp of the mechmarket prototype, emphasizing the same initial phase tests. My aim was to determine if there were any enhancements in user experience compared to their previous interactions with the mechmarket subreddit. Below were the results.

Significant improvement over the initial 13%

With the completion rate exceeding 88%, the findings strongly suggest that the mechmarket prototype excels in intuitiveness and user-friendliness when compared to the Reddit platform. Unanimously, all participants agree that the concept of a dedicated mobile app for mechmarket is highly favorable.


REFLECTION
Wrapping up
Retrospective Insights
Project Takeaways

Developing the mechmarket app was my first personal project after completing the Google UX Design course. This endeavor provided invaluable insights into the needs of both novices and seasoned users within the keyboard community, fostering my growth as a Product Designer. Moreover, it served as a platform for honing my skills in Figma, where I delved into techniques like crafting scrollable content, constructing components, and leveraging the auto-layout feature. This enriching journey not only elevated my design proficiency but also enriched my understanding of delivering user-centric experiences

Things I would do differently

Reflecting on the project, I recognize the importance of investing more time in brainstorming and refining the project's direction during the planning phase. This would have prevented the need for frequent adjustments during the implementation of new features. Moving forward, these insights will inform my approach, leading to a more streamlined and effective execution in future projects.