Content design with cojones

Or so I tweeted whilst watching the recent Apple keynote. A month later and I don’t think I could have been more wrong.

Immediately after the iPad’s reveal, the interweb rippled with an argument between two tribes, those that want a computer that allows them to tinker under the hood, and those that don’t care about getting their hands dirty – they just want to email, surf, watch and listen. For me, this isn’t the interesting debate. It’s how the speed, screen size and controlled environment of the iPad now means that content design on screen can finally come of age and grow some balls. Big ones.

Your content isn’t the same as my content

There are some sites that people check two or three times a day. BBC News is one of them for me. However, out of the 50 or so articles on their home page in the morning, I’ll probably only read around ten stories. As I check back during the day, there’s a law of diminishing returns, in fact every time I visit I usually end up reading half as many stories as I did the previous time.

This isn’t because there’s no ‘new’ news, it’s that new stories have problems bubbling up to the surface. Unless it’s a major breaking story, new content tends to get lost.

It’s easy to see why: the articles I read first thing loiter on the page till they reach the end of the editor’s news cycle, disregarding that I don’t need to read them again. New stories also get lost amongst articles that I decided not to read in the morning: if I’ve ignored them once do I really need to be presented with them again?

Rather than delivering the same content to everyone, how about delivering articles through an application that knows who I am and what I’ve read? Strip out the deadwood I’ve consumed already and the content I’ve ignored. Concentrate the experience down to new content I haven’t seen yet and make the experience personal.

Of course, feed readers have been doing this for some years using RSS. However, the iPad is targeting the ‘non-tinkering’ tribe, the people who don’t know what a feed is or for that matter care. RSS readers also deliver content in a totally non-branded and generic way – one story, one source is treated much the same as any other. The iPad allows us to go so much further.

Going click happy

These are the stories I read in one session on the BBC news site a few days ago:

Yet of course this isn’t actually the sequence of pages I looked at. My browsing experience was closer to this:

I bounce between the home page and content, flitting between the two. 12 clicks to read 6 pages? Laid out end to end it seems crazy that I spend so much time in the lobby compared to where I actually want to go.

How do I decide where to go without the home page though? What if we were to start seeing content as sequences of pages and stories rather than individual pages linked from one page? Some sites are already moving in this direction, placing previous and next story links at the top of each page. Here are two examples, from Heat and Vogue magazine:

Where does that next page link take you? At the moment it’s usually based on recency – the story that got published next is next. But how about a series of pages based on your reading habits and interests? Or a user generated set of the most popular pages? An editorially curated feature set consisting of a series of stories, videos and galleries? A set curated by a friend, a brand, a newspaper or a celebrity? Or an experience that combines shopping and content in one experience from multiple sources?:

From an interaction perspective this is made possible by the tablet form factor of the iPad. The experience of holding content in your hand and the immediacy of the iPad’s page swipe allows us to start thinking about how content can be grouped together in new ways, and how home pages can become about discovery rather than merely a glorified destination board.

Put that monolithic template back where it belongs

All too often sites are designed around one template for each content type. A blog post uses the blog template. An article uses the article template. The presentation of each story remains the same even if the needs of the content changes.

It’s an alienating experience when you compare online stories against their print equivalent. It’s only content that’s been created natively for the web, such as videos and slideshows, that rise above the print magazine’s content.

However, when it comes to features and articles, the presentation feels constrained. Hemmed in by the rigidity of a content management system dictating that every story needs to fit the same template. A template that needs to fit every screen resolution and every browser.

The iPad is an opportunity to look again at the balance between the needs of content and the content management system. What if we could start using apps to delivering content in a known environment to craft deeper and more engaging online experiences? What if we could start using the known characteristics of the iPad (such as it’s screen resolution and multi-touch screen) as constraints that influence the design in a positive way? We’d be able to stop designing for the lowest common denominator and craft for the richest experience.

Shelving that one-size-fits-all template and beginning to design for a different experience in story telling would be a good place to start.

Take a beat

One of the key parts of the experience of reading a newspaper or magazine is rhythm. Part of this comes from the visual design (that flexible grid again), but also a tempo that comes from story length and weight.

Here’s a typical spread from the print edition of the Daily Telegraph:

The page has four stories, and each one is of a different size. The length of each one has been determined by how important the editor feels the story is relative to the day’s news and, of course, how many column inches he has to fill to print the newspaper. The varying lengths of each article give the reading experience a rhythm of it’s own, mixing depth with occasional breadth (especially as shorter stories tends to be less serious and more frivolous).

On the web, that same serendipity of rhythm that comes from a print constraint is removed: the web is never going is run out of pixels, nor need to fill so many column inches a day. Which means that all too often stories on the web seem to take the same space, regardless of their importance. The same length, the same presentation, the same template.

Is this because a story had to be long enough to justify a page? And that in a world driven by information architecture every needs needs it’s own URL?

Wouldn’t it be better to start seeing stories of different length as a good thing? Something to deliberately create? An opportunity to let the user take a beat, mixing groups of short stories amongst longer articles:

A story could be as short as 140 characters (as so brilliantly demonstrated with the tweets interspersed between images on Pictory) or as long as an essay.

Of course, the best of the web experience can also be used to create compelling experiences that have a rhythm of their own. How about if a stream of mixed length stories were to include data visualisations, video stories and slideshows? It’s not so much a content set as a playlist.

King banner

The iPad is a huge opportunity for the relationship between advertising and content to be changed for the better. No longer does advertising need to be constrained into insignificant banners that no one pays attention to.

Ads need to become part of the experience in a positive way, a relationship that can help both the user and the advertiser. The worse that could happen is if the model of disruptive advertising continues: the only way we can get your attention is if we piss you off:

For sure, something that’s mildly annoying on your current computer is going to be infuriating and brand destroying when you’re holding the content in your hand.

Online ads need to become part of the content themselves – not an overlay or a banner, but a page in their own right. Yes, they can swiped away with the hand, but surely the iPad’s full colour screen goodness is a rich enough canvas for a compelling advert that can attract attention?

The three ages of the web

All of this contributes to different aesthetic and a different way of experiencing content online. The iPad is the next step on in a long journey from the first days of the web.

From a design perspective, the web started off as something tiny, tiny, tiny. Fonts were small, images were small and buttons were exceptionally small. They had to be. We forget now just how small how a monitor resolution of 640 by 480 is.

Clients became obsessed with trying to cram everything into the viewable area of the page (remember, users don’t scroll…) and designers compensated for this by downsizing everything. This included the body copy, with many web designers coming from a print background (myself included) thinking it was okay to set type in the, impossibly small to read online, 10pt.

As the internet progressed, monitors became bigger and the slow crawl from 640 to 800 and onwards began. Web 2.0 came about and nearly everything became shiny. Serifs became fashionable, not least because designers started caring about usability – type at readable sizes suddenly means that serifs become a practical proposition. As the size of your monitor went up the size of your browser window stayed the same, a near universal page width of 1024 pixels.

The third and upcoming age is a different world. Innovations like typekit and the slow painful death of IE6 mean that typography can be anything. The years of learning usability the hard way have paid off: designers now have constraints to be creative with. What it means to read, consume and interact with a web page is moving on. Images, type and experiences are becoming bigger. On the iPad they’ll be full screen, edge to edge and seamless.

This reflects the same developments in the way websites and pages are structured:

From a very regimented beginning (when hand holding was a necessity: navigation to get you back, links for other things to see in case you came to the wrong place) to a focus on content. This second age spoke of a confidence in the content and the way that people consume it – we’re not going to distract you with link bait… read the article and then decide where to go next at the end. Navigation? Everyone knows where the back button and search field is.

As this confidence has developed, sites have begun to take advantage of all of the space available. Sites like thesixtyone, where the full screen is used to focus the user on discovering new music, rating and sharing as you go.

Or the beautiful Thinking for a Living, using a new way of navigation through an article to turn the way content is presented upside down (or side to side at least).

The future of content design?

Sites like these are beginning to provide a glimpse into a new way of thinking about content. The iPad (and it’s sires) are a huge opportunity to continue this trend. To start…

• exploring new ways of grouping content together by users, curators or themes
• personalising the content you see based on what you’re already consumed
• using the way you interact with a touch screen to drive navigation and page flow
• developing richer advertising that’s a part of the experience rather than an intrusion
• recreating for the web content rhythms, mixing short and long form content together

And above all, to design content with confidence.