Role

Team Leader &
UX Designer

Team

6 members

Timeline

10 weeks,
January - March 2024

Link

Background

For this project, our team was given the challenge of coming up with a product after exploring a topic of interest in depth and testing it with a user base to verify its value and effectiveness. As a team made up entirely of undergraduates, we wanted to create something dedicated to our fellow students. This raised the question of: what would students need the most? Did they need something to assist them socially? Did they need something that would assist them with commuting or housing? Several rounds of brainstorming allowed us to decide that we wanted to focus on something that the general student body would always need: a more accessible and effective way to study.

Assumptions

We made several assumptions we made about what our users, primarily college students, would need in an app dedicated to maximizing their studying experience:

These courses would be difficult and face-paced. There would need to be a way to make it easier to catch up with the speed of the course and make the process of studying for exams much faster.

Focusing on accessible features would not only be beneficial to students with disabilities, but to all students in general.

Given the density of these courses, collaboration would be the best way to have students learn the content and support each other.

Research and Value Exploration

‍To understand the needs of students who had difficulty with learning, we turned to published studies and journals with a focus on disabilities and the benefits of collaboration within a learning environment. We also did an in-depth competitive analysis of 8 different note-taking platforms popular amongst students to analyze the market we would be working in and the gaps within it that we could fulfill. We also sent out a survey for our student peers to receive their direct input and interviewed 2-3 students each for more detailed insights.

Online Research and Findings

For the best variety of research and more accurate data on our scope of interest, we looked through research databases and student testimonials of their note-taking experiences on Reddit.

ON STUDENTS WITH DISABILITIES

4 of the articles we found on research databases highlighted learning disabilities and the benefits of good note taking. We found that:

Students with disabilities record 50% fewer notes than their fellow students and score 20% lower on average on tests
They experienced the most difficulty with writing fast enough, studying their notes meaningfully, deciding what is important to record, understanding what they were being lectured on, and making sense of their notes post-lecture.
Guided notes, clear and legible notes from a designated notetaker, and lecture recordings offered the best support for students with disabilities.

3 of the testimonials on Reddit gave us more insight on the official programs universities put in place to help students with disabilities with note-taking. These programs essentially gathered willing students to be designated note-takers for a specific class they were taking, and these notes would be shared with other students in the class who requested the accommodation. We found it interesting that:

Student notetakers are often offered payment, giftcards, discounts, etc.
Many students expressed frustration at how common it was for designated note-takers to upload outdated notes from previous classes in order to receive the above incentives.

We realized the importance of note-taking services for students with disabilities, but also the need to improve and regulate the service to be better overall.

ON COLLABORATION AND SHARING

2 of the studies we found focused on collaborative learning in online/digital environments, as well as collaboration in higher educational institutions:

Collaboration in note-taking results in more holistic notes for recall, but as a consequence there is less originality
In online/digital learning settings, the scores of collaborative workers were higher than those who had studied individually
Even at higher institution levels, students struggle with knowing how to take notes or how to find relationships within their notes, and one of the universities in these studies found that class discussion and collaboration was more helpful that standardized notes

And we looked into related Reddit threads to gather more specific opinions from students who had actual been exposed to a collaborative environment:

Some students expressed a want to share their notes because of the amount of work put into them
Some students actively sought lectures and notes of other professors if their own lectures/professor were confusing to them
Some students expressed that they would only want to share their notes conditionally, or that they felt that their notes would be incomprehensible to other people due to how personalized they were

Overall, we see that there are many benefits to sharing notes and collaborating with others to study—students get a more comprehensive understanding of their material and in turn, score higher, but on the flip side, a more community approach could limit their individual potential to make more personal connections to the course content, and some students are also protective of their personal knowledge.

Competitive Analysis Chart

User Analytics

SURVEY ANALYTICS

55 total participants
30 specified their major
20/30 STEM majors
10/30 Non-STEM majors
82.1% always take notes
10.7% take no notes
7.1% sometimes takes notes

INTERVIEW ANALYTICS

11 total participants
majors represented (6/11 STEM):
machine learning, graphic communications, early education, history, computer science, communications, human bio, theater, visual art, ocean atmospheric science, physics

Core Insights, Behaviors, and Takeaways

Incentives given to notetakers for students with disabilities can result in volunteers submitting outdated or low-quality notes.

Optimized notetaking is difficult to achieve. There are issues like not being able to write fast enough, not knowing which information to note, not being able to make meaningful connections, etc.

Many students are not sure how to organize their own notes, leading to issues with their own comprehension and sharing with others.

Notetaking is a skill, and many students are not confident that they have it.

Students who take continuous notes during lecture, even if they begin to directly copy and paste the information or just don't know what to write down, do it because it keeps them engaged with the lecture (active listening).

Students are unwilling to share their notes because they don't believe their own notes are "good enough," though sometimes they want to protect their personal work as well.

The biggest surprise to us, and a revelation that went directly against the assumptions we had going into this project, was that collaboration (when it comes to notetaking and studying) was not that important to the students we surveyed and interviewed. This would encourage us to pivot our approach going forward and learn what other ways we could serve our users.

(To the left) Our team discussed different points we had learned throughout the research process and grouped together related insights in an Affinity Diagram. We found the most common themes in our research to focus on going forward, and developed a problem statement to guide us as our project progressed.

How might we design a note-taking and collaborative app for students that makes learning accessible and easy, while also promoting good study habits and making connections with the material?

Brainstorming and Ideation

Design Goals

Users should have a feature that gives them guidance on things they are not sure about (e.g. how to organize, what connections can be made, etc.)

Collaboration features that highlight how collaboration after class can help with learning and retention.

There should be features catered to accessibility: like something to address the issue of lectures going too fast, or the difficulties some students face with active listening.

User Personas

Going into the ideation phase we captured a general idea of the users we wanted to cater to in creating this product. When considering a university environment, we knew the needs of every student was going to be wildly different just due to the fact that there are many different majors within a school. Additionally, there are a diverse range of extracurriculars students can commit themselves to, and each student has their own struggles with meeting their personal goals as well.

We created these two personas with those considerations in mind. We wanted to represent students who were in more humanities based disciplines vs those in STEM based disciplines, students who have responsibilities outside of studying, students with plans to pursue more education after university, students with disabilities, etc.

The creation of these personas in combination with our affinity diagram helped the team choose brainstorm different ideas and categorize them into templates, active participation, organization, and novel ideas.

Individual Exploration

As the team leader, I encouraged my team members to explore ideas on their own before the team recuperated and deliberated together. Since we wanted to represent students accurately, I felt that as students ourselves with different experiences from one another, there could be value in us exploring new and creative ideas separately before speaking with the group. We did a Crazy 8's exercise, in which each participating member needed to illustrate 8 different ideas within a 1-minute timer for each idea. Each person on the team also worked on illustrating their own "vision" of the product we were working on, and we pitched our ideas to each other as elevator pitches.

These sessions proved to be extremely productive, as each team member was able to bring a unique perspective on our topic. We discussed which ideas were our favorite, and decided which ones to pursue based on how well they addressed the needs of the users in our research. In the end, we were able to craft a mission statement together as well:

We aim to improve the note-taking and learning experiences for all students (with an emphasis on students with disabilities) by creating accessible and inclusive processes for note-taking that allow for seamless collaboration between peers.

Preliminary Design Decisions

Below is the first iteration of our UX Flow, which was our guide as we created our first set of wireframes and prototypes.

The main features represented in the flow above are:

COMMUNITY

Ability to share notes with peers, and view and save the notes of others. Can also create and share templates.

STUDY

Generate quizzes from the contents of notes. Can play individually or compete against friends/community.

NOTETAKING STYLES

Toggle features on/off OR drag and drop widgets onto the page. to customize note structure.

AI ASSISTANT

Assistant can explain topics that users struggle with, provide additional resources, assist with citations, etc.

JUSTIFICATIONS AND EXPLANATIONS

Difficulty keeping up → audio recording + transcription

The ability to record during lectures would lessen the stress of needing to keep up with the professor and allow the student to focus more on big ideas and overarching themes of the lecture. The transcription would later help to fill in the blanks and recall smaller details.

Not sure what to write → Community & AI assistant

Users can view the notes of their classmates to get a grasp of what the most important information is and see what others find the most valuable to remember.

Within their own notes, the AI assistant can help with identifying major themes and ideas and further explain any confusing points.

Difficulty organizing → Community & Widget-Based Notetaking & AI assistant

Users can view the notes of their classmates to get inspiration for how they can organize their notes more effectively. They can even use templates to lessen the load of having to think up an organizational structure all on their own.

Using widget-based note-taking, users can structure their notes however they like with different types of widget blocks to organize their thoughts.

The AI assistant can offer tips on the best way to structure the current topic the student is learning.

Different styles of notetaking → Widget-Based Notetaking OR Toggle-Based Notetaking

Typing or writing is not the only way a user might need to take notes. They will often have diagrams or visuals to support their learning. Widget-based note-taking creates “widgets” or “blocks” that students can organize within the grid of their notes so that they can have all types of note-taking within their document organized however they want.

Toggle-based note-taking simply allows students to toggle whatever mode they need at the moment. For example, if they need to draw, they can toggle draw mode to draw directly on their notes and then turn it off to return to the default function (e.g. typing). This is less customizable than the widget-based option, but is less cluttered and more simple to understand.

Maintain active listening and make connections → AI Assistant & Study & Community

The AI assistant can be activated at any point and can be asked to explain topics further or provide additional sources and links to improve the student’s understanding.

The Study feature directly takes the student’s existing notes and generates a quiz that the student can continuously use to practice their active recall on specific topics.

Viewing the notes of their fellow classmates allows users to understand the content from different perspectives, and they can save and turn other notes into quizzes they can study as well for further practice.

Design Phase: Sketches, Wireframes, and Prototypes

INITIAL SKETCHES

WIREFRAMES

Widget-Based Interface

Toggle-Based Interface

LOW FIDELITY PROTOTYPES

As pictured in the previous section, we wanted users to be able to customize their notetaking experience without being too overwhelmed, and we had two different solutions. We called one a "Widget-Based Interface" and the other a "Toggle-Based Interface." Both of them are very similar in that it allows users to change the mode they are using. For example, the default might be typing, but they can change to drawing/writing, recording audio, etc. However the idea would be executed differently depending on if it was Widget-Based or Toggle-Based.

Both types of notetaking operated on a grid system; essentially the document would have a grid that different elements conform to so that the notes could be customizable while still maintaining some sort of structure. Widget-Based notetaking requires the user to drag and drop the mode they want to use into the grid like a "widget." Toggle-Based notetaking allows the user to "turn on" the mode they want to use within the confines of the grid.

The main focus of our user testing was figuring out what kind of note-taking system worked the best for our users. Since a widget-based interface had the most flexibility and opportunities, we presented our users with four different options:

(1) Widgets on the Sidebar

(2) Widgets Commands

(3 and 4) Widgets Top Bar and Widgets Bottom Bar

SIDEBAR

In this version, a sidebar menu opens up. Users can drag and drop blocks from there.

PROS: Most familiar interface.
CONS: Takes up a lot of space.

COMMANDS

Similar to the app Notion, "/" can be used to choose and place widgets.
‍

PROS: Takes up the least space.
CONS: Possibly unintuitive.

TOP or BOTTOM

Widgets always present at the top or always present at the bottom.
‍

PROS: Easily accessible.
CONS: Possibly distracting.

The Toggle-Based interface ended up looking more like tabs rather than toggles, but once these tabs were activated, a corresponding menu would open up to allow users to pick the mode they currently wanted to use. The current mode in use is indicated by the highlighted tab on the side. This interface is much less crowded and complicated than the Widget-Based interface, but slightly less customizable.

Toggles when they are activated.

Toggles activated and being used within the grid.

Two different types: toggles opening up a side menu (left) and toggles revealing a drop down menu (right).

The Study menu showcased how users could automatically generate quizzes based of their notes for individual use, and how they could also combine their note sets with others to create quizzes shared amongst friends.

An early iteration of the Community menu showcased how users could look through different groups (corresponding to courses within their school) to find notes, templates, and inspiration. They would be able to start collaborations with others, as well as download the notes of other users within the same classes to share and compare the information between their notes.

USER TESTING RESULTS

We spent about an hour with 4 different potential users to explore our prototype and evaluate what they liked and disliked. We also invited them to speak about their preferences and experiences with other platforms within the same niche to see how we could polish this product to stand out and be valuable. The overall summary and sentiments were:

Although they enjoyed exploring the different widget options and found novelty in their functionality, the users preferred the toggles more.

All the users identified collaboration as the weakest feature that they wouldn’t use that much.

The study feature was a great way to include people who didn’t take notes on apps because the link can be shared and accessed without an account.

The general perception of the AI feature was neutral. One user mentioned really wanting it, two users mentioned it as being okay, and one user found no use for it.

Based on this feedback, we pivoted our product's direction for the last time due to time limitations, and ultimately removed the collaboration feature since every step of the process following our initial research showed that users did not care about it that much. We adopted the Toggle-Based Interface for the most part, but there were still some positive comments about the Widget-Based interface that we decided to carry over as well. Once a feature was "toggled," a menu will open up with “cells” that can be dragged and dropped onto a grid on the document and can be expanded/collapsed.

With the removal of the collaboration feature, we no longer marketed our product as a collaboration and productivity hub, but instead as a note-taking/study platform with accessible and customizable features to accommodate all styles of learning.

Leafed: Optimizing the Note-Taking Experience

"Grow like your notes do!"