The text below is from the Graphicacy website:
The redesigned America After 3 PM site is made of two interwoven components of a ‘scrollytelling’ landing page and a data explorer that visually tell the story of participation in, and unmet demand for, afterschool programs; the experiences and opportunities programs afford; and which children and families are missing out, and why.
The landing page (above) for America After 3 PM serves as an executive summary, a short, engaging overview of the key points from this year’s data on after-school care.
This allows a casual visitor to glean the key takeaways in just a few minutes, even if they never dive deeper to the data explorer page. We 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 opportunities to dive deeper using the data explorer view. This view allows the user to see all the underlying data at the National level, as well as for each U.S. State. Through best practices around information design and user experience design, the data explorer allows easy navigation between geographies and across topics, so the full breadth of data is only a couple of clicks away.
The Graphicacy team continued our partnership with the Afterschool Alliance with a complete redesign of the website. Graphicacy delivered a much-improved user experience and a data explorer that visually tells the story of afterschool care in the United States, effectively highlighting key trends and important data points, to a diverse audience of parents, educators, and policymakers.
- Graphicacy: Jeff Osborn, Reed Spool & Will Merrow
- Afterschool Alliance team
"Afterschool programs have proven that they can be an effective partner in efforts to improve the health and wellness of our nation’s students. America After 3 PM highlights the positive role afterschool programs are playing in the lives of students who are able to take advantage of the benefits they have to offer—from access to healthy foods to opportunities to taking part in a variety of physical activities."
Healthy eating and afterschool programs
- Parents that agree that afterschool programs should provide children healthy beverages, snacks, and/or meals
- Parents whose child’s afterschool program offers beverages, snacks, and/or meals (possibly take out)
- Parents satisfied with their afterschool program’s snacks and/or meals
- Parents satisfied with the healthfulness of their afterschool program’s snacks and/or meals
- More info: Healthy foods were described in the survey questionnaire as those that are minimally processed foods made with whole grains and heart-healthy fats or oils and without added sugar or trans fats; fruits and vegetables; and beverages made without added sugar.
Physical activity and afterschool programs
- Parents that agree that afterschool programs should provide children opportunities to be physically active
- Parents whose child’s afterschool program offers opportunities for physical activity (possibly take out)
- Parents satisfied with the amount of physical activity offered in their child's afterschool program
- Parents satisfied with the variety of physical activity offered in their child's afterschool program
- More info: Examples of the variety of physical activities provided in the survey questionnaire were indoor, outdoor, games, and skill-building activities.
Concepts → Blueprints
Details of some of the supplemental data I designed
The first version of the dashboard and fact sheets
This project also taught the importance of how a product performs in situations it's needed in. The dashboard needed to lead users to fact sheets that they could print or use as slides for advocacy and awareness purposes.
One fun outcome of this project: Arnold Schwarzenegger, an advocate of afterschool programs, tweeted the first version of this project to his followers:
I realized this is the closest I've ever been connected to the former California governor and action hero (other than the time I walked right by him and his security detail in Georgetown, Washington, DC).
In all seriousness, though, this moment did spark awareness of how essential it has become to transform spreadsheets into vivid and shareable experiences. Here, we drew the eyes of people who might otherwise have never seen or read data about afterschool programs in the U.S. Even one influencer can reach millions. The first version of the dashboard and fact sheets were designed with the constraints of the existing Afterschool Alliance website and brand, and with a goal to make a useful tool that conveys a message of honesty, authenticity, and credibility. The updated design helps to elevate some of the main points that may have been less heralded in the original design.