Cards for discovery in 5 mins
•Descargar como PPT, PDF•
5 recomendaciones•1,223 vistas
The Content Discovery team at the BBC aims to make bridges between our different products and help users discover more of our content relevant to their goals. In order to achieve this we’ve been researching and designing a new Card presentation format. As UX professionals, we want to reduce the cognitive load at each step that users take so that they feel they can move fluidly through the content. In this short presentation I give you a handy analogy for how the snackability, familiarity and portability of cards are essential to enabling horizontal journeys across the architecture of a website or app. I also touch briefly on how we’re designing a global Card pattern to promote onwards journeys across the BBC. For my full talk on this topic, see http://www.slideshare.net/EmilyHeath/cards-for-discoverywiad15
Recomendados
Recomendados
Más contenido relacionado
Último
Último (20)
Destacado
Destacado (20)
Cards for discovery in 5 mins
- 1. Cards for discovery in 5 minutes! Emily Heath @gradualist
- 2. News Sport TV & iPlayer Children’sKnowledge & Learning Homepage Search App Cards footer Radio & Music Cross-product journeys
- 4. A single currency for cross-product journeys
- 5. Pick a card, any card
- 6. A card is a piece of portable, snackable micro-content presented in a consistent and recognisable format.
- 7. Hakonart’s lunchbox design available on zazzle.co.uk. Other lunch boxes and designs are available.
- 8. The Mona Lisa lunchbox Hakonart’s lunchbox design available on zazzle.co.uk. Other lunch boxes and designs are available. Familiar Portable Snackable
- 10. Footnote (*these psychologists!): Halberstadt, J., Pecher, D., Zeelenberg, R., Ip Wai, L. and Winkielman, Piotr. (2013) Two faces of attractiveness : making beauty in averageness appear and reverse. Psychological Science, Volume 24 (Number 11). pp. 2343-2346. ISSN 0956-7976
- 13. Cognitive fluency Try it for yourself on http://facelab.org/
- 17. portable | p təb(ə)l|ˈ ɔː adjective able to be easily carried or moved, especially because being of a lighter and smaller version than usual: a portable television.
- 18. Card architecture: a) the most useful bits of one thing
- 19. Card architecture: b) the mash up of many things
- 20. Card architecture: c) the card as micro content
- 21. portable | p təb(ə)l|ˈ ɔː adjective • Computing (of software) able to be transferred from one machine or system to another. portable versions of IBM's Systems Network Architecture technology.
- 22. The journey of a card
- 27. Familiar Portable Snackabl e E.g. Twitter video player, soundcloud, Yummly
Notas del editor
- I’m a senior user experience architect in the Content Discovery team at the BBC.
- We’re designing pan-BBC cards.
- I don’t have time to talk in detail what cards are….but you haven’t been living in a cave.
- But I do want to tell you why I think cards are such an effective design pattern for discovery.
- A simple analogy broken into 3 parts: the discovery card is like a Mona Lisa Lunchbox!
- We all recognise the Mona Lisa; the whole point of a lunchbox is that it is portable; and it is snackable.
- Familiarity.
- Psychologists * have done research on how we process information. They found that the more familiar something looks the more likely we are to choose it.
- In this study they asked a number of people to look at photos of faces and say who they thought was the prettiest or most attractive. I’m going to run this test with you now - I’ve got five pictures here and I’d like you to take a moment to say who you would rate is the prettiest face there. Now I’m not going to ask you to put your hands up to say which ones you choose,
- but I will take a bet that a large number of you think that number 3, the middle photo, is the most pretty face. This was the result of the study, and what is revealing about that result is that this face is actually an amalgamation of all the other faces. It was the average face.
- Psychologists call this cognitive fluency. Not beautiful features, just recognisable.
- The more faces amalgamated together, the more familiar the face will look to more people. This translates to how we make choices to do and read things online. We don’t like filling in long forms and can’t be bothered to read headlines that have long words in them. This isn’t because we’re looking for an easy ride, but we are drawn to the familiar.
- Twitter Cards are a good example of this. They successfully promote 3rd party content by sticking it inside this familiar (Twitter branded, and consistent) format so people are more likely to click on it and share it.
- Portability, can be defined as something that is easily carried or moved, especially because being of a lighter and smaller version than usual:
- Portability, can be defined as something that is easily carried or moved, especially because being of a lighter and smaller version than usual:
- Portability of cards encourages sharing
- (you give someone a small, easy to read thing, they’re more likely to share because they know their friends ‘will know what I’m sharing here’).
- And so this portability aids discovery.
- Double significance: Because in Computing, Portability means something which can be transferred from one machine or system to another. That’s efficient!
- So if cards are a small module of content which can be displayed across the whole of BBC online, then there is no redesigning or reprogramming our pages and systems to accommodate it and we save a whole lot of time.
- And efficiency is essential to the survival of the BBC as an organisation. (And probably your clients and product owners too)
- Cards are like the snacks in your lunchbox because they are available to you wherever you are.
- You don’t have to break your journey to have a snack.
- It’s like those tasters at the market - you get to try before you buy, or just keep on moving.
- This is what cards are doing here. Watch or listen this little clip of content right here - we know you’ll like it - and we know you’ll come back for more, buy the whole package, or maybe tell a friend.
- Here is an example of how we’re putting video, audio, quotes, galleries and more into our own consistent, portable and snackable format.