Mobile App Design

Radiant

A mobile app to support new teachers in their first year of teaching

Case study image
View prototype

My Role

UX Researcher, UX Designer, Interaction Designer, UI Designer

Team

Self-directed, with guidance from course mentor

tools

Sketch, Affinity Designer, InVision, Airtable, Draw.io, Maze

Duration

80 hours over 2 weeks

challenge

Research shows that new teachers face three common challenges: classroom management, lack of lesson planning resources, and lack of support from their colleagues. These challenges result in a nationwide teacher shortage, with 13.8% of public school teachers leaving their jobs or the profession each year. In high-poverty schools, the challenges are more acute since they have a greater share of new teachers and novice teachers, and fewer teacher resources available.

We can use digital services to provide new and novice teachers with access to many of these teaching resources (lesson planning, mentorship, etc.) and help improve teacher retention in public schools. Through contextual inquiry, we can better understand teachers' everyday experiences and identify opportunities where a digital platform (in this case, a smartphone app) can support their needs and goals.

The project and content presented here are speculative and for educational purposes only.

Outcome

A high-fidelity prototype of a mobile app that provides lesson-planning resources, skill-building tutorials, and peer-to-peer support for early-career public school teachers.

It's important to note that an app is not going to solve all of the challenges within the U.S. education system. This project is an exploration of how we can use digital services to better support our teachers – as one part of a multifaceted solution that will require the work of many different stakeholders.

Process

Design Thinking process

Phase 1: Research

View the full research plan here.

Secondary Research

I started the project with market research to better understand the problem and the target audience. After reviewing reports from the Department of Education and various research papers, I found that there are two primary types of support that early-career teachers need: short-term problem-centered support and long-term critical reflection.

Identifying where teacher support is most needed (to identify target user demographics)

Primary Research

After conducting a competitive analysis and mapping out key stakeholders, I reached out to my network to interview teachers about their experiences. I also reviewed some research papers that included ethnographic interviews with new teachers over the course of a year.

These combined gave me an understanding of the challenges new teachers experience during their first year of teaching. I then created a user experience map (or user journey map) summarizing my findings:

A new teacher's journey through her first year of teaching

Curious about the details? View the process here.

Phase 2: Define

Defining the Problem

Next, I used the insights and needs from my experience map to craft "Point of View" statements.

POV statement = The user needs [user need] because [research insight].

Then, I posed the design problems as a "How might we...?" questions. It's important to ensure that the questions are broad enough to generate a wide range of ideas, yet specific enough to stay within the scope of the overall project.

POV statements and HMW questions show which problems we're solving for

Generating & Prioritizing Ideas

For each HMW question, I did a rapid brainstorm (2 minutes) to generate as many ideas as possible. View the idea list here.

Business & User Goals

Knowing that some ideas landed outside the scope of this project, I mapped out business goals and user goals to pick the right ideas to move forward with.

The ideal solutions must serve both business and user goals
Feature Roadmap

I used the RICE product management method to determine which solutions to prioritize as features for the Minimum Viable Product (MVP). Since I wasn't able to estimate reach and impact realistically, I used confidence (estimated from research data) and effort (estimated using feature complexity) to determine priority. View the full Feature Roadmap on Airtable.

Defining the App's Architecture

With the P1 features in mind, I outlined the the app's information architecture (IA) in an app map. This helps designers and developers understand how screens/features are connected to each other. Having a clean IA also prevents users from hitting dead ends or getting lost in a complex app.

App map showing how features are organized within the app – click image to view annotations

Since many of the features are context-specific, I also created an app map with descriptions for key features. View an annotated app map here.

I mapped out user flows to show how these features would be used by a new user and an existing user.

These user flows show how new and existing users would use the app's features

I took one of the user flows and mapped out detailed screens and decision points to create a task flow diagram. View both task flows in detail here.

Task flow showing how a new user experiences the app – click image to view details

Before sketching wireframes, I drafted UI requirements for each screen. This document helps me ensure that my designs can actually be built by a developer – that the designs are realistic and viable. The worst case scenario is having a beautiful, user-centered design that is impossible or too costly to implement because of engineering limitations. View the UI  documentation here.

Phase 3: ideate

Now, the fun part: sketching! I made rough sketches of the app's main screens, then moved to wireframing on my computer.

Low-fidelity sketches of the app's main screens

Phase 4: Design

I created mid-fidelity wireframes in grayscale so that I could focus on the content layout.

Mid-fidelity wireframes highlighting the content layout

Note: I originally named the app "Springboard" in the theme of hurdles and springboards, but later changed the name to avoid confusion with an existing e-learning platform also called Springboard.

Phase 5: Prototype

Usability Testing

Using InVision and Maze, I set up a mid-fidelity prototype and guidelines for remote usability testing. Though I had hoped to conduct in-person testing, most of the teachers in my area had left for summer vacation. Instead, I applied a blended approach: I sent out the Maze test to my network (some teachers, mostly non-teachers) and followed up with testers to better understand usability issues. Despite some confusion from non-teachers about the lesson planning process, the usability testing went quite well and I received a lot of detailed feedback.

I synthesized the test results into design recommendations to implement in my high-fidelity prototype. View the full analysis here.

Usability test insights, translated into design improvements

I prioritized the design recommendations according to time and resource constraints I had. Designing the app walkthrough was going to take more time and resources than I had available, so I saved it for a future iteration and did my best to improve existing icons or copy to be clearer.

Designing the Final Prototype

I made revisions to the mid-fidelity wireframes according to the recommendations from usability testing, then designed a logo and set style guidelines (color, typography, etc.) so that I could create the final UI design.

These annotations show how key screens were improved between the mid-fidelity and high-fidelity wireframes.

Finally, I set up an interactive prototype in InVision to prepare for developer handoff.

Demo of the final design

Phase 6: Iterate

Next steps

From here, I can follow the feature roadmap to continue building out the app. Using the results from this usability test, I can also modify some of the planned features and reprioritize them to improve the overall user experience of the app.

Reflection

Though I myself have been trained as a teacher, it's important to be humble and not assume that I know what's best for the app.

Too often, we design social impact products/services without making sure that the target users have a seat at the table. As a result, our products or services can only accomplish so much – they're inherently limited because our process was limited.

The challenge in this project was ensuring that I was seeking out teacher voices, prioritizing their experiences. Even if this app isn't the one-and-done panacea, it's at the very least an opportunity to shed light on issues within our education system and to advocate for much-needed teacher support.

Let's build something together

Interested in working together? Drop me a line – I'd love to hear from you.
I'm currently available for consulting on UX design and Webflow projects.

SAY HELLO