Boston's annual budget runs to roughly $4 billion in operating funds and a $5 billion capital plan, and for most residents understanding it meant digging through documents hundreds of pages long. The City wanted the budget to be something people could actually explore, so we architected a set of public-facing fiscal budget applications using Jekyll. The site presents recommended and adopted budget information across cabinets, departments, and programs, and integrates with an Access database through a JSON API to generate over 1,600 unique, mobile-friendly pages.
Numbers alone don't make a budget understandable, so we designed the site's data visualizations with Chart.js in close collaboration with the City's UX researcher, and tested them with residents before launch. The site includes a featured analysis section with cards for each story complete with author photos and summaries, budget basics explainers, and a capital budget interface with interactive charts and tables for individual projects.
Behind the scenes, we built the data infrastructure to aggregate, transform, and validate the budget data so everything on the site stays accurate and current. The applications are fully responsive and meet ADA accessibility requirements, so every resident can use them regardless of device or ability.
The result is a budget that belongs to the public in a real way: more residents now engage with the City's finances through the website, increasing transparency and accountability, and both the Budget Office and the Department of Innovation and Technology have praised the tools for their usability and reach.
Visit the live site