Bringing Citymeals on Wheels an efficient means of communication between staff and volunteers — helping those who are helping others complete their mission with ease and support.
Paper-and-pen processes were causing frustration on both ends — between the staff coordinating routes and the volunteers walking them.
The task was to design a responsive website that lets volunteers quickly access and enter information about meal delivery, client health and well-being concerns — while allowing staff to easily keep records for the seven years required to maintain city funding.
Citymeals volunteers gained an intuitive mobile-first website that lets them efficiently review and log aspects of their delivery routes — with the option to immediately contact a central office line.
In the end we also recommended a full native mobile app. Out of scope for this sprint, but research made clear it was a logical next step to serve an always-moving volunteer base.
Scroll for a detailed look at the project and design process — or jump to a section.
At a glance, the Citymeals on Wheels mission can look deceptively simple: getting meals and social interaction to homebound seniors. Behind the scenes the logistics become quite complex. Currently CMW relies on paper and pen to deliver multiple levels of information to and from its volunteers and maintain its records. A new responsive web platform will streamline this process — eliminating frustrations and giving time back to both volunteers and staff.
We looked at other volunteer platforms — Invisible Hands, North Brooklyn Angels, Mom's Meals — alongside delivery apps like DoorDash and Uber Eats to see how they communicate detailed information to users and what features enhance the experience.
Designing for a mobile volunteer is of the utmost importance — they are constantly on the go. Mobile wireframes were transformed into a full prototype that closes the gap between an outdated paper process and a modern, responsive experience.
Usability testing was conducted with five participants — including a long-term Citymeals on Wheels volunteer — across three task flows.
"When one avenue becomes unavailable, you have to pivot — our team sent in our own volunteer to document the process first-hand."
A responsive website volunteers and staff can access on the go or engage with via desktop.
Our final recommendation was to further develop the mobile website into a native app. This would make it even more convenient for staff and protect against complex UI problems across browsers — and because information would be stored on the device itself, the user would rely less on pinging a server to constantly load the next page.
The research process was extensive given a tight design-sprint timeline. Both volunteers and staff are considerably overwhelmed and busy, making interviews difficult to schedule — which only deepened our motivation to make their lives easier.
A key lesson: when one avenue becomes unavailable, pivot. With interviews initially hard to land, the team sent in its own volunteer to document the process first-hand, giving us incredible knowledge of the workflow and its real-world friction.
Another hurdle was the lack of any existing design system. In a very short window, new components were developed riffing on the public Citymeals website. The clearest follow-up would be a thorough heuristic analysis and refinement of brand colors and standards specifically for this mobile context.
Icons originally created by Freepik — Flaticon.