CMSish

where web content management and user experience collide

Design vs content in digital magazines

Data journalism and infographics
I was over at Guardian HQ last Friday for a small but well formed event on data journalism. A panel of five discussed infographics and the business of digging news stories out of data.

Simon Rogers kicked things off with a summary of what the Guardian is doing in this space. Back in the day when we both worked at Guardian Unlimited, I didn’t always see eye to eye with Simon, but I admire the good work he’s doing these days with the data blog.

David McCandless, author of Information is Beautiful, was also on hand. Perhaps his most startling infographic was his CV. It turns out he never trained as a designer or did much more than dabble in design until a few years ago. Not bad for somebody who wrote what (I’d guess) was the year’s best selling design book.

In the Q&A there was discussion about whether some visualisations are only beautiful; nothing more than illustrations that add a bit of colour without clarifying anything—or in the worst case, even misrepresent the story. The latter case aside, I’d say visual variation is a legitimate end in itself. There’s nothing wrong with being pretty.

Still, it’s also the case that the best infographics work as an integral part of the story, and can bring out new insight. Design is being used here as part of the storytelling process. In the current Age of Skim Reading, the infographic is the story for many readers.

Which came first, the design or the content?
Which brings us to web templating and digital magazines.

Web template design is done before the content has turned up. The design is a bucket that gets filled with content. So there’s no real relationship between the design and the content; the design is not part of the story, merely part of the brand.

Most magazines, otoh, are designed around the content. Sure, there will be brand assets, master grids, baselines and so forth that get reused continually; but the design for each set of pages essentially starts with a blank slate and the story. The finished product is a story told with a mix of words and design.

There are pros and cons to each approach. Templating is highly scaleable. It has low production overheads once the templates have been created, so fits better into a tight production schedule. It deals better with distribution to multiple channels and devices; for each template A you can have (say) a matching mobile template A*.

But templates have to be “content-proof”, so that they don’t blow up when they encounter unexpected content; this is a really big constraint in practice. Templates don’t relate to the particular content of any story. And obviously they tend to look a bit “same-y”. All in all: an inferior user experience.

So this is the hard problem for digital magazines: is it possible to design content in a way that 1) can work across channels, and 2) can be done quickly enough and cost effectively enough to be viable.

Magazine options
Some people think magazines ought to just get with the programme, and adopt the web design paradigm so that their content can be easily pushed out to whatever digital channels are appropriate. This needn’t be as limited as it sounds. Your templates don’t have to be dumb buckets; you can make them pretty smart, so they introspect the content and format accordingly. It’s still lossy though; you’re still decoupling the design process from the storytelling.

Come to think of it, that decoupling is what in the CMS world we call “separation of content from presentation”, and it’s generally thought of it as a Good Thing. Is that a shibboleth we need to abolish in the magazine world? For search indexing etc, maybe it’s enough that it can be separated, after the fact.

Meanwhile, Adobe and Woodwing are building iPad-oriented solutions based around InDesign, the magazine publisher’s weapon of choice. This is a high-fidelity approach, which follows exactly the same design process as print. Which means it’s quite time intensive, and requires new design work for each device aspect ratio/orientation. Not to mention that the only way that they’ve found to make this non-lossy to date is to, er, bake the pages out as images… There’s talk about “adaptive design” and generating HTML5 in future releases. The truth is that a transition from InDesign to HTML (5 or otherwise) is likely to be quite lossy for the foreseeable future. Being a bit elastic is precisely one of HTML’s great strengths.

Which is the best approach? In short: I don’t think anybody’s there yet. It’s a matter of making a pragmatic decision that works for the moment (eg. only target iPad, “letterbox” your design for other devices, forget smartphones), while waiting for developments.

Filed under: Design, Publishing, , ,

Great open source user experiences

So software is (finally!) in the Age of Experience, where the world’s biggest tech company could plausibly be described as a user experience business, and where better UX is helping drive millions of dollars of market growth.

In that light, I’ve compiled a bulleted list of open source apps that offer a truly great user experience, with screenshots and  detailed notes:

Now I’m pretty sure I’ve missed one or two there. Please do set me right in the comments. But it’s going to be a pretty short list however you cut it. Why is that?

My first guess is that it’s about the social organisation of open source projects, that makes it difficult for people who aren’t hardcore devs to get involved. But I could be totally misinformed on this.

btw, this is NOT about being anti-OSS. It’s a good model that has produced a lot of great code, some of which I use every day. But nothing very user-facing.

Filed under: Design,

Eye candy? Wash your mouth out

I recently saw a tweet along these lines (I’m paraphrasing to protect the guilty):

Looking for a designer to spray some eye candy on our web app

Ouch. This says to me that somebody has built an app without understanding the purpose and value of interaction design. You can’t really improve your user experience by bolting on prettier icons as the last step. Good interaction design requires you to really sweat the details, and preferably from the outset. The beauty of a great application isn’t just a matter of form; it arises from function.

I agree there is value in polish: a more professional interface raises user expectations about robustness. Cynically, people are more likely to blame themselves if they hit a bug on a polished interface; if the software looks Heath Robinsonish otoh, they’re waiting for it to fail. But polish without real attention to the interaction details is a flimsy trick, a petard to hoist yourself with.

Traditionally, of course, developers got away with a lot of crap when “designing” their user interfaces. But that crap won’t wash so well any more, because too many users have seen better, and understand that they’re being shortchanged. Can you still build successful apps without good UX? Yes, sure. Maybe if you’re inventing a new market, or if you’re not really selling the app but the services around it, but most of all if the buyers are not the users.

Unfortunately, that’s very commonly the case in WCM, except at the bottom end of the market—which is why low end products (eg. Squarespace) often have better usability than high end ones (eg. Oracle). Things have been improving over the last couple of years admittedly, but you still see a lot of sloppy, ill-thought out design. Too much excise, technical jargon (“nodes”!), inconsistent gestures, etc.

I start every project by thinking about the interaction design, and slowly work around to the implementation model. Not so much “test driven development” as “design driven development”. Sometimes that makes things much harder for the developers; but hey, developers are smart people and they like hard problems. If they don’t; well, you need to find better developers.

Filed under: Design, ,

My tweets

Other stuff