How we designed and made Up the Block, a new type of digital news product for underserved communities.
For years, Upstatement has collaborated with The Trace, the premier newsroom reporting on American gun violence. We’ve learned that gun violence doesn’t just affect its immediate victims — it traumatizes entire neighborhoods and communities, often intersecting with issues like housing security, mental health, incarceration, and domestic violence. Many support organizations exist to serve this wider public, but there’s a lot of friction in finding and connecting with them: Which organizations provide counseling free of charge? Do any speak Portuguese? What if I don’t have a smartphone? Where do I even start?
Providing resource directories is a classic example of service journalism, a long-standing concept in the news world. But The Trace recognized that its existing readership of academics, researchers, activists, and others interested in the policies and effects of gun violence was different from the target audience for these services. The Trace needed to engage and serve new readers in a new way. It was a great opportunity to bring service journalism outside of the publication’s regular frame and into a product space.
The Trace leveraged the contacts and experience of their new outreach editor Sabrina Iglesias to become a model for reaching an often-overlooked audience. The new product they envisioned — a Philadelphia-specific directory of organizations that help those affected by gun violence — serves as a missing link between residents and resources. We joined the project as these ideas were forming, and our research and strategy phase quickly identified some key user goals.
- This new website should be a practical, no-nonsense resource that gets people to information quickly and reliably. It should be easy to use and always up to date.
- Accessibility matters, in every sense of the word. We shouldn’t assume a fast internet connection, the latest smartphone, or perhaps any digital technology at all. We should design for multiple languages and launch with complete English/Spanish parity.
- Connecting a visitor to the right organization would require fine-grained categories and search tools. Site visitors should be able to find counseling groups, West Philadelphia groups, or both at the same time.
We often say editors are users too, and so we outlined a few priorities for the team at The Trace as well:
- A technology stack that allows the directory to grow and improve over time, while providing features that make it easy to evaluate and test new changes.
- A lightweight CMS and database schema suited to a multi-lingual directory with multiple categories.
After just six weeks of rapid design and prototyping, we launched Up the Block (featuring wonderful homepage artwork by Philly artist Marian Bailey).
Site visitors can browse the directory by prompts, categories, neighborhoods, or even the language capabilities of the organizations. Helpful results are available in just one click, while providing detailed filtering controls to those who want it (e.g. filtering for the two groups in West Philly who advise on victims compensation and have Spanish-speaking staff). Search is full-text and provides instant results as you type.
We also wanted to solve for the offline version of the directory. Rather than require the Trace to manage a separate workflow for a print version (keeping it updated, distributing it), we turned to custom print stylesheets. When printed, any page on the website outputs with each organization’s information laid out in a tabular format, complete with a date-stamp and footer for reference. This solution maintains a single source of truth and makes distribution easy. Any community group, church, individual, etc. can print and circulate the directory as they see fit: in a community center, though the mail, or as a PDF.
To manage the app, Trace editors organize all site content in Airtable, where they can easily add organizations, edit English/Spanish side-by-side, and even generate one-off single pages. We used Gridsome and Netlify to make deployments easy, ensure speedy load times, and keep the site secure.
Up the Block builds upon existing community networks, furthers The Trace’s mission, and helps Philadelphians find essential support services in times of crisis. We’re excited to see this effort live and hope it serves as a useful model for the future of service journalism as a product.
For more information, read the launch post at The Trace, follow Up the Block on Instagram, and visit the site itself at uptheblock.org.
