Redesigning a video player, browsering page, and additional features for an SaaS ed-tech startup
Team
Role
Timeline
Tools
Overview
The Impact
20+
4
6
Introduction
Larabee is an ed-tech startup that's focused on short-form video content
Larabee is an SaaS-based platform that aims to work closely with companies to turn standard processes and procedures into short-form instructional videos. Larabee combines clips of repeating actions with text instructions to ensure the learner can follow along step by step.
The Problem
Larabee's front-end was created by the team as needs arose. The system wasn't designed with a focus on usability making it difficult to navigate. The site was also missing features that were intended to be in the wide-scale release.
The Solution
Find out where different users are struggling and work with the founder and engineers to implement changes that address needs while maintaining the original vision for Larabee.
Research
To establish what direction to take the redesign, I needed to learn more about user's experience with Larabee as content creators and learners.
I started by conducting background research on other SaaS companies.
To start my research, I looked into similar pre-existing companies to see how they were priced what features they offered. I focused on annual prices, and how they split services by tier.
I created a survey to learn more about users experience using Larabee as a tool to learn new skills.
I made a survey (n=23) for clients at companies that were working with Larabee to create training tutorial videos for new staff. The questions focused who their target audiences were (for internal use or customer facing) as well as what information they needed accessible before a user started a lesson and their interest in Larabee's Insight feature.
I interviewed stakeholders who were producing lessons with Larabee, along with Larabee staff, to understand content creators experience with the platform.
I took the time to interview Larabee staff and users who had undergone training using Larabee. Users tended to report a positive experience learning from Larabee, but this group had users with different levels of prior experience with the skills they were learning. I also spoke with representatives from companies using Larabee for staff onboarding to understand what concerns they had about Larabee's effectiveness.
Key Insights
Combining the feedback I received from interviews with clients, the user survey, meeting with Larabee's founder, and my own heuristic testing, I found some repeating concerns to keep in mind for my redesign.
Larabee's Team
Larabee wanted to prioritize their unique features through the redesign. This led to a focus on the Insights feature, user customizability, and the way text and videos were presented togehter.
Companies Uploading Videos
Companies uploading content (for clients or employee onboarding) cared most about having their lessons easily identifiable. They tended to be more focused on the browsing page than the video player itself.
Users Watching Lessons
User cared most about parsing information in the video player. Being able to tell how long a lesson would be, how may steps there were, and what they would need before they started were all priorities.
Redesign
Redesigning the Video Player
I experimented with different iterations of the Video Player. Since there are so many parts of the page I needed to figure out what needed to be visible at all times, and which features Larabee wanted to push.
Original
1st Iteration
2nd Iteration
Final Product
Redesigning the Browsing Page
Videos on Larabee are tagged with lots of information. A big part of this redesign became figuring out what information needed to be visible, what could be minimized, and what didn't need to be user facing.
1st Iteration
The Final Product
While meeting with my team to discuss the Browsing Page redesign, it became clear that the Original Page didn't have enough information, while the 1st Iteration had too much information. The Final Product ended up being the perfect Goldilocks solution— just right!
When designing the Insight Library, I wanted to give users options for how they interact with the Insight videos.
A new feature that Larabee wanted to implement was the Insight Library, a compendium of pre-existing short form videos with broadly applicable knowledge that could be attached to new lessons when uploaded. The feature needed to be accessible through the Video Player, and its content needed to be playable alongside a lesson without becoming distracting. To accomplish this, I created 3 designs for ways the Insight Library could be implemented:
reflection