Semester Project

Web Development and Interactive Media

LV Childers Hall (Fine Arts Bldg), Room 2019 (Design Lab/Classroom)
Instructor: Tony McEachern, Ph.D.

E-mail: tony@tonymceachern.com   •  Web Site: http://www.tonymceachern.com/courses
Course Number:  Undergraduate 87547-126-01   •   Graduate 87553-314-01
Course Days & Time: Mondays and Wednesdays from 5:10 pm – 7:00 pm

Interactive Web Site Design Assignment 

Website Due Date: Wednesday, December 7, 2011 – Final Critique/presentation
The entire web site (completed) must be uploaded to the web at the start of class.

NOTE: Each website MUST be uploaded to, and viewed from the class web server as shown during the “How to FTP” tutorial. As FTPing is a part of the assessment, NO web sites will be accepted or presented from any outside server.  

Create your BEST EVER interactive web site. Designers will choose to design either a web site for self-promotion, a magazine prototype, an online portfolio / product catalogue for eCommerce, or an organizational web site. You are not subject to only these ideas. If you have a different idea you may write up a description of it and send that to me as well. You will perform smaller projects along the way to help you build this big project.

IMPORTANT: Each student must select a theme or metaphor for their selected web site style.  Choose what kind of site you intend on designing?

Design your own original interactive web site using Dreamweaver and Photoshop. Your web sites must have interactive buttons, rollovers, and embedded video in appropriate places. Regardless of the type of site you select, all sites must incorporate (at a minimum) the specifications listed in checklist below.

Related Software
You may also find a need to use software such as Photoshop, Illustrator, Freehand, and MS Word, when developing the assets of your web site.

Project Specifications
Page Size (in Pixel Dimensions): 1024 ppi  wide (The height will vary based on the amount content on a particular page. You may opt to go with a smaller width size if your design requires less space.)

This is a semester project and you will be given instructions throughout the course as to how to create this site.

Interactive Web Site Design Procedure & Checklist

Take the following steps when developing your web sites and check off as you complete your project:

Step I. Planning the Website: (Handout from “The Graphic Design School” text, pages 166 – 171)

  • Concept Development: Develop a concept in the form of a theme or metaphor that describes you, your product, or the service you intend on rendering.
  • Site Functionality and Page Relationships: Create a site map listing all of the main sections and pages of your site, then draft a flow chart (see page 168) that shows how your web site will function.
  • Composition / Layout Development: Design/develop the style and composition of your site, inclusive of color schemes, imagery, and symbolic elements that are to be used.

Step II. Publishing the Website: (Karlins. Chapter 1):

Step III. Designing the Website Interface: (Karlins. Chapters 2, 3, 6, 7, & 9)

  • Design a Home Page with a graphic interface that generally displays the following global navigation (you don’t have to use these labels exactly. This is just a guide):
  • About Us/Me – Biographic or Introductory Sketch of you as artist/designer or service provider and your mission.
  • Services – Describe your products and/or services.
  • Credentials – Chronological Resume with Related Experience and Education.
  • Portfolio – Sample of at least Six (6) pieces of your work, product or service.
  • Contact Information – This can be done as a page or as the footer of all pages within your site.

NOTE: The Home Page should have an active link to all of the above items. If you’re clever enough, the Home Page may also act as your Splash page.

ALSO: These global (main) navigational elements listed above should be accessible from each page of your site.

Step IV. Developing Section Content:

  • About Us/Me section with a photo of yourself.  Your bio or introductory sketch should act as a selling point and should pertain to your services. To effective, you should also include your mission statement.
  • Services Rendered section that states all of the products/services you are (or intend on) offering to your customer or prospective client.
  • Work Sample (Portfolio) section of at least six (6) samples (images, writing, etc.) of your work. You must prepare your sample work outside of class and be ready to work during studio time.
  • Five (5) Buttons (in addition to the 5 buttons, you should include a ‘skip button’ that jumps from your splash intro directly to your home page. This allows the user the option to skip over the splash intro).
  • Interactive Rollovers should be incorporated into your composition.  This can be done through the use of buttons or through any other creative means.
  • Proper use of Background Images and/ Background Colors (Black and White are treated as colors here) for your viewers’ web browser.
  • Embed some sort of rich media (sound, movie clip, etc.) strategically into your web site design.
  • One Online Form (optional) that will be used as a means of correspondence between you and your customer or client. You have to decide what information you want to collect in this form.

Website Due Date: Wednesday, December 7, 2011 – Final Critique/presentation
The entire web site (completed) must be uploaded to the web at the start of class.

NOTE: Your web site presentations will be viewed with the overhead LCD projector and critiqued by your peers and the instructor.