To conduct a thorough discovery phase to identify opportunities and gaps and to validate the solution. Based on the findings of the research, we were to design a new learning experience for students to organize and memorize subjects effectively
Business Analyst, Project Manager, UX/UI Designer
4 months
Discovery phase and UX/UI Design in a form of 85 web app screens with mobile responsive design
A Miro board with all the discovery phase findings, clickable wireframes, a few UI Concepts, and the final deliverable in Zeplin with a style guide and exportable assets
Study Flow is an educational app that helps students to organize study materials and learn how to memorize subjects effectively. To deliver an improved learning performance, we enhanced the traditional note-taking approach with interactive study techniques such as Spaced Repetition, Quizzes, Interleaving, and Categorizing (STIC).
Cieden worked jointly with the stakeholder to understand various study methods and their effectiveness, conduct market research, identify the gaps in competitors’ features, facilitate a brainstorming workshop to ideate and validate the solution, conduct quantitative research (survey), define project scope and a feature prioritization map (roadmap), list jobs-to-be-done, define monetization strategy, build information architecture and the actual UX/UI Design.
The main concept is that all topics and study materials are organized hierarchically using a nested list and a mindmap with collapsible nodes. A node can contain study materials such as notes, images, videos, attachments, etc. as well as quizzes/flashcards which can all be ordered into a Study Plan.
Learning for the sake of learning does not bring long-term results, it may lead to burnout, a waste of time and money. Keeping this in mind, it is essential to create an engaging learning experience to make sure the learners understand why they do it, to make every minute count.
Cieden’s team and the client were focused on the creation of innovative learning experiences, targeting potential users who aspire to organize knowledge and study effectively. A detailed analysis of existing learning methods, conducting market research, and the analysis of competitors’ features have led the team with a number of design questions.
To research the issue in-depth and continue the work with the brainstorming workshop, the team developed a series of assumptions and created jobs-to-be-done frameworks.
After reviewing plenty of competitors, the functionality of their products, and reading user feedback on them, we got a helicopter view of what’s currently available on the market. We identified a trend almost right away. None of the apps we’ve reviewed help users conceptualize and really learn. What the competition does instead is focusing strictly on memorization. They present information in small isolated chunks through flashcards, free of any context. In other words, categorization, which is an essential part of learning, is missing. That’s what we decided to zero in on.
Workshops are intensive sessions used during the design process to solve problems and challenges when cross-functional collaboration is needed. Workshops enable participants to come together for a limited period of time of idea generation and hands-on activities that allow them to achieve an actionable goal.
We started by defining Problem Statement and used 3-6-5 Brainwriting methodology.
After gathering, grouping, and prioritizing all the ideas, we conducted a Sketching Studio workshop to visualize some of the best ideas that later served as a foundation for interaction design.
As a result, we grouped our ideas into epics and voted for the winners.
In the attempts to see what methods and tools students use to study and whether there is a desire to improve this process, we reached out to our potential customers to gather quantitive data. Armed with our initial assumptions only, we’ve recruited and surveyed students to better define their pains and their “painkillers”. That way we removed our own bias and based our further decisions on actual data.
The Value Proposition Canvas is a tool that can help ensure that a product or service is positioned around what the customer values and needs. At this step, we identified our customer’s major Jobs-to-be-done, the pains they face when trying to accomplish them, and the gains they perceive.
After listing gain creators, pain relievers, and products and services, each point identified was ranked from nice to have to essential in terms of value to the customer.
Having completed the discovery phase, we gained an understanding of each function, user actions, user flows, and scenarios. Subsequently, we created the information architecture that merged several modules, which complemented each other and provided a seamless experience for our end users.
In the attempts to see what methods and tools students use to study and whether there is a desire to improve this process, we reached out to our potential customers to gather quantitive data. Armed with our initial assumptions only, we’ve recruited and surveyed students to better define their pains and their “painkillers”. That way we removed our own bias and based our further decisions on actual data.
Based on identified users’ problems, the team developed a high-fidelity product prototype to test the design concept.
As we all know, most students study at night, especially when they prepare for exams. Thus, we allowed them to choose between the light or dark mode in their customizable settings. Later, we added a few different themes to make our product visually appealing to a wider audience.
To ensure consistency in the project implementation, we developed a style guide which is the single source of truth that groups all the elements that will allow the teams to design and develop a product. By utilizing a collection of repeatable components, we create an exceptional user experience.
Active Recall is a memorization technique we utilized in the product design. The technique involves learning something, and then regularly testing your knowledge actively through questions and tests, rather than rereading the material passively. Flashcards and self-testing are yet another group of studying techniques that have proven to be very effective. Spaced Repetition basically tells the user WHAT to study and WHEN based on their previous test scores and on a concept called The Forgetting Curve.
Image Occlusion lets you create cards that hide parts of an image to test your knowledge of that hidden information. The cards generated by this add-on would be best described as image-based cloze-deletions. We further boosted learning retention by implementing flashcards and quizzes coupled with mind map categorization. Such a holistic approach to studying maximizes the chance to retain the knowledge in the students’ long-term memory.
For every node in the mindmap, its title is displayed, but the user can also choose to show more things for each note. These things include:
• sections the user highlighted in the note embedded in the node;
• selected images/videos contained within the node;
• selected questions/flashcards contained within the node.
The mindmap isn’t just a different way of visualizing the same contents of the outline, but also a way of (optional) visualizing the other materials contained within each node: note highlights, media, flashcards, and user’s learning progress (determined by the learning algorithm). If we display too much info on the mindmap, it could become cluttered and confusing very quickly. That’s why we enabled the users to toggle among the different modes of visualization.
prev.
next.