AI StudyGuide
A tool aimed to help students learn faster by auto-generating flashcards from recorded lectures and digital course materials.
Overview
Role
Product Designer
Duration
4 months
Team
Myself, 1 PM and 10+ devs
Tools
Figma, FigJaM
StudyGuide is a feature on product LearningClues– A NSF Funded Ed-Tech platform that allows students to study efficiently by simplifying instructor provided course materials.
This feature was built with the intent to reduce cognitive overload and prep time for students. While the concept was compelling, the original version of StudyGuide left students confused and disengaged.
My job was to transform the experience into one students would actually want to use.
Impact
faster flashcard creation
found it intuitive and easy to use
more time spent on study sessions
Setting the Stage
Juggling 3+ classes, dozens of lectures, and scattered materials each semester is overwhelming.
Every student, including myself, has faced this question:
What do I even study first?
To assess why students weren’t adopting StudyGuide, I decided to take a step back.
Research
I conducted a survey with 160+ students.
This revealed a key insight— students craved guidance, but current tools weren’t solving that need.
I followed up with focus groups, competitive analysis and heuristic evaluation for the current screens.
Focus Groups:
Students struggled with the onboarding process, they struggled even before landing on the main (test review set) page.
Quizlet was most popular tools among students because of it's clean UI and testing capabilities.
Student had a hard time trusting the content, they wished that all resources were instructor verified.
Competitive Audit:
Only paid version of Quizlet provided access to pro features.
Other systems still require students to do the leg work of creating flashcards themselves.
External resources support was not available in any of these systems.
Heuristic Evaluation:
Found severe usability issues in navigation and main test review set page.
From the research, Emily was born, to represent the frustrations shared by students.
A sophomore juggling classes and part-time jobs. She wants to study smart, not harder—but the original design made her feel lost before she even started.
Her story wasn’t unique as it represented dozens of students’ pain points. This insight became the foundation of my redesign.
make onboarding clear and welcoming?
help users create study sets with fewer clicks?
reduce distractions and make studying more rewarding?
DESIGN SOLUTIONS
#1. Simplified Onboarding
Before: The onboarding had multiple steps with no clear guidance. Users were confused about where to start, and many dropped off.
Design Thinking: I mapped the journey and identified drop-off points using analytics. The focus was on helping students feel like they were making progress from the very beginning.
After: I designed the onboarding experience with contextual tooltips. Users could also dismiss future walkthroughs to avoid redundancy.
Impact: We saw a 40% drop in early exits within the first 2 weeks of A/B testing.
#2. Reduced Clicks in Date Selection
Before: The older date selection logic flow made users go through 5 steps for choosing a custom time period. It lacked flexibility and clarity.
Thinking: I redesigned the logic to reduce steps and make all date range options visible at a glance.
After: Users can now quickly set a custom period and immediately see how it affects their study material.
Impact: Reduced friction led to faster setup and more immediate engagement.
#3. Reduced Clicks in Term Selection
Before: Students were forced to manually deselect each unwanted term—an impractical approach for courses with 50+ terms.
Thinking: I studied how batch selection works in other ed-tech and content-heavy platforms.
After: Introduced a “Select All” and “Deselect All” toggle with the flexibility to modify selections individually, paired with a scrollable list for easier navigation.
Impact: 50% reduction in time to flashcard creation.
#4. Clean, More Focused UI
Before: Overwhelming layout with all options crowded in one place—students felt lost.
Thinking: Used progressive disclosure and modal design principles to prioritize content.
After: Redesigned the test review set view with clean navigation with collapsible menus for non-frequently used features.
Impact: 95% usability score from testers. Comments noted “less distracting” and “more calming.”
#5. Gamified Test Modes
Before: StudyGuide felt passive—students missed active engagement or reinforcement.
Thinking: Studied game mechanics from competitor apps like Quizlet and Duolingo.
After: Introduced timed quizzes, match-the-pair games, and visual feedback to boost motivation.
Impact: Study time doubled per session. Students enjoyed “beating the clock.”
#6. Instructor Help Option
Before: Students always preferred instructor verified content. They also often had unanswered questions while studying but didn’t know where to go.
Thinking: A common theme was identified: students needed a bridge between study content and instructors.
After: Introduced a contextual “Ask Instructor” button tied to course content. This allowed students to get help on tricky flashcards directly.
Impact: Students reported more confidence and fewer drop-offs when stuck.
Below is the final prototyped solution which was handed-off to LearningClues development team in September 2022.
Reflections
💪🏻 Startup culture taught me to work under pressure and stay resourceful
🛠️ Improved at using Figma as a tool and leveraging UI Kits
🫂 Gained proficiency in collaborating and communicating with developers
✨ Achieved stronger perspective toward designing—thinking beyond UI to systems and experience
WHAT I'D DO DIFFERENTLY
📹 Replace helper screens with a 90-second onboarding explainer video
👥 Test with more diverse student populations across different universities
🧪 Run more long-term retention experiments to optimize review habits