AZ School Spending

Project Overview

Context

Arizona School Spending showcases financial charts and data for the Arizona K-12 school system. The site was built for the AZ Department of Education in order to provide the public with information about education finance in an accessible format. I worked with Lolo Zhang on the development of its component design system as well as flows for sharing and comparing schools/districts. Check out the live site at schoolspending.az.gov.

Involvement

  • Product design
  • Development (Elixir, Phoenix)
  • 2D Illustration

Date

2022 – 2023

Home page for AZ Finance portal, showing a heading with large, bold text on the left that reads 'Arizona K-12 School Finance'. On the right is a photo of two excited students. Images of charts and graphs are overlaid on top of the photo.
The expenditure tab on a district's page. Shows a dashboard of section header containing callouts for dollar amounts and positive or negative indicators, as well as an explanation of the current section. Following the header are charts and tables of financial data.
Historical bar chart for per-pupil expenditures. The chart shows buttons at the top for adjusting the year range, format, and scope of the data.
Search input and dropdown for the school and district finder, showing the UI for highlighting Charter schools in the dropdown
Custom comparison report toolbar, which shows a toolbar containing a search input and instructions to select up to 4 schools or districts to create a custom report. Two districts have been selected and display their name, address, and a button that reads 'View Location'
Shows the custom comparison report toolbar fixed to the top of the screen while the user has scrolled down through the comparison report, which is a set of tables with collapsible headings. Each table is divided into sections with highlighted subheadings.
2D vector illustration for the 404 page on the site. Features an illustration of the cliffs in Arizona at sunset, with some cacti in the foreground. The text 'Oops! Something went wrong. Go Home.' sits on top of the empty sky in the background.