January 27, 2010

Surfacing critical news stories

Breaking News scenarios

  1. Homepage
  2. Search results page

This was the first version of the editorial team’s Breaking News experience on the homepage. This feature was not designed for everyday news topics but reserved for high-impact events such as natural disasters. In reality, this project was initiated in reaction to the recent-at-the-time 7.0 magnitude earthquake in Haiti.

The additive treatment on the homepage was intended to drive traffic to a results page with a few critical elements:

  1. Up-to-date news aggregation from reliable sources
  2. Helpful links directly related to the event, curated by our editorial staff
  3. Close attention to the ads triggering to prevent insensitive ads from appearing during a time of crisis (e.g., deals on vacation packages to Haiti)

The final element was to provide a dedicated space for Microsoft to jump in and provide transparency on how the company was prepared to help. Here’s a blog post on what our team and company did to help out.

I have included this particular project primarily for posterity—not necessarily on its design merits alone, but to draw a distinction of what the home and results pages looked like in 2010. Our design language, both from a structural and visual standpoint, has evolved dramatically. The visual disparity is easy to spot, but through a systems design perspective, the underlying structure, and lack thereof, is the most fascinating to me. There was no grid, no responsiveness, padding was either 5 or 10 pixels based on how it looked, link targets were tiny, and that logo…ugh. 

* * *


Search IngressProduct design

HeaderProduct design

Query FormulationProduct design

Zo, Emoji That SongProduct design



AutopilotPoster design

Real EstateProduct design

OSD logoBrand identity

.... .- ...- . .- -. .. -.-. . -.. .- -.--