3rd assignment : Web graphics

Create the following graphics for the WIUW-FM website, www.wiu.edu/users/miwium. WIUW-FM is the Macomb area's National Public Radio station. Alternatively, you can select another website. I am not expecting you to create the webpage in HTML, only to design the images in Photoshop. You have the option of creating roll-overs and animated GIFs using ImageReady, an application that comes bundled with Photoshop.

Website Identity - Create a graphic that identifies WIUM-FM on the entry (home) page. This image often is positioned at the top of the page. Though I am not specifying the size dimensions, the image cannot exceed 10" in width or 6" in height. It can be much smaller. For example, this identity image on www.cnn.com is about 2.5" in width and .75" in height.

Buttons - Create the navigational buttons or additional graphic elements for use on this entry page. I am looking for a visual relation between these graphics and the identity graphic. The look/identity of a website is created by these small visual elements. Alternatively, combine the identity graphic and these buttons into a single (site map) image.

Banner ad: Create a banner advertising WIUW-FM that is 468 x 60 pixels at 72 pixels/inch. This ad will be placed on another website. This is one of the standard banner ad sizes.

 

While you are working on these assignments, continue to save your images in the PSD (photoshop document) format. This is the only file format that supports layers and other Photoshop information. Only when you are finished should you convert the file to another format. Otherwise, you will not be about to edit text or work on separate layers. When you save the file as a JPEG or GIF file, visual information is permanently lost due to file compression.

Before submitting you work, optimize the image size of each file by using the File>Save for Web...' palette in Photoshop. Turn in your final work as either JPEG or GIF files in the Digital Drop Box on the Blackboard website. Ideally, the files should be no larger than 30K when compressed. The buttons can be miniscule in file size. The resolution must be 72 pixels/inch. Web images need this low resolution so the files can be uploaded quickly.

 

Written portion - For the written portion of this assignment, you will need to write:

  1. What the unifying design elements and principles of the web graphics (the identity and button graphics). Discuss at least four elements and principles.
  2. In one sentence, define the key message of the banner ad that you need communication
  3. Define the banner ad's target audience (who is this ad direct to?)
  4. What font(s) did you select. Discuss your selection(s)


 Links:  Examples  student examples
     
   Handouts  Web Graphics
     Banners Ads

  Grantastic Design
  Usable Web
  Internet Advertising Bureau
  MSDN Online
  HTML Writers Guild
  W3C - World Wide Web Consortium


 Rough:  Wednesday  October 15

 Critique:  Wednesday  October 22
 Due:  Monday  November 3 (billboard/poster also due)
     
   Next  Billboard design