Case Study
Notiive
Revolutionizing online learning with a community-centric platform
✦ Background
In traditional academic models, lectures, reading, and note-taking have typically been the norm. Nevertheless, studies show that people effectively retain skills and knowledge through more tactile and engaging methods, such as hands-on practice, discussions, demonstrations, and teaching others what they have just learned. *Source: National Training Laboratories Institute for Applied Behavioral Science (NTL)
✦ The Challenge
Design an end-to-end application addressing the concept of learning new skills. When it comes to taking on such an endeavor, some online platforms may employ less effective learning styles and may not cater directly to diverse learning preferences. According to preliminary research, many users may disengage due to a lack of accountability, motivation, or visible progress.
In the ever-evolving landscape of education, one unchanging truth remains: Every learner is unique...
Given the current state of technology, there is an abundance of stimuli and a wealth of platforms and resources available for learning new skills online. Many students tend to have their preferred methods for learning most effectively, and we seek to acquire new skills for a multitude of reasons. In this comprehensive project, I set out to more clearly understand the needs and pain points of users and to build an online learning platform that accommodates this vast diversity.
✦ Scope & Process
73
300+
37
Research
✦ Goals
I aimed to comprehensively explore effective learning methods, reasons for early discontinuation, strategies to support course completion, evaluation and measurement of learning achievements, and the impact of sharing newfound knowledge. This approach would hopefully uncover diverse insights into learning behaviors, barriers, and ways to create a supportive learning environment, ultimately contributing to a holistic understanding of the user learning experience.
✦ Objectives
I sought to uncover why individuals seek to learn new skills, the prevalent types of skills they pursue, the tools and resources they currently use, their preferred learning methods, how learning integrates into their daily lives, the factors contributing to sustained motivation, and the reasons causing users to discontinue their learning.
✦ Methodology
To obtain qualitative insights, user interviews were conducted. Eight participants ranging from their mid 20s to early 40s were interviewed remotely. All users had previous experience with and a genuine curiosity for online learning. For additional data, a competitor analysis of four existing platforms was performed to identify opportunities in current strengths and weaknesses.
✦ Synthesis: Observed Patterns Through Affinity Mapping
✅ Positive Motivations:
+ Professional ambitions
+ Creativity / self expression
+ Strong presence of community
+ Close relationships
+ Achievements and positive feedback
+ The end goal
+ Knowing that “it will eventually click"
❌ Common Drawbacks:
- Time commitments
- Handling negative feelings
✦
What We Learned
Define
✦ User Personas
Through the creation of user personas, I was able draw from my research synthesis to identify unique goals, pain points, and behaviors across a number of archetypes. This served as a jumping off point for all platform ideation that would follow.
✦ Ideation
In order to develop impactful ideas, I opted for using a number of brainstorming techniques. This was crucial for visualizing the problems to be solved in order to align project goals and establish priorities that would achieve a minimum viable product.
✦ Prioritization
⏱️ Features Required for Minimum Viable Product
Visitor course browsing - search and filter
User registration and authentication
Course catalog - divided by category
Provide course dates, enrollment deadlines, and timelines
Course enrollment and checkout process
Lesson content - videos, demonstrations, interactive exercises
Social features - cohorts, discussions, direct messaging
Course progress tracking
Short, digestible lessons
✦ Information Architecture
🧱 Sitemap & Navigation
Because the platform would consist of a wide array of courses uploaded by instructors, the core of the navigation from the home screen would operate by implementing e-commerce patterns to enable learners to browse and filter courses to best suit their needs. A deep navigation menu would accommodate exploration.
A student dashboard for active courses would keep users organized with their curriculums, projects, and classmates. While a remote card sort was conducted early on with 10 participants, this initial sitemap saw iterations over the span of the design phase as flows became more clear.
Design
✦ Interaction Design
🔷 User Flows
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
✦ Sketches & Wireframes
✦ Responsive Design
✦ Brand Core Values
In order for wireframes to evolve into high fidelity, proper planning needed to be taken into account. I first set out to establish the appropriate core values that would capture the tone of the brand's identity. I settled on the following: Accessible, Bold, Curious, Expressive, Friendly, Modern, and Vibrant. This lended itself heavily for pursuing a direction in visual style.
✦ Gathering Inspiration Through Moodboarding
✦ Logo & Visual Identity
Something about community, chat bubbles, pinwheel implying forward motion and progress. Something about the name (Grab from above). Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate.
✦ Component Library
The Outcome
✦ Interactive Prototype
External link can be found here ↗︎. (Required on tablet and mobile.)
✦ Finding the Right Course
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
✦ Checkout Process
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
✦ Direct Messages
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Test
✦ Usability Testing
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
✦ Analyzing & Prioritizing Test Results
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
✦ Revise and Iterate
Wrapping Up
✦ Conclusion
The conclusion discusses personal reflection and learnings as a designer looking back into the project, lessons learned, achieved goals. Next steps and key takeaways from the project itself. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
✦ Next Steps
As time allows in the future, my design plans for this project are as follows:
+ Onboarding and account setup
+ Curriculum interactions
+ Assignment uploading and feedback
+ Virtual campus
+ Lesson discussions
+ Student and mentor profiles
+ Full desktop platform
Final Key Takeaways will go here. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Ryan Emmans 2024
