Background
Interactive Micro-Lesson is a video recording and editing tool specifically designed for K-12 teachers. Evolving from an initial online course recording tool, it now focuses on providing teachers with efficient recording and editing capabilities along with a wealth of interactive online classroom features for over 1.8 million + users.
Timeline
Sep 2021 - Jun 2022
Team
2 Product Manager
1 UX Designer (me)
12 Developer
Core responsibility
Design System
Interaction Design
Visual Design
User Testing
Process
MVP
3~4 months
Version 0.1 - 0.6
Iteration
4~5 months
Version 0.1 - 0.6
Hand off
Context
What is our business need?
Enhance Post-Class Online Learning
Pre-class
In-class
Post-class
Under the Seewo brand, lacking in addressing post-class scenarios learning products.
Improve Engagement
Under the educational policies, there's a growing expectation among teachers for diverse digital teaching methods
Currently, out of a total of teachers who used our recording software, a significant 95.23% recorded fewer than 10 videos.
Increase Product Usage
Who we design for?
Adam is a middle school teacher with three years of experience in public education. He currently uses Adobe Premiere to record and edit micro-videos, which he shares with students to help them consolidate knowledge after class.
Emily is a 12-year-old middle school student who is currently in the second grade at a public school. She occasionally uses a computer to review the lessons she learned and to complete her homework. Emily is familiar with using digital tools to support her learning outside of class.
Teachers problems
High learning
curve
Low efficiency
Lack of learning feedback
How might we
Enhance teachers' efficiency and quality in recording and editing micro-lessons
Final Solutions
For teachers to create interactive micro-lessons
Effortless Video Recording for Educators
In user testing, we found that users often struggled to find functions or experienced misclicks. So we aim to improve usability and enhance efficiency during recording.
To address this, we will streamline the layout, use clear labels, and create intuitive navigation, reducing errors and helping teachers easily access essential tools.
Seamless Transition from Recording to Editing
To eliminate the need for users to jump between different platforms for recording and editing, we are combining both functions into one.
The design challenge is to ensure use consistency and ease when switching between recording and editing. To achieve this, we will focus on maintaining uniform controls and a seamless experience throughout the entire process.
Interactive Tools for Enhanced Video Engagement
To increase classroom engagement by adding quizzes and games to videos, we want to make it easy for teachers to create interactive resources.
To help teachers achieve this, we will provide pre-built templates and user-friendly customization options, allowing them to quickly incorporate engaging elements without overcomplicating the process.
Insert Game
Insert Quiz
...
Results
Substantial data and feedback have been obtained
How did I get there?
Research
Digging into the problem
Why we want to develop a new product platform?
Despite a long period without maintenance, it still has active users
There is a significant demand for post-class online teaching scenarios
In the beginning phase, we performed primary researches and data tracking to collect more data, trying to gain a deep understanding of user’s needs and pain point. Next, we hoped to identify the differences in educational recording software.
Secondary research
Competitor analysis
Changes in education policies
Primary research
5X Interviews
Understand user‘s need and pain point, to find opportunity
Data analysis
Identify user pathways and reasons for user attrition
Insights
High learning
curve
-Professional tools
-Jumping between different platform
Low efficiency
-Complex navigation
-Complex process
Lack of learning feedback
-Difficulty tracking each student progress
-No real-time feedback
How to jump from recording to editing
How to design recordings for educational scenarios?
Scenario 1
Recording
Scenario 2
Editing
Publish
Analytics
So, As a teacher
Challenge 1 - Recording
How to Design an intuitive and efficient Video Recording Tool for Educators?
#Define problems
What the usage problems at the MVP version during user testing?
Teachers are struggling with a (During the MVP testing phase), we conducted user testing with a group of angel users, primarily K-12 teachers. Teachers reported difficulty in navigating the cluttered interface, often encountering confusion when trying to locate essential functions. Additionally, frequent misclicks were noted due to the poor organization of the tools, which caused frustration and disrupted their workflow. high learning curve when using video recording tools due to a cluttered interface and frequent misclicks.
#1
Limited and Fixed Recording Area
#2
Users often accidentally tap the editing button while trying to pause recording, leading to costly interruptions and errors that are difficult to undo
#3
“Re-recording and Publish” Option is Easy to Miss
#Solution 1
Expand Workspace: Flexible Views for a Focused Recording Experience
Survey
The findings showed that most teachers use lower-resolution 13-15 inch laptops, and 82.4% frequently utilize internal annotation tools.
Iteration
To address the limited recording area, we designed flexible view modes that allow sidebars to be collapsible, giving users a larger workspace for recording. This offers teachers more space to focus on their content while still having access to essential tools.
In the future, we aim to add more recording modes to better suit teachers' needs.
Existing product users show that teachers’ recording devices are mainly low-resolution and 13-inch small devices.
82.4%
Annotation on slides
13” size
13”~15” Size
Others
Navigator
Side only
Version 1.0
Version 0.2
✅ Selected
#Solution 2 & 3
Regroup Navigation: Intuitive Navigation for a Smoother Recording Experience
The main principle behind this design is to prioritize clarity and increase usability by organizing functions based on their relevance and frequency during recording. This ensures that teachers can easily access the most important tools without confusion.
High
Low
Level 1
System Functions
Level 2
Recording Functions
Level 3
In-Recording Tools
Manu
Feedback
Publish
Editing
#2#3 - Location
Ensure Consistency: Aligning Function Placement with User Habit
After evaluating two layout options, I selected Option 2, which integrates in-recording tools at the bottom and recording functions at the top alongside the system toolbar. This design saves space, aligns with user habits from other seewo products, and reduces friction for teachers transitioning from those platforms. Despite the need for slight user adaptation, the consistency across products ensures a smoother experience
Pros
- Placing core functions at the bottom feels intuitive and simplifies operation
Cons
- In-recording tools on the right side are inconvenient for left-handed users, who represent a portion of the teacher base.
Pros
- In-recording tools at the bottom saves space and maintains consistency with other Seewo products, helping users transition with less friction
Cons
- Users must adjust to recording functions being at the top, but color differentiation aids visibility
Challenge 2
How Can We Ensure a Smooth and Consistent Transition from Recording to Editing?
#Challenge
How to Solve Streamlined Transition Challenges🌟
our solution is combining recording and editing into one platform, with the more streamlined user flow. However, this brings new challenges, such as maintaining consistency between the two modes, ensuring error tolerance, and minimizing waiting time. As the user flow shifts from separate tasks to an integrated experience, it's crucial to design a smooth, intuitive transition that reduces friction and keeps users focused on their content rather than the process.
What is the challenge in transition?
Keep Consistency
How to maintain a consistent layout between recording and editing, ensuring alignment with the Level 1 system functions
Error Tolerance
How to design the system to allow users to easily recover from mistakes during the transition from recording to editing
Waiting Time
How to optimize the design to reduce the perceived waiting time during the transition from recording to editing,
Layout Consistency
Interaction Patterns
Undo Functionality
Autosave
Confirmation for Actions
Loading indicators
Placeholder content
Challenge 3
How Can We Help Teachers Easily Create Interactive Modules?
Background
What create interactive modules
Enhance Engagement & Track Progress
Interactive modules, not only enhance engagement by requiring active student participation but also provide real-time feedback, allowing teachers to track student performance effectively
Interactive Resources
We offer two key types of interactive resources: quizzes and games. Quizzes are ideal for formal assessments, helping teachers evaluate student knowledge, while games provide a more playful way to reinforce concepts and keep students motivated.
Design principle
How can user design interactive modules effortlessly?
Create effortless
The creation process should be intuitive, with simple, easy-to-use tools that allow teachers to build modules without technical expertise.
Real-Time Preview
Teachers should be able to preview modules as they create them, ensuring that the interactive elements work as intended and align with the learning objectives.
Reusable
The design should allow teachers to create modules that are easily editable and reusable, saving time while maintaining flexibility.
#Context
Quiz Types and Entry Points
We initially offered a wide range of quiz creation options that were available across both the recording and editing phases. This gave teachers flexibility in when and how they integrated quizzes into their lessons, whether adding them live during recording or fine-tuning them later during the editing process.
Creation Options
Single-choice
Multiple-choice
Long answer
Rating scale
Answer card
Entry Points
Recording page
Editing page
#Initial PM scheme
Functional quiz mode
We initially offered a wide range of quiz creation options that were available across both the recording and editing phases. This gave teachers flexibility in when and how they integrated quizzes into their lessons, whether adding them live during recording or fine-tuning them later during the editing process.
Recording
- Teachers can directly select the exact type of quiz they want to insert, making it ideal for planned interactions in real time
Editing
- In the editing stage, teachers have the flexibility to insert interactive elements based on the video content. They can review the entire lesson and decide where the interactions fit best.
#Define problem
What's problems based on functional quiz mode
We initially offered a wide range of quiz creation options that were available across both the recording and editing phases. This gave teachers flexibility in when and how they integrated quizzes into their lessons, whether adding them live during recording or fine-tuning them later during the editing process.
Function overload
Too many functions are displayed, making it difficult for users to quickly navigate and select the right tools during recording.
Answer Card Preference
Teachers prefer using answer cards to support pre-existing questions on their slides rather than creating new quizzes directly in the software.
Quiz Type Friction
Changing quiz types is a cumbersome process, causing frustration and slowing down teachers when they need to switch formats quickly.
#Iteration
Unified Quiz Creation: Merging Options for a Seamless Experience
Merge
Add a quiz
Rating scale
Multiple Choice
Answer card
Long answer
Rating scale
Merge
This decision was made to eliminate the need for teachers to choose between different quiz types upfront, simplifying the decision-making process and reducing confusion during quiz setup.
Re-categorize
Separated two functions: default (formerly the answer card) and advanced. The default mode offers a quick, simple quiz setup, while the advanced mode integrates other quiz types, allowing users to easily switch between single-choice, multiple-choice, and long-answer formats when editing or modifying quizzes.
Let's get in touch
Contact
📧 fankaid@iu.edu
Know more
Designed by Kaidi Fan, 2024