Images for a client's web site

Task sheet
You have a client for whom you will be creating a web site at some point in the future. They have each asked you to provide a portfolio of images that might be suitable for the following page layouts:



You can choose one of three clients for this task (the type of images shown in brackets):

• An Endangered Species Organisation (animals threatened with extinction) 
• A Classic Car Enthusiasts Club (either one make or a range of makes and models) 
• A Space Exploration Group (planets, galaxies near or far) 

1 Download the 8 original images and save them with sensible names.

2 Re-size each image as necessary to obtain the required measurements. Any resolution above 70 dpi is acceptable for web use. Some images, if not all, may need to be cropped so that only a section is used in order to meet the size requirements. You can enhance any image if you wish (contrast or colour adjustments etc.) but this is not essential.

Images that have become out of proportion will not be accepted.

3 Save the 8 edited files in JPG format. (Advanced students should also save them again with the best level of compression compatible with quality.)

4 Store all the images in a single folder and provide a screen print of the folder.

5 Display all the images in a presentation or document – one page or slide matching each of the layouts required (4 slides or pages in total). Save that file and print it – for a presentation print a handout version with 4 slides to a page.

The images should have licence terms that permit commercial use or, if this is not clear, you should provide a copy of an e-mail that you have sent to the owner, or owner / administrator of the site where you have obtained it seeking permission for use on a web site that will be promoting products related to endangered species, classics cars or space exploration as appropriate.

Sample output:

• An attractive display of the images selected 
• A list of images sources 
• A screen print of the folder including dimensions and file sizes

World Events in November

Melbourne Cup

Australia Melbourne  2011 November

The Melbourne Cup is the greatest and most prestigious race meeting in the southern hemisphere. Held over four days in late spring, it is four days of top quality racing and social preening- trackside tickets and extravagant dresses give added cache to the proceedings.

Thanks Giving Celebrations

Americas  2011 November

There is perhaps no bigger communal event in the USA each year than Thanks Giving Day. And at the heart of it all are family reunions and large feasts, traditionally including the demolition of a large turkey with the extended family.

Cape Town World Cinema Festival

Africa South Africa Cape Town  2011 November

Compared with the luxury, glamour and international recognition of other world film festivals, such as Cannes and The Oscars, The Cape Town World Cinema Festival is a rather smaller affair. Indeed, it is only, in 2008, in it 5th year.

Pirates of the Caribbean festival in Cayman Islands

Americas Cayman Islands  2011 November 19

The Cayman Islands are rich in not only their seafaring history, but also in their pirating and pirateering... and in celebration of their pirate legacy, the Cayman Islands host their own Pirates of the Caribbean Week in November.

  

Fireworks Night

Europe  UK  2011 November 5

Amateur pyro-enthusiasts all over England dream of November 5th every year, when they get the opportunity to show off their Catherine Wheels and ability to conjure up Tchaikovsky's 1812 Overture in the night sky over their neighbours garden

Surin Elephant Round Up

Asia Thailand Surin  2011 November 2

Viewers of the more obscure television sports channels available nowadays will probably be aware of the annual Surin Elephant Round Up. For it is here that teams of elephants with human drivers sitting atop play games of football against each other- with hilarious results.

The Pushkar Camel Fair

Asia India Pushkar  2011 November

The central tenet of the Pushkar Camel Fair was originally a Hindu religious celebration, coming at a time of a full moon in November (usually). However, over the years, this site of pilgrimage had people from all over India flocking to the town with camels and cattle for a three day market- in which the animals were traded. So now, in a blaze of tourist brochure colour, religion and tradition, the population of Pushkar swells from 14,000 people to over 200,000 for the week’s festivities with tourists from all over the world joining pilgrims and traders from India in Pushkar. It is a week of enduring images- from huge areas containing thousands of camels, often adorned in multi coloured cloths and jewels being traded throughout the day, to the camp fires at night, blazing under the midnight hue of the moon.

Saint Martin Festival in Croatia

Europe Croatia  2011 November 11

St Martin`s Day, on 11 November, is a day that Christians and Protestants alike celebrate throughout many countries and regions of Europe. In the Zagreb county of Croatia, the day of Saint Martin is a day for wine lovers, a day to purify the newly harvested wine and dine on succulent roasted goose. 

The Professional Bull Riders Championships

Americas Las Vegas  2011 November 21

For an animal that doesn’t get much attention from the world at large (ok, city dwellers) for most of the year, it’s funny how the bull is the animal du jour when it comes to events.

Remembrance Sunday

Europe UK  2011 November 11

The countless, bloody sacrifices that scarred the lives of millions across the world due to the slaughter on the trenches of the First World War are commemorated each year on Remembrance Sunday.

The Mombassa Carnival

Africa Mombassa Kenya  2011 November 16

Despite recent political instability, Kenya is still one of Africa`s top tourist destinations. It`s got the great safaris, the superb wildlife, the wonderful beaches, the terrific food... but with all this, sometimes visitors miss out on the cultural side of this beautiful country.

Word Events Task Sheet

World Events Task Sheet
You will be provided with a list of some events, with brief descriptions, taking place around the world during November. You may know of some more and may like to include those too or share them with colleagues.

1. Consider ways to make this list more attractive and so more likely to be read and have some impact. Find a more suitable graphic or image to accompany or illustrate the events that you feature in your display. The text provided needs to be included somewhere in your document or publication to describe each event in brief.

2. Choose any application that you wish to utilise for this purpose. Here are some possible displays:

• A calendar page using a table with illustrations on key dates and text on a further page 
• A spreadsheet or presentation slide with links that take viewers to another sheet or slide with more information 
• A blog with an entry for each event 
• A more attractive text and image document or leaflet (eg Word, Publisher or Serif PagePlus) 
• An A4 poster (eg using Serif DrawPlus) 

3. Where possible, add links to web sites with more information in addition to the brief description provided on your sheet. This could simply be a link to the site where you obtained your image. A note of where each image’s original location should be kept and this information either incorporated in the main document or publication itself or as supplementary notes.

For the purpose of the first part of this task, it will be acceptable to use images that are not licensed for commercial use or re-use except where you are including them in a blog or a web site or storing them (or the publication) on-line.

4. As an extension to this task you could consider revising your draft publication to be suitable for distribution or publishing on-line.

This would necessitate using only images for which you are confident an appropriately license applies (or for which you have permission to use).

Replace images accordingly, including revised notes of where the replacements have been obtained.

Sample output:

• An attractive display of World Events in November 
• A list of images sources 
• A revised display suitable for general distribution or publication on-line 
• A revised list of image sources 

Task 2 Notes

Measurements!

The first thing you have to do is work out how big the image will have to be. It’s no good getting a great image that’s too small - you can’t make a small image bigger without losing quality. (I suppose an exception would be if you were wanting to create some graphical effect that would disguise the ‘mistake’ but you need to be able to show that you understand sizes for this task.)

An A4 sheet measures about 30cm wide by 21cm high. Or about 12 inches by 8½ inches. To allow for printers that might not print to the edges, we’ll use 11 inches by 8 inches.

A printer will want at least 300 dots per inch resolution. The more dots the closer together they’ll be and the sharper the image will appear. So there’s some maths to do:

To cover 11 inches, you need 11 x 300 dots. That’s 3300 dots. Now, technically, dots aren’t exactly the same as pixels but pixels will do just fine for this type of task. So that’s an image at least 3300 pixels wide that you need.

Just to be on the safe side, you should check the height too. To cover 8 inches you’ll need 2400 pixels.

So now you can start looking for an image, knowing that if it measures more than 3300 x 2400 it should be suitable. (Obviously, if you intend to use only part of an image then the original will have to be bigger.)

Where will you find a suitable image?

Remember that this is for commercial use so you can’t take any chances with the first one you find on a normal Google search. You’ll need to use either Google’s advanced image search tools and set the requirements to licensed for commercial use or use another gallery like morguefile, stockxchange or others where license terms are shownso you have evidence it’s OK to use it.

What do you want an image of?

The businesses are related to flowers and fast modern cars so either a flower or a sports car seem sensible choices. But it doesn’t have to be. You may find that you can edit something different to give either the impression of speed, electricity and technology in one case, or illustrate a Valentines theme another way. The choice is yours (although your ‘client’ will have the final word on what you proceed with!)

Editing

First of all save the original somewhere. then save it again with a different name and use that copy for the edits. Then if it all goes horribly wrong you can start afresh.

Size

The actual image you’ve found will almost certainly be the wrong size so change that. In Serif PhotoPlus that’s quite simple - Image | Resize (making sure you keep the ratio or the image will be distorted). Change the resolution first to 300dpi and then the width to 3300 pixels.

Is the height now more than 2400 pixels? It probably will be as many images are in a 4:3 ratio but not all so check. If the height is less than 2400 pixels you’ll need to set the height to that figure instead.

Either way, you’ll still have an image that is too wide or too tall. So another edit is needed to cut some of it off. Your choice - use crop tools to achieve the required size.

A better way to get the right size would be to crop the original size image down to dimensions that are proportionate to what you require. For example, a rectangle 4400 x 3200 would work. Then you could resize either the height or the width and it would give you 3300 x 2400. That does require some calculations, though, and a bit more thought - so if you can’t figure that out stick to the first method.

Save this file regularly (in whatever format the software uses).

More edits

The task needs you to make changes to the appearance of the image now. There is a huge range of choices so it may be a good idea to try several variations. Just save each with a separate file name.

File types

Once you’ve decided on one you need 3 versions: the (new) original, a PDF and a version for the web. You’ve got the first one - that’ll be something like image.spp or image.psd.

Next, the PDF. You should simply be able to Save as > PDF and the application will do the rest. Add some crop marks and a file name in the PDF print options if you can. That’ll be image.pdf

Now for the web version. First, 3300 is too wide for the web! The task says between 1000 and 1200 pixels wide so some further changes are required. It may be sensible (but not essential if you know what you’re doing) to save the file again with a different name before these. Something like image-web.spp or whatever would be a good name.

For the web, resolution above 100 is pointless as monitors don’t show any more than 96dpi or, in most cases, only 72dpi at best! So if you were to use Image | Resize again and change the resolution to 100dpi you’ll find that the dimensions will change to 1200 pixels wide - which is what you want. The height will also be OK too.

Then use File | Export Optimiser (or similar) to transfer the image to another file type. The choice will be between .jpg (or.jpeg) .gif and .png Ignore anything else you’re offered. For each file type Serif PhotoPlus displays what the image will look like and its new file size in kb. You have to get your file size down to less than 120kb. For each file type there will be quality settings - either a sliding scale or to choose a number of colours to use.

Try out various settings. You’re looking for the best combination of good quality and least file size within the 120kb limit. You’ll probably find a lower .jpg setting will give the best compromise but it’s worth keeping screen prints (or saving separate files) of a range of settings to provide evidence for other criteria you can write about later.

Save the chosen file as image-web.jpg or whatever and that’s the practical part of the task done.

In order to present the work you’ve done, and illustrate notes about how you’ve done it in your portfolio, it’s a good idea to place the amended original, the PDF and the web version(s) in one folder. You can then take a screen print displaying the file sizes and types easily for comparison. The original (pre-edit) file can be included but it’s not essential.

---

This task provides an opportunity to meet these criteria:

P2 explain how different types of graphic images relate to file formats

P3 demonstrate the use of editing tools to edit and manipulate images

M2 justify the software, tools, file format, image resolution and colour depth used for creating graphic images.

---

Andrew Hill September 2010

Sample Task 2 images

A large original image (click to see full size)

An edited version - this illustration is the version prepared for web use (click to view full size)

An extract from the edited version with added text and graphic feature designed for an A5 print - this illustration is the web version. (click to view full size)

Tasks 2A and 2B also require that PDFs are produced for printing and justification for choosing certain file types, resolution, dimensions etc. is included in a description of how the files were created.

A sample of a completed assignment task is available at this link.

Sample Task 1 Presentation

A set of slides similar to these will meet the criteria for Task 1 when completed

A Guide to your Digital Graphics Portfolio

This apples to both Level 2 (Unit 35) and Level 3 (Unit 30)

Introduction

Unit introduction
Many documents incorporate an element of graphics or graphic design. From the layout of the text, to the image used to promote a product, it is expected that there will be some form of graphic representation. Technology allows for the production and reproduction of images to all scales, sizes and colours. Highcapacity storage devices, digital cameras, specialist software and printers mean that high quality and appropriate images can be designed and produced much more easily than before. There is now little excuse for not creating documents that use graphic images effectively.

In this unit, learners will be expected to identify the technical requirements for the creation, storage and manipulation of complex artwork. They will be required to produce original images using drawing packages and also to create and edit electronically captured images. Learners will identify suitable images to enhance documents and use available tools and techniques to ensure that the finished document meets the user need. Learners must be able to understand and recognise the differences that file formats and sizes will make to their chosen image, for example identifying how pixelation and resizing can distort the image and looking at methods to eradicate this distortion. This may include the need to convert files from one graphic format to another and the identification of the most appropriate format in relation to the file’s final use. In order to be sure that the final product meets requirements, formal checking must take place. For example, ensuring things such as the image resolution are appropriate for the intended use or checking the loading speed if the image is intended for a website. All artwork and information chosen must abide by the laws of copyright. It is essential that learners recognise the need to gain permission to reproduce the work of others and that they adhere to the appropriate legislation.

Learning outcomes
On completion of this unit a learner should:

1 Know the hardware and software required to work with graphic images

2 Understand types of graphic images and graphical file formats

3 Be able to use editing tools to edit and manipulate images

4 Be able to create and modify graphic images to meet user requirements.