LANDING PAGE
-
Work with the stakeholder to understand their vision for the product
-
Receive reviews and feedbacks from the client to iterate the design
-
Map out user flow and site map
-
Design the interface for the product (for both coach and user platform)
-
Clarify the requirements for the development team whenever there are issues arise during the developing process (either discuss with the stakeholder to clarify or internally solving)
My responsibility
Domain
Live-stream
Time
2022 - 2023
Role
UX/UI Designer (cum BA)
Challenge & Solution
Main challenge:
The client wanted a platform where coaches could create online workshops and livestream them at scheduled times. A key requirement was the ability to mark workshops as recurring events, so coaches wouldn’t have to recreate the same session repeatedly.
Solution:
I researched familiar platforms like Zoom, Teams, and Google Meet to understand common patterns for creating online events and managing recurrence settings. Based on these insights, I designed a workflow that follows similar logic, allowing coaches to easily set up one-time or recurring workshops in a way that feels intuitive and consistent with tools they already use.
My Process
-
In this project, I worked directly with the client, which gave me the opportunity to deeply understand their vision and business needs from the very first meeting.
-
Using those insights, I researched similar products to identify industry patterns and explore potential features we could introduce to enhance their platform. I then mapped out the user flows for both the user platform and the coach platform, designed the interface, and created an interactive prototype. Throughout the process, I walked the client through complex flows, gathered their feedback, and refined the design to align with their goals.
-
After several rounds of iteration, the final design was approved and ready for development. I continued supporting the team by breaking features into user stories and clarifying any complex interactions during implementation.
The client’s vision is to create a platform for Coach to live-stream their workshops and Users from subscribed companies can choose the workshops they are interested in to join and invite their teammates as well. The goal is to strengthen the relationships across departments and teams, and increase employee engagement based on their common interest.
Requirement
-
Create public workshops that all users from all companies can join
-
Create private workshops that only users with the workshop's link can
-
Be able to manage their workshops schedule through a calendar
-
Live-stream the workshop 10 minutes before the scheduled time
-
Chat with users in the live stream.
-
-
Can join all the public workshops created by all the coaches
-
Invite their teammates to join the workshop.
-
Have a calendar to manage their joined workshops.
-
Watch the live-stream and chat with the coach and their teammates.
-
Information Architecture
1. User platform
2. Coach platform
UI design
Colors & typography
BG-01
#fbf8f8
Light orange
#fdefea
BG-02
#fbfbfb
Mid grey
#d3d3d3
Grey
#6a6a6a
Dark grey
#4b4b4b
Be Vietnam Pro
Regular
Semibold
Aa Bb Cc Dd Ee Ff Gg Hh Ii Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Xx Yy Zz Ww
0 1 2 3 4 5 6 7 8 9
! @ # $ % ^ & * ( )
LOG IN
Log in with email & password or Google sign in
WORKSHOPS PAGE
Manage all the workshops that have been scheduled
On this page, coach can manage all the workshops that have been scheduled, either create, edit or un-publish it. Also, they can easily launch the workshop that will start in 10 minutes.
CREATE A WORKSHOP
Create a workshop by filling out details and uploading images
To create a workshop, coach have to fill out the details and upload images for their workshop. They can create multiple workshops at the same timeframe by checking recurring workshop checkbox and set the workshop as private or public.
LAUNCH A WORKSHOP
Coach can launch the workshop 10 minutes before the scheduled time
The coach will enter a waiting room to check their camera and micro. When they feel ready, they can start the live-stream to make sure the internet as well as everything else is good to go.
Thank you for watching
HOME PAGE
Overview all the activities
Coach will have a calendar to have an overview of their scheduled workshops. Also, they can quickly access to the workshop starting in 10 minutes and their workshops today.
COACH PLATFORM
THE PLATFORM FOR COACH TO SCHEDULE & LIVE-STREAM THEIR WORKSHOP
USER PLATFORM
THE PLATFORM FOR USER TO JOIN AND WATCH THEIR INTERESTED WORKSHOPS
HOME PAGE
Have an overview of all the activities
Users will have an overview of their joined workshops schedule (via calendar); all now streaming and popular workshops.
WORKSHOPS PAGE
View all workshops or select a category user interested in
LIVE PAGE
Access to all the now streaming & live in 10 minutes workshops
IN LIVE-STREAM
Chat with coach (via public chat) or with team members only (via team chat)
Wireframes
Creating lo-fi wireframes help us align the client's idea with the product visual and features. After agreeing on the wireframes, we can move on to the next step of developing the product.
