Visual Web Design
Visual and Interaction Design for Information Technology
INFO 498B
Saturdays, 8:30 a.m.-12 p.m., October 6 – December 15, 2001
Mary Gates Hall, Room 271, 8:30 a.m.-10 a.m./ Room 058, 10:30 a.m.- 12 p.m.
University of Washington main campus
Course Overview
To create an effective online-user-centered experience unique visual and interactive properties are employed to enhance site messaging. This course will provide an overview of these properties along with computer lab opportunities to originate and create appropriate online content. In-class time will be broken into four sections to include lecture, critique, program demonstrations and hands-on lab experiences. Lecture topics will include discussions of visual and aesthetic properties, information structures, navigation, narration, message making, movement and interactive sequencing.
Students will be required to complete class assignments, conduct web audits/evaluations of existing sites and complete coordinated study–term project.
Course Objectives
The objective of this course is to develop an understanding, articulation, and craftsmanship regarding the methods, organizational process, and production of online and interactive content making. The assignments are designed to build upon principle elements of visual and interactive decision-making, and to provide the student with a greater understanding of online form building. Students will work in class, participate in critiques, and learn from their personal investigation of the subject matter, the instructor and their peers. Evaluation is based on the quality of work, growth throughout the quarter, and participation in class.
• After completing this course, students will understand:
• How to organize information visually.
• The ability to use color effectively.
• How to select appropriate typefaces.
• How to utilize visual elements to create stimulating sites.
• Ability to create a relationship between content and message making.
• Obtain knowledge of web-based form building.
• Appropriate images and brand systems.
Texts and Supplemental Reading
There is one required textbook for this course:
Web Design Essentials, second edition*; Dennis, Anita and Giudice, Maria; Adobe Press (Peachpit Press), 2001
Recommended textbook for this course:
Adobe PhotoShop 6.0: Classroom in a Book, Adobe Press (Peachpit Press), 2000
Designing Web Graphics.3, third edition, Weinman, Lynda, New Riders Publishing, 1999
Additional texts, programming tutorials, and online reading material will be assigned or suggested throughout the course.
*Please purchase second edition.
Course Format
The course will be comprised of lectures, critiques, hands-on computer exercises, and time for group project work.
Grading & Assignments
Grades will be determined by the following criteria
10% Performance:
• Participation-involvement with class discussions and in-class critiques.
• Preparedness-responsibility of the student to be on time, bring necessary working materials to class and use lab time to appropriately.
• Deadlines-all assignments are due at the beginning of class. No late assignments accepted unless the instructor agrees upon prior notice.
50% Assignments: Completion and posting of the following assignments
• study one: aesthetic exercises, web audit/evaluation and textbook assignments
• study two: information design exercises, web audit/evaluation and textbook assignments
• study three: navigation and narration exercises, web audit/evaluation and textbook assignments
• study four: message delivery exercises, web audit/evaluation and textbook assignments
• study five: movement exercises, web audit/evaluation and textbook assignments
40% Term Project and Presentation: Design brief, content organization, storyboards, site map, project execution, delivery, visual application and presentation.
About the Instructor
Karen Gutowsky has completed design projects for many Northwest corporations to include: AT&T Wireless, Microsoft Corporation, Alaska Airlines and Children’s Hospital and Regional Medical Center. Her design work has been recognized and awarded by Communication Arts, Graphic Design USA, Society of Publication Designers, Society of Illustrators and a gold award from the Seattle Show for her thesis project on "Performance Criteria for Visual Communication."
She is a principal at Z Group Design, a visual communications company located in Seattle, WA, along with visiting lecturer at the University of Washington. She holds a master’s degree in visual communication from the University of Washington and a BFA in visual communication from the University of Illinois.
Contact information:
Scheduled office hours Saturday, 12 p.m.-12:30 p.m. MGH 058
Email: kgz3@home.com
Course Schedule
Session 1—10/6: Visual Properties and Compositional Aesthetics
• Class overview and course requirements.
• Present visual elements to include: line, shape, pattern, texture, value, and color.
• Overview compositional properties to include: scale, depth, contrast, movement, arrangement and balance.
• Program tutorial.
• Assign aesthetic exercises, web audit/evaluation and textbook assignments.
Session 2—10/13: Information Systems and Structures
• Critique of week one exercises and web audit.
• Present components of information design to include: hierarchical systems, mapping, diagrams, signage, typography and sequencing.
• Program tutorial.
• Assign information systems and structures exercises, web audit/evaluation and textbook assignments.
Session 3—10/20: Navigation and User Interface Design
• Critique of week two exercises and web audit.
• Present components of navigation and user interface design to include: bars, icons, user-response, rollovers, naming and labeling.
• Program tutorial.
• Assign navigation and user-interface design exercises, web audit/evaluation and textbook assignments.
Session 4—10/27: Message Making
• Critique of week three exercises and web audit.
• Present components of message making to include abstraction, representation, symbols, iconography, typography, semiotics, message delivery and response.
• Program tutorial.
• Assign message making exercises, web audit/evaluation and textbook assignments.
Session 5—11/3: Movement and Animation
• Critique of week four exercises and web audit.
• Present components of online movement and animation to include: narration, time sequencing, animation and interaction.
• Program tutorial.
• Assign movement and animation exercises, web audit/evaluation and textbook assignments.
Session 6—11/10: Brand Systems
• Midterm presentation—prototype of coordinated study–term project
• Present components of branding systems to include: visual language, graphic standards, consistent messages, grids and brand flexibility.
• Assign final components of coordinated term project.
Session 7—11/17: Online Form Building
• Critique of week five exercises and web audit.
• Present components of online form building to include: page construction, file naming, files preparation, file sizes and file organization.
• Work on final components of coordinated study–term project.
11/24—Thanksgiving Break
Session 8—12/1: Coordinated Term Project
• Critique of coordinated study–term project (exhibition spaces).
• Work on final components of coordinated term project.
Session 9—12/8: Coordinated Term Project
• Critique of coordinated study–term project (exhibition spaces).
• Work on final components of coordinated term project.
Session 10—12/15: Coordinated Term Project
• Course review.
• Work on final components of coordinated term project.