Aaron Cecchini-Butler
Aaron Cecchini-Butler, UX Research / UI Design
Welcome for website.jpg

TeacherTracker - Mobile App Designed for Teachers

designed to increase communication efficiency among teachers and administrators

TeacherTracker

Home screen buttons are identical to tab bar - facilitating easy access to most areas of the app from every screen (an extremely shallow IA - to increase efficiency)

The What and the Why?

For the past four years, I’ve worked as a teacher at an after-school program and my exposure to some of the problems teachers face inspired this concept app.

TeacherTracker is a digital product designed to help improve communication between teachers and administrators while also serving as a database to minimize the amount of information teachers are required to track.

Pain Points for Teachers:

  • Required to track a lot of data

  • Communication 

  • Hard to get help quickly 

  • Preparation for school shootings is poor 

My Proposed Solutions: 

  • Easily searchable database of students and teachers 

  • Basic communication tool  

  • “Call for help” button  

  • Emergency button that would alert local authorities and silently alert all other adults in a school

 
 

Once I identified the main pain points, I went on to conduct interviews and summarize my insights.

(Additionally, I was able to perform contextual inquiry and use immersion research due to my job as a teacher. Through this I was able to observe a number of teachers deal with pain points, and then ask them about the problem, and potential solutions.)

 
 
 

Primary Insights:

  • Hard to communicate misbehavior to administration

  • Difficult to change spaces

  • Often the only adult in the room. Studies have shown that 100% of teachers have to go to the bathroom sometime!!

  • Not adequately prepared for school shootings

 
 
 

I took these insights and constructed some provisional personas as well as fleshing out the persona of “Elena Johnson.”

I built the provisional personas to account for the varied demographics of teachers. I also wanted to highlight important insights in separate provisional personas to emphasize their importance.

 
 
 

Provisional Personas

 
provisional persona 1.jpg
provisional persona 1 copy 2.jpg
 

Full User Persona

 
Elena Johnson Persona
 
 

The interview process, and the creation of the user persona helped me work through potential user flows and Information Architectures.

 
 

Initial IA, shallow and wide makes the most sense for this app as completing tasks efficiently is paramount.

User flows, mid-fidelity prototypes

User flows, mid-fidelity prototypes

 
 

Research pointed towards a shallow and wide information architecture. Teachers need to complete tasks quickly.

Also, early user testing highlighted a confusion about the different of “help” and “emergency.” This was addressed by changing the button style of “emergency” and adding a number of fail-safes in the emergency user-flow.

 
 

With the information architecture drawn out, I began working on some sketches to ideate possible screens.

 
 
IMG_2269.JPG
IMG_4554.JPG
IMG_9219.JPG
IMG_6180.JPG
IMG_2306.JPG
iPad concept

iPad concept

Desktop welcome screen

Desktop welcome screen

Desktop Tri-Fold  - mobile-first design enables a desktop version that can display the equivalent of three mobile screens

Desktop Tri-Fold - mobile-first design enables a desktop version that can display the equivalent of three mobile screens

 
 

My sketches include some responsive ideas. Although the core of the original idea is mobile, initial interviews revealed that some teachers didn’t always carry their phone, but were near a computer a majority of the time.

 
 

After deciding on the screens that would suit this project the best, I moved on to making wireframes.

 
 
wireframes.jpg
 
 

Early wireframes included a navigation bar across the top to keep important items easier to reach. User research found that people preferred a bottom navigation for iOs for the sake of familiarity more than they noticed any improved comfort. This change led to changing the contents of the nav bar to reflect the buttons on the home screen.

 
 

Once my wireframes were fixed to reflect the results of their user tests, I moved on to final designs.

 
 

A daily dose of inspiration keeps the teacher inspired and creates a positive association with the app. This is inspired by the daily calendars many teachers keep on their desks.

This page features an important element that was recommended by multiple teachers. The “External Extracurricular” category is something that would help teachers understand their student’s schedules outside of school giving them a full picture of the student.

Sometimes teachers being trapped in their classrooms with a number of kids and no other adults. TeacherTracker would give teachers an efficient way of explaining the issue and calling for the appropriate help.

Simplicity is important because the target users cover a large demographic. I worked hard to design something that feels clean but is still simple to use right away!

The ability to send kid’s to the office is an issue. Communicating with administration during the conflict is difficult. Using TeacherTracker, it’s easy to send the kid to the office and explain why. The administrators would receive this on their end.

Unfortunately, school shootings in the USA are an epidemic. The emergency button would allow any user to alert authorities immediately. Additionally, it would alert all other users of the emergency immediately and silently, to avoid the PA system “lockdown,” that’s currently in place. This has the potential to speed up response times and save lives.

The primary categories are color-coded. This helps keep the user oriented. I opted for bold colors because the middle of a school day isn’t the time for subtlety!

Sometimes teachers need to change their location and the current system only alerts a few individuals about the change. TeacherTracker would update the location on the app, so all other users could see it.

 
 

I’m really pleased with this iteration of designs. They make completing tasks very simple. It was hard to have restraint when it came to the designs, but my research all pointed towards simplicity being more important than visuals.

 
 

After completing the designs, I went ahead and designed a notification sound.

 
 
 

Notification sounds are a great touch to customize an app, while also allowing users to quickly know which app is notifying them.

I included questions about this in my interview segment and the answers helped inform my approach.

 
 

Now with all the pieces existing, I put together a prototype using InVision.

 
 

An important takeaway from the first round of prototype testing was the idea that access to the Welcome Screen is unnecessary after the user is in the app.

Additionally, 4 out of 6 of the testers didn’t return to the homepage - opting to use the tab bar to navigate. However, the 2 other testers - both self-described as “technologically-adverse" - relied on the ability to go back to that home screen.

 

I put together an Affinity Diagram in order to easily see the results of the prototype testing.

 
 
 

Summary

A number of the potential users who tested the prototype of this app have expressed extreme interest in it becoming a reality. The process - from inception to now - has been inspiring. TeacherTracker will remain a passion project. The next steps I will take are:

  • Prototype microinteractions

  • Test next iteration of designs (with interactions) on potential users

  • Update style guide/UI kit to maintain consistency

  • Discussing plausibility of design - especially of database

  • Designing data entry forms