ONGOING PROJECTS
Passion: I personally enjoy the full process of product development from the UX Research to the UI Development.
Ongoing Projects: This is a compilation of ongoing projects and personal suggestions on updating features.
Ongoing Project
ABOUT THE COMPANY: GO SESH is a SaaS booking platform designed to empower entrepreneurial trainers to host classes anywhere in the world. The platform provides custom features to grow trainer's and teacher's personal businesses.
ABOUT THE PROJECT: The add-to-cart feature would work as 'a la carte' for trainer's classes. ie. add yoga mat, VIP package
The first interaction shows the trainer's perspective of the platform.
Through the trainer's perspective, I wanted to create a simple way for them to continuously add and remove their a la carte items. The first interaction shows the following:
-
an info hover bubble
-
'+' button to add more a la carte items
-
Once an item is added, the trainer has the option to "remove" it or "add" new item
-
If trainer hovers over '-' or '+' button, it will show "Remove" or "Add-on" in a bubble
The next few screens show the client's view.
The client will see the "Optional Add-ons" on the Trainer's class page. Once the client chooses to click 'BOOK NOW' they will be shown a few options. I created multiple variations of the a la carte feature depending on a few factors:
-
If the trainer has less than 3 a la carte items, the items are shown without a scroll box.
-
If the trainer allows their client to purchase one or more tickets
-
If the trainer adds more than 3 a la carte items
-
If the client chooses to select all the same a la carte items per multiple tickets
-
If the client chooses to select different a la carte items per multiple tickets
Once the desktop version was completed, it was time to design the mobile site.
Mobile InVision prototype will be seen from the client's booking page.
Add-To-Cart Feature
I developed the user flow, reviewed it with the team, then developed the prototype.
Working remotely for this project, we learned the best way to communicate and show mockup improvements was through Google Drawings. I laid the prototype out in the user-flow for the team to leave their feedback so I can edit the mockups.
This allowed the team to leave individual feedback so I could re-design and display the new mockups.
User Flow + Prototyping
Interactive Prototype
Mobile Prototyping
Suggested Project
Update Mobile Booking Page Usability
ABOUT THE COMPANY: GO SESH is a SaaS booking platform designed to empower entrepreneurial trainers to host classes anywhere in the world. The platform provides custom features to grow trainer's and teacher's personal businesses.
ABOUT THE PROJECT: The trainers gave us feedback that when their clients tried to book their class via mobile site and use the promo code feature, it was confusing for their clients because they were not able to see the total after the promo code was applied. As I tested the feature, I realized that it wasn't the promo code feature that was the issue. The total number of tickets, fees, any promo codes applied, and payment total all showed at the top of the page instead of at the bottom of the page. The client should not have to scroll all the way back to the top of the booking page to see the changes made as they are scrolling down the page.
I updated the mobile booking page to be more user-friendly.
Users are very comfortable with scrolling. I wanted to create a feature where the trainer's clients will always be informed about what they are purchasing.
I created the user-flow and prototypes through Photoshop.
I suggested to add a bar at the bottom of the mobile screen that scrolls with the user.
The scroll bar with the greyed out "CONFIRM BOOKING" button will follow the client throughout their booking experience.
The "CONFIRM BOOKING" button will only be activated once the client adds valid payment details or applies a promo code for a free class.
Once the client selects how many tickets to purchase, the quantity and price will show in the scroll bar.
The quantity and total will be automated and totaled.
If the client has a promo code and applies it, they will see the newly discounted rate in the scroll bar.
The promo code applied gives the client a free class, therefore the "CONFIRM BOOKING" button is activated for the client to proceed.
Suggested Project
Utilize Search Engine for Discovery
ABOUT THE COMPANY: GO SESH is a SaaS booking platform designed to empower entrepreneurial trainers to host classes anywhere in the world. The platform provides custom features to grow trainer's and teacher's personal businesses.
ABOUT THE PROJECT: The trainers who signed on to the platform asked if they are able to be found if clients come to the site, search for "yoga teacher" or "personal trainer". I suggested that we revamp the search engine to help clients find the exact fitness & wellness experiences they're looking for near them. I wanted to create a search experience that allows the client to create their own experience within a search.
This is the current search bar.
The current logic of the search bar is that clients can search classes near them or manually search trainer handle or class category
This is the suggested user flow.
This is the user flow for the revamped search engine. Since we worked remote, I designed the prototype and placed it into the user flow for the team to review.
This is the suggested search bar.
This suggested search bar will allow the clients to search:
-
for a session (class), a trainer, or manual search
-
a location
-
when
-
who, what, when
This is the first mockup of the search page results.
I wanted to show the original search on the top of the page. Then, I wanted to give the clients an option to filter their search more to cater to the experiences they'd want.
-
categories
-
price
-
Sort by:
-
Recommendation
-
Highly Rated
-
Most Reviewed
-
-
Distance
-
Location
-
Indoor
-
Outdoor
-