BBCi & Interactive tv programmes Designing for interactive ... · PDF file • Enhanced...

Click here to load reader

  • date post

    03-Jul-2020
  • Category

    Documents

  • view

    4
  • download

    0

Embed Size (px)

Transcript of BBCi & Interactive tv programmes Designing for interactive ... · PDF file • Enhanced...

  • Designing for interactive television © BBC 2005. All Rights Reserved 1

    Designing for interactive television v 1.0 BBCi & Interactive tv programmes

    Vibeke Hansen - Head of interactive television design © BBC 2006. All Rights Reserved

  • Enhanced television - Doctor Who

    BBCi, 24/7 - ‘Bridge’

    Designing for interactive television © BBC 2005. All Rights Reserved

    When designing for the BBC interactive television there are a few things

    that are worth keeping in mind:

    BBC Interactive TV services currently include two key areas:

    • Enhanced Programmes (e-TV)

    • BBCi, (24/7)

    The BBC’s interactive TV services are available across all BBC channels - for free.

    The audience of our services is diverse. All services should be easy to use for the

    audience, from the young through to the elderly. One in 30 of our audience has a

    visual impairment. When creating graphics, large clear fonts should be used, and

    colors that show a good contrast between text and the background. As a general

    guide all our services should be clean, clear and consistent to cater for all our

    audiences.

    Introduction

    2

  • 3

    Television design A basic introduction

    Designing for interactive television © BBC 2005. All Rights Reserved

    2

  • Designing for interactive television © BBC 2005. All Rights Reserved

    Television sets have a central, visible screen area. Around the outside, surrounding

    edge of this area there is an extra volume of screen space which varies in

    dimension according to the set manufacturer’s specifications. Graphics and text

    placed in this ‘unsafe’ area can fail to display. The BBC employs two universal safe

    margins to guarantee that all content is visible.

    Picture Safe Defines the largest region of screen that viewers are likely to see.

    However, because screens vary considerably, background graphics (those that do

    not hold vital information) may continue to the edge of the screen.

    Text Safe Defines the boundaries of the area in which vital information such as logos and

    text can be placed. These specifications are based on the PAL (Phase Alternative

    Line) Standard Screen Size.

    As a BBC technical requirement, all BBC programmes must be 16:9

    widescreen. Widescreen programmes must be 16:9 FHA (full height/anamorphic)

    (ex. ref. BBC technical standards document.).

    Designing for television: Safe margins

    4

    16:9 Safe

    14:9 Safe

    4:3 Picture Safe

    4:3 Text Safe

  • Designing for interactive television © BBC 2005. All Rights Reserved

    Digital images are made up of grids of coloured blocks or “pixels”

    (a contraction of the words “picture” and “elements”). These units are the

    smallest individual elements of the image.

    Computer monitors use pixels that are square; on a television screen they are

    slightly rectangular, roughly 1.067 times as wide as they are tall. Consequently,

    images that have the same number of pixels across their width and height will

    appear slightly stretched horizontally on a television screen, when compared to

    their display on a computer monitor. The effect is most obvious when observing

    regular geometric elements such as circles, which would appear on television as

    ellipses if translated directly from a computer screen.

    To get around this disparity, all images destined for television but initially created

    on a computer should be saved out at 768 pixels wide by 576 pixels high. Then,

    the image is reduced horizontally to 720 pixels in width. When broadcast on

    television, the wider pixels of the TV screen will ‘stretch’ the design back to the

    correct proportions.

    Designing for television: Pixel size

    5

    Computer Pixel

    Television Pixel

    x 1.0667x

    x

    Computers generate square pixels so you need more of them in a TV Line.

  • Designing for interactive television © BBC 2005. All Rights Reserved

    Television screens are designed to display moving images and cause a variety of

    problems for still graphics and photographs. Because there are fundamental

    differences between television and computer screen displays, it is important to

    constantly test PC or Mac-generated work on a variety of TV screens.

    Flicker The image on a television screen is composed of interlaced odd and even scan

    lines, which alternate at a rate of 50 times per second. Any single pixel (or line of

    pixels) falling onto a single scan line will flicker. A similar, distorted effect occurs

    when thin lines in text characters and single pixels in dithered photographs appear

    on screen. Because the overall resolution of a television screen is lower than that

    of a computer monitor, even the sharpest images will appear fuzzy in comparison.

    Different set top boxes can further exaggerate negative effects.

    Bloom Each scan line is made up of an analogue signal, which controls changes in colour

    and value across the screen. Strong contrasts in hue or luminance along these

    lines can cause distortion, throwing the display of vertical edges out of alignment.

    The resulting “bloom” causes curves or waves to appear in vertical lines. To avoid

    this problem, designers should avoid making strong changes in colour along

    vertical edges. Text in strong colours near rectangular edges can cause especially

    bad distortion.

    Designing for television: Display

    6

    Flicker

    Bloom

  • Designing for interactive television © BBC 2005. All Rights Reserved

    Colour display on television Use of colour has to be considered carefully. Television screens have a more

    limited overall gamut than computer monitors and a much higher gamma value.

    This results in much higher contrast and saturation levels during display. To achieve

    parity in terms of colour intensity, images should be toned down and desaturated

    when taken from the computer to the television screen. ‘Hot’ reds and oranges

    cause particularly bad distortion and pure white and black should always be

    avoided. The strongest white used for television display should hold a value of

    around 95%, or 240/240/240 in RGB terms. The darkest black conventionally

    used should hold a value of 5%, or 16/16/16 in RGB terms.

    Moiré Single pixels can cause flicker, therefore applying dither to images that are

    converted to limited colour index tables (such as 8-bit GIF or PNG files) should

    be avoided. The designer should refrain from using intricate patterns on screen,

    as this will cause a ‘Moiré’ distortion. This ‘shimmering tartan’ effect is a common

    problem and occurs when regular patterns such as grids or dots are rotated away

    from the true vertical. Large, clearly defined regions of cool desaturated colours

    tend to work best on television screens. Curves are less liable to distort than

    straight lines and as a rule, movement diminishes the impact of all television

    display problems.

    Designing for television: Display

    7

    Colour

    Moiré

  • Designing for interactive television © BBC 2005. All Rights Reserved

    What is widescreen For historical reasons television has settled with the 4:3 format (1.33:1), the

    word 'widescreen' is used to describe a picture that is wider than the norm.

    Hence any image that has a higher Aspect Ratio (AR) than the norm (1.33:1)

    could be described as widescreen. The broadcast industry have decided that

    their definition of ‘widescreen’ is an AR of 1.78:1 (16:9). It is important to

    remember that this is all the word ‘widescreen’ means.

    Digital, HDTV, DTT and numerous other bits of broadcast jargon do not

    necessarily imply the use of widescreen images. The BBC is committed to

    widescreen as an integral and important part of our digital service proposition.

    Even Widescreen hasn’t escaped from our desire to create our own terminology,

    here are some words and phrases you may hear:

    Tall and thin - 16:9 material shown on a 4:3 television.

    Short and fat ( or wide) - 4:3 material shown on a 16:9 television.

    Black bits - top & bottom - 16:9 letterboxed on a 4:3 television.

    Full Height Anamorphic - A distorted projection or drawing of anything which, when viewed from a particular point or by reflection from a suitable mirror,

    appears regular and properly proportioned; a deformation.

    Designing for television: Widescreen

    8

    16:9

    4:3

  • Designing for interactive television © BBC 2005. All Rights Reserved

    Tall and thin 16:9 material shown on a 4:3 television

    Designing for television: Widescreen

    9

    Short and fat (or wide) 4:3 material shown on a 16:9 television

    This is a 16:9 DLB transmitted (tx.) onto a conventional analogue set.

    4:3 transmited(tx) on to a widescreen television - Pillarbox.

  • Designing for interactive television © BBC 2005. All Rights Reserved

    Black bits - top and bottom 16:9 material displayed on a 4:3