CoachArt Reimbursement Portal
Automated reimbursement with Bill.com integration
TIMELINE
January - June 2024
CLIENT
CoachArt
ROLE
Product Designer
TEAM
2 PMs, 2 designers, 7 developers
90%
efficiency boost
450+
users
60+
components
01. Brief
Background
CoachArt is a nonprofit that provides in-classroom experience to children with chronic illnesses by pairing them with over 450 volunteer teachers.
To support these volunteers in providing arts and enrichment classes, the organization funds classroom supplies and reimburses teachers for out-of-pocket expenses.
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg"><path d="M 22.613 0 L 22.116 9.874 L 31.99 9.363 L 24.656 15.993 L 32 22.613 L 22.126 22.116 L 22.637 31.99 L 16.007 24.656 L 9.387 32 L 9.884 22.126 L 0.01 22.637 L 7.344 16.007 L 0 9.387 L 9.874 9.884 L 9.363 0.01 L 15.993 7.344 Z" fill="rgb(234, 120, 30)" height="32px" id="MLgXi2yBJ" width="32px"/></svg>)
Problem
Expense flows within the organization burdened teachers with unnecessary steps and left administrators drowning in manual review and extraction.
frustrated volunteers
delayed reimbursements
wasted staff time
Objective
Design a scalable expense management system that
simplifies teacher submissions
1
and reduces manual effort
2
for administrators
Goals
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg"><path d="M 10.946 0.631 C 11.373 -0.21 12.627 -0.21 13.054 0.631 L 14.207 2.898 C 14.497 3.469 15.226 3.696 15.813 3.397 L 18.139 2.21 C 19.002 1.769 20.017 2.474 19.845 3.395 L 19.383 5.876 C 19.266 6.501 19.717 7.094 20.376 7.182 L 22.988 7.528 C 23.957 7.657 24.344 8.797 23.639 9.445 L 21.74 11.193 C 21.26 11.634 21.26 12.366 21.74 12.807 L 23.639 14.555 C 24.344 15.203 23.957 16.343 22.988 16.472 L 20.376 16.818 C 19.717 16.906 19.266 17.499 19.383 18.124 L 19.845 20.605 C 20.017 21.526 19.002 22.231 18.139 21.79 L 15.813 20.603 C 15.226 20.304 14.497 20.531 14.207 21.102 L 13.054 23.369 C 12.627 24.21 11.373 24.21 10.946 23.369 L 9.794 21.102 C 9.503 20.531 8.774 20.304 8.187 20.603 L 5.861 21.79 C 4.998 22.231 3.983 21.526 4.155 20.605 L 4.617 18.124 C 4.734 17.499 4.283 16.906 3.624 16.818 L 1.012 16.472 C 0.043 16.343 -0.344 15.203 0.361 14.555 L 2.26 12.807 C 2.74 12.366 2.74 11.634 2.26 11.193 L 0.361 9.445 C -0.344 8.797 0.043 7.657 1.012 7.528 L 3.624 7.182 C 4.283 7.094 4.734 6.501 4.617 5.876 L 4.155 3.395 C 3.983 2.474 4.998 1.769 5.861 2.21 L 8.187 3.397 C 8.774 3.696 9.503 3.469 9.794 2.898 Z" fill="rgb(13, 21, 66)" height="24px" id="FfMAFqwh4" transform="translate(4 4)" width="24px"/></svg>)
Digital forms
that allow easy uploading and editing
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg"><path d="M 10.946 0.631 C 11.373 -0.21 12.627 -0.21 13.054 0.631 L 14.207 2.898 C 14.497 3.469 15.226 3.696 15.813 3.397 L 18.139 2.21 C 19.002 1.769 20.017 2.474 19.845 3.395 L 19.383 5.876 C 19.266 6.501 19.717 7.094 20.376 7.182 L 22.988 7.528 C 23.957 7.657 24.344 8.797 23.639 9.445 L 21.74 11.193 C 21.26 11.634 21.26 12.366 21.74 12.807 L 23.639 14.555 C 24.344 15.203 23.957 16.343 22.988 16.472 L 20.376 16.818 C 19.717 16.906 19.266 17.499 19.383 18.124 L 19.845 20.605 C 20.017 21.526 19.002 22.231 18.139 21.79 L 15.813 20.603 C 15.226 20.304 14.497 20.531 14.207 21.102 L 13.054 23.369 C 12.627 24.21 11.373 24.21 10.946 23.369 L 9.794 21.102 C 9.503 20.531 8.774 20.304 8.187 20.603 L 5.861 21.79 C 4.998 22.231 3.983 21.526 4.155 20.605 L 4.617 18.124 C 4.734 17.499 4.283 16.906 3.624 16.818 L 1.012 16.472 C 0.043 16.343 -0.344 15.203 0.361 14.555 L 2.26 12.807 C 2.74 12.366 2.74 11.634 2.26 11.193 L 0.361 9.445 C -0.344 8.797 0.043 7.657 1.012 7.528 L 3.624 7.182 C 4.283 7.094 4.734 6.501 4.617 5.876 L 4.155 3.395 C 3.983 2.474 4.998 1.769 5.861 2.21 L 8.187 3.397 C 8.774 3.696 9.503 3.469 9.794 2.898 Z" fill="rgb(234, 120, 30)" height="24px" id="KDoxNfVXr" transform="translate(4 4)" width="24px"/></svg>)
Generated invoices
that reduce manual effort and user error
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg"><path d="M 10.946 0.631 C 11.373 -0.21 12.627 -0.21 13.054 0.631 L 14.207 2.898 C 14.497 3.469 15.226 3.696 15.813 3.397 L 18.139 2.21 C 19.002 1.769 20.017 2.474 19.845 3.395 L 19.383 5.876 C 19.266 6.501 19.717 7.094 20.376 7.182 L 22.988 7.528 C 23.957 7.657 24.344 8.797 23.639 9.445 L 21.74 11.193 C 21.26 11.634 21.26 12.366 21.74 12.807 L 23.639 14.555 C 24.344 15.203 23.957 16.343 22.988 16.472 L 20.376 16.818 C 19.717 16.906 19.266 17.499 19.383 18.124 L 19.845 20.605 C 20.017 21.526 19.002 22.231 18.139 21.79 L 15.813 20.603 C 15.226 20.304 14.497 20.531 14.207 21.102 L 13.054 23.369 C 12.627 24.21 11.373 24.21 10.946 23.369 L 9.794 21.102 C 9.503 20.531 8.774 20.304 8.187 20.603 L 5.861 21.79 C 4.998 22.231 3.983 21.526 4.155 20.605 L 4.617 18.124 C 4.734 17.499 4.283 16.906 3.624 16.818 L 1.012 16.472 C 0.043 16.343 -0.344 15.203 0.361 14.555 L 2.26 12.807 C 2.74 12.366 2.74 11.634 2.26 11.193 L 0.361 9.445 C -0.344 8.797 0.043 7.657 1.012 7.528 L 3.624 7.182 C 4.283 7.094 4.734 6.501 4.617 5.876 L 4.155 3.395 C 3.983 2.474 4.998 1.769 5.861 2.21 L 8.187 3.397 C 8.774 3.696 9.503 3.469 9.794 2.898 Z" fill="rgb(144, 201, 248)" height="24px" id="t8kj2qEy3" transform="translate(4 4)" width="24px"/></svg>)
2-way messaging
between volunteers and admins
02. Research
How users go from forms to frustration
To understand the pain points behind CoachArt’s reimbursement process, we conducted staff interviews and heuristic evaluations of the existing 20-page Google Form. This helped us uncover not just the procedural steps but also the emotional friction users felt at each stage.
Volunteer
“I want to have a simpler and clear way to request supplies and submit reimbursements.”
Operations Specialist
“I want to create bills within Bill.com with minimal manual effort.”
Volunteer Manager
“I want to better organize Amazon purchases to easily reconcile with business statements.”
Key User Groups
Teachers
Administrators
Mark
Mark purchased water color sets for his art class students. Now, he wants to send a reimbursement request to CoachArt.
Ann
Ann reviews Mark's reimbursement request. Once approved, she copies the information to generate an invoice.
Journey Mapping
Steps
Fill out form
Review submission
Notify volunteer
Create an invoice
Actions
Enter personal information and payment type
Upload receipts
Select supply category, subject, and and material
Add any necessary comments
Access submission
Ensure all the fields are filled with valid information
Cross check with information from volunteer’s file
Inform volunteer if request is approved
Else, contact volunteer pointing out the issues in their request
Ask volunteer to submit a new request
Once approved, copy each response and paste it into Bill.com’s invoice generator
Download all receipts and upload them into Bill.com as well
Select the volunteer from the list of vendors
If the volunteer doesn’t have a Bill.com account, email them to make an account
Generate and send invoice to volunteer
Pain points
No direct receipt navigation, edits require backtracking
Can't partially approve requests
Volunteers don't know the issues with their request
Tedious and manual to copy each form input into Bill.com
Waiting for volunteers to create an account interrupts my workflow
Solution
B2C
Teacher-facing web forms to submit reimbursement requests for privately purchased supplies
B2B
An internal approval dashboard for reviewing submissions and automatically generating Bill.com invoices.
03. Final Product
Reimbursement Request
ORIGINAL
Teachers had to complete a 20-page Google Form with repetitive fields and no flexible editing, leading to errors and frustration.
Original Google form
New
Tabbed workflow
Insight
Users had to backtrack to edit entries.
Design
Each receipt opens its own tab, enabling quick navigation and edits.
Auto-calculated totals
Insight
Users had to calculate totals across multiple touch points.
Design
A review screen automatically sums all receipts.
Receipt preview
Users had to constantly switch views to reference receipts.
Design
Receipt previews allow for seamless data entry.
Interactive experience
1
Enter information
2
Upload receipts
3
Review & Submit
Supply Request
ORIGINAL
Previously, supply requests were submitted via email through a completely separate process, creating confusion and extra work for both volunteers and admins.
New
Unified flow
Insight
Users had to submit financial requests fragmented processes
Design
Centralized platform allows for parallel workflows
Link preview
Insight
Users had to paste raw links for admins to purchase from
Design
Familiar e-commerce style aligns with user mental models
Review & submit
Insight
Users want to know their total cost to check accuracy
Design
A summary page calculates the total and displays all items clearly
Interactive experience
1
Enter information
2
Upload receipts
3
Review & Submit
Admin Portal
ORIGINAL
Before the redesign, administrators had to manage reimbursement and supply requests through disjointed systems, juggling emails, Google Forms, and Bill.com, which was time-consuming and error-prone.
New
Categorize requests
Insight
Admins wanted to reduce manual error when processing requests
Design
Filters, flags, and status chips manage high-volume requests.
Flexible approvals
Insight
Admins found it inconvenient to guide users to their errors
Design
Item-level checkboxes send direct feedback
Bill.com integration
Insight
Admins manually copy each entry into Bill.com
Design
Built-in PDF generation syncs with Bill.com’s APIs for seamless invoicing
Interactive experience
1
View requests
2
Review submissions
3
Notify & Invoice
Design System
04. Impact
90%
reduction in reimbursement workflow steps
cutting a 20 page form down to a streamlined 2-3 step process
450+
volunteers and teachers onboarded
improving adoption and usability across CoachArt’s programs
60+
reusable design system components
built for scalability and future nonprofit finance workflows
