University of Oregon - Department of Architecture - ARCH 424/524 Cheng - Advanced Design Development Media

Assignment 1

Web Page

Hand-in Tuesday Jan 18 by 9:00 a.m.

Select an aspect of Maybeck architecture to explore and create a web page which expresses your interpretation of the aspect. Make the graphics for your web page a model for the class site.  Class members will vote on whose web design should be used as a loose template for all pages.


Technical: Show proficiency in Golive: publishing, text, color, images, links, image maps, rollovers Photoshop: Web file formats, selection sets & image editing, layers

Content:  Investigate Maybeck architecture, Sequence images to create a narrative, Manipulate or annotate scanned images to create original interpretive work.

Topics for investigation:

Explore Expression:

Consider what makes a compelling presentation. Reflect on both the nature of your selected site and other presentations such as films or novels which you have felt strongly about. Carefully examine well-designed Web sites such as the ones referenced by Lynda Weinman to understand the creative possibilities. Find a favorite site to share with the class.

In examining other sites, look at how layout, color, and type are being used to shape the personality of the graphics. If your site was a person, what style of clothing would he or she wear? Be on the lookout for things that have a similar feel as your place and closely inspect what are the formal or visual characteristics which contribute to your perception. Make sketches and notes throughout the process.


Plan what are the features you want to emphasize and what categories they fall into. Sketch a flow diagram of the nodes and links: is there a linear progression through these aspects or are they interwoven?

Design your site with downloading constraints in mind: smaller images and fewer colors will load more quickly. Image processing tools such as Photoshop and Graphic Converter make it possible to generate alternate versions with lower color depth for comparison.

Create a page template & style guidelines:

For this class, please create a page called "place.html" in your public_html directory which is accessible from your personal "index.html" page. You can either make this a title page (splash image) or design it as a template for all other pages in your site for this class.

Using graphics programs that you are comfortable with, create GIF images which can help unify your presentation by appearing on every page. Elements to create can be: image maps, buttons, horizontal rules, vertical borders, background wallpaper (keep it subtle so text can read).

Tryout different kinds of layouts with these elements and then refine it into a standard frame for your typical pages with an indexing system and layout elements such as rules and tables. Standardize how type alignment, sizes and styles will be used so that you can create a guideline for consistent styles: for example, all subheads will be Heading 3, color 8C1717, etc. See theVDS96 page for an example of style guidelines and template page for teamwork.

Submission procedure & file names:

Bring drafts of your report and the graphics to each class session. For Jan 13, bring your template page design.

For Jan 18, illustrate how your template page can be used for aesthetically pleasing results with your architectural anaylsis. Include in your presentation a diagram of the site's future nodes and links. Feel free to incorporate any forms of digital media which help you express your ideas.

Instead of handing in the documents, you will post them to your public site Web page. Make sure your site page's URL is on the class list correctly. Please make your initial default index.html your personal home page which links to your site home page called place.html.

E-mail Prof. Nancy Cheng at ""with questions, suggestions or address corrections.

| intro | schedule | books | home |

edited Jan 6, 2000 by nywcheng