Skip to content Medium logoTwitter logoGithub logoTumblr logoInstagram logo
Banner image for A Bright Identity for Education News

Case Study

The Hechinger Report

A Bright Identity for Education News

How we helped the country’s premiere education magazine explain who they are — with a little inspiration from an unlikely subject

Five years ago, The Hechinger Institute found itself at a pivotal juncture. Originally committed to training professional journalists, newsroom cutbacks forced the Institute to re-imagine itself. And, in the face of steep challenges, it did just that, morphing into a news organization (The Hechinger Report) dedicated to reporting on inequality and innovation in the American education system.

When we arrived, Hechinger was thriving. It had established itself as the premier news magazine covering education, a peer to The Chronicle of Higher Education. Just one problem: They didn’t look like it. Although their stories routinely ran in The New York Times, The Atlantic, and NPR (to name a few), their own website looked like a blog. That’s where we came in.

Upstatement set out to create a new identity and website that matched the quality of Hechinger’s journalism. We helped their small staff relaunch the website as a destination that would show (or, as their director puts it, exclaim) their mission. We can proudly say it’s been quite a success.

chrome browser toolbar
hechinger homepage



Site Design

Making a brand statement on the homepage

While Hechinger had established itself with influential, award-winning stories, it lacked name recognition. There’s a saying in journalism, “Show don’t tell.” With Hechinger trying to cement itself as primary destination for education news, we wanted readers to quickly sense who Hechinger is and what they care about.

For starters, Hechinger is a magazine. They publish a select number of thoughtful pieces about the most important issues (Common Core, computers in the classroom), and places (New Orleans, Mississippi) in American education. Every few days, they produce a long, strong, original cover story.

To make things more challenging, Hechinger can’t count on strong photos to carry their vivid, human-centered stories. But what they lack in photography, they make up for in reporting prowess. Their stories are deeply researched, chock full of shocking, context-setting numbers that grab you by the shirt and make you want to read. We wanted the homepage to have the same effect.

mountain icon
New cover stories come out almost everyday, but don’t always have photos. We designed treatments that work with or without accompanying art.
a section of the hechinger report page
eye icon
Hechinger goes deep on the subjects it cares about most. The homepage showcases their most important beats.
a section of the hechinger report page
pie chart icon
Numbers are at the heart of every Hechinger story. These custom teases make it easy to see the stunning facts behind big stories — and provide the perfect entry point.
a section of the hechinger report page

The average caseload of a public high school counselor — nearly double the recommended limit

a section of the hechinger report page
paper clip icon
Important features used to disappear from the homepage almost as soon as they were published. This attention-grabbing section gives a second life to big features.
a section of the hechinger report page
text cursor icon
Highlighting important passages improves scannability on a page filled with text. It also helps readers focus on key facts and phrases.
a section of the hechinger report page
airplane icon
The redesign coincided with a relaunch of their weekly newsletter. This hefty call-to-action appears on every page — and contributed to a boost in subscriptions.
a section of the hechinger report page
a section of the hechinger report page


Balancing Style with Substance

While Hechinger can’t always rely on great photos, images are important to the editors and the audience. Throughout the process, we repeated the phrase, “Policy is boring. Kids are interesting.” That’s why the site is peppered with photos that take us inside the classroom.

Many of those photos are iPhone shots snapped by the story’s author. Our tasteful presentation makes each image look good no matter what. And when Hechinger has great photography (they hire freelancers for their biggest features), they still have the option to go big.

hechinger article example
hechinger article example on a tablet
hechinger article tease spread
hechinger article tease spread
hechinger article tease spread
hechinger article tease spread

“There is something fearless about the personality of this site. The impactful use of type and the striking yellow create an experience that is branded and distinct without sacrificing on readability and scannability of the articles.”




Inspiration from an unlikely subject

rebranded hechinger blue books

The Dreaded Blue Book

Our palms still get a little sweaty at the thought of the classic pale blue exam booklet. Pencils ready, class! But once the flashbacks stopped, we found something inspiring in the dreaded blue book.

The same book you see above found its way onto our inspiration board and played a big role in the final design. We loved how evocative the exam booklet felt even without photos. The bold rules, big type, and simple construction informed everything from the final logo to the top story treatment.


Friendly & Approachable

While the blue book inspired us, we didn’t want Hechinger to feel like taking an exam. The design called for a friendly sans serif. Approachable, but still serious enough for the subject matter. National struck precisely the right balance.

For contrast, we searched for a chunky, bold serif. Enter Tiempos. Klim Type Foundry’s flagship typeface provided the perfect foil, particularly because both typefaces were penned by the same person, the magnificent Kris Sowersby.

example of the hechinger rebrand on office supplies

Brand Guide

Completing the System

After developing the branding and site design, we extended the system to cover business cards, buttons, stationary, and social media (an often undervalued expression of the identity). Our extensive brand guideline book also includes alternate logo uses, a type/color guide, and instructions for how and when to use photography.

hechinger brand guide cover
hechinger facebook brand page




Making complex pages easy to manage

At Upstatement, we believe that a great reading experience starts with a great editing experience. That’s why we recently hosted a content management hackathon with teams from ESPN, The Verge, and National Geographic. And when Hechinger’s editors needed a simple solution to manage their complex homepage, we designed and built Stream Manager, a slick editor that seamlessly integrates with the WordPress backend.

With Stream Manager, content management problems that used to cause headaches are accomplished in a snap. Want change a story position? It’s as easy as dragging and dropping. Add a new story? No problem, the freshest stories automatically appear in your stream — and await approval before showing up on the homepage. What about pinning stories? We’ve got that covered, too. Pin a story anywhere, from the very first to the very last slot on the page.

Drag & Drop Organization

hechinger website page

Pin Important Articles

hechinger website page

Easily Search for a Post




Increased traffic and a happy client

We couldn’t have asked for a more passionate, dedicated team than Sarah, Davin, Matt and the gang at Hechinger Report. We’re immensely proud of the work we did together. The project started with clear goals, and we accomplished each one.

  1. Design a new identity that reflects Hechinger's distinct voice

  2. Show people who you are and what you do

  3. Help Hechinger to become a destination site

The third goal included some key performance metrics. We wanted the new design to encourage recirculation (the number of pages somebody visits after their initial page view) and to see an overall increase in traffic. In the end, we saw both go up — and by a substantial margin.


Increase in page views


Increase in Recirculation

“Upstatement was attentive to our goals and did a great job of figuring out how to define what we do visually. We love love love the design.”

photo of Sarah Garland, Editor of The Hechinger Report

Sarah Garland
Editor, The Hechinger Report

the Hechinger website on iphones

What We Did

  1. Research
  2. Content Strategy
  3. Design
  4. Front-End Dev
  5. CMS Development
  6. Launch