Dynamic table for quick event management to capture big event segment.
Context
Large scale events are messy
Hopin gave the world a platform to host massive virtual events. In-person and virtual alike event management is a heavy task for organizers: managing overlapping sessions, multiple speakers, changing details were a huge pain point for event organizers. They also had to use third party apps to organize themselved. Even worse, it all led to churn of one of the most profitable segment of users.
What You'll Learn
Why a table with inline editing, the most mundane of SaaS tools, revolutionized Hopin's event schedule management.
My Role
I led this critical initiative in terms of UX and CX. I closely collaborated with engineers since this type of a table is very UI heavy and comes with a lot of error prevention efforts. I researched user segments that will benefit from the new tool via user interviews, a round of unmoderated testing and card sorting inquiry.
Goals
Streamline planning directly in Hopin and reduce time on task for big event organizers.
Outcomes
Adoption rate of the solution > 50%. Table view has become the most used view for program management and was later made into a default view.
Experience change
From
Calendar view that required managers to waste time openning and closing details modal for every small change.
To
Complimentary dynamic table that makes detail editing faster and provides a bird eye view of all activities.
Trigger/Problem
At that time our scheduling tool was essentially a calendar view and, as told by our users, there were two main problems:⚡︎ Back and forth between calendar view and session editing modal for every small change
⚡︎ Quick context was lacking: cards could only display 3-4 attributes while every event session had at least 8 attributes
After a round of interviews and data analysis in terms of number of sessions, duration of events, collaborators and speakers we discovered something interesting.
Nearly all event organizers we interviewed used spreadsheets to manage event schedule before uploading it into Hopin program.
Solution
Challenges
It was a very UI heavy project since we lacked a lot of components in the system.
Building new UI components while keeping the system team informed.
Testing micro-interactions effectively in limited prototyping tools.
Starting point
First, we needed to address some questions:
⚡︎ HMW stay on top of overall schedule context while editing individual sessions?
⚡︎ HMW clearly display most important session details?
⚡︎HMW allow quicker session creation when not all details are known to organisers?
We iterated, tested, did a state-of-the-art analysis of Airtable, Monday.com and Clickup to shape out solution. Before proceeding with prototyping I analysed all the types of interactions this kind of a table requires.
Details
Testing
We tested a very interactive concept prototype created in Figma. See the first prototype we tested.
Positive Feedback: Initial user testing confirmed key hypotheses and revealed some surprises, like the need for a "Save on Enter" feature.
Card Sorting: We tested information grouping with 30 participants, leading to adjustments like prioritizing the order of columns. start/end times and speaker names. All research preparations, testing and results syntesis took four days.
Error States & Design System: The final solution included clear error messages for conflicts (e.g., start time before end time) and non-applicable fields. This project expanded our design system due to the numerous micro-interactions and new UI components required.