Research has shown that afterschool programs provide critical opportunities for children to reach their full potential. This project was an opportunity for the Afterschool Alliance to show the unmet demand for, and benefits from, these types of programs in a data-driven way as well as touch on which children and families are missing out, and why.
The redesigned AA3 site is made up of two interwoven components – a scrollytelling landing page and a data explorer.
The landing page for AA3 serves as an executive summary, a short, engaging overview of the key points from this year’s data on afterschool care. Chunked by topic, a casual visitor can glean the key takeaways in just a few minutes, even if they never dive deeper into the data explorer page. Graphicacy used a technique called scrollytelling, which integrates animation and transitions into the natural scrolling behavior of web browsers. As users scroll down the page, charts and graphics animate into place, and transition to new charts. Each chart is paired with a short description, which is woven together into a larger narrative.
From this opening narrative, there are several access points along the way to dive deeper using the data explorer view. This companion page allows the user to see all the underlying data at both National and U.S. State levels. The data explorer has a robust and accessible top navigation panel that facilitates easy browsing between geographies and across topics, so the full data landscape is only a couple of clicks away. Given the breadth of the underlying data, chart types were purposely kept simple to allow users to scan a wide range of data points quickly with minimal frustration.