techEd

ROLE
UX designer 

CLIENT
CareerFoundry

TIME
10  months 


Overview

As someone who has experience in primary and secondary teaching, I always found that I spent many hours preparing for lessons. I always wished I could've saved time with my preparation by having access to more interesting and creative lesson plans/resources.

Process:  Human Centred Design Thinking and Agile Methodology 

1. Understand: problem statement, competitor analysis

​2. Observe: UX research; interviews and surveys

​3. POV: user personas​

4. Ideate: user flows/ journeys help with building solutions

 ​5. Prototype: sketch from low-mid fidelity prototypes to high fidelity prototypes and turning them into an interactive prototype

​6.Test: user testing (remote and in-person) 


Problem Statement

As a teacher, I want to access a platform that provides fresh, adaptable and modern classroom content that promotes active learning and helps me engage students' attention.

  • Due to a massive increase in digital learning, a lot of our learning has shifted online.
  • Children as young as five years old are doing their work on devices but with that comes a lot of other competing interests available through devices such as; video games and social media.
  • Also, with the COVID-19 pandemic, it has become quite apparent that online learning is going to become an integral part of the curriculum.  That makes it harder for teachers to constantly come up with fresh and engaging classroom content.

Why techEd

As stated previously in the problem statement teachers are increasingly finding it harder to come up with fresh, engaging, and creative content with this rise in digital learning.  We transitioned from paper to digital without changing how students learn and how we teach. 

What’s currently out there?

I did a competitor analysis on three different web-apps that teachers most commonly used for sharing and creating classroom content. This helped me to identify what works, what doesn't and if there are any gaps in the market. I did a S.W.O.T analysis. I picked these three competitors because they deliver classroom content to teachers. 


User Research

What do teachers think?

I interviewed and surveyed a group of five teachers to get a better understanding of how they use technology for their classrooms, how frequently they use it, what sites they like and what they believe is missing from the sites or apps they currently use.  I first conducted a survey and later an interview to get more detailed answers from the participants. 

What did I gather from the interviews and surveys?

Teachers do quite often search for classroom content online. They also do sometimes find it challenging to find fresh and engaging content to teach for students. Finally, they are also interested in learning how to make their own resources, and they are concerned about students' disengagement in class.  

User Personas 

After gathering research from other websites and speaking with a pool of teachers, I created two user personas based on this information I received. 

User Journeys 

After creating the user personas, I then mapped out the journeys that the users would take to complete their task. The main three tasks include; 

  • searching for a classroom module
  • downloading a classroom module 
  • creating a classroom module on techEd

 

Task analysis 

I created two different task analyses for the two main tasks that a user will carry out which are; finding/downloading and creating content on techEd.  Below are my two different user flows. 

Task Analysis 1- Search for a Module and Download 

Scenario 1.  As the only german teacher at my school, I don’t have as many resources for German as I’d like. I’m currently teaching a new topic in German, and I’d like to see what materials other teachers of German use so that I can incorporate them into my lessons.

Task Analysis 2 - Create a module, upload a module

Scenario 2. As a teacher of Chinese Annie is keen to share some of her successful lesson plans with other teachers.  She is happy to share the module she created publicly. 

 

Information Architecture 

How did I organise the pages on the app?

I did a card sorting analysis, using a closed card sort. 

  • There were  10 categories for users to place the items under. I knew what the main navigation was, but I wanted to see under which category the user would place the remaining items. 
  • The results were interesting, and I ended up actually removing some of the categories for the main navigation.  
  • There were too many categories and that caused an overlap in results. 
  • Despite the initial mistake, I made with the closed card sort I still found it useful to do. From the results, I was able to see what the main navigation should be and what should not be included. 
  • I later made the site map which served as a visual representation for the navigation system of TechEd. 

 

Prototypes 

After research and brainstorming solutions through designing the hierarchy and mapping out the user journey/tasks I began the prototyping process with drawing out some solutions. 

Onboarding

Pre-onboarding (the common type) is the most appropriate for this app because it shows users the three main features of the app (finding, downloading and creating classroom content).

Signing Up and Dashboard

Login with email, when the user logins they land on the dashboard. On the dashboard they can see they modules that are recommended for them, the modules they have downloaded and the modules they have created (if they have created any). Or they can find completely new content. Either way this give teachers to just pop open the module they have downloaded just before their class starts.

Learning Areas and Modules 

Users have two options for finding content. They use the search bar to directly look for the subject/year/module they are interested in or they can browse the content using the techEd filter system. Users have a selection of modules to choose from after they filter their search. When they select the module they land on the module description screen. The Module description page gives the user information about the module and includes necessary files to download.

Downloading Wireframes

If the user selects the download option they preview the files. I have used a spinner to give the user feedback about the progress of the module they downloading.

Uploading a Module

Image (first on the left) what a downloaded file looks when a user opens it.
There are three steps to that need to be made to create a module. 

1. Users need to describe the module which includes entering a title, description of the module, and an image that best represents it. Next step the user must place the module under the appropriate categories (i.e. learning area, subject, year level and module topic).

Publishing the Module

The first image on the left shows the final step of creating a module. After users have uploaded their module they can view on their dashboard.

 

Visual Design

The guidelines from material.io have inspired along with feedback from my mentor inspired many of my design decisions. These were the four most common design patterns II used. 

User Testing 

Participants 

  • 6 primary and secondary school teachers 👩‍🏫 👨‍🏫 

Goals 

  • What did I want to achieve from user testing?
  •  To see if the user can perform the main functions of the app as intended, e.g. search for a module and download one.
  •  To learn from the primary users (teachers) if they would use this app for finding resources
  •  To hear suggestions from other users - to receive feedback about what they would add and what they think could improve the features.

Methodology

  • The study will be held at the participants’ places of work or home and will be conducted as moderated in-person or remote tests. 
  • The test will include a short briefing, task performance with TechEd conducted on a mobile app, and a debriefing.

Test Objectives

  • • I want to know how users will find content on the app - can they successfully find the module they are looking for?
  • I want to see how users use the create content feature; specifically whether or not there are too many categories for them to fill out
  • I want to see if they can complete the tasks without any issues.

Iterations

There were a few moderate to severe issues that came up in the usability testing.  I made some changes based on the feedback I was given. 


Issues 

  • Users unable to select more than one option 
  • Users had some difficulty reading descriptions of text 
  • Downloading and lack of feedback about progress

Before

After 

Before: 12px font size 

Darker background more difficult to read text 

After : 14px font size 

Lighter background with darker text easier to read

Before: no feedback users were left feeling a bit confused because they didn't have visual feedback 

After: Added spinning wheel for user feedback 

 

Design Language System

Mockups 

Copyright © All rights reserved.
Using Format