Raster and Vector Images Raster Images <ul><li>Rasta images also known as bitmap are stored as a series of tiny dots which are called pixels. Each tiny dot is assigned a certain colour causing the pixels to form together to generate a picture. </li></ul>As you can see by the image of the C, raster images when zoomed in close enough reveals the pixels which for the image. The different shades if the same colour form out to blend into the background which creates a smooth curve when zoomed out. <ul><li>Raster uses 4 different common types of format. These are .jpg, .gif, .tiff and .bmp. Most pictures you will find on the web consist of these formats and are mainly low resolution. Images with low resolution print poorly, so it is possible to have an image with a high resolution which means it’s a better quality for printing and more detail. </li></ul>
Raster and Vector Images Vector Images <ul><li>Vector images are highly different from raster images. Vector images are not based on pixels making up the image, instead a vector images use mathematical formulas consisting of lines and curves that make shapes. Most browsers do not support vector images on the web. </li></ul><ul><li>All vector images are high resolution because vector images have been mathematically formulated without the use of pixels. Vector images represent the relationships between points and the paths connecting them. Some example vector file types are .ai, .cdr, .fh, and .eps. You can place rasterized images in vector art. We accept these files for label artwork, as long as the placed images are high resolution. </li></ul>As you can see here, the C has no jagged like edges but instead has a smooth curve from point to point. There is no pixels which zoomed in or out as the image stays the same throughout.
Antialiasing <ul><li>Antialiasing for real-time applications is supported in graphics hardware, but its quality is limited by many factors, including a small number of samples per pixel, a narrow filter support, and the use of a simple box filter. </li></ul><ul><li>For computer graphics, antialiasing is a software technique for diminishing jaggies, (stair step) like lines which should be smooth on an image or shape. Jaggies occur due to the monitor, printer or output device not having a high enough revolution to represent smooth lines on the image or shape. </li></ul>As you can see by this picture, anti-aliased reduces the prominence of jaggies by surrounding the stair steps with intermediate shades of grey which fade out making the edge of the shape/image seem more smoother. This would also be the same for a colour scale device. The anti-aliased effect reduces the jagged appearance on the line and also makes it seem a little bit more fuzzier when zoomed in.
Image Resolution <ul><li>DPI (dot per inch) or PPI (pixels per inch) are also known as image resolution determines the number of pixels that a digital image can hold and as such the depth of quality and size of the file. </li></ul><ul><li>The quality of an image all depends on the pixels that an image contains for example, the more pixels an image has, the better quality it will turn out to be but also the larger the file size. Resolution is important to understand as is can affect the image size - in print, the resolution does not affect the image size, but on screen, resolution can have dramatic effects on the image size. </li></ul>
Image Resolution <ul><li>Pixel resolution in bytes is the size of the image or the appearance on a computer screen, monitor, etc. This number is tied directly to how big the image is on the hard drive. The byte-size of the image file is directly proportional to the pixel count and its size on the screen computer screen, which simply displays all the pixels in a fixed one-to-one grid. </li></ul><ul><li>Embedded resolution is different to pixel resolution as embedded resolution tells the printer how far apart to spread the pixels in a printed image, this determines how "fine grained" the image will look when printed. It is completely independent of the pixel count (file size) of the image. A high-pixel-count image can have a low embedded resolution or vice versa. Given the same pixel count, a high embedded resolution will result in a smaller printed image (the pixels are packed together more tightly), and a low embedded resolution will result in a larger image (the pixels are more spread out). </li></ul><ul><li>Two resolution definitions are often used in place of one another. </li></ul>
Image Resolution Image Dimensions in Pixels Printed Size (W x H) Approximate File Size (CMYK Tiff) 600 x 400 pixels 2” x 1.33” 938K 640 x 480 pixels 2.13" x 1.6" 1.17 Mb 600 x 600 pixels 2” x 2” 1.37 Mb 800 x 600 pixels 2.67" x 2" 1.83 Mb 1024 x 768 pixels 3.41" x 2.56" 3 Mb 1280 x 960 pixels 4.27" x 3.20 4.7 Mb 1200 x 1200 pixels 4” x 4” 5.5 Mb 1600 x 1200 pixels 5.33" x 4" 7.32 Mb 1800 x 1200 pixels 6" x 4" 8.24 Mb 2100 x 1500 pixels 7" x 5" 12 Mb 2400 x 1600 pixels 8” x 5.33” 14.6 Mb 3000 x 2400 pixels 10" x 8" 27.5 Mb 3300 x 2550 pixels 11” x 8.5” 32.1 Mb
Aspect Ratio <ul><li>Aspect Ratio of an image is the ratio of the width of the image to its height. This is shown by two numbers which have been separated by a colon. For example, x : y as an aspect ratio, no matter how big or small the image is, if the width of the image is divided into x units of an equal length and the height is measured using this length, the height would then be measured to the y units. </li></ul><ul><li>Aspect ratios are mathematically expressed as x : y (pronounced "x-to-y") and x × y (pronounced "x-by-y"), with the latter particularly used for pixel dimensions, such as 640×480. Cinematographic aspect ratios are usually denoted as a (rounded) decimal multiple of width vs unit height, while photographic and video graphic aspect ratios are usually defined and denoted by whole number ratios of width to height. </li></ul>
Aspect Ratio <ul><li> The standard analogue television screen ratio today is 1.33:1. The Aspect Ratio is the relationship between the width and height. A Ratio of 1.33:1 or 4:3 means that for every 4 units wide it is 3 units high (4 / 3 = 1.33). </li></ul><ul><li>Aspect ratio is typically shown up in one of two different formats. The first one is more common in scientific and engineering fields which is the decimal format. An example would be ‘2.73’. </li></ul><ul><li>The second and more common in fields suck as photo pressing and construction is the ratio format. This format contains a colon which separates two numbers. For example ’16:9’. </li></ul>
Aspect Ratio How to measure Aspect Ratio <ul><li>First, measure the length of the object which has been chosen to calculate the aspect ratio. Depending on the object, this value can vary. Moving screens or pictures are measured by its horizontal distance across the object. </li></ul><ul><li>Then measure the height of the screen. </li></ul><ul><li>If you are using the ratio format--length as the first number, followed by the colon or slash, and then the width or height--you can simplify this expression as you would a fraction. For example, an object with length of 32 and width of 18 has an aspect ratio of 32:18, or 16:9 when reduced. </li></ul>
File Formats <ul><li>TIFF ( Tagged Image File Format ) For images destined for print the fundamental requirement is good colour support. It is by providing this that the TIFF format, with its support for RGB, Lab and especially CMYK colour models, established itself. </li></ul><ul><li>PSD ( Photoshop Document ) Originally Adobe thought that the EPS format’s fundamental viewing problem would be solved by the integration of its Display Postscript technology at the OS level, but the overheads on this proved just too great to be practical. Instead Adobe came up with a new file format, PDF (Portable Document Format), that incorporated all the main benefits of EPS without the downsides. </li></ul><ul><li>EPS ( Earnings Per Share ) As its name suggests, each EPS image is made up of the same Postscript commands that will be eventually be sent to the Postscript-based output device. The most obvious strength of the EPS format’s programmatic base is that it can describe vector information which is why the format is usually identified with drawing rather than photo-editing packages. In fact the EPS is just as capable of handling bitmap information. </li></ul>There are several types of File Formats, each do a different job to another. Some of the File Formats which are available to use are: <ul><li>JPEG ( Joint Photographic Experts Group) What made the JPEG completely different was the acceptance that its compression could be "lossy", that is that information could be thrown away. Of course the trick was to make this loss as imperceptible as possible and the result was a five-stage process. To begin with the image is converted to a colour space (LAB again) where colour and luminance are handled separately. The two chrominance channels are then downsampled as the eye is not as attuned to changes in colour as to changes in brightness. In this way pixel data can be cut by 50% with almost no perceived loss of quality </li></ul>
File Formats <ul><li>GIF ( Graphics Interchange Format) The TIFF's flexible nature has a further drawback in that its tag-based structure inevitably adds an overhead to each file. For print work that's a price well worth paying, but it's not acceptable for Web work where every byte counts. The main format that has come to dominate here is the GIF (graphic interchange format) thanks to its combination of palette-based indexing and LZW compression. GIFs can contain a maximum of 256 colours with an 8-bit palette though, unlike other formats, takes full advantage of storing fewer colours at lower bit-depths as well. The fact that the number of colours is restricted automatically suits the typical flat-colour GIF for LZW compression, especially as the system has been tweaked. </li></ul><ul><li>PDF ( Portable Document Format) Increasingly then image edit ability is becoming important. The obvious way of maintaining maximum information and maximum edit ability is to stick with the native application-specific format. Of course it was to avoid this go-it-alone anarchy that file format standards had to be developed in the first place, but the situation with bitmap images is quite special. After all the format is well known. The core format PSD 3.0 format is built on a short header specifying the image size and colour channels and then three information sections called the Colour Mode Data Block, Image Resources Block and Layer and Mask Information Block defining features such as duotone settings, channels and paths and layer opacity and blend mode respectively. </li></ul>
Colour Models A colour model is an abstract mathematical model describing the way colours can be represented as tuples of numbers, typically as three or four values or colour components. When this model is associated with a precise description of how the components are to be interpreted (viewing conditions, etc.), the resulting set of colours is called colour space. This section describes ways in which human colour version can be modelled
Adobe Photoshop Adobe Photoshop is a software which enables you to graphically edit images professionally. The package can be used by many people such as experts and people who are new to the software. This software focuses on bitmap images. Adobe Illustrator Adobe illustrator is like adobe Photoshop in a sense that it enables you to graphically edit images professionally. However, unlike adobe Photoshop, adobe illustrator focus on vector images. Adobe InDesign Adobe InDesign is a software which is used to create work like posters, magazines, flyers, newspapers and books. It supports export to EPUB and SWF formats which create digital publications.
HA1 - Technical File – Topic 1 Please use this template for your presentation. Use the slide area to display the text and images you need to fully explain and illustrate each topic. You can change the style, size, position and colour of the text and place images wherever you wish. Just be careful to preview the presentation regularly, so that you can check it is legible. Use as many slides as you need for each topic and remember to cite all sources for text and imagery. When you are up to date with your presentation, upload it to Slideshare and then your blog. If you’re stuck, don’t suffer in silence, ask for help.
Bibliography For Text <ul><li>http://www.larabank.com/photoshop/vector_raster.html </li></ul><ul><li>http://www.consolidatedlabel.com/support/artwork-support_raster-vs-vector-art.asp </li></ul><ul><li>http://people.csail.mit.edu/ericchan/articles/prefilter/ </li></ul><ul><li>http://www.webopedia.com/TERM/A/antialiasing.html </li></ul><ul><li>http://absolutegraphix.co.uk/trade_dpi.asp?strID=Guest </li></ul><ul><li>http://www.kneson.com/news/200503/200503.html </li></ul><ul><li>http://www.bestprintingonline.com/resolution.htm </li></ul><ul><li>http://en.wikipedia.org/wiki/Aspect_ratio_(image) </li></ul><ul><li>http://www.ehow.com/how_6223561_calculate-aspect-ratios.html </li></ul><ul><li>http://designer-info.com/Photo/advanced_file_formats.htm </li></ul><ul><li>http://tabs.stanford.edu/webworks/Fall%200405%20-%20Beginning%20Photoshop.pdf </li></ul><ul><li>http://www.techiwarehouse.com/cat/59/PhotoShop </li></ul><ul><li>http://trikgue.blogspot.com/2011/12/download-adobe-illustrator-cs5-portable.html </li></ul><ul><li>http://en.wikipedia.org/wiki/Adobe_Illustrator </li></ul><ul><li>http://joecartersmedia.blogspot.com/2011_05_01_archive.html </li></ul>