This project began with the discovery phase, in which research was conducted to gain a deeper understanding of the existing issues that the KNOW learning management system aims to resolve. This consisted of secondary research to understand the problem space using existing data, a screener survey to gain user insights, and one-on-one interviews to fully grasp the motivations, needs, and goals of college students.
SECONDARY RESEARCH — To better understand the problem space that digital learning technology exists in, secondary research was conducted. My goal was to understand the way college students learn in order to make studying more effective. By reviewing information from academic journals, I was able to understand some of the issues experienced by our users:
SCREENER SURVEY — In this step, a research plan was generated to list goals, methods to accomplish these goals, and to identify our target audience. These objectives include understanding the study habits of college students with regard to learning formats, study material, and learning efficiency. A survey was sent to thirteen students enrolled in university, and I discovered the following:
After the research phase, I began to synthesize the data obtained from my primary research to find similarities between user experiences. Here, we discovered that the issues the students faced were different from what was found during secondary research. The insights gained enabled me to create a persona and a problem statement to continue the design process.
RESEARCH INSIGHTS — Affinity mapping was a useful tool to identify patterns commonly experienced by users and organize common issues by importance. These patterns were turned into research insights, which enabled me to identify three pain points that require a solution:
PERSONA — Based on the insights gained in the previous exercises, similarities between our users were used to generate a persona. This is a representation that reflects the shared interests, goals, and concerns of the users identified during the discovery phase. This was extremely crucial in gaining an understanding of real needs and challenges faced by college students.
PROBLEM STATEMENT — A problem statement was generated to guide the ideation phase of the design process.
The affinity map and persona developed in the previous phase enabled me to identify the pain points that require a solution and generate a problem statement to guide the design process. Defining the issue in this way allowed for the ideation process to begin.
USER STORIES — In addition to How-Might-We questions, two user stories were created to reflect our users, their desires, and their goals. These were largely inspired by our persona, Olivia, and go as follows:
MINIMUM VIABLE PRODUCT — Once the user stories were developed, I created two epics to further examine user pain points. This consisted of outlining the steps required to complete the user goals laid out in the stories. This exercise revealed potential features that users can benefit from, as well as improvement opportunities to incorporate in the design for KNOW. Defining these steps enabled me to establish the minimum viable product to be created.
SITE MAP — After mapping out the steps required to complete user goals, I started the process of organizing the content needed to perform these tasks. I created a site map to begin thinking about the different screens required for this website and the ways in which they connect to each other. By creating the information architecture, hierarchy was established for the KNOW website.
The ideate phase enabled me to identify potential design solutions by reframing the problem space, as well as recognize potential gaps and opportunities. How-Might-We questions, user stories, and site maps were tools used to start thinking about what is needed to help users achieve their goals. This phase will take these ideas and turn them into a fully functional solution.
RED ROUTE DIAGRAMS — Once the minimum viable product was defined and hierarchy was established, I created red route diagrams to help users accomplish their tasks. Here, I identified key actions and pages that users will take when using our product. They consist of marking readings as completed, taking assessments and and reviewing results, and using flashcards as a self-assessment tool. The red routes — seen in the form of a user flow — establish the most critical tasks for our product's success.
PAPER SKETCHES — The user flow diagram became a website in this exercise, where I used paper sketches to implement the critical tasks defined in the previous step. Concepts in these drawings include ways to gauge learning progress, study tools for self-assessment, and marking readings as completed in order to prevent students from falling behind on coursework and maximize their study time.
PAPER PROTOTYPE — Drawing on the design used in the sketches, a paper prototype was created to test the usability of our digital product. The success of this prototype will be measured by analyzing the ease or difficulty in performing the critical tasks identified in the previous steps.
GUERILLA USABILITY TEST — The final step in the design phase was conducting a guerrilla usability test. I recruited five college students to test our paper prototype in order to identify pain points and ensure that our product needs is easy to use. We sought to find out if existing features are useful and if there are any issues with our red route user flows. The findings were compiled into a report and consist of the following:
The previous phase enabled me to realize the ideas that were generated during ideation and turn them into a design solution. By identifying critical tasks and turning them into a paper prototype, I was able to identify pain points that need to be resolved. In this phase, I will be refining the design of our product based on the feedback gathered from the guerrilla usability test.
WIREFLOW — To start the refine phase, I redesigned the KNOW website using the insights uncovered during the guerrilla usability test. To do so, digital wireframes were created. This enabled me to map the product's content and create a strong visual layout prior to creating a high-fidelity prototype. This was turned into a wireflow by using arrows to connect the screens needed to perform critical tasks. This illustrates how users will interact with visual components and move through the product.
VISUAL DESIGN — Once the screen layouts were established using wireframes, the process of visual design began. Because KNOW is a learning management system, I used motifs associated with classrooms in the product interface. This includes blue lines as dividers — which is reminiscent of lined notebook paper — as well as a color palette that is inspired by a traditional wood pencil.
MOCKUPS — The visual design elements in the previous section were applied to our digital wireframes. In doing so, we created high fidelity mockups that enabled us to see what our next prototype is going to look like.
The previous phase enabled me to refine the design to better accommodate user needs. Using feedback from the guerrilla usability test, I was able to optimize the prototype and turn it into a more user-friendly product by using digital wireframes to conceptualize the redesign. Once the screen layouts were established, I applied visual design elements to our wireframes and created high-fidelity mockups. These were then applied to the final phase of the design process — user testing.
HIGH-FIDELITY PROTOTYPE — To create a high-fidelity prototype, I took the mockups and connected the screens using Figma. We then performed a usability test to analyze the efficacy of the redesign.
USABILITY TEST I — In this step, I conducted the first usability test using the KNOW high-fidelity prototype. A test plan was created in order to test the efficacy of the design and obtain feedback to further refine the website. Testing on 5 new users allowed for m to gauge whether the product suited the needs of our audience. asked them to perform three tasks: review flashcards, mark a reading as "completed", and taking a quiz and reviewing the results. The findings consisted of the following:
MODIFICATIONS — The first usability study enabled me to use these insights and create an updated design for the KNOW website. These modifications were made according to user feedback to make a more useful product for our target users. To accomplish this, I added a new section to the top navigation, redesigned the "Quiz Results" summary section, and removed explanations from the live quiz — these can only be seen when reviewing assessment results. These changes can be seen below:
USABILITY TEST II — I conducted a second usability test to further refine the design based on user feedback. Using the same script, I tested our modified prototype on 5 new participants and found that the issues were less crucial than those discovered in the previous round of testing. This was determined by the fact that fewer users experienced problems with the updated design. The findings consisted of the following:
REFLECTION —The next step would consist of applying design solutions to the next prototype based on the insights gained during the second round of usability testing.
This project has shown me the ways in which user feedback dictates the products we interact with. The more I spoke to users, the more I understood them and the pain points they experienced as they studied for school. By designing this learning management system, I've learned that it’s crucial to listen to the thoughts of as many users as possible to ensure that the product functions for our target audience.
