Advanced Web Design: AD650

COURSE CALENDAR | WEEK 07 CLASS OUTLINE | Homework

Topics Covered in Class:

  1. AD650 Learning Forum: New Technique presentation
  2. CLIENT WORK/Visual Design Development
    • Review Midterm Projects in progress- students will take note of what is missing, what needs improvement and what is required for a passing grade.
    • Your 3 mockups should account for:
      • Key page elements & location: header, footer, navigation, content objects, branding elements
      • Grouping: side bar, navigation bar, content area, etc.
      • Labeling: page title, navigation links, headings to content objects
      • Place holders: dummy text (lorem ipsum dolor...), and image place holders
      • A developed color scheme with color choices for all key page elements including headings, bullets, links, plus, visited, hover, and active links.
      • A cohesive and appropriate graphic style using branding and background images.
      • A design for each level (EXAMPLES: top-level: homepage, secondary-level: section, tertiary: content, unique layout: calendar)
  3. CLIENT WORK/Interaction Development
    • Usability Testing with Paper Prototyping: Define a task/goal for the user. Using your wireframe as guide, draw each page in your site involved in that task. Ask your partner to "be" the user profile's character. You will be the computer. Ask the user to complete the task by navigating the paper prototype until they reach the goal. Take notes during the testing. Do not give hints or advice to the user. (sample)
    • IA deliverables
    • Design Patterns
  4. Questions/Review:
    1. Background Images and Image Replacement
    2. Styling Lists and Links
  5. Styling Forms and Data Tables using CSS (ZIP)
    1. Accessible HTML Data Tables | diagram
      1. summary and caption
      2. thead, tbody, tfoot
      3. col and colgroups
      4. more info
    2. Styling data tables
      1. simple table with style
      2. table gallery examples
    3. Accessible HTML Forms | diagram
      1. fieldset
      2. legend
      3. label
      4. option groups
      5. accesskey
      6. tabindex
      7. more info
    4. Styling form elements
      1. simple layout
      2. complicated layout
      3. accessible input
      4. form gallery examples
      5. more info

Homework| Week 7

Midterm Project is DUE Next Class!!!

The purpose of this project is to give students experience preparing a client presentation outlining the site planning and development phases. Designers with the ability to prepare and present a professional verbal and visual presentation will be better able to compete in the highly competitive field of design.

Students should be prepared to present their well-crafted presentations to the class in a professional manner. Each student will have 10 minutes, including time for feedback.