Time.com Redesign

Like most of the world, I have admired the covers, layout design and curatorial qualities of Time Magazine for my entire life. Time could come to life in ways that build on the classic style and emotive qualities of the print magazine while taking advantage of the connective power of the web. This is Phase 1 in an experiment where I asked what Time’s digital experience would be like if it preceded its printed older brother.

1. The Homepage

I’ll be the first to say that the homepage is not usually the highest traffic page of any web property. Especially in a splintered world where brands exist across multiple channels and communities. Either way, it represents the unique challenge of having lots of content that spans multiple categories. It’s also the perfect chance to give it a visual impact that is uniquely time.

This first screenshot illustrates a new header for the site that features the latest issues in a way that reflects visual style and history of time covers. Visitors can scroll through current and past issues, read selected content from them and potentially subscribe.

2. Homepage Scrolling Header

When a visitor begins to scroll down, the cover gallery closes.

3. Polish and Improved Readability

The content of the page was completely reworked from how the buckets are organized to typographic hierarchy. Increasing the size of featured stories, white space and contrast and size of type also improve the readability. The clear end benefit is visitors finding content that relates to them, discovering new topics and a more enjoyable reading experience.

Advertising and social were baked right in as a design constraint from the first sketches. This helps ads and social tools feel more integrated into the experience. I have also included a twitter piece that visualizes trends in topics.

People come to content through dramatically different paths and read different ways. To account for that, I have included a toggle to switch between standard, grid and list view.

4. Grid View

When a visitor selects grid view, the page automatically transforms into a neat grid of boxes that are more focused around images and categories than headlines. For many people this gives them a better sense of what types of content are available, feels more engaging and is easier to parse.

5. Article

In most cases, this would be the page I start with. It’s the destination that people want to reach, whether the through the homepage, search, twitter or facebook. Building on patterns from featured articles in Time’s print magazine, really breathes some life into the content and would hopefully help it connect with readers.

What Next?

In a world where my nephew can’t name a magazine but can tell you 10 websites he digs, I think Time has an interesting opportunity to help define the future of digital publishing. Next up, I’m thinking about digging into their iPhone and iPad apps a bit. Maybe thinking about what an experience is like through an RSS reader or Facebook.