Cards for discovery
I’m writing from Talk UX, the conference on UX aimed at getting new and differing voices heard.
Cards have become a massive trend in UI design, and BBC UXA Emily Heath elaborated not only on them as a concept but also how the BBC is implementing them.
Heath summarised cards as the following:
Cards are a piece of portable, snackable, micro content presented in a consistent and recognisable format
She had a memorable means of remembering the key elements of cards: “a Mona Lisa lunchbox”. Meaning:
- It is recognisable – we prefer the familiar (known as cognitive fluency), and even judge beauty in terms of what’s familiar to us (this is a whole topic on its own really)
- It is portable – it shows up on Google, twitter, Facebook … anywhere and everywhere that’s appropriate and in the appropriate way
- It is snackable – it can be consumed in small amounts if and when desired
They’re certainly popular as of late (I particularly like how Vox and the Yahoo News Digest app use them, and surely just about everyone has fallen into “the black hole of dailymail.co.uk’s righthand column”) but it’s a testament to their potential when a digital behemoth such as the Beeb choose to take them on. Heath pointed out that with over 2000 categories on their site, this a massive job for them to integrate, but that their potential for discovery in the footer every page means it’s worth the effort.
The team even created a visualisation to show the current interconnectedness of different sections, to find that sections were intraconnected but not interconnected (i.e. great within each section but not between each other).
As she explained it, she “wants to turn [information] ladders into ropes”.
What’s a minimum viable card? Heath showed the BBC proposal that is being rolled out.
Cards create accessible packages of information #talkux pic.twitter.com/ugxLNzZ85E
— Alastair Somerville (@Acuity_Design) March 5, 2015
Slides for a similar talk that she did are available online and below.
Cards for discovery from Emily Heath
Header image NC-BY-CC by Talk UX.
Member discussion