Designed for CS 449/649 F22 by Kelvin Zhang, Daniel Lu, Athena Liu, Zhongchi (Leo) Li, and Hong Yi Chen
Introduction
Context, Topic, and Value Proposition
The act of learning has traditionally been very individualistic, which can often feel solitary or isolating, especially when a student is falling behind or finding it difficult to stay motivated. Our project aims to improve collaborative learning and studying among students by creating a tool that enables them to work together and support each other. Specifically, by providing students with a platform for community teaching and accountability, we can help them learn more effectively and efficiently to achieve their academic goals. This is a timely and relevant topic, as more and more students are turning to online learning and remote education due to the COVID-19 pandemic and even well after the pandemic. In the past few years alone, there’s been a significant rise in self-directed learning platforms, such as Khan Academy and Coursera. Despite the success of these platforms, these online courses have a poor completion rate of 15%, due to a lack of incentives, social interactions, and “zoom fatigue.” This presents an opportunity for us to introduce a new, innovative approach to learning centred around online groups.
The Problem
As described in the previous section, the “problem” that we aim to solve is the individualistic learning approach that is prevalent among primarily post-secondary students. Although this is less of a problem and more of just the status quo, we believe that this method of learning is less effective. It can lead to students falling behind, losing motivation, or misunderstanding concepts. Through both interviews with students at the University of Waterloo and online research, we’ve found that the individualistic approach to studying can lead to a lack of engagement in both online and in-person courses. This can result in lower grades, declining mental health, and a poor overall learning experience. As 4th-year students ourselves, we’ve experienced the drawbacks of this approach firsthand and believe that there is a need for a tool that enables collaborative learning and studying. Despite the availability of resources and tools for independent study, we believe that a group-oriented way of learning can improve students’ study habits and help them achieve their academic goals.
As such, our overarching goal is as follows:
“Create a tool that enables collaborative learning and studying to improve students’ study habits and help them achieve their academic goals alongside their peers.”
The benefits of solving this problem are as follows:
- Students will be able to obtain support from their peers, which can help them stay motivated and engaged in their studies.
- Collaborative learning can provide students with incentives and motivators that encourage them to keep up-to-date with their coursework.
- By centralizing multiple studying tools into one platform, we can reduce the number of apps, websites, or services that students need to use in order to learn effectively.
- Our tool will provide students with a single hub where they can share notes, discuss questions and assignments, and connect with their classmates without having to manage multiple platforms. This can help them to organize their studies and improve their learning experience.
Our Solution
The solution we’ve created is StudyHub, a social platform for studying. It enables students to easily set up study groups and provides them with a platform for community teaching and learning.
Features of the app include shared notes, collaborative practice problems, and incentives to encourage productive studying habits. Our goal is to improve students’ study habits and help them achieve their academic goals by providing them with a supportive community, tracking their progress, and incorporating gamification features. Moreover, students can use StudyHub to meet new classmates and set up accountability partners, who are individuals who support each other in keeping commitments and maintaining progress on their goals. This can provide students with a supportive community to help them stay motivated and engaged in their studies.
StudyHub is designed with multiple types of students in mind, including full-time students who are excelling in school, full-time students who struggle to keep up, and mature students who are balancing school with a full-time job. Whether you’re a top student or just trying to catch up, StudyHub can help you succeed.
For a demo of StudyHub, see here: https://drive.google.com/file/d/1mkL1KMBylR4lVYOvZrj2VyvRfgKOWbeP/view
Our Findings
One of the key insights from our evaluation of the StudyHub prototype is the importance of providing clear and concise instructions to users. In our user testing sessions, we found that students often had difficulty understanding complex or multi-step processes, and they appreciated having explicit instructions and guidance to help them navigate the app.
Another notable finding from our evaluation is the need for regular user feedback and iteration. In our interviews with students, we received a range of suggestions and feedback about how to improve the app, and we used this information to iterate on the design and features of StudyHub. This highlighted the value of incorporating user feedback into the design process and the importance of regularly testing and refining the app to ensure that it meets the needs of users.
Finally, we found that students were highly receptive to the idea of using incentives and gamification to encourage productive studying habits. In our user testing sessions, many students commented on the potential benefits of being able to track their progress and earn rewards for completing goals or challenges, and they were excited about the idea of competing with their classmates in a fun and engaging way. This suggests that incorporating gamification elements could be an effective way to motivate and engage users in the app.
Background
Meeting Student Needs/Wants in a Collaborative Learning Environment
After conducting extensive research on student needs and theories of collaborative learning, we have identified several key takeaways that have informed the development of StudyHub.
The article What is Collaborative Learning by Valamis underscores Vygotsky’s Theory of Social Development. This emphasizes the importance of communities in knowledge creation and sharing. This suggests the potential benefits of a mentorship or partner-based approach to learning, where experienced individuals can share their knowledge and skills with inexperienced ones. By fostering a community teaching environment, our application will enable anyone to act as a “More Knowledgeable Other” and share their expertise with others.
Diving deeper into the benefits of a partner-based approach to learning, we found additional support for this approach in Darren Finkelstein’s article on the 5 Benefits of having an Accountability Partner. Finkelstein highlights the potential of accountability partners to act as unbiased observers and supportive partners in helping individuals plan, strategize, and stay focused on their goals. These insights reinforced the importance of incorporating an accountability system into our online study groups, in order to help students stay on track and achieve their learning objectives.
Examining Existing Solutions and Products
After analyzing the tools we use on a daily basis for school, we realized that there is a wide range of preferences for note-taking methods among students. Some prefer using paper and pen, while others prefer tablet or computer-based tools. We found that certain note-taking apps, such as:
- Notability — for easily annotating slides and lecture content via a tablet and stylus
- Notion — for the customizability and overall organization
- Microsoft OneNote — for the efficiency of typed notes and text editing
We also watched a YouTube video on the perfect note-taking app, which provided insights into the different types of learners and which tools they might prefer. These insights informed the development of our application, which aims to support a variety of note-taking methods and preferences.
Beyond these actual tools, students employed different methodologies . Two popular ones included the Pomodoro technique and using flashcards. The Pomodoro technique is a time management method that involves breaking down work into intervals separated by short breaks. This technique helps individuals stay focused and avoid burnout by regularly taking breaks. Flashcards, on the other hand, are a study aid that consists of a question or prompts on one side and the answer on the other.
This research helped us identify a few key insights that will inform our design. Firstly, we found that students follow a similar workflow when preparing for exams, which includes taking notes, completing assignments and practice problems, and reviewing notes. Secondly, we observed that these steps could be more effective in a collaborative environment. This is because collaboration can provide students with peer support, accountability, and access to a wider range of perspectives and experiences.
By shifting to a collaborative model, StudyHub will aim to reinforce learning outcomes and improve student engagement and motivation. Additionally, we recognize that many students use multiple tools and solutions in their daily study routine, which can be difficult to manage and keep organized. Our solution combines all of these tools and resources into a single platform, so students can access everything they need for a particular class in one place. This will help reduce the organizational overhead required to manage multiple applications and methodologies and make it easier for students to stay on track and focused.
Context
To better understand the context of the problem we are tackling, we used a value proposition canvas to visualize our product-market fit. The canvas served as a way to find the intersection between our vision of our customer and the product that wanted to create.
Starting with who our customers are, we drew on our own and our colleague’s experiences as students to help us articulate their needs, fears, and wants. Some of the most important insights from those are that students need passing grades and to stay up-to-date with class content. Students want a sense of fulfillment and community. They also fear not being able to meet their standards or even just falling behind in classes
Those insights gave us a general idea of the product our project was going to focus on — creating a platform where students can easily collaborate on a set of notes for the class, meet other students in their courses to work through difficult concepts together, and gamify the entire experience using an activity tracker to motivate healthy habits. By offering a social experience, we can help these students stay engaged in their courses through a more interactive and enjoyable study experience.
With these values identified, we generalized them to be embodied by three different personas. For each, we created an empathy mapping to help us better understand their needs, experiences, and pains.
Tatiana — the studious undergrad.
Tatiana represents an organized, detail-oriented student. She values the idea of learning by teaching and wants to be able to discuss course material in-depth to gain the most out of it.
For Tatiana, our empathy map illustrates a confident, passionate learner. The brands she’s affiliated with describe her broad toolkit of studying applications that all help her organize, but none of which fall in the intersection described in our value proposition canvas. None achieve the collaborative, slightly-competitive gamification that we envision. As we will go on to show, our emphasis on collaborative study planning in the form of easy calendar access and accountability study partners came from empathizing with Tatiana’s desire to find time for insightful course conversations.
Nivlek — the struggling, forgetful high schooler.
For Nivlek, we drew inspiration from feelings of disorderliness, stress, and a sense of falling behind. He doesn’t necessarily have everything in order the way Tatiana does, but he still wants to be able to pass his courses.
In building his empathy mapping, we wanted to connect with his frustration with the courses that he wants to pass, despite having skipped lectures. He would love for studying to be more fun and efficient.
Abram — the mature, part-time graduate student.
For Abram, we sought to relate to someone that may not have too many connections inside of the school environment.
One group member, Daniel, drew inspiration for the empathy mapping from the experiences of his mom who’s currently studying an online law program in her free time. She would often try to join miscellaneous Facebook groups to meet others in her program. Without a lot of time, she often has to watch recorded lectures and find ways to study without always being present the way a full-time student can be.
Visualizing the motivations and experiences of these 3 very different personas helped us reflect on our value proposition. While each had a very different background, each found a mutual desire for a collaborative environment. We also found that gamification and social incentives of would be vital to creating an engaging application. This would be further illustrated once we did user interviews.
User Interviews
We conducted 1 mock interview and 3 user interviews to confirm our findings and look for new insights. We focused a lot on asking open-ended questions about what their studying experience is like when it feels the most effective, and how it could be improved.
We learned a lot and found that a common pain point is the lack of focus while studying. All interviewees expressed the pain of getting distracted during their study sessions. We also gained insights into possible solutions to that problem, such as introducing collaboration to hold each other accountable, introducing app integrations so that users don’t have to get off the platform, and introducing a gamified experience to motivate and encourage others.
From these insights, we worked to create an initial affinity diagram to group their answers.
After feedback and working through our ideas, we then generated a secondary affinity diagram that clustered answers into groupings. This helped us to more critically analyze and find patterns within our interview answers.
Lessons from our Affinity Diagrams and how we acted on them
1) Studying is boring, let’s help them feel engaged through collaboration and gamification
Our interviewees often returned to the idea that studying is boring and unengaging. It’s easy for students to lose interest in the tasks at hand, especially if there is no instant gratification or reward that is visible after the hard work is complete. A huge cluster of answers revolved around creating a way for work and progress to be tracked, giving an opportunity to visualize the completion of work.
From this, we found that one critical aspect of our application would need to make studying more engaging. Connecting this to pain points relating to finding others to collaborate with, we felt that it’s critical to create social incentives through gamifying the application.
2) Using many different platforms and tools to study can be distracting, so let’s make a single hub that helps you navigate and work between them
Getting distracted was a major grouping among study pain points. Interviewees then described how using many different tools, each with a different use could often become a source of distraction. Students described how navigating between different tools could lead to notifications and other pop-ups pulling away their attention.
Thus, we learned creating a single platform that could improve and minimize navigation between tools could help reduce distractibility.
3) Students struggle with accountability, so let’s build them a support network to hold them accountable
There were many instances where interviewees felt like they would value something to hold them accountable. They would often fall behind and only allow it to get worse without anything to latch onto. We saw this both as a sign that some sort of progress tracking and gamification would be valuable, and also that our ideas for a collaborative platform could be important. These thoughts would eventually go on to become an inspiration for our accountability partner system.
Hierarchical Task Analysis
Finally, we worked through a hierarchical task analysis to analyze the processes that a user would move through. In doing so, we identified 3 primary goals for a user.
The first goal is to study for exams. Success in this area means having a clear understanding of the material, being able to identify what is important, and being able to recall the information when needed. From our HTA diagrams, we came to realize that this process can be broken down into two steps: “review” (1–4) and “application” (5–6). In the review phase, most of the time is spent on reviewing notes and re-doing past assignments and tests. There seems to be an opportunity to automate or gamify this process since it can be very structured and tedious. Finally, applying the knowledge mostly comes in the form of doing practice questions.
The second goal is to take effective notes. This means being able to identify what is important and organizing the information in a way that is easy to understand and recall. The main focus of this area is on reviewing previous notes (2) and organizing notes (5) after a lecture. We identified these as big pain points as students often will skip review/organization as it involves too much friction — to get around this, we can try to build a system to make this process easier.
The third goal is to do assignments. This means being able to understand the instructions, being able to complete the task, and being able to submit the assignment on time. In order to be prepared to start the assignment, students should ensure that they are up to speed on lecture material so that they can apply the relevant knowledge. When completing an assignment that is difficult, there is often trial and error involved before a solution is found. In this process, students tend to pattern-match to find similar questions that may have been covered in lectures so something like a search feature would be useful.
After walking through these processes, a few features really stood out to us as being valuable for the users.
- A review feature that allows students to quickly review notes and past assignments.
- An organization feature that helps students to organize their notes after a lecture.
- A practice question feature that allows students to test their understanding of the material.
- A search feature that helps students to find relevant information when working on an assignment.
Design
In order to create a high-quality, user-friendly prototype, we iterated on our solution through various design tools such as storyboards, user flows, and low-fidelity prototypes. These techniques helped us take the key problems and formulate early-stage designs to address user needs. Our main goals were to help motivate students and enable them to be productive by providing a way for them to organize their notes in one place.
Storyboards and Sketches
By creating storyboards, we established an initial idea of how a user will accomplish the goals above.
The first storyboard shows how a student can upload a note to the platform by choosing a source. Notes can be taken using different mediums such as paper and electronically (electronically can vary from app to app). This captures the core of what needs to be accomplished — having a way for users to unify these different notes in one place. Establishing this allowed us to expand on it in our future designs.
The second storyboard shows how a student was unmotivated to study at first but felt encouragement to study from looking at their study streak as well as their peers. The study progress tracker helped the student start studying and they felt part of a larger student community, which motivated them to continue studying. This interaction in a forum-like manner was the beginning of our iterations on how students can interact with each other.
The third storyboard shows how a student gains motivation from an accountability partner, which is a more direct way of interaction. The student felt external pressure from a specific person and was, as a result, more productive. This one-on-one interaction via chat was the initial idea of how students can interact with others to be held accountable for meeting their study goals.
The fourth storyboard shows how a student gains motivation from study achievements that give a sense of fulfillment. They work hard to get various badges to show off to their friends on their profiles. This shows how achievement can be used to motivate high-achieving students.
User Flows
After creating these storyboards, we then created user flows which then helped us define fine-grained steps and understand which steps a user might take to accomplish a specific task. We created the corresponding user flows for the storyboards above.
We incorporated these user flows into designing the initial UI to tailor to the key user needs. These user flows helped us develop UI for finding an accountability partner, discussion forums and a study dashboard. Specifically, we used the discussion with peers diagram to help us define details of how this forum may look like. We also created two flows for accountability partners in order to see how this interaction might take place in two alternative ways. Note uploading/organization helped us improve students’ existing workflow (which is scattered across various apps/mediums) and make it more efficient. The study tracking also shows how this progress may be tracked.
Low and High Fidelity Prototypes
We then proceeded to design low and high-fidelity prototypes to refine our design. We made various trade-offs during this process. For example, we refined the layout of the UI to make it clean and user-friendly. Users could take a look at our app and learn how to use it very easily. The features were all easily discoverable with a bottom navigation bar. We also experimented with different colour combinations and eventually came up with a design system that was neutral and gave a very sleek look to the app. As learned in the readings, aesthetic interfaces are crucial to a good UX, so we worked to create an aesthetic design that was jam-packed with practical features.
As we progressed through user testing and future refinements, we made multiple changes that were based on the initial ideas we had from storyboards/user flows. We built various features off of the core user goals and fixed usability issues. We simplified the UI for finding an accountability partner throughout these processes as it was initially confusing by having various steps (one for each class, matching with a partner). We removed some unnecessary information and made the button’s text be more informative. We also improved the forum by allowing multiple ways to interact with a post. Instead of just posting and replying to a post, students can like, dislike, share posts and like/share comments. This makes the sense of community more real when discussing course material with others. We also made sure to show the study progress in an easily visible spot, the home screen so they can access it whenever they need. We also added enhancements to help them stay connected and updated to classes by designing an updates screen to remind students of deadlines as well as motivate them by showing them interaction on their posts. We also added a feed to let students see an overview of what is happening in each class.
In the end, the UI was sleek and the UX was polished so that the user could use the app with ease and take advantage of all of the features that were carefully designed.
Test
In our testing phase, we interviewed a total of 5 participants who were selected to represent a diverse range of ages, academic backgrounds, and courses. The ages of the participants ranged from 18 to 22, all of which were undergraduate students at the University of Waterloo. The participants were enrolled in a variety of programs, including computer science, engineering, and business.
Key Findings
Our user testing revealed several key findings that informed the design changes we made to the prototypes.
- In our low-fidelity prototype, the process of uploading a note was somewhat obscure — as one of our main features, the only way to access it was through a small “+” button on the navbar. We had also designed custom modals for the entire flow, which served to be hard to interact with on a mobile device.
- The home screen was not clear and did not provide enough information about the purpose and potential actions that could be taken in the app. Many participants had difficulty understanding the app’s main function and the actions they could take from the home screen.
- On the Figma prototype, the feature for finding an accountability buddy was not well-defined and lacked clear instructions on how to use it. Many participants were unsure of how to join a class and add an accountability buddy.
Our high-fidelity prototype was much better received, and we found that we didn’t have any major concerns in the main feature flows of our app. There were some smaller details, like adjusting colours to have enough contrast, adjusting the size of icons, etc. that we implemented for additional clarity to the end-user.
Design Changes
Based on the findings from our user testing, we made the following design changes to the prototypes:
- We switched from modals to iOS-native components, such as a drawer popup and a built-in file selector. We also moved the navbar to the bottom of the screen to be thumb-friendly and made the upload notes button the primary CTA.
- We redesigned the home screen to provide more information about the app’s purpose and potential actions that could be taken. Our high-fidelity prototype included concrete examples of posts the user might see, instead of just mock data. We also moved our main features into their own icons in the navbar, instead of accessing them through a hamburger menu.
- We added in another screen to be shown the first time a user uses the accountability partner feature. We also added the ability to search for specific classes and connect with other users in the same class.
In general, we found the user testing phase to be invaluable when designing our final app because it provided us with valuable feedback from our target audience (students) that helped us identify areas for improvement and make necessary design changes. Our pilot interview also taught us the importance of including more in-depth follow-up questions to better understand participants’ thought processes and reactions to the prototypes.
After all of our tests, our final prototype looked like this:
If you’d like to play around with the prototype, you can do so at the following link:
Conclusion
Reflection and Key Insights
In conclusion, the UX design process is a crucial step in creating effective and engaging products and services. Through careful research, analysis, and iteration, we hope to have created user experiences that are intuitive, user-friendly, and effective. Some key insights that we have learned through this process include the importance of clear instructions, the need for iteration and user feedback, and the value of creating a safe and inclusive community for users. By incorporating these lessons into our design process, we can continue to create products that meet the needs of users and help them achieve their goals.
One of the key lessons we learned during the UX process is the importance of providing clear and concise instructions to users. When designing interfaces, it’s natural to assume that users will be able to figure out how to interact with them as they use them. However, as the instructions become more complicated, it’s possible for the interface to exceed its capacity for conveying information clearly. In these cases, it’s often best to provide explicit instructions and set clear expectations for the user.
As an example, in our accountability user flow, we initially tried to show the process of finding an accountability partner through a series of interfaces. However, this quickly became confusing for users and they were unsure of what to do next. To improve this, we added specific, concise instructions and messaging to specify statuses, steps, and options. This helped users to understand the process and navigate the user flow more effectively.
To further improve the user experience, we also added a tutorial screen before the user flow began, to inform users of what interfaces were coming and what they should do in each. This set users up with expectations of what was to come, making their experience with the user flow much smoother. Overall, our experience with this project has taught us the importance of providing clear instructions and supporting users throughout their journey.
Another important lesson we learned is the need for iteration and listening to user feedback. We were surprised to find that the end product often differed significantly from our initial ideas, and it was crucial to keep iterating and incorporating user feedback to create a design that best served their needs. In the end, the aesthetic appeal of the design may not be the primary concern; what’s most important is creating a user experience that is intuitive and effective.
Current Limitations and Future Plans
Some of the limitations of the current product include:
- This platform relies a lot on network effects in order to succeed. This means that without a large user base, there is limited potential for finding accountability partners and engaging in discussions with other students.
- Student adoption is a major challenge. Figuring out how we can incentivize students to switch from their existing tools and workflows onto this platform will be crucial to its success.
- The app is currently only optimized for mobile, which may not be the ideal learning and studying experience. Desktop is something we’d like to pursue in the future.
There are two overarching goals for StudyHub’s future plans:
- Creating a safe, inclusive space for students to learn together.
- Becoming a hub for all of your courses, used by students worldwide.
There are several steps that could be taken, but some potential ideas include:
- Expanding the range of course materials and resources available on the platform, to make it a comprehensive study tool for students in different subjects and levels of education. This could involve partnering with educational institutions and organizations to provide access to a wide range of learning resources. Also, it could include integrating with other study resources and tools, such as online tutoring services or practice quizzes.
- Developing additional incentives and gamification elements to motivate and engage users, such as physical rewards for completing study goals or challenges.
- Building a strong and diverse community of users by promoting the app to students and educational institutions around the world, and incorporating features that encourage users to invite their friends to join the platform.
- Creating a safe and inclusive space for students to learn together by implementing strict moderation and community guidelines, and providing support and resources for students who may be experiencing challenges or difficulties. This could involve providing access to mental health resources, academic support services, and other resources that can help students succeed in their studies.
- Incorporating feedback and suggestions from users into the design and development of the app, to ensure that it continues to meet the needs and expectations of the user community. This could involve conducting regular user surveys and focus groups, and using the results to improve the app’s features and functionality.
