Creating a unique
schedule app to save on
monthly admin costs
VMS
Schedule App
Role
UX/UI Designer
Timeline
April - August 2023
Scope
Mobile App
Scope
The goal was to create a mobile app that could replace the current spreadsheet Music Instructors were using as a schedule and timesheet.
The app would be a minimum viable product (MVP) that would later be incorporated into a full schedule, booking, and billing solution.
My role
I was the sole designer in charge of UX/UI design for this small business project. I worked closely with the owner/developer to hash out design ideas and to ensure the designs aligned with business goals and were feasible within technical and resource constraints.
Research
User interviews
Wireframes
Prototypes
UI Design
Usability testing
Design library
Product handoff
Problem
Village Music School (VMS) Instructors currently use an Excel spreadsheet to manage lesson schedules, record student attendance and submit invoices. This system is creates unnecessary friction for both instructors and admin staff.
Key issues
⭐️
Goal
The desired outcome was to replace the spreadsheet with an Instructor app that would save on administrative cost and create a more efficient Instructor workflow.
Solution overview
A mobile app, where Instructors can see what their workday looks like, get schedule change notifications, confirm that a student attended their scheduled lesson and see that payment automatically get added to to their monthly invoice.
Impact preview
✅ Schedule - Organizes workday events and interactive quick actions to complete required attendance tasks.
✅ Attendance - Simplified attendance marking with gentle reminders increases invoicing accuracy.
✅ Invoice - Automatically generated invoices simplify instructor's monthly billing.
Summary of my decision making
In order to remove the in person admin from the workflow and save money, the app needed to replace the spreadsheet and the Instructors must complete the required attendance and invoice tasks in time for the school to send their paychecks.
Learning that wasted time was what bothered Instructors the most, I made the tasks easily completed in seconds. Invoice calculations would be done automatically, so without the concern of having Instructors doing manuall calculations, I removed daily invoicing and made it monthly. With uncertaintly if the MVP could include multiple scheule views and becuase I didn't want Instructors to have to leave their preferred schedule view (day view or agenda view) just to mark attendance-I made attenendance doable in a few clicks from any schedule page. Additonally, I created timely notifications that would remind and lead Instructors to their required tasks. Not having to remind Instructors of tasks would limit the need of admin.
Future scope for added business revenue
Before jumping into the project, I met with the business owner regulary to discuss the bigger picture and ways to digitalize other areas of the business to save money. When designing this app, I had to keep in mind how it would grow to include Instructor's creating their own availability and how this app would connect with a customer booking solution.
Research
I started by interviewing the owner to understand business goals and moved to user interviews. I conducted interviews with five Instructors to learn about a typical day of teaching, how they used the spreadsheets, and what parts of the process frustrated them.
User Interview
AI transcript assistant for Affinity mapping
Target audience and pain points
Our users are Music Instructors, aged 30-60 and teach as contract employees at Village Music School. The levels of tech savviness vary between users, but are all comfortable using digital calendar apps.
The instructors find the spreadsheet time consuming and a burden to fill it out every day. What the instructors actually wanted was an easy way to view their schedules. Submitting attendance and approving invoices; they wanted that to work with minimal effort.
Note: How the spreadsheet works
The spreadsheet shows the Instructor's schedule. When a student attends a lesson, the Instructor marks their attendance on the spreadsheet, then calculates all the lessons they taught for that day and invoice the school.
Business requirements & constraints
Interviewing the owner, we discussed his long term goals for improving efficiency by digitizing many of the manual processes being used at the school. The first stage was to create an Instructor app that would handle all Instructor work flows, but the MVP was to replace the spreadsheet.
The owner worked on the development of the app, so to keep it feasible, design simplicity was important and keeping the solution to include only the most necessary screens.
Business requirements
Attendance - Instructors must record student attendance.
Invoice - Instructors must invoice the school for only lessons they taught.
Integration - Work with current manual and electronic systems.
Growth - Consider additional features, specifically around instructor availability and how the app will work with future booking systems.
Competitive analysis
There wasn't a direct competitor, instead I explored different types of solutions; including popular calendar, task, and billing apps. Keeping scalability in mind, I also became familiar with booking solutions, knowing the app would grow to include a feature to set availability as part of a new online booking system.
Design patterns and usability principals that could be carried over to the new app
Calendar apps
Task apps
Email & Photo apps
Selection mode
Bulk actions
Financial apps
Examining competitor solutions
Framing the problem
My objective for me was to create an app that met the business needs but was user focused - made to assist the Instructors, not make their day harder.
The Music Instructors viewed the spreadsheet as a tedious task - a form they were required to fill out for the school.
How can I create an app that helps the Music Instructors view their daily schedules while completing attendance and invoicing tasks that don't disrupt their workflow?
User goals
My design revolved around three user goals and how the Instructors could accomplish them in ways that didn't cause friction in their day.
Creating new user flows
The old spreadsheet flow was time consuming and led to incomplete tasks, incorrect attendance and invoicing.
The new flows reduced task completion time from 5-10 minutes to seconds. Recording student attendance and submitting an invoice now take 2 clicks. With added barriers preventing errors, and helpful reminders, easy task completion improves efficiency and accuracy.
Mapping out a user flows
Ideation
I decided to focus on the schedule as the core solution and then experiment with ways to incorporate attendance and invoicing as quick, but rewarding tasks. I brainstormed ways for Instructors to record student attendance straight from their schedule and create automatic monthly invoicing.
Before
Instructors are required to complete attendance for their students because the school requires it.
After
Show Instructors the money their making every time they mark a student "present".
Feature ideas
Schedule features
Attendance features
Invoice features
Hand drawn sketches and wireframes
Creating wireflows for quick ideation
To help me think through the workflows, interactions, and ideate on screen design, I created wireflows. They were helpful in showing stakeholders how the Music Instructors would interact with the screens and navigate through the app.
Wireflows of workflows: Single attendance, multiple attendance, and monthly invoice
Iterations
Along the way, there were ideas that didn't work, roadblocks, disagreements, delays, and frustrations. Here's a few that stood out and what I did to keep moving.
Solutions to designs that didn't work
I experimented with different patterns and familiar interactions for recording attendance before returning to a slightly modified version of my original sketches. There's always another solution that could get the job done. In order to not get stalled, I presented the alternatives, but with my strong recommendation to move forward with the final design. I believed it was the best overall design that would allow instructors to complete attendance with a combination of little effort, and without disrupting the look and layout of the schedule.
Addressing privacy concerns
As VMS adds more digital solutions, incorporating profile images into solutions has many benefits, including creating connections between student and teacher. However, with most students being minors, using photos can cause security concerns. I opted for avatars, allowing students (with parent's permission) to select their character with the option of using initials as an alternative.
Switching from profile photos to Memoji avatars
Resolving differing opinions
Covid hit the school pretty hard. They lost students and Instructors were having to get second jobs. The owner preferred we didn't use a typical Schedule-Day view screen because it highlights gaps in their schedules. Instead he preferred we only use the Schedule-Agenda view, where appointments are shown in a list format, not separated into a calendar format. We agreed to test both and ultimately decided to include both screens.
Usability testing
I tested my design prototype with a group of VMS instructors. The instructors had an easy time completing schedule, attendance, and invoicing tasks. There were some small issues with navigation which I solved with icon changes. Additionally, onboarding will help any instructors with remaining navigation questions.
Results
Instructors were frustrated with the amount of time it took to use a spreadsheet to view their work schedule, record attendance, and do weekly invoice submissions. Now, only taking moments, Instructors can view their lesson schedules, mark student attendance, and send their monthly invoices.
Schedule
Day view (left) & Agenda view (right)
Attendance mode
Agenda view (in attendance mode)
Invoice
Invoice (left) & Invoice reminder (right)
Reframing attendance as money earned!
Attendance success message (left) & Invoice success screen (right)
Final screens
Next steps
The goal is to round out this app into a full Instructor App, adding an additional availability workflow. This will allow Instructors to control their own work schedules by setting the days and times they are available to work.
Product roadmap (left) & Instructor availability wireframes (right)
