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.
Annual Membership $99/year (cancel anytime policy)
14-Day free trial for new customers
Reservation booking fee
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
Service window: Thursday-Tuesday
Desktop / Mobile-web
Mobile App (iOS)
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.
As an urban professional, I want to check the availability of a experience so that I can book a party on my birthday.
As a mom, I want to add more items so that I have enough supplies to accommodate a large party.
As a business owner, I want to manage my reservations on the go so that I can make changes if something comes up.
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.
Typography treatment for content cards are styled differently.
Fonts and colors are inconsistent.
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.
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
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.
Add to Calendar Feature
Sign Up After Selecting
Filter Browse Option
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.
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.
Suggesting a background video that captures the feeling of an experience: Joy
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
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
Add a little more personalization by adding a photo, details about the person.
Have a price total present so when you add items, it updates the total price
Remove the redundancy of "add this extra for"
Allow adding addresses rather than re-editing one
Better ux experience to jump to future date faster
Option to add promo code
Add maps integrated feature so users can click address and open with their native maps app.
Joy means: delight, great pleasure, joyfulness, triumph, rejoicing, happiness, gladness, glee, exhilaration, exuberance, elation, euphoria, bliss
Primary | #08bac7 rgb(8, 186, 199)
Secondary | #fb0 rgb(255, 187, 0)
Accent | #011718 rgb(1,23,24)
Accent | #969696
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.