Responsibilities
User Research・Ideation・Wireframing・Prototyping・Usability Testing
Tools
Figjam・Figma・Keynote・CapCut
Team
Solo Project
Timeline
December 2024~March 2025
VidVibe
Education | Interactivity | Engagement
Boost English skills by engaging videos and gamified practices
Overview
As an English learner, I strive to create an effective solution that helps others overcome similar challenges, encouraging consistent practice and real-life use to enable free conversation. VidVibe enhances users' listening and speaking skills with short, engaging videos on relevant topics, interactive features, and gamified practice to boost English proficiency.
THE PROBLEM
The challenges of free conversation in English
Many intermediate English learners start with a solid foundation but face unexpected hurdles when they enter real English-speaking environments.
Why do these problems matter?
"One of the major difficulties for non-native listeners is the fast rate at which native speakers talk. This rapid pace reduces the clarity of individual words and makes it harder to process meaning."
"Variability in accent and pronunciation presents a significant challenge for non-native listeners, as unfamiliar sounds can impede word recognition and comprehension."
"Idiomatic expressions enrich language, offering vivid imagery and emotional depth that literal words often fail to capture."
THE SOLUTION overview
Based on user research, watching TV shows and movies is the most effective and enjoyable way to improve English skills. This inspired me to create VidVibe, an app that enhances users' listening and speaking abilities through short, engaging videos on relevant topics, interactive features, and gamified practice to boost their English proficiency.
USER RESEARCH
Qualitative interviews uncover real user experiences and challenges
I conducted remote interviews with seven English learners from different countries living in English-speaking regions for education, career, or family. My focus was on their frustrations and satisfaction with learning methods and overall experience.
“I studied in Scotland, where the accents are very strong. They confuse me all the time.”
“When watching a TV show, please use English subtitles. This helps you connect what you hear with what you see.”
“There are some phrases you may not know, but they're quite common in the daily conversations of native speakers.”
“I felt frustrated when I couldn't express my thoughts or ideas to those around me.”
Research insights
Secondary RESEARCH
Competitive landscape shows focus on AI avatars and real-time feedback
I examined 20 English learning apps to better understand the market. I identified five main competitors, most of which focus on AI-avatar conversations with real-time feedback and video-based teaching methods.
Key market opportunities
Framing the opportunity area
Creating a visual media-based platform to boost learning
I defined the product's target audience based on user needs, goals, and pain points. I analyzed these challenges and framed them as three Point of View (POV) statements and How Might We (HMW) questions. I then used the "visual media-based learning" HMW question as a foundation to develop innovative, user-centered solutions that align with the market.
Opportinity
Visual media-based learning method
How might we create a video-based platform that is both entertaining and produced by native speakers, allowing English learners to listen to conversations, read captions, and practice mimicking sentences, accents, and vocabulary, ultimately helping them improve their English proficiency?
IDEATION PROCESS
Brainstorming user needs and goals
I used effective brainstorming methods, including creative constraints and analogies to guide my exploration. These methods allowed me to gain deeper clarity on the solution. I began by listing user needs and mapping a potential solution to each.
Watch movies and TV shows with subtitles to improve listening and mimic natural speech.
Continuously improve accent recognition, listening, and speaking skills.
Learn and practice slang, idioms, and phrasal verbs in daily conversations.
Real-life contents:
Learn idiomatic expressions for practical use in “Express Yourself,” “Talk About Yourself,” and “Immerse in the Culture.”
Outlining the solutions and gaining the early feedback
I translated user needs into innovative concepts by sketching a series of wireframes that included key features.
Early in the ideation phase, I also conducted concept testing to gather feedback and refine the solution.
Prioritization & Sitemap
Prioritizing the app's functionality and building the structure
Create a sitemap that visually represents the pages and screens, clearly depicting the app's functionality based on the prioritized features sets.
Building a sitemap enables me to visualize the product thoroughly and think through the structure easily.
Po
P1
．Captions & explanations
．Video control
．Accents practice
．Progress tracking
P2
P3
．Business English
．Social connections
Final Design | Feature 01
Video-based courses with clickable captions
User Need
Watch movies and TV shows to learn English.
Solution
in landscape learning mode
Users can click on marked words to collect unfamiliar terms for later practice and access instant definitions, creating a more engaging learning experience in landscape mode. They can also adjust the speed, pause playback, and go directly to the practice session.
Solution
in portrait learning mode
Learning focus: Portrait viewing mode utilizes handheld functionality to create a more focused learning environment.
Podcast mode: Enjoy lyrics-only playback with repeat features for distraction-free listening without video.
Real-life topics: Categorize video content into “Express Yourself,” “Life in the USA,” and “Holiday & Culture” to enrich users' life knowledge.
Final Design | Feature 02
Enhance accent recognition
Problem
Users struggle to recognize the variety of native speakers’ accents.
Solution
Accent choice: Collected words are saved in the Work Bank, allowing users to select an accent from the sentence to enhance their listening skills and accent recognition.
Organize words: Sort words into "Know it," "Unsure," and "New" for easy practice.
Final Design | Feature 03
Tune your ear to native speed
Problem
Struggling to follow fast-paced native speech.
Solution
Final Design | Feature 04
AI-guided speaking practice
Problem
Users struggle to find speaking partners anytime.
Solution
Speak out loud: The AI guides users through Q&A, sentence practice, role-playing, visual aids, and freestyle conversation.
User Needs
Users need feedback to improve their pronunciation and sentence structure.
Solution
Offer real-time feedback through conversations with an AI avatar to help users enhance their speaking skills.
Validating process
Evaluating design impact through 2 task flows
I conducted Remote Moderated Usability Testing with 5 participants to assess the video-based English learning app. The main objective was to verify if users improved their listening and speaking skills by watching short videos and completing four practice sessions.
Task 1: The user watches the video "Share your thoughts and opinions with friends" in horizontal viewing mode, completes the learning processes, and engages in all practice activities.
Task 2: The user views the video "Enjoy visiting pumpkin patches in the fall" in vertical viewing mode, listens to the audio and lyrics, and engages in a practice session.
Validating results
Measuring design effectiveness
Design success was evaluated using Success Metrics and Severity Ratings to verify if the solution meets user needs.
“
I think the only issue was that when I did the first task, I didn’t realize I could click on the words to see their meanings. That was it—just the caption feature.
”
Success Metrics
Task Completion
All tasks completed successfully
Task Efficiency
Tasks rated easy to complete
Overall Satisfaction
Users satisfied with the app
Severity rate : Critical > Major > Serious > Minor
Caption Explanation
Critical Severity
Needs improvement
Flashcards Usage
Major Severity
Needs improvement
Search Functionality
Serious Severity
Needs improvement
Takeaway
prioritized iterations
Improvements 1.
Guide users to better understand the app with a clear, big-picture onboarding animation
“It’s like the captions when you watch Netflix or something similar. You need to read them to follow what’s happening. But I didn’t try clicking on them to see what was going on.”
Before
After
Before
After
Improvements 2.
Make accent selection clear, easy to follow, and interactive
2/5 users did not realize that the Accent icon is clickable, highlighting the need for more straightforward explanations or a more intuitive solution.
Use “Add an accent ” to guide users to explore more: A straightforward way to address the confusion.
Before
After
Improvements 3.
Add clear visual cues and progress slider to improve flashcard navigation
All five users agreed that Flashcards need more indicators to show users they can swipe left and right or rotate to the next page.
“This one is probably too simple, and it doesn’t instruct me to go to the next one, so it could be improved in that regard.”
Before
After
Improvements 4.
AI-driven conversational guidance with diverse learning methods to boost user engagement
Users felt the AI avatar dominated the conversation, making learning feel passive. The updated design guides users with multiple interactive learning methods to boost engagement and motivation.
Before
After
ui Kits
CONCLUSION & KEY LEARNINGS
Challenges I faced
Qualitative user research helped me gain insights to tackle the challenge of numerous effective English learning apps on the market
The primary challenge I encountered was the overwhelming presence of numerous excellent and effective English learning apps and platforms on the market. Fortunately, I obtained valuable insights from user research and interviews, where I received meaningful feedback that empowered me to uncover the best solutions.
What I have learned
I have learned from feedback, usability testing, and prototyping
From the project's topic, I learned from my interviewees that interacting with real people and watching videos are the most effective ways to learn a language. Additionally, from the users' perspective, tooltips with text guidance are essential for first-time users who may feel lost while navigating the platform. I also discovered that creating animations to mimic the prototype helps users easily recognize the features during testing.
What I am proud of
An effective English learning app featuring a gamified listening experience
I am proud of my ability to create a fun, gamified listening practice that encourages user interaction. I believe that the app I developed will be a valuable solution for users, especially when it provides beneficial and engaging video content.
Next step
Enhance the practice session that can encourage users to practice daily
I would focus on enhancing the practice sessions, as language learning requires continuous practice and dedication. I aim to find ways to help and encourage users to engage with the app daily to sharpen their listening and speaking skills.
Explore the AI avatar learning method further and enhance its development
Given the growing popularity of AI avatars in the language learning market, I would like to explore this area further and develop a more effective solution for the app.