Web Design II - Fall 2011

Web Design 2

Course Number:
70 384-801

Class Meets:
Tuesdays and Thursdays: 8:00 - 10:50 A.M.

Office Hours:
Tuesdays and Thursdays: 10:50 - 11:30 A.M.

Professors:

Tracey Greene
Tracey_Greene@uml.edu; tracey@trayandalan.com
781-956-0300

Brendan Sands
brendansands@gmail.com
978-500-4058

Description:

Through a combination of lectures, technical demonstrations, in class exercises and critiques, this studio art course will teach students the fundamentals of designing and creating visual content for the World Wide Web. We will explore what constitutes a visually exciting and conceptually engaging web site. Students will review HTML, JavaScript, Flash, image processing, animation, interactive strategies, web architecture and management, and usability. Students will also learn about HTML, CSS, JavaScript, and the importance of creating “Rich Internet Media”. In addition to these technical skills, the students will develop an understanding of the potential use of the World Wide Web authoring as a fine art practice.

Objectives:

Building from the students’ understanding of information architecture, HTML, image processing, animation, and usability, this course is designed to prepare students for the independent planning, architecture, design, and production of advanced World Wide Web art projects. We will concentrate on developing the students Web architecture skills and creative talents with Web authoring and focusing those students towards a sustainable art practice. Web Design I is an important course for students pursuing professional careers in the diverse field of Internet Art and Web Design.

Requirements:

Over the course of the semester, students will be required to complete several finished projects using their research, planning architecture, design, and World Wide Web authoring techniques. For all projects, students will be required to publish each assignment and the final semesters work to the internet, as a complete project Web site. We will conduct thorough critiques of all completed work so that all students can learn from one another. Everyone must come prepared and engaged and everyone must participate. Students will be evaluated on the presentations, so test your work and equipment before hand on multiple operating systems and browsers. Students are responsible for meeting all project deadlines and critiques. Late presentations will suffer a drop in letter grade for each day late. Attendance and punctuality is required at all class meeting and will be reflected in the final grade. You can get an "A", only if you are consistently in class and on time. An Incomplete will only be issued if there are extenuating circumstances related to illness or critical personal emergency and only after administrative notice has been received.

Criteria for Evaluation:

The final grade for the semester will be determined by;

  1. Project and presentations, based on craftsmanship, 25%, and content, 25%
  2. Attendance, punctuality and preparedness, 25%.
  3. Participation in discussions and critiques, 25%.

Policies:

Students should be aware of the University policies regarding creative dishonesty and the penalties for plagiarism and software piracy. While it is accepted that there may be occasion for stylistic or historical inspiration, influence and reference, the student will be asked to produce original work from ones own study and investigation.

Optional Reading:

  1. Designing with Web Standards, 3rd Edition, Jeffrey Zeldman, Peachpit Press. ISBN 10: 0-321-61695-2.
  2. CSS Web Site Design Hands on Training, Eric A. Meyer, Peachpit Press. ISBN 10: 0-321-29391-6.
  3. CSS, DHTML, and Ajax, Fourth Edition: Visual QuickStart Guide, 4th Edition, Jason Cranford Teague, Peachpit Press. ISBN 10: 0-321-44325-X.
  4. Web Style Guide, 3rd edition: Basic Design Principles for Creating Web Sites, Patrick J. Lynch, Sarah Horton, Amazon.

Supplies:

iPod, iPhone, USB/thumb drives, etc. as needed to use for media transfer.

Assignments:

Project 1 - Site Architecture and Development Planning w/ Tracey | Due Week 3 | Thursday, September 22
Each student will choose the web site that they will be responsible for creating for the semester. Please meet with me individually to discuss your plans ahead of time. Initially, each student will research websites and the latest demands in the industry (i.e. 508 accessibility, dynamic content, W3C standards, Web 2.0, rich media, mobile, SEO, etc.). Students will then incorporate these demands into their website. To determine their site goals, each student will create a list of objectives and validate them with users. The student will then figure out the content and navigation through a detailed site diagram and wireframe. Technical objectives include; stakeholder requirements, user needs, site planning and architecture, which includes wire framing.

Project 2 - User Interface Design w/ Tracey | Due Week 5 | Thursday, October 6
Each student will be responsible for creating a logo to accompany their website. Using the research and questionnaire findings from project two should help point the student in a creative direction. To aid the creative journey, an exercise will help to shape necessary elements (font, color, imagery, layout, etc.). Creation of one user interface design including a home and an interior page based on site diagram, wireframe architecture, site goals, content, and logo design will be required. With your basic understanding of how HTML and CSS work, create one design using Photoshop. The user interface design should explore color, layout, and style options. The class will critique the design, which will help to define the best user interface layout. Technical objectives include; learning how to make a creative vector logo for the primary uses of the Web and print, creating a recognized style, how to create visually interesting user interface designs in Photoshop with your basic knowledge of HTML.

Project 3 – HTML and CSS Refresh w/ Brendan | Week 7 | October 18 & 20
The first couple of weeks will be an introductory in how design is translated into a working and interactive website. HTML and CSS (Cascading Style Sheets) is the blueprint for how all websites are rendered in the browser. Code is typically hidden from the average user; however as web designers and developers it is important to learn the basics of how websites are constructed. This initial assignment will be an introductory overview of how to construct and edit example code including HTML and CSS. Sample code will be provided for you to develop into a working web page. Grades will be based on organization, cleanliness, best practices, capitalization, indentation, and overall understanding of how to interpret and modify code to make various adjustments (i.e. color, font, spacing, etc.).

Project 4 - HTML/CSS Production w/ Brendan | Due Week 11 | Thursday, November 17
Each student will produce their site home page and a sample interior page based on their final user interface design in HTML and CSS. Sites should be developed “smartly” for the fastest and most efficient deployment. Technical objectives include; learning how to start and organize HTML pages with CSS and JavaScript from your Photoshop design using a Dreamweaver defined site in Code View.

Project 5 - Final Site: Final Site w/ Tracey & Brendan | Due Week 14 | Thursday, December 8 - LAST CLASS
Using Dreamweaver, compose all of the semesters work into one coherent web site which should include HTML pages with CSS and two rich elements (i.e. JavaScript, JQuery, PHP, etc.). Add meta key words and meta description so search engines can find your site. Technical objectives include; a comprehensive understanding of the site architecture, design, development, production, and management.

The final project must be posted to the ftp/hosting site provided on the last day of class.