GDT 150 Design for the Internet: Fall 2002
Assignments
Assignment One: Website Critiques
Part One
Due: Monday, Sept 9
Find five websites, one for each point below, and write a short paragraph explaining why you feel they meet the criteria.
- A website that you think is well designed
- A website that you think is poorly designed
- A website that you think is exceptionally easy to use
- A website that is difficult to use, for any reason
- Your favorite website
Make sure that you think about and explain why you chose each site. Be specific - if you like the color scheme, discuss how the color scheme is used: complementary colors, high/low contrast, etc. Be sure to include the URL of each website.
Part Two
Due: Wednesday, Sept 11
Convert you paper from part one to a webpage by hand. Make sure you use paragraphs, headings, and links to the sites you critiqued. FTP it to your webspace.
Part Three
Due: Monday, Sept 16
Format your webpage using CSS and Dreamweaver. Use an external stylesheet (define in new stylesheet) and FTP both your critique and the stylesheet to your webspace.
Part Four
Due: Wednesday, Sept 18
Add screenshots of each site to your critique page. To take a screenshot on the mac, press Command + Shift +3. On OS9, it will be saved on your hard drive; on OS 10, on your desktop. On Windows, press "Print Screen" and go to Photoshop, make a new document, and paste.
Make sure that the screenshots are large enough to adequately show the site and the details you discuss in the critique, but not so large that they download slowly or take up all the space in the browser.
Project 2: Design a Homepage
Due: Wednesday, Oct. 9
Design a homepage for your webspace. The design and content should reflect something about you and your interests. Think about what it is that you want to share about yourself with other people—hobbies, passions, ideas, politics, whatever.
You must include the following elements:
- Your name
- Your email address, which should be linked
- Links to each of your assignments. This area needs to be easily updated, because you'll be adding a link to this page every time you turn in exercises and projects. In other words, make this html text rather than graphical text.
- Some sort of text area, which could be a paragraph about yourself, a welcome message, a description of what the site's all about, or anything you want it to say.
- Photos or other graphics that help structure and add visual interest to your page
- Optionally, add links to sites that you visit often or that you want to share with other people
- HTML text must be styled with a stylesheet
Design the page in Photoshop and cut the graphics that you'll need. Save all your graphics for the page in a folder inside your root directory called "graphics". Save the homepage as "index.html" in your root directory.
Before you put your files on the server, make sure that your links and graphics work. After you put them on the server, make sure that you check again. Remember that by putting up a homepage, I can't see your files any more, so if a link doesn't work, I can't tell if you turned in an assignment or not.
Compare and Contrast Writing Assignment
Due: Monday, Oct. 14
Write a short essay comparing the way that you designed Project 2 with the "Well Designed" website that you chose for Project 1. Be as specific as you can.
Talk about layout strategies, the use of text, the use of images, content differences, overall look and feel. Which appears more professional? Why? Is it important that it appear professional? How does the content of the sites change the way they are designed?
These questions are just a starting point. Be sure to think about and address any other pertinent points that you may think of.
Additionally, find a personal (not a company, can be an individual's portfolio site, weblog, etc.) website that you believe is well designed. Be prepared to discuss it in class on Monday. Good starting points for finding personal sites are: linkdup, K10K, Weblogs.com, or Eatonweb portal, but please don't limit yourself.
Page Layout with Provided Elements
Due: Wednesday, October 16th
Create a subpage layout in Photoshop and save the entire layout as a gif or jpeg and post to your webspace, adding a link from your homepage as necessary. Make the canvas as tall as necessary to fit all the content, but design the page optimally for 800x600. In other words, make the canvas 750px wide with approximately 400px above the fold.
Feel free to add any graphical elements that you like, such as photos.
Download the materials:
Cut Page Graphics
Due: Monday October 21st
Cut the graphics for the WCC page you designed above. If you have graphical navigation, cut rollover versions of each button. Make sure that the text is in exactly the same location on both the normal and over graphics.
Project 3: "Client" Website
Due: Wednesday, Nov 13
Download the materials (content and logo) and create a website using them. The homepage should be unique, while the subpages should use a template to ensure consistent layout and appearance. You must use all the content provided and include the following elements on all pages:
- Logo
- Page title (optional on homepage)
- Navigation
- Footer Element (copyright 2002 your name, etc.)
- A login box described in the text document
- A "Buy Now!" banner that should be a link that doesn't go anywhere
Before starting work in Photoshop or Dreamweaver, create at least five different thumbnail sketches showing layout possibilities. Make a photocopy of the thumbnails and hand it in to me on Monday, Nov 4.
Final Project: Portfolio Site
Part One
Due: Monday, November 25
Find five online portfolios that you think are well done. Write about why you think they work well, what you like about them, and anything that you would like to borrow from their approach. Make a quick webpage, including links, and link it from your class homepage.
The Rest
Due: Wednesday December 18
Create a 10+ page portfolio website. The look and feel of the site should match the appropriate level of professionalism and market that you think your work addresses. You should treat this site as a tool with which you will get a job—no fake resumes, no ficticious names, no stolen work.
Pay careful attention to the site architecture. If you need to break up your portfolio into several different categories—such as web, print, and logo—do so, and add subnavigation. Consistent, usable navigation is extremely important. Remember that functionality says as much about your employability and professionalism as the visual design. Don't include pages that have no content on them. Every page should convince me that you're a good designer and that I should hire you.
At least one pages must be primarily html text; it can be a resume or design statement.
All text styling, including link colors, must be controlled through stylesheets. Your resume, if you choose to do a resume, must be treated consistently.
Designs must be appropriate for the web: no wide fixed width designs, no full screen images, well optimized graphics, html used as a design tool whenever possible (no single color graphics where table cells could be used). File sizes/ download time will be taken into account when grading. Webpages must download quickly! Make sure that all pages have titles and that all images have alt tags.
If you have another idea for a project, and it will meet all the criteria here, feel free discuss it with me.
