Inspiration

The Neurologic Music Therapy Services of Arizona (NMTSA) empowers people through the healing of music, but their digital presence hadn’t kept up with their impact. We wanted to create a platform that reflects their compassion and innovation while making volunteering, therapy coordination, and admin work effortless.

This rebuild was driven by the challenges of a small team balancing therapy sessions, volunteer coordination, and donor outreach with limited technical resources. Our goal was to deliver a sustainable, accessible system that lets NMTSA grow without needing constant developer support.

What it does

The new NMTSA Website Rebuild is a centralized digital platform for administrators, volunteers, therapists, clients, and donors. It combines scheduling, management, donations, and communication in one modern, secure, and accessible site.

Every page follows WCAG 2.1 AA standards with responsive layouts, ARIA labels, and keyboard navigation. Information about programs, staff, and opportunities lives directly on the site—no lost links or external documents.

Volunteers use a personalized dashboard with a real-time calendar, instant sign-ups, and a QR-based clock-in/out system. Admins gain full control through inline content editing, secure role-based access, and a unified dashboard for managing users, sessions, and content.

For clients and therapists, the same system manages therapy scheduling and attendance, creating a single hub for clinical and community coordination.

Donations and merchandise sales run through Stripe and Stripe E-Commerce, offering fast, transparent, and secure payment flows. Together, these features turn NMTSA’s site into a reliable, human-centered operations platform that supports both growth and accessibility.

How we built it

The site uses Django for the backend and HTML, CSS, and JavaScript for the frontend, hosted on Vercel with CI/CD from GitHub. Django handles authentication, routing, and data through ORM models for volunteers, clients, therapists, shifts, and events.

The frontend relies on Django templates and vanilla JavaScript with asynchronous fetch() calls for live data updates—no page reloads required. All submissions are secured by Django’s CSRF middleware, and modular CSS keeps the UI clean and consistent.

Offline reliability comes from localStorage caching that syncs with the server once reconnected. Environment variables secure API keys, while Django middleware protects against XSS, CSRF, and session attacks.

Challenges we ran into

Integrating multiple user roles while keeping usability and security strong required custom role-based decorators and careful template logic. Synchronizing client- and server-side data for clock-in/out and scheduling features meant building asynchronous, cache-aware update systems.

We also optimized the live calendar to reduce DOM reflows and iterated on accessibility with screen-reader and keyboard testing to ensure full compliance.

We also had some issues with deployment, due to neither of us having backgrounds in CS. While a majority of the problems were solved before we were able to present, some persisted, and will be fixed post this competition. These are not present in our locally hosted websites.

Accomplishments that we're proud of

We delivered a production-ready, modular Django platform that combines accessibility, performance, and real-time interactivity. The QR attendance system and offline persistence layer make participation seamless for volunteers and therapists alike. Optimized database queries and caching improved load times by roughly 40%, giving NMTSA a fast, reliable system ready for real-world use.

Additionally, we optimized database queries using select_related() and caching strategies to reduce server load, improving response times by up to 40%. The result is a web app that is not only functional but also performant, secure, and scalable.

What we learned

We learned how to balance user experience with backend precision—designing asynchronous REST-like APIs in Django while maintaining accessibility from day one. Building for a nonprofit reinforced the value of maintainable, modular code that empowers non-technical users to manage their own tools securely.

What's next for NMTSA - Website Rebuild

Next steps include integrating Twilio and SendGrid for automated notifications, expanding Stripe for recurring donations and analytics, and migrating to a cloud-based PostgreSQL database with optional Google Sheets sync.

We plan to add an analytics dashboard for real-time volunteer and donation insights, Progressive Web App features for offline use, and Google OAuth login to simplify access for clients and staff.

Accessibility audits with Lighthouse and axe-core will continue to ensure WCAG compliance. The system is fully deployable today after connecting NMTSA’s production credentials and is built to remain secure and sustainable for years ahead.

Share this project:

Updates