Designing an E-Commerce Platform within FINI

Product Design Intern
Shopify API Integration
Mobile
My Role
Product Designer
Timeframe
2 weeks
Team
Solo Designer

Overview

FINI Marketplace: Partnering with Brands to Sell Specific Products

FINI is a digital health platform that allows user to track progress towards physical and mental goals through a concept known as challenges. Users will participate in self made or community wide challenges with the primary goal of bettering their physical or mental health.

The FINI Shop is an initiative to promote two things:

1. Allowing FINI to partner with fitness and health brands to sell products that fit their audience
2. Giving fitness influencers a platform to sell their products

My Work: End to End Mobile Design

During this project, I worked with another product designer to define our design decisions and brainstorm on solutions to fit our goals. Our work was cross-functional by nature, to ensure that we were creating designs that were solving the problems of our users and addressing requirements by founders and engineers. 



User Research: Gathering existing User Data and Personas to inform my decisions



Engineering: Showing low-fidelity designs and discussing feasibility



Founder / Head of Product:  Seeking their continuous feedback and making variations and iterations to support their suggestions

User Research

Understanding Our Target Personas

I conducted formal and informal user interviews to understand the personas we were trying to target. These personas boiled down to two types: fitness coaches/instructors that want be able to sell products and brands that were interested in associating with FINI. While designing, we kept the major goals and pain points of these brands in mind to design an ecommerce-flow that was as intuitive as possible
Janet Lemmings
Yoga Instructor
Janet is a yoga instructor who holds bi-weekly yoga classes at the beach. She conducts her yoga challenges and payments through FINI and aspires to start her own yoga clothing brand.
Goals
- Starting own yoga clothing brand

- Advertising clothing brands directly to her students and followers.

- Increasing her social media reach
Pain Points
- Struggles to find a good platform to sell her clothing with reasonable fees

- Struggles to find product-market fit and targeting her specific demographic
Aspen
Partnering Fitness Brand
Aspen is a brand of running shoes that aspires to help reduce foot pain while running. As a new business, they need a platform to sell their products and find their target demographic
Goals
- Finding influencers to advertise their products

- Finding ways to advertise directly to their demographic: Runners and Fitness

- Increasing their social media reach
Pain Points
- Struggles to find a good way to market to their current demographic

- Struggles to find influencers to market their products and consistently uses multiple different platforms.

Design Process

Feature Scoping

Our main features/screens within this marketplace would be standard of e-commerce flows:
1. Marketplace Home Screen
- Discover Products
- Search + Filter for Products
- Access Brand Specific Pages
2. Item Details
- Product Description
- Product Price
- Ratings and Reviews
3. Shopping Cart
- Add and delete items
- Cancel Order
4. Check Out and Payment
- Standard Forms
- Payment Screen
- Confirmation Screen
5. Reading and Writing Reviews
- Write a Review

- Review Tags
6. Order History
- See past orders and current orders
- Cancel Orders
Our primary challenge came in  making sure that we were accounting for and designing an end to end experience that covered the extensive edge cases such as, but no limited:

1. Accounting for different payment methods
2. What happens when a certain color/size is out of stock?
3. Can a user edit their order? Cancel Order? All Post Order Actions that are available?

CARD VARIATIONS

Finding Card Variations

I crafted diverse iterations of the e-commerce shopping cart, refining its design through a thoughtful iterative process. This involved careful consideration of user experience, interface elements, and feedback loops to ensure an optimal and user-friendly shopping journey.

Explanation for Review Rating Placement

Explanation: Reviews are the only information within the card that may be missing if there are not enough or no reviews to display a number rating. This card is meant to go on a horizontal carousel meaning that the card must stay the same size. Therefore we need to place the reviews in a place where it would not affect sizing if missing

SCREEN FLOWS

How Might We Visualize Progress Between Badges?

We crafted diverse iterations of the e-commerce shopping cart, refining its design through a thoughtful iterative process. Simultaneously, we conscientiously incorporated references to conventional e-commerce flows, drawing from established industry standards, while remaining attuned to the distinctive goals and pain points of our personas.
Discovering and Purchasing a Product
Order History and Cancelling an Order
Writing a Review
Using the Filters Button

HIGH FIDELITY CALL OUTS

Finalizing Designs

We thought carefully about the products for the marketplace, aiming to support various brands in our UI and screen flow design. Our focus was on creating a user-friendly experience that caters to different product types and brand preferences.
Partnering Brands for FINI
- We created specific sections where users could find specific brands from different products

- Top Banner would be given to Brands who pay for that ad space, generating additional revenue for FINI
Personalized Products
-  (e.g.) users who were in fitness challenges would be recommended products that were categorized as “fitness”

‍- Products would be personalized based on what challenges the user was partaking in
Order Confirmation
- Provides necessary information that a user might want to edit

- Shopify Platform will secure credit card information
Order History +  Cancellation
- Provides one place for users to view all orders

- Users can cancel their orders here

TAKEAWAYS

Balancing Business Goals with User Goals

Balancing user perspectives and a business-centric approach was key in designing the e-commerce flow, ensuring accessibility and appeal to a broader audience. We focused on strategies that not only drive more products to people but also prioritize a seamless user experience, aligning the design with both business goals and user needs.
Up Next: 
FINI

Uplifting Users through Use of Gamification Achievements

Product Designer
Feature Design
Mobile Application