Amanda Fong

HomeGrammy AwardsNFLWatch! MagazineCBS Internship ProgramJoymodeAbout

Joymode

Who is Joymode?

Joymode is a startup that offers users access to fun experiences without the burden of owning and setting up. The users include families, young urban professionals, companies and more. It is currently serving in the Los Angeles Area.

Business Model

Annual Membership $99/year (cancel anytime policy)
14-Day free trial for new customers
Reservation booking fee

Features

Up to 200+ experiences (with weekly new additions)
Create your own experience upon request
Customer service chat agent
Delivery and Pick-up option ($10 less) within the LA service area
Optional add-ons
Service window: Thursday-Tuesday

Platform

Desktop / Mobile-web
Mobile App (iOS)

Goal

Provide a user-friendly experience that allows our user to browse, book and customize their reservation. Retain users by offering the capability to reserve, manage and modify on-the-go through the iOS mobile app.

User Stories

Vanessa, 23  |  Santa Monica

As an urban professional, I want to check the availability of a experience so that I can book a party on my birthday.

Kassandra, 35  |  Sherman Oaks

As a mom, I want to add more items so that I have enough supplies to accommodate a large party.

Michael, 42  |  Beverly Hills

As a business owner, I want to manage my reservations on the go so that I can make changes if something comes up.

Pain Points

I went through the user journey on the iOS app and found some flows that we can improve and features we can add to create a better seamless booking experience.

Design Language

Typography treatment for content cards are styled differently.
Fonts and colors are inconsistent.

Taxonomy

Infromation architecture on homepage displays different types of content vs. the web.
There is no way to filter by categories on homepage. Infinite scroll of experiences.
The category list is buried under search tab in no specific order.

Listing Page / Reservation Flow

An experience page is missing the details information.
The price is located in the middle of the page. Readability is weak because of the font.
The flow is different in comparison to the web. You select dates last vs. first.
Don't have features like "save for later/favorites" or sharing

Research

I did some comparative research on other companies that offer the same reservation flow. Some UX patterns that I want to highlight include the option to share with my friends a post and also bookmark for later use. These apps also have a sticky CTA for quick checkout/reserve and it keeps me updated on price as I make changes to my reservation options. I like how Eventbrite had the option to add it to my phone's native calendar to set reminders at the confirmation level.

OpenTable

Favorite/Share Feature

Reviews

Select Time

Restraurant Details

Eventbrite

Add to Calendar Feature

Maps Integrated

Favorite/Share

Sign Up After Selecting

Airbnb

Filter Browse Option

Favorite/Share

Maps Integrated

Reviews

Challenges / Audit

Due to the inconsistency and missing features, we have to rethink the flow and design language and build out a shared library and components that can be applied to all platforms for web, ios and future proofing for android devices.

Home
Search
Experience

User Flow

The app allows you the option browse experiences without signing in first. I applied the native tab bar to feature the top destinations like search, chatroom, and profile. Under the profile, you would have to ability to manage your settings and view/modify your reservations. For the reservation process, allow users to check availability first. Once the dates are confirmed, enter address second to make sure we deliver to that address. A user will be frustrated if they entered their add-ons and finding out at the end that the experience cannot be delivered. Third, manage add-ons and confirm reservation.

Recommendations


Splash Screen

Suggesting a background video that captures the feeling of an experience: Joy


Home

Go for a simple text only header to seperate content

Create initiative icons without the next of the use of text labels

Allow users to filter by category, party size, date, price, availability


Experience

Build a scrollable image gallery header to show more images of the experience.

Simplify use of typography, font sizes

Left align the content and use clear dividers for each section

Add missing important information about details,

Offer sharing features/favorite


Account

Add a little more personalization by adding a photo, details about the person.

Add Reservations

Add settings

Add Extras

Have a price total present so when you add items, it updates the total price

Remove the redundancy of "add this extra for"

Delivery

Allow adding addresses rather than re-editing one

Better ux experience to jump to future date faster

Review Reservation

Option to add promo code

Confirmation

Add maps integrated feature so users can click address and open with their native maps app.

Visual Design Lanuage

Joy means: delight, great pleasure, joyfulness, triumph, rejoicing, happiness, gladness, glee, exhilaration, exuberance, elation, euphoria, bliss

Logos

Colors

Primary | #08bac7 rgb(8, 186, 199)

Secondary | #fb0 rgb(255, 187, 0)

Accent | #011718 rgb(1,23,24)

Accent | #969696

Iconography

Typoface

Aa

Effra

38 | Heading 1

32 | Heading 2

24 | Heading 3

18 | Heading 4

14 | Heading 5
12 | Heading 6

Iterations

After defining the design system, I began applied these rules to the mobile app experience. Following iOS human interface guidelines, I redesigned a new set of intuitive icons for the tab bar which deprecates the use of tab text labels. I also re-thought ways of navigating on the homepage. I cleaned up the typographic treatments, limited the use of font sizes, and used clear action styles to prompt users that the item is clickable. The design is more simplified and bright which screams a good time.

Amanda Fong - NFL
CBS Internship
Program
Desktop / Mobile
Product Design
View Project
02

Amanda Fong