Harnessing AI to simplify sub plans and support teacher well-being.

SmartSub Mobile Prototype

Timeline

80 hours

Roles

UX Researcher

UI Designer

Branding

Project

Responsive Website

Tools

Figma

Figjam

Deliverables

Competitive Analysis

User Interviews

Affinity Map

Persona

Product Roadmap

User Flow

Low Fidelity Wireframes

Moodboard

Style Tile

High Fidelity Wireframes

Usability Test Results

Priority Iterations

Reflection

Next Steps

Overview

SmartSub Desktop Prototype

SmartSub is an AI-powered platform designed to simplify the process of creating sub plans for teachers when they need a substitute to stand in for the day. Often, teachers choose to go to work instead of taking a much-needed day off because writing detailed sub plans is time-consuming and stressful. It’s not just about taking a break; it’s about empowering teachers to step away when they need to without the burden of micromanaging their day for someone else. SmartSub streamlines this process by offering customizable options that generate clear, descriptive plans, ready for immediate use. By reducing the time and effort spent on sub plans, SmartSub aims to give teachers the freedom to take well-deserved time off and return refreshed, knowing their students were well-supported in their absence.

Background

As an elementary school teacher, I struggled to take a day off due to the time-consuming task of writing detailed sub plans. The process—providing classroom details, schedules, and ensuring substitutes could keep students engaged—was overwhelming. I realized this was a common challenge for teachers, and I wanted to find a solution.

I turned to AI to simplify the process. My solution prompts teachers to input key details, like schedules and routines, which can be saved and reused. It also includes a library of review activities, aligned with current lessons, to help substitutes keep students engaged. AI generates clear, customizable instructions, saving teachers time and reducing stress. SmartSub makes it easier for teachers to take time off, ensuring a smooth day for both students and substitutes.

Researching the Sub Struggle

Competitive Analysis, User Research, Affinity Map, Persona

Research Goals

I set out to explore the following goals through my research:

  • What challenges keep teachers from using their PTO?

  • What are the biggest pain points for teachers when making sub plans?

  • What is the current process that teachers use to make sub plans?

  • What activities do teachers prefer or avoid assigning for students when they have a substitute?

Competitive Analysis

Competitive analysis revealed the following insights:

  • Magic school combines teachers input and AI to generate resources for teachers.

    • Over 50 tool options to choose from

    • Saves resources for later use

    • Outputs do not include images

    • No options for substitutes

  • Diffit generates instructional materials using teacher input and AI.

    • Available for language arts, math, and science

    • Available for grades 2-11

    • Same worksheet layouts provided for all activities, while content is specified by teacher input

  • Education.com provides ample instructional materials for teachers to choose from.

    • Options such as lesson plans, worksheets, games, and sub plan bundles

    • Does not offer personalization with the use of AI

  • Teachers Pay Teachers provides an online library of resources created by teachers

    • Wide variety of resources available

    • Does not offer personalization with the use of AI

    • Teachers must purchase items they wish to use

User Interviews

"I try to use a template, but with how often schedules change, it still feels like I’m starting from scratch every time.”

- Jessica J.

Topics:

  • What challenges keep teachers from using their PTO?

  • What are the biggest pain points for teachers when making sub plans?

  • What is the current process that teachers use to make sub plans?

  • What activities do teachers prefer or avoid assigning for students when they have a substitute?

“There is pressure when planning for a day off. You have to consider everything”

-Anna J.

Demographics: 5 users (all women)

  • Teachers who work with K-8 aged students

  • Ages 29-35

Method: In person interview

“Good sub plans are simple and don’t over complicate cause substitutes don’t always know how to teach”

-Ashley B.

Insights:

  • Many teachers find creating substitute plans so frustrating they avoid taking time off, even when sick or stressed.

  • The pressure to create detailed plans and ensure a smooth day for students and substitutes often deters teachers from taking time off.

  • Teachers prioritise including clear daily schedules, engaging review activities, and class/student information in their sub plans.

  • Teachers typically spend between 1 to 3 hours preparing substitute plans.

Affinity Mapping and Personas

Affinity mapping (see Affinity Map) and analysis of user interviews revealed these key insights into user needs and decision-making behaviors:

  • 80% of teachers said that making sub plans is a barrier to taking the day off

  • 80% of teachers said they it is hard to remember all the details of the day

  • 100% of teachers want to use review activities that are engaging

  • 80% of teachers mentioned using a template to cut down on planning time

  • 80% provide important school/class information for their substitutes

Using this data, this unique user persona was created. (see Persona)

Disgruntled Ms. Day: Sarah is a dedicated teacher who finds writing sub plans time-consuming and stressful, often spending hours to ensure clear instructions, updated schedules, and engaging activities. Balancing pressure from her boss and the challenge of remembering daily routines, she wishes for an easier way to ensure her students and substitutes have a smooth, successful day.

Brainstorm in Process

Ideation, Product Roadmap, User Flow

Refining the Project Focus

Based on insights from my persona, it was clear that teachers need a way to simplify the process of creating sub plans to feel more comfortable taking time off. Teachers face challenges like constantly changing schedules, finding activities that align with current lessons, and providing detailed instructions for substitutes. Keeping these priorities in mind, I started exploring potential solutions to address their needs.

Problem Statement: I’d like to explore ways to help K-8 teachers find review resources that align with their current classroom topics so they can create a seamless day for substitutes and students.

HMW: How might we provide teachers with review resources that align with their current classroom topics?

Problem Statement: I’d like to explore ways to help K-8 teachers produce clearly outlined daily instructions for substitutes so that they can reduce their cognitive load when creating sub plans.

HMW: How might we produce clearly outlined daily instructions for teachers to give to their substitutes?

Product Roadmap

As I began developing a solution, I focused on outlining the various features my product would need to include. To ensure a clear direction and prioritize the most essential elements, I organized these features into four distinct categories. This structured approach allowed me to identify which features would deliver the greatest value and address the core needs of the target audience.

(High Priority)

Must Haves

  • Logging in

  • Student information

    • Students with academic, health, or behavioral needs

  • Daily schedule selection

  • Class routines

  • Activity library

  • Sub plans generator

    • AI generated instructions of subs

  • Edit sub plans option

Nice to Have

  • Saved sub plans

  • End of the day note from sub

  • Consumables links to print or export

Surprising and Delightful

  • Theme options for sub plans

  • Slides generator

  • Substitute reflection for students

    • Student feedback on how the day went

(Low Priority)

Can come later

  • Teacher connections/share

    • Option to follow other teachers and use the same plans with their current class info

User Flows

A user flow was created to address the persona's identified needs, ensuring an efficient and seamless journey for teachers. Key steps in the flow include:

1. Selecting a Schedule: Teachers choose the schedule that fits the day they are taking off.

2. Choosing Activities: Teachers browse a library to find activities for their class.

3. Specifying Detailed Instructions: Teachers can customize instructions to ensure clarity for substitutes.

4. AI-Generated Plans: The process concludes with AI compiling the selected inputs into comprehensive sub plans for review and export.

User Flow: Generate Sub Plans (See User Flow)

Shaping User Ineractions

Low Fidelity Sketches

Wireframe Sketches

Select Your Schedule Screens

1. Option to select which day of the week the plans will be for

2. Option to edit schedule if needed

Desktop

Mobile

Daily Plans Overview Screens

1. Subjects and times separated into sections for visibility

2. Option to add activities and guidelines for each part of the day

3. Activities appear once selected

4. Progress bar displays where you are in the process

Mobile

Desktop

Activity Library Screens

  • Overlay/ bottom sheet keeps the steps clear for users

  • Search option gives users control over types of activities

  • Filter option makes search more efficient

  • Activity thumbnail and description supports rapid browsing

Desktop

Mobile

Activity Preview Screens

  • Option to see whole page worksheet

  • Activity description helps teachers decide if this is a good for for their class

  • ‘Add Activity’ button adds activity to Overview screen

Mobile

Desktop

Add Guidelines Screens

  • Prompts help relieve cognitive load for teachers to consider everything needed for a lesson

  • Lots of options provided to help generate more/less specific lesson plans

Desktop

Mobile

Preview Information Screens

  • Organized into categories to keep the experience manageable

  • Option to edit each section independently

Desktop

Mobile

Preview Daily Plans Screens

  • Activities and guidelines combined using AI to generate instructions for each part of the day.

  • Option to edit instructions if needed

  • Option to go back and make changes in overview

Desktop

Mobile

Export Plans Screens

  • Ability to export resources in variety of ways

  • Ability to export different resources in different ways (ex: email Daily Plans, print 2 Digit Addition)

Mobile

Desktop

Phase 4: Design and Branding

Process: Moodboard, Style Tile, High Fidelity Wireframes

Branding

The design reflects SmartSub's core values and mission to simplify sub planning for teachers. Key design choices include:

  • Color Palette: Blues and tan/browns convey professionalism and trustworthiness.

  • Logo Design: A clean sans-serif font paired with a clock icon featuring missing sections, symbolizing preparation for time away.

  • Name Significance: The inclusion of "smart" highlights the platform's use of AI to streamline and ease the planning process for teachers.

Brand Values

  • Streamlined

  • Customizable

  • Innovative

  • Intuitive

  • Time-saving

Moodboard

Color Palette and Fonts

High Fidelity Wireframes

Select a Schedule

  • Bolded portions of the day when teacher gets a break

  • Left aligned text for readibility

  • Option to edit if schedule has changed

Desktop

Mobile

Progress Overlay (Mobile Only)

  • Appears for 1.4 seconds to quickly signal to user their current progress after each step is completed

  • Darker background to bring hierarchy to the overlay

Overview

  • Daily activities separated for visual clarity

  • ‘Add Activities’ button as primary CTA because teachers will likely want to add activities before instructions

  • Activities with pdf icon appear once a selection has been made

  • Generate button features an AI icon to let users know that the plans will be created using AI

Desktop

Mobile

Activity Library

  • Overlay/bottom sheet helps users easily follow the steps.

  • Search function allows users to specify the types of activities they want.

  • Filters streamline the search process for quicker results.

  • Activity thumbnails and descriptions enable users to browse efficiently.

Desktop

Mobile

Activity Preview

  • Option to side scroll to see more images on mobile

  • Information is arranged in order of priority, ensuring the most important details are presented first for the user

Desktop

Mobile

Add Instructions

  • Adjusted the layout from initial sketches to include a more visual selection method, removing the need for dropdown menus to view all options

  • Opted to use the language ‘instructions’ as opposed to ‘guidelines’ for this section

Mobile

Desktop

Preview Contact and Emergency Information

  • Divided these information sections into two pages to create a more intuitive and user-friendly grouping of content

  • Used larger title font sizes to create visual hierarchy for each section

  • Included the ability for users to edit specific sections as needed

Mobile

Desktop

Preview Class Information

  • Option to 'View Class Roster' as a separate action to maintain a clean and uncluttered interface.

  • Information is organized by priority, presenting the most important details to the user upfront

  • Included the ability for users to edit specific sections as needed

Desktop

Mobile

Daily Plans Preview

  • Parts of the day grouped togehter for visual clarity

  • Included the ability for users to edit specific sections as needed

  • Activities included utilize a pdf icon and the ability to click to see the activity

Desktop

Mobile

Export Resources

  • Provided the flexibility to mix and match resources and select the desired export format

  • Offered multiple export options to accommodate the diverse needs of teachers

Mobile

Desktop

Giving the Plan a Trial

Usability Test Plan, Priority Iterations, Reflection, Next Steps

Usability Testing

To make sure usability testing reflected my user persona, I chose participants with similar characteristics, needs, and challenges. This helped me gain valuable insights into the specific pain points and expectations of teachers. By focusing on the persona’s perspective, I could apply the test findings to create solutions tailored to their needs.

Demographic

  • 5 participants (all women)

  • Teachers who work with K-8 aged students

  • Ages 29-35

Tasks:

  • Generate and export sub plans on mobile

  • Generate and export sub plans on desktop

Qualitative Goals

  • Determine whether users can successfully add an activity.

  • Assess if users are able to add instructions without difficulty.

  • Evaluate whether users can generate sub plans effectively.

  • Gauge user satisfaction with the experience of generating sub plans.

Quantitive Goals

  • Determine the rate of completion for each task, determine rate of user errors.

Test Results

Task 1: Generate and export sub plans on mobile

Successes on Mobile

  • 100% of users thought the Select your Schedule screen was easily readable.

  • 60% of users thought it was very easy to add instructions.

  • 100% of users thought the Daily Plans Overview was easily readable.

Successes on Desktop

  • 80% of users thought the Select your Schedule screen was easily readable.

  • 80% of users thought it was easy to add an activity.

  • 80% of users thought it was easy to add instructions.

Opportunities on Mobile

  • 100% of users wanted to side scroll when looking over the individual activity.

  • 60% of users had trouble clicking into the search bar to conduct a search.

  • 100% of users said the Progress bar pop up was too fast.

  • 60% of users used negative words when talking about the Progress pop up.

  • 40% of users thought a few other subjects in the Schedule should be bolded (arrival, dismissal).

“The instructions section was great because it made it so much easier to figure out what I’d need for each lesson.”

-Anna J.

Task 2: Generate and export sub plans on desktop

Opportunities on Desktop

  • 40% of users had questions about what 1 or more of the categories meant when adding instructions

  • 40% of users moved the curser to ‘Add Instructions’ when told to click ‘Add Activity’ because the desktop layout did not match the mobile

Priority Iterations

I utilized a severity-to-frequency chart to assess and prioritize the value of my insights for the company. This approach allowed me to evaluate each point individually and accurately position it on the chart. Upon completing this process, it became clear that the key areas requiring iteration were as follows:

  • Make search bar larger

    • Ensure that users can use the search bar easily without needing to click multiple times.

  • Explore new solutions for the progress bar pop up

    • Since many users expressed negative feelings when talking about the pop up, new solutions will be explored.

  • Bold other subject areas in schedule

    • Improve the readability of the schedule by adjusting font size to make it easier for users to quickly scan each subject.

  • Order of ‘Add _____’ buttons do not match on mobile and desktop

    • Maintain consistency between screen types.

Iterations before and after

  • User Feedback: 60% of users experienced difficulty clicking the search bar.

    • Search Bar: Increased the size of the search container and touch target.

    • Efficiency: This adjustment improves accessibility and makes searching easier and more efficient for users.

  • User Feedback: 100% of users found the schedule easily readable.

  • Additional Insight: 40% of users suggested bolding the start and end of the day to minimize focus on less detailed sections.

  • Cognitive Load Reduction: This change helps ease the cognitive load for teachers when planning the day.

  • User Feedback: 100% of users felt the pop-up was too quick, and 60% expressed dissatisfaction with this type of pop-up.

  • Exploring Solutions:

    • Solution #1: Add a horizontal progress bar displaying the name of each step.

    • Solution #2: Highlight the current step while keeping the top section clean.

  • User Behavior Insight: 40% of users moved the cursor to ‘Add Instructions’ when prompted to click ‘Add Activity.’

  • Button Swap: The buttons were swapped to align with the mobile experience.

  • Consistency: This change creates consistency across different screen types.

  • Support User Confidence: The update helps build user confidence when completing tasks.

Next steps

Additional Testing: Begin testing the iterations that have already been made.

Next priority Task Flow: Begin planning for the customizable school and class information that teachers can preset to efficiently generate their plans.

SmartSub Desktop Prototype
SmartSub Mobile Prototype

Reflection

This project helped me improve my design skills, explore AI, and address user challenges effectively.

  • Growth as a Designer:

    • Improved use of auto layout for efficiency

    • Gained confidence in integrating AI to create practical solutions

  • Challenges and Solutions:

    • Used overlays and bottom sheets for clear user navigation

    • Simplified design by focusing on readability, avoiding unnecessary icons

  • Key Takeaways:

    • Enhanced workflow and design tool skills

    • Gained insight into AI’s potential for future projects

Back to Home
Next Project