Planning and preparing classes often takes longer than the class itself. ReSource helps teachers find, save, and share resources.
ReSource
Introductions
001
Type of Project
Final project for Udacity Nanodegee
Skills
UX Design
UX Research
UI Design
Product Thinking
Tools
Figma
Miro
Lookback
Zeplin
Project Date
May 2020
Problem
Using the internet to find additional teaching resources is a growing trend. Currently there are over 40,000 private language institutions worldwide and more than 20,000 new ES jobs are listed per month.
Now, picture this: all those teachers out there spending more time prepping for class than actually being in it. It's a real struggle!
Research
002
Research Goal
I want to learn how teachers are currently using digital tools to find resources to supplement their lessons. I will also include researching what goals they wanted to achieve when using these tools. I want to determine what opportunities and needs might exist for new resource-finding tools so that I can use these findings to help me shape the direction I will take in developing this product.
Research Methodology
Market Analysis
Personal Experiences
In person interviews
Observational Tasks
Online Survey
Gathering Data
003
Process
I conducted in person interview sessions with teachers who frequently rely on using resources sourced online. Some of these participants also participated in an observational where I watched these teachers perform specific tasks based on the current tools they prefer to use. I gave the teacher a specific lesson topic and took notes on how they found additional resources and the steps they took once they had found an adequate resource. After the initial interviews I generated an online survey and distributed it amongst teachers in my region as well as to teacher Facebook groups. This survey would help to greater my understanding, while also confirming previous research of teacher needs in relation to finding, using, and sharing resources found online.
Observations
004
Observations
Once I collected the data I organised my findings into an affinity diagram using Miro. Having this data organised helped me to identify possible features and to create a feature prioritisation chart. As a teacher myself I was able to relate a lot with my research but there were still a few surprises that I hadn’t personally thought about.
Throughout my research I was able to conclude that:
- Teachers wanted fast and effective ways to find resources online.
- They needed resources which were adaptable and proven to be good.
- One problem that teachers faced was printing as they normally printed one resource per class member.
-
"Searching for a resource takes me a long time to find what I am looking for"
-
"A lot of resources I find often have mistakes or no way to edit"
-
"I am constantly looking for resources maybe 5 times a week"
-
"I sometimes reuse the same resource but I will normally search for it again rather than saving it"
User Persona
005
Jessica
Barnes
27 Years Old
English Teacher
Living in France
After studying for three years in London Jessica decided she needed a break and decided she wanted to travel while teaching English. After completing her TEFL course, flying through the modules Jessica accepted a position to teach English in a private academy in Nantes, France.
Jessica is currently in her second year of teaching and one thing that doesn't get easier is planning classes. She is often frustrated that planning her classes takes so long and she feels like she plans for longer than she is paid for. Her academy is small but she gets on really well with her coworkers and they try to share resources to save time.
At the weekend Jessica likes to travel to different villages close to Nantes and she is regularly socialising outside of work with her colleagues. Her favourite social media app is Instagram and she loves sharing photos of her adventures with her family and friends back home.
Low Fidelity
006
Sketching
I started by sketching some different screen layouts, based on the feature prioritisation chart. After initial sketching using Crazy 8 and Defined Sketch methods, I decided on a User Flow, following the user journey of a teacher who wanted to search for a specific resource and then add it to their saved resources. I also wanted to incorporate the future features of being able to print easily, access class data, share resources with other teachers and have the ability to see the credibility of a resource through the review and number of uses feature.
Section 1 - Searched a specific resource. They can see all the resources that fit the search and on the side bar they have filter options to refine the search.
Section 2 - Preview function.
Section 3 - Class details like how many students in a class. This is helpful for knowing how many copies to print.
Section 4 - Saved resources. Here they can click on the resources and then print, edit, share etc.
Section 5 - shows the groups the user is a part of.
Section 6 - In this screen the user can see the group header, folders of shared resources, group members, and group chat.
Section 7 - Resource Info Page
Small preview of the resource, the tile, extra information added by the creator, the number of uses, other users star rating and reviews.
Section 8 - Homepage after login. Here the user can search for the resource they are looking for. Below the search bar there is also recommended resources that the user can scroll through.
Low Fidelity
006
User Flow
Low Fidelity
006
Wireframe Prototype and Feedback
Initial Wireframe Prototype
Revised Wireframe Prototype
I chose to use Lookback to assist with user testing. The testing was first performed using a low fidelity prototype produced on Figma based on my previous sketches.
This testing allowed me to confirm the user flow created as well as helped me to identify the problem of users wanting the ability to search new resources at all times.
Key problem: When starting a new search the user had problems and took longer than normal to find how to go back to search. Because the home button is obvious they would click on home and started the progress again from home.
In this new design I have included a "Return to search" button so the user can return to the search results if they decide this resource isn't suitable for them they can return to the previous screen. If they find that this is not the correct search I have included a search bar in this page so that they can start the search again.
High Fidelity
007
Designing a Prototype
From the testing results of the low fidelity wireframes I was then able to use Figma to create an interactive high fidelity prototype. I then began the testing process again to see how users now responded to my designs.
I created a user flow and tested 10 different users so that I could observe their behaviour, movements they found easy, and pains. I would say this testing was very effective and approximately 75% of the users were able to complete all the task in two minutes or less.
During the testing phase, all of the users spent the longest amount of time trying to figure out how to save the resource. It was obvious that I had made a mistake and so I had to figure out where I went wrong. I took note of some comments that the users announced when they had the task to save the resource.
-
“I actually like how easy it is to save but it doesn’t say if it is going to download”
-
“The downloading vs saving was a bit confusing”
-
“I suggest writing the words save as this icon is difficult to understand”
-
“This is a download icon not a save icon”
High Fidelity
007
Iterations
After analysing the feedback and time taken to preform each task the trend showed that the test users didn’t understand the icons I had chosen to represent the task of saving a resource. Other users also commented that they would prefer to have an instant download button as we a save button. Before creating the next prototype I also performed an accessibility review analysing the text size, colour, visibility and accessibility. During the testing period 65% of users mentioned that they thought the menu and home button were very close together and that on a mobile device it was difficult to select the correct option.
I returned to Figma to resolve the issues I had found during testing as well as during the accessibility review. This included increasing the distance between the home and menu button, optimising text colour, size and visibility and changing the icon used for saving a resource and adding the option of direct download.
Conclusion
008
Outcomes
Overall I feel confident that this application is designed by a teacher and for a teacher and that this design adheres to many of the problems addressed in my initial research.
To continue with this design I will be focusing on different needs that were discussed in early research such as the ability to edit resources, upload your own resources and communicate with members of a group.
As this is one of my first projects I feel really satisfied that I have put all of my new knowledge into practice.
The next project I would like to perform is one that is not so connected to me personally so that I have to perform a lot more research and have less biased opinions.
Reflections
This project followed through the process of research, research analysis, low fidelity, mid fidelity, high fidelity, prototyping, iteration, user testing, and further iteration.
During this project I was able to use my skills of conducting interviews and surveys, creating hand drawn sketches, producing low fidelity designs using figma, creating high fidelity designs with figma, testing user interaction with tools like lookback and creating a project portfolio.
When creating my initial high-fidelity prototype, I found I had some problems with accessibility and some of my initial colour schemes which I liked were unsuitable.
One of the biggest challenged I encountered while doing this project was being too ambitious, as I am still learning how to use a lot of these tools, I wanted to be able to run before I could even walk.
I arrived at my conclusion after extensive testing and multiple design iterations. I believe this was necessary to reach the final design prototype I have created. Luckily some of the users who conducted the prototype testing were actually teachers so it was great to hear them commenting on how useful this tool would be for them to help reduce their planning time. Ultimately this was my overall goal, I wanted to create a tool so that teachers didn’t have to spend so long sorting through resources and finding ones which were applicable.