Multimedia

A bitmapped graphic (also called a bitmap image) is made up of a grid of pixels. A pixel (short for "picture element") is the smallest element in an image, and it is one single colour. If you magnify a bitmap image, you can see that it is made up of these tiny squares.

All data in a computer is stored as 1s and 0s, so each colour is given its own binary code. This black-and-grey image needs only two colours, so it can be stored using just one bit per pixel: a 0 for each black pixel and a 1 for each grey pixel.

In a photo taken with a digital camera, each pixel stores the colour that was detected by one part of the camera’s sensor.

Any image that needs only two colours can be stored with one bit per pixel. This image has been made by giving a 0 to each orange pixel and a 1 to each pink pixel:

If an image needs more than two colours, it needs more bits per pixel. With 2 bits there are 2 × 2 = 4 different bit patterns, so four different colours can be shown. Each bit pattern is given a colour:

Using 3 bits gives more colours, because there are more bit patterns: 2 × 2 × 2 = 8 colours, as in this image.

The number of bits used for each pixel is called the colour depth (or bit depth). Instead of writing 2 × 2 × 2 = 8 colours, you can use a power: 2³ = 8 colours. So with n bits per pixel, 2ⁿ different colours can be shown.

The greater the colour depth, the more colours are available for the image. To find the smallest colour depth for an image, count its colours and find the smallest power of 2 that is at least that number. For example, an image with five colours needs 3 bits, because 2² = 4 is too few and 2³ = 8 is enough.

Image resolution is about how clear an image is on a screen or on paper. When you zoom in to a bitmap image, its pixels are stretched into larger blocks. That is why a bitmap image looks poor when it is enlarged too much. In the pictures below, A has the most pixels and E has the fewest.

Image resolution can be given as the number of pixels the image has per inch, for example 300 ppi (pixels per inch). In this course, image resolution usually means the size of a bitmap image in pixels: the number of pixels wide by the number of pixels high, for example 1920 × 1080. The total number of pixels is the width (in pixels) multiplied by the height (in pixels).

Image resolution should not be confused with screen resolution (or display resolution). Screen resolution is the number of pixels that a screen is set to display, given as the width of the screen in pixels by its height in pixels, for example 1920 × 1080. Screens with a large number of pixels (1280 × 720 and above) are called "high definition", because they show images and video more clearly.

If you view an image with a low resolution (for example 300 × 240 pixels) full screen on a screen with a higher resolution (for example 1280 × 720 pixels), the computer has to rescale the image to fit the screen, and the image looks pixelated.

Note One mark scheme has also accepted "screen resolution" as the term for the dots per inch (dpi) when an image is displayed.

To estimate the size of an image file, multiply the number of pixels by the colour depth:

file size in bits =
   width × height × colour depth

Here the width and height are in pixels and the colour depth is in bits per pixel.

So the file gets bigger if either the colour depth or the image resolution goes up.

As the number of bits grows, it makes sense to use bigger units: 1 byte (B) = 8 bits (b), 1 kilobyte (kB) = 1 000 bytes and 1 megabyte (MB) = 1 000 kilobytes.

Exam questions often ask for the answer in kibibytes (KiB) or mebibytes (MiB) instead. Then divide by 1024 at each step instead of 1 000: 1 KiB = 1024 bytes and 1 MiB = 1024 KiB.

Note This only estimates the size. The real file is a little bigger, because it also stores the file header.

The picture on the left has a colour depth of 24 bits and the one on the right has a colour depth of 8 bits. Which one looks worse?

The 8-bit image can only show 256 different colours, but the 24-bit image can show about 16.7 million. Humans can see far more than 256 colours, so the 8-bit image looks poorer.

The file size of an image depends on its colour depth. These four copies of the same picture show how much the file size grows as the colour depth goes up:

Colour depth and image quality. In real life we can see a huge range of colours, so the more colours a bitmap image uses, the closer it looks to reality. But not every image needs a high colour depth. Some images are not meant to look like real life, and even for real-life images a lower colour depth is not always noticeable. Finding a suitable colour depth is often a matter of trial and error.

Colour depth and file size. The main reason for reducing the colour depth is to make the file smaller. The more bits used for each colour, the more storage space the image needs. Smaller image files download more quickly on a web page and take less time to send by email.

The real size of an uncompressed bitmap file is always greater than the simple file size calculation. As well as the pixel data, the file must store extra information so that the image can be shown correctly. This extra data is called metadata, which means data about data. Examples of metadata are:

• the image dimensions (width and height in pixels)
• the colour depth
• the file format (file type)
• the type of compression used
• the date and time it was created
• where it was created
• details of the device that created it
• camera settings

The metadata must be in a fixed position in the image file, so that any software that displays or uses the image can find and read it. It is usually at the start of the file, in an area called the file header.

One way to organise image metadata is the Exif (exchangeable image file format) standard, which has a wide range of metadata tags, such as detailed camera settings and the time and date.

Common file formats for bitmap images are:

• Bitmap: the file extension is .bmp
• PNG (Portable Network Graphic): the file extension is .png
• JPEG (Joint Photographic Experts Group): the file extension is .jpg or .jpeg
• GIF (Graphics Interchange Format): the file extension is .gif

Bitmap images are most often made by taking a photo with a digital camera or a phone camera. The image is stored as a grid of pixels, where each pixel is a digital record of a colour captured by the camera’s sensors. Most flatbed scanners also save the scanned image as a bitmap.

You can also make a bitmap yourself with bitmap editing software. This is slow for anything but the simplest images, but it is useful for small pictures such as the sprites in a computer game.

A vector graphic is an image made up of a list of drawing objects and their properties. A drawing object is a shape defined mathematically or geometrically, such as a rectangle, a line, a polygon or a circle. Each object has properties that set its:

• dimensions, for example its width and height
• appearance, for example its line colour, fill colour and line thickness
• position, for example its x and y coordinates

The objects and their properties are stored in a list called the drawing list. When the image is shown, the computer works through the drawing list and draws each object.

A common file format for vector graphics is SVG (Scalable Vector Graphics), which is used for vector graphics on the web. All popular web browsers can display SVG images. Here are the drawing lists for three simple vector graphics, written in SVG:

<circle cx="100" cy="100" r="50"
  fill="lightgreen" stroke="black"
  stroke-width="5" />

<ellipse cx="80" cy="60"
  rx="70" ry="50"
  fill="orange" stroke="black"
  stroke-width="3" />

<rect x="10" y="10"
  width="140" height="100"
  fill="yellow" stroke="black"
  stroke-width="1" />

Advantages of vector graphics

Vectors can be resized without distortion. Vector graphics are scalable: they can be made bigger or smaller without distorting the image, because the computer redraws each object at the new size from its properties. A bitmap image can look pixelated when its size changes, especially when it is enlarged: the computer has to stretch the existing pixels over a larger area, so the shapes look rough and blurry.

To resize a bitmap image without losing much quality, pixels have to be added to spread the colours over a larger area, so a bigger bitmap means a bigger file. Some photo editing programs can do this, but because a bitmap has no instructions for the exact shapes in the image, the result is less sharp than the original. A vector graphic can be scaled without any change to its file size: the size of a vector file only changes when objects are added or removed.

File size. Vector graphics usually have smaller files than bitmap images, especially when they do not have many detailed shapes. For example, the colour of an object in a vector graphic is stored once, as one property, but in an uncompressed bitmap image the colour has to be stored for every pixel, even if the whole shape is one colour.

Image editing. It is much simpler to create and edit vector graphics. Each object can be changed on its own by changing its properties, and objects can easily be added or removed. Changing a bitmap image often needs specialist photo editing software.

Resolution. Vector graphics stay good quality whatever the resolution of the screen or printer they are shown on. The quality of a bitmap image depends on its own image resolution and colour depth, so a low-resolution bitmap will not look good on a high-resolution screen or when it is printed.

Advantages of bitmap images

Vector graphics are built from a limited number of shapes, so the kinds of image they can show are limited. This is why they are mostly used for illustrations, cartoons, logos and web designs. Bitmap images can show almost any level of detail and complexity. Photographs are always stored as bitmaps.

Sound is caused by vibration. To make a sound, something has to vibrate, such as the string of a guitar, a person’s voice box or the loudspeaker of a radio. The vibrating particles knock into other particles, which vibrate and knock into more particles, and so on. This is how sound waves travel away from their source. We hear sounds because the vibrations in the air make our eardrums vibrate. In the same way, a microphone picks up vibrations in the air and turns them into electrical signals.

A sound wave is usually drawn as a graph that looks a bit like a water wave. This is not exactly how the particles move (they move backwards and forwards in the direction the wave travels), but it lets us show the sound wave on a graph.

A sound wave is analogue. This means that the value on the graph (here, the air pressure as the sound passes) can be any value, not just certain fixed (discrete) values. Over time it changes smoothly, instead of jumping from one value to the next.

A graph of a sound wave over time shows two features that change how the sound sounds to us: the amplitude and the frequency.

The amplitude is the height of the wave on the graph, from the middle to its highest point. It shows how loud the sound is: sound waves with a higher amplitude are louder. For example, an actor speaking to a whole theatre makes a sound wave with a higher amplitude than someone in the audience whispering to a friend.

The time period of a sound wave is the time between two peaks of the wave. The frequency is 1 divided by the time period, and it is measured in hertz (Hz). The frequency shows the pitch of the sound: a higher frequency gives a higher pitch. For example, the graph of the shrill sound of a whistle is much more bunched up than the graph of the deep sound of a double bass. In the graph below, the sound shown by the pink dotted line has a higher pitch than the sound shown by the orange line.

To make a digital sound file that can closely recreate the original sound, the computer has to change the analogue sound wave into a digital form. To record a sound:

1. A microphone picks up the sound waves and turns them into analogue electrical signals.
2. An analogue to digital converter (ADC) changes the electrical signals into digital values that can be stored on a computer. This process is called sampling: the level (amplitude) of the analogue signal is measured at regular time intervals. Each measurement is called a sample.
3. Each sample is given a binary pattern and stored in the computer’s memory.

Once the sound is digital, it can be edited with sound processing software. To play a digital sound file, it has to be changed back into analogue sound waves:

1. A digital to analogue converter (DAC) changes the digital values stored on the computer into analogue electrical signals.
2. The signals are passed to a speaker. The speaker cone vibrates and moves the air, making analogue sound waves.

The sound waves that come out of the speaker may be quite different from the original sound waves. How close they are depends on the sampling rate and the sampling resolution.

How often should the ADC sample the sound wave? If it takes samples only rarely, the digital sound will sound very different from the original. If it takes samples very often, the digital sound will be close to the original, but the file will be very large, because it stores a large number of samples.

The sampling rate is the number of samples taken per second. It is measured in hertz (one hertz is one sample per second). A sampling rate of 44.1 kHz means the sound wave is measured 44 100 times every second. The higher the sampling rate, the better the quality of the recording, and the bigger the file.

To rebuild the original sound accurately from its samples, a high sampling rate is needed. The graphs below show the same sound sampled at a high rate, at half that rate and at a third of that rate:

This graph shows a very low sampling rate of 1 sample per second. The sound recreated from the samples is very different from the original:

Raising the sampling rate makes the copy more accurate, because the gaps between samples are smaller. 44 100 Hz (44.1 kHz) is a common sampling rate for digital audio: the sound is sampled 44 100 times per second, and these samples are used to rebuild the sound when it is played back.

The Nyquist theorem. The human ear can hear frequencies from about 20 Hz up to about 20 kHz (at most about 22 000 Hz). The Nyquist theorem says that, to reproduce a recording accurately, the sampling rate must be at least double the highest frequency. So music for a CD is recorded with a sampling rate of 44 100 Hz. Recording only the human voice needs a lower sampling rate, around 8000 Hz.

Each sample measures the level of the signal, which stands for the height of the sound wave at one moment. The sampling resolution (or sample resolution) is the number of bits used to store each sample. It sets how many different values a sample can take.

With a low sampling resolution (very few bits per sample) there are only a few binary patterns, so the changes in the analogue signal cannot be stored accurately. Each value has to be stored as the nearest digital value available. The difference between the real analogue value and the value stored is called the quantisation error. In the top graph below, with only 2 bits per sample, measurements at different levels have to be stored with the same binary pattern. With 3 bits per sample (bottom graph) each sample is stored more accurately.

In this example, with 2 bits each sample can only be one of 4 levels (0 to 3), but with 4 bits there are 16 levels (0 to 15), so the stepped digital wave follows the real wave much more closely:

A high sampling resolution makes the file larger, so it takes up more storage space. This may not be practical, depending on what the recording is for. Digital audio usually uses one of two resolutions:

• 8-bit audio, when lower-quality sound is good enough, for example in devices that only need simple sounds.
• 16-bit audio, the standard for CDs and sound cards. With 16 bits per sample there are 2¹⁶ = 65 536 possible values.

To find how much storage a sound file needs, in bits:

1. work out the number of samples: multiply the sampling rate in Hz (samples per second) by the length of the recording in seconds;
2. work out the number of bits: multiply the number of samples by the sampling resolution (bits per sample).

storage in bits =
   sampling rate × seconds
   × sampling resolution

To give the answer in other units, divide by 8 to get bytes, then by 1 000 for kilobytes and again for megabytes (or by 1024 for kibibytes and mebibytes).

Mono and stereo. One more thing changes the file size: whether the sound is monophonic or stereophonic (mono or stereo). Mono sound is one track of sound. Stereo sound has two different tracks (channels), which give an impression of position and direction. Two tracks need twice the storage, so a stereo recording is twice the size of a mono recording with the same length, sampling rate and sampling resolution:

stereo storage in bits =
   sampling rate × seconds
   × sampling resolution × 2

When you record digital sound you often have to choose between accuracy and file size. Increasing either the sampling rate or the sampling resolution improves the quality of the sound, but makes the file larger. Decreasing either one makes the file smaller, but the sound quality is worse.

These examples start with a sound file in standard CD quality: a sampling rate of 44.1 kHz (44 100 Hz) and a sampling resolution of 16 bits.

Increasing the sampling rate. 44.1 kHz is the standard rate for CDs and MP3s, but the most common sampling rate for the sound in films and on DVDs is 48 kHz. Raising the rate from 44.1 kHz to 48 kHz gives 48 000 × 180 × 16 = 138 240 000 bits = 17 280 000 bytes = 17.28 MB. The file is about 1.4 MB, or 9%, bigger.

Decreasing the sampling rate. FM radio usually uses a sampling rate of 32 kHz, and some digital video uses it too, because it allows four channels of sound to be recorded. Lowering the rate from 44.1 kHz to 32 kHz gives 32 000 × 180 × 16 = 92 160 000 bits = 11 520 000 bytes = 11.52 MB. The file is about 4.4 MB, or 27%, smaller.

Increasing the sampling resolution. More bits per sample give a greater dynamic range (the range between the quietest and loudest sounds that can be stored). For example, Blu-ray discs, used for high-definition video, support a 24-bit sampling resolution. This gives 44 100 × 180 × 24 = 190 512 000 bits = 23 814 000 bytes, about 23.8 MB. The file is about 7.9 MB, or 50%, bigger.

Decreasing the sampling resolution. Some digital audio files use 12 bits per sample instead of 16. This gives 44 100 × 180 × 12 = 95 256 000 bits = 11 907 000 bytes, about 11.9 MB. The file is about 4.0 MB, or 25%, smaller.