bbc iplayer for tv: putting iplayer where it belongs

of 59/59
BBC iPlayer for TV Putting telly back where it belongs Jane Murison

Post on 13-Apr-2017

133 views

Category:

Internet

4 download

Embed Size (px)

TRANSCRIPT

BBC iPlayer for TV

BBC iPlayer for TVPutting telly back where it belongs

Jane Murison

Ive been at the Beeb 9 years. I recently shared a lift with the Blue Peter dog.Its pronounced mew-riss-onAs opposed to terrorist or in chargeThis is one of many poor haircuts Ive had. I was trying to grow it out.My passport smile tries to convey that I am serious but friendly. I end up looking smug.

Telly is nicer to watch telly on. Thats why its telly.

Participant quote from BBC user research last week

Ill talk aboutHow TV is different from computersFrankenstein technologyHow we design for new things

Freesat 4:3Tasty.

BBC iPlayer Online launched 2007First TV iPlayer launched on Freesat 2009 - http://www.bbc.co.uk/blogs/pressred/2010/01/bbc-iplayer-on-freesat.shtml

5

HTML6

Wii Most Popular section7

Dcable the best til last! Some customers still see this8

Designing for TV

Why doesnt TV iPlayer look like this?

flickr.com

Telly is big, but (in the immortal words of Father Ted), its far away.

Do less.

So this15

Becomes something like this.16

1) Not every box lets designers choose a font.

2) Designers have their noses two inches from a giant monitor and the eyesight of a youthful osprey.

You might not have control of what fonts you get, or kerning or tracking. Our recent research favoured >24pt FSMe and Helvetica Neue, and found Gill Sans and Tiresias to be poor.Designers have their noses 2 inches from a giant monitor and the eyesight of a youthful osprey.

17

Remote controls are hard to design for

Entry problemsYou only have these buttons.*

* Colour keys are evil.

enterback

This is basically why we cant put this design up on a TV.21

Its even more fun with Games Consoles

enterback

Five-point nav, plus you might need to support both gestures and sometimes voice input in the same interface, without messing it up with too many interaction design twiddles.22

Colours change on telly.

A beautiful rural landscape turns into your aunties bad watercolour of a beautiful rural landscape24

The iPlayer Pink (circa 2010)

This was why we ended up with so many variations on the iPlayer pink. Since we audited it in 2010, weve narrowed this down to about 2 or 3.25

..and textures change too

This subtle diagonal stripe texture is called carbon fibre by the design team. Applying this to some TVs we actually saw the TV drawing lines as if there was a ghostly etch a sketch operating over the whole screen. What we were seeing was an extreme moir effect.27

Like this one28

and gradients are a nightmare

Doesnt stop us from using them, but whats an easy effect to create in photoshop has to be meticulously hand-coded for each different set top box, so the design needs to use very simple gradients, very sparingly, and if possible make sure the design works without them. 30

Action safe

Text safe

Salmon safe

Telly cuts off the edge of the picture. Newer ones arent as bad, but the old CRTs got kind of messy at the edge of the picture, so the manufacturers helpfully put a frame round it to cut out all the fritzy bits.Make sure youre keeping to guidelines safe areas (16:9 safe is non-optional). We are trying to keep action safe for 4:3 (because we are well hard). This means a button in focus is always within a 4:3 area in the centre of the screen. You can use lovely centred carousels and menus to make this work.

Richard Salmon figured out what the BBC safe areas should be for CRT televisions. Were still figuring it out for HD and flat screen televisions. In the meantime, Salmon safe is pretty safe.31

Heres what that previous screen looks like when you add in the safe areas. All that attractive white space put in was really there to protect the safe area: not just for visual impact.33

and yet, sometimes we get this

Although since we couldnt replicate this particular error, we eventually stopped worrying about it before release.34

Transitions

You don't know if your design is working until you know how the transitions look on the set top box. Transitions communicate the information structure as well as movement, and a bad transition is almost worse than no transition. Work closely with your tech team and our tech team to get the transitions as smooth and simple as possible. Different things are easy on different set top boxes.

Test it! With people!

This would be true with anything, but when its a TV application you really REALLY need to carry out research with normal humans.They will make you cry.

36

Franken-users &Franken-tech

Wikipedia

Look how happy they are

Zdnet.com

This sort of stock photography is sometimes perpetrated by UX people. In order to control the problem space, they ignore the inconvenience of mixed up technology, shaky broadband connection and non-standard family set ups. The solutions can be mortally flawed as a result.39

and poorly used marketing personae have a lot to answer for.40

Marginally closer to the truth

FOX

At least in the sense that they havent changed their TV (or anything else) for a long time. Average television lifetime is about 8 years things like moving house can be the catalyst for an upgrade. Its not like mobile phones, where people upgrade about once every 18 months. This slows technical development, and changes our strategic approach to how we support TV services.41

Some people get TVs from skipsWikipedia

Admittedly, theyre probably not then plugging it into the internet.42

Technology in the family: The TV is 8 years old. It will get replaced when it blows up, they move house, or if something big happens that requires new technology (HD TV sales increased before the World Cup in 2010) the kids are pestering to get an HD TV, and Mum and Dad may cave in the January sales.Under the TV (obscured by the sofa), is a cable set top box they have a package deal to get broadband, cable, and phone. Mum thinks theyre probably paying too much but cant be bothered to do the research to get a better deal. Theres also a DVD player, but not a bluray, because theyd need to get an HD TV. Theres also a moldering VHS that gets used about once a year, and an Xbox.Dads got an iPhone, and a big HP laptop which usually lives on the desk in the spare bedroom. He has a work computer which is much better spec, but he doesnt like using it at home much. Mum has a Blackberry from work, and got an iPad for Christmas which she has to keep away from the kids. She tends to use it for Wikipedia, Buddy, the eldest, is a student. Hes got a MacBook (present for starting university), and is on a PAYG Android. Hes in a shared student house which has a freeview HD box and an LG TV they bought together. He thinks its insane his parents havent bought a new TV yet.Dawns in her in final year of 6th form college. She has inherited Buddys old netbook, and has a hard-won iPhone 4Bridget and Mary-Louise have their own phones, but theyre both over three years old and have been passed down from at least two other family members. They have a PC laptop that they have to share. They also have a Wii in their room, and the last family TV, which is about 13 years old.

Theres a huge ecology of technology in the house, covering a massive span of up to date-ness and sohpistication. iPlayers made sure its available to this family in about 9 way to this family, but theres STILL a good chance they havent watched on demand TV on their TV, unless one of the kids has gone to the trouble of connecting the Xbox to the internet.

CAVEAT: obviously Ive made this up. But it does have elements of reality in it the age of the TV, how kids get mobile phones, upgrade dependencies.

43

The user

Whos your (secret) primary persona?

Why we do research: I think most people making things have someone in mind when theyre doing the making.

It better not be yourself.

But in practice having *anyone* in mind without research is probably going to damage the work. Even if youre thinking about that farmer in Wales with sketchy broadband who needs to see the long term snow reports via Red Button.45

!*&[email protected]!

This is the problem with that: If Im thinking of me, someones thinking about our boss, someone else is thinking about Welsh farmers and the last is thinking about Kanye West, were going to end up with a BAD design for nobody.

Plus well have lots of fights.46

So when we were testing iPlayer for Xbox, we had two main groups in mind:Regular Xbox users who were experienced with the native interface and gesturesPeople who were not regular Xbox users but who had an Xbox in the house.

Sometimes we tested them as friendship pairs, since viewing is a shared experience. For one group were hoping its learnable, for the other, that its consistent (within reason)47

Designing for new devices

Mapping the product to the thing

Competing wireframes

Mapping the users to the product

Mapping the device users to the product this is our user testing lab in Salford. We observed an early(ish) round of research with experienced Xbox users, and people who lived in houses with an Xbox but didnt use it very much. We checked what input they were most comfortable using, checking for learnability 51

We went hands, arms and voice on with iPlayer for Xbox Live - it's very swish.

Whoop, going minority report all over my XBOX BBC iPlayer Xbox 360

Finally, we get BBC iPlayer on the Xbox. Awesome. #HappyNow!!!

Twitter quotes from launch day56

What next?

The march goes onNew features like live, pause, last played

New devices to launch on all the time (Sky coming this year)

[email protected]

Jane Murison