Digital graphics technology

Pictures are made up of millions of pixels. These are small squares of block colour which are put together in order to create a picture. The more pixels per image, the better quality the image is. You can tell whether an image is of good quality by how long it takes for the picture to pixelate when zooming in. The smaller and closer the pixels in an image are the more clearer and better quality the picture is.

Good quality imageGood quality image

This is a high resolution image because you have to zoom in a lot for the image to pixelate.

Bad quality imageBad quality image

This is a low resolution image because you don’t have to zoom in much for the image to pixelate. The image is also visually very blurry not very detailed.

In a picture the pixels are not visible unless the image is very bad quality. Image resolution represents the quality of a picture. The higher the resolution, the better quality the image is.

Full size image Zoomed in until pixelated

Full size image Zoomed in until pixelated

Good quality Good quality imageimage

Bad quality imageBad quality image

Compression (lossy, lossless)

Compression is where the file size of a photo is decreased. This helps when you have lots of photos because it means that you don’t lack in space to store it and it doesn’t cost a lot to print. Although compression can decrease the quality of the image. But if the image is compressed slightly, the image quality doesn’t appear affected. Sometimes if your image loses quality it is ok as if you use it for example in a site, you may only want the image very small for an icon maybe. Therefore as the image is small, the loss in quality isn't very recognisable. In a bitmap or raster image, when compressed it may lose quality depending on what file type it is saved as because the image is made up of pixels and when compressing raster images, pixels are taken from areas of block colour and so the less pixels, the smaller the file size but the more quality is lost.

Lossless data compression is a class of data compression algorithms that allows the exact original data to be reconstructed from the compressed data, meaning what appears as the same image is reconstructed

Lossy data compression only allows an approximation of the original data to be reconstructed, in exchange for better compression rates. data encoding method that compresses data by discarding some of it.

File extensions e.g. bmp, png, gif, tiff, jpg, psd

Original image(lossless PNG, 60.1 KB size) — uncompressed is 108.5 KB

Low compression (84% less information than uncompressed PNG, 9.37 KB)

Medium compression (92% less information than uncompressed PNG, 4.82 KB)

High compression (98% less information than uncompressed PNG, 1.14 KB)

Vector graphics are made out of points, lines, curves, and shapes or polygons, which are all based on mathematical equations, to represent images in computer graphics. An advantage of vector images is that when zoomed into, the image does not pixelate as it is made up of lines as apposed to pixels unlike raster images. Vector images are also generally a smaller file size although some systems may not support the raster image format. When creating a graphic, there is a tool which you can use to create a polygon. You can then manipulate this image by moving the lines and points of the polygon.

File extensions for vector graphics include:

Adobe Illustrator Artwork (AI) is a proprietary file format developed by Adobe Systems for representing single-page vector-based drawings in either the EPS or PDF formats. The .ai file name extension is used by Adobe Illustrator. Vector graphics can be made in Adobe Illustrator and there are many tools and brushes to create any desired image. Anything made in Adobe Illustrator is saved as an ai flle type.

Encapsulated PostScript (EPS) is a standard format for importing and exporting PostScript language files in all environments. It is usually a single page PostScript language program that describes an illustration. The purpose of the EPS file is to be included as an illustration in other PostScript language page descriptions. The EPS file can contain any combination of text, graphics, and images. An EPS file is the same as any other PostScript language page description, with some restrictions.

Adobe Flash (FLA) is an image or animation created on Adobe Flash. In this program you can use a variation of tools and effects to create vectorGraphics and animations.

Bit Depth is the depth of colour within each pixel. In an RGB image there are 3 main colours that make up any other variations of colours in the colour space.

Bits per pixel (BPP) is the number of distinct colours that can be represented by a pixel which depends on the number of bits per pixel (bpp). A 1 bpp image uses 1-bit for each pixel, so each pixel can be either on or off. Each additional bit doubles the number of colours available, so a 2 bpp image can have 4 colours, and a 3 bpp image can have 8 colours.

16 bpp, 216 = 65,536 colours (“Highcolour" )24 bpp, 224 ≈ 16.8 million colours ("Truecolour"

Monochrome (265 colour variations) describes images in one colour or shades of one colour. A monochromatic object or image has colors in shades of limited colours or hues. Images using only shades of grey (with or without black and/or white) are called grayscale or black-and-white.

•Highcolour is a 16bpp image usually but sometimes supports 15bpp image. Each pixel is represented by 2 bytes

•Truecolour is defined to mean at least 256 shades of red, green, and blue, for a total of at least 16,777,216 colour variations.

•Having more shades of colour can enhance a photograph. •BPP

1 BIT(2 colour

variations)

2 BIT(4 colour

variations)

4 BIT(16 colour variations)

8 BIT(256 colour variations)

16 BIT(65536 colour

variations)

24 BIT(16.8mill colour

variations)

Bit Depth can be changed In Photoshop so that the amount of colour used can either be reduced or increased. This is achieved by opening your picture in Photoshop, then selecting “Image”, “mode” and then selecting the number Bits you want the image to be adjustable to.

Colour Space refers to the 2 colour options in an image (RGB and CMYK)

RBG means that the image only includes the shades between the colours red, blue and green. Whereas CMYK means that the image includes all shades in-between Cyan, Magenta, Yellow and Black. . RGBA is RGB with an additional channel, alpha, to indicate transparency.

CMYK is another colour space. A wide range of colours can be created by the primary colours of pigment (cyan (C), magenta (M), yellow (Y), and black (K)). Those colours then define a specific colour space. To create a three-dimensional representation of a colour space.On computer screens, RGB is used for the display to create an accurate copy of the image in CMYK. It is used in colour printing as a standard format and this is how a picture may print off in odd colours if the image is in RGB because all colour printers are CMKY.

Greyscale (8 bit colour depth) only allow shades between black and white. It means that in an image the value of each pixel is a single sample, that is, it carries onlyintensity information. Images of this sort, also known as black-and-white, are composed exclusively of shades of grey, varying from black at the weakest intensity to white at the strongest.

Additive colour mixing: Three overlapping light bulbs in a vacuum, adding together to create white.

Subtractive colour mixing: Three splotches of paint on white paper, subtracting together to turn the paper black.

YUV (Luminance and chrominance) takes human perception into account. Historically, the terms YUV and Y'UV were used for a specific analogue encoding of colour information in television systems. It’s a way of breaking the brightness and colours in theimage down into numbers, and it’s slightly different from RGB.

HSV (Hue, saturation, value) HSV is also known as the hex-cone colour model. Saturation indicates the range of grey in the colour space. It ranges from 0 to 100%. Sometimes the value is calculated from 0 to 1. When the value is ’0,’ The colour is grey and when the value is ’1,’ the colour is a primary colour. A faded colour is due to a lower saturation level, which means the colour contains more grey. Value is the brightness of the colour and varies with colour saturation. It ranges from 0 to 100%. When the value is ’0′ the colour space will be totally black. With the increase in the value, the colour space brightness up and shows various colours.

Hue replaces each colour in an image with another. The colours that each one will turn into is shown in the colour bars un the window. The top bar represents the colours already in the picture whilst the bottom shows which colours will be replaced with which.

hex-cone colour model.

Saturation is the richness of the colours in an image. The more saturation in an image, the richer the colours and the less saturation, the duller the colours.

Scanners

An example of image capture is a scanner. The idea of a scanner is to insert a piece of paper with the image into a machine which then when connected to a computer, copies the image onto the computer. From there you can save or print the image you have scanned. Most the time, you can select one out of a few options on how you would like to scan the image. For example: black and white, Colour or text.There are 3 types of scanners:Flatbed scanners, also called desktop scanners, are the most versatile and commonly used scannersSheet-fed scanners are similar to flatbed scanners except the document is moved and the scan head is immobile. A sheet-fed scanner looks a lot like a small portable printer.Handheld scanners use the same basic technology as a flatbed scanner, but rely on the user to move them instead of a motorized belt. This type of scanner typically does not provide good image quality. However, it can be useful for quickly capturing text.Drum scanners are used by the publishing industry to capture incredibly detailed images. They use a technology called a photomultiplier tube (PMT). In PMT, the document to be scanned is mounted on a glass cylinder. At the centre of the cylinder is a sensor that splits light bounced from the document into three beams. Each beam is sent through a colour filter into a photomultiplier tube where the light is changed into an electrical signal.

Scanners are useful in businesses as you can copy and print a page you have without having to find a file on the computer and print it off meaning you can print things off in mass.

Digital Cameras

Digital cameras take pictures and sometimes videos. They have LCD screens which allow you to change settings and view photos that you have taken. Compact cameras are designed to be tiny and portable and are particularly suitable for casual and "snapshot" use. Hence, they are also called point-and-shoot cameras. The smallest, generally less than 20 mm thick, are described as subcompacts or "ultra-compacts" and some are nearly credit card size.

Some of the settings you can change on a digital camera may include, Flash (Auto) (if a subject is too dark, the camera will flash a small light when taking the photograph to lighten up the photo. There is also a setting to stop flash so if you are shooting something in broad daylight. You may have several settings such as a landscape setting (adapts the camera settings to what would be best when taking pictures of landscape), portrait which gives overall soft skin tones, sports (fast shutter speed meaning you can capture fast moving objects) nature (for maybe getting close up shots of things such as flowers or wildlife) and most cameras also come with a timer, which is good if taking a group photo for example.On some digital cameras you can change the aperture and shutter speed. The aperture controls the size of the hole that the light passes through in order to get into the camera. By adjusting this to make the aperture lower (hole smaller), it means that more light can get into the camera, meaning that your depth of field on the photo (whether all of the photo including foreground and background)will be small. This means that the part that you focus on will be focusedand any further away or closer. Whereas, by making your aperture larger(bigger hole) you are letting more light in, meaning that more of the shotwill be focused, which is ideal for a large depth of field or if your planning on getting a landscape photo. The shutter speed alters how much timelight has to enter the lens. For example, if you wanted to film a city with cars going past but only want the lines left by the car lights visible, you would select a slow shutter speed.Generally, digital cameras are easy to operate and have a reasonably Large storage. They aren't too expensive and they come with a lead to Attach to your computer in order to transfer them. Pictures can be easily Deleted.

Resolution

Image resolution ( measured in Pixels per inch)describes the detail an image holds. The term applies to raster digital images, film images, and other types of images. Higher resolution means more image detail.

Digital cameras are available with different qualities. Some cameras boasts higher resolution photos and they are generally more expensive. Whilst some cheap cameras may not take very good quality photos. The main thing that determines how good a digital camera is along with the amount of zoom available , is the Megapixels the camera has, which represents how many pixels are in the image. The more megapixels the camera has, the better quality the image taken will be. The more megapixels, the better the resolution of the photo. The only downside of this is that bigger resolution photos mean bigger file sizes.

Storage

Dependant on the resolution of the picture, image files generally take up a lot of space in comparison to something like a word document because of all the information that is stored. There are several different places to save these documents, each hold a set amount of space. An example of this is a USB Drive (Universal serial bus) or memory stick. Memory sticks vary in space as you can get 1 GB of space where as on some, you can get 8 GB.

Asset management is the organisation of files or imagesin folders. It is important if you have a lot of files to keep them organised in order to find the file you want if you wanted to use it. Also, by giving your files relevant file names when saving them, it makes the file easier to find, especially when using the search bad. By separating different files and putting them into named folders, managing information and files in much easier and quicker and means you have easy access to the files you need.

Target Destinations are what an image is going to be used for, for example the internet or to be printed out. Depending on the target destination, the image may need to be altered. If the image is to be put on a website and it is a high resolution image with a large file size, the image may need resizing ort or compressing if it is only going to be a small icon and in order for the image not to slow down the loading speed if the page too much. One thing that can be done is resizing. When made smaller in dimensions, the image is a smaller file size as there are less of each colour pixels in the image. Although, if made bigger, the quality may be sacrificed. It is important when preparing an image for the web that you get the right balance between good quality and fast loading time.

To resize an image, you can open it in Photoshop and press File then Image size. A new window is then displayed which has options on the dimensions of the image you are editing. As you change the width, the height is changed to counteract so not to stretch the photo.

An image can also be optimised in order to reduce file size. This is good if the image only has to be a small icon on the website or if the picture only consists of a few colours. To optimise a photo, you open the image in Fireworks, Select File and Image Preview. From here a window will then appear with several options. In this window you can view how the image would look like on the web and in different file formats. This also displays the loading time for the image on the web. Also, you can choose what percentage quality you want using the scroll down bar.

Here I have changed the file type of the image to see how it would look on the web. The one to the left is saved as a JPEG and is good quality. But when I changed the image file type to GIF, though the load time was quick like the JPEG the picture showed noticeable quality loss.

JPEG GIF

Changing image quality