Freedom of the Press Foundation / Committee to Protect Journalists

Press Freedom Tracker

Screenshot of press freedom tracker homepage
Services
  • Services
  • Branding
  • Design
  • Development
  • User experience
Technologies
  • Technologies
  • Django
  • Git
  • JavaScript
  • React
  • Sass
  • Wagtail CMS

Tracking violations of press freedom

This project was conceived by the Committee to Protect Journalists (CPJ) and Freedom of the Press Foundation (FPF), partially in response to a violent assault on a journalist by then Congressional candidate Greg Gianforte. This site is meant to be a resource for citizens, journalists, and lawyers to quickly gain information and statistics related to incidents in the US concerning the Freedom of the Press.

Research-based process

Little Weaver conducted important research in order to ensure that this site met the goals of FPF, CPJ, and potential site users. We learned that similar sites were not providing the fact-based information and context that journalists and lawyers are looking for when they want to make citations. We avoided a map-based visualization of incidents, which our research revealed to be less helpful, and instead took a statistics-based approach. Anyone who goes to the site can easily filter incidents to get granular data based on many options, and can easily download that data to perform more extensive statistical analysis.

Screenshot of partner logos from site footer

Press Freedom Tracker partner logos in site footer


We also found that the reputation of the site and verification of incidents was important for journalists and lawyers who might want to cite the incidents reported on the site. We used this research in our design, making the partner organizations who made the site a visible part of every page. We ensured that the sources for each incident report were clear, and exposed the methodology used to categorize incidents wherever it was relevant, instead of only showing it on each category’s page.

Screenshot of incident page

Statistics in the sidebar allow users to easily filter for similar incidents.

Modern, eye-catching design

In order to make the information contained in the site accessible and useful we wanted to make it easy to understand and use, and to allow the user to follow a story laid out by each incident. The design uses black and white extensively, lending the gravitas for the seriousness of these incidents, while the use of color gives a quick visual aid to the user. Bold highlights emphasize how incidents are categorized, while a colorized hover-over effect pulls users further into each story.

The design also emphasizes the storytelling aspect of this site: reading about one incident leads naturally into reading about related incidents, or to filtering incidents based on the individual statistics provided. This allows users to explore the site in a natural, intuitive way.

Screenshot bottom of incident page

Customizable or auto-generated links to more incidents, creating an intuitive user experience.

Easy to use filters

It was important for the site to have straightforward filters, so we created a design that only shows users filters that are relevant to their current search. We made filters available for every aspect of the incidents and created custom autocomplete modules to help users find the incidents they need.

Screenshot of incident filters

Easy to use filters made with React.

Auto-updating statistics

One of the prime functions of this site is to allow journalists and lawyers easy access to statistics related to the incident data collected. We wanted statistics to auto-update, saving countless hours of time for site administrators. We created custom statistics functions in Django that allow site administrators to easily insert statistics from the site into blog posts and other pages, as well as display them prominently on the homepage. Admins can add new statistics functions and display them easily as their needs grow and change.

Screenshot of statboxes

Autoupdating statistics can be added in statboxes, seen above, or in the text of an article.

Mobile-ready

At Little Weaver, we know that our users are often on the go and don’t have time to stop at a computer when they need information. This site was made with mobile in mind, with a fully responsive design that allows users to get what they need no matter what device they’re using.

Building a better world, together

This is our second project with Freedom of the Press Foundation, and our first with Committee to Protect Journalists. We truly believe that the work each of these organizations engages in to defend journalism and the freedom of the press is essential to creating a just and accountable world. Simply put - we’re thrilled to have had another opportunity to work together.