home ◅ Classes + teaching ◅ Digital and Emerging Media Design I ◅ Assignments

Narrative

GDES-220 fall 2015 · American University Design
Instructor: David Ramos (ramos@american.edu)

Build a website that tells users a story. Consider navigation, user experience, typography, image choice, and the value of templates and shared stylesheets in web development. Think of this website as a single system, built from many smaller and reusable parts.

Photo of globe sitting in a window

As a departure point, start by talking about a place managed by the National Park Service—an historic site, national park, national landmark, or other site.

Consider the way in which a reader should experience the site. The heart of your task is to convey a narrative: deciding what story you want to tell, creating a site design that communicates that story, and building that site.

This project involves the design of system of parts; all of these pieces should work as a whole. For this project, use every page of the site to express a single design concept. The site will most likely draw from two or three standard layouts, with only the content changing from page to page. Make every page adhere to one overarching color scheme, one way of handling type, and one grid. Explore ways to make individual pages stand out, but only after you have constructed the fundamental system, and only within the framework that you have constructed.

Objectives

Deliverables

One website, built in HTML/CSS. The website should have at least three page types/page templates; creating more than five page templates is probably unnecessary and inadvisable. (We can discuss requirements for projects that do not fit a page-by-page model.)

At the end of the project, turn in a rough, un-designed PDF process book, containing images of your work in progress, sketches, and early versions.

You may use JavaScript to add features to the site, but remember that JavaScript is not the focus of this course. Consider using existing scripts based on the jQuery library.

Evaluation

20% Concept and storytelling
20% Page layout and typography
10% Usability of site structure and navigation
10% Use of templates and standardized code
20% HTML/CSS/JavaScript quality and correctness 
20% Process and process documentation

Sites to consider

Think of these as precedents rather than models to imitate.

Websites with narrative aspects

Place and narrative

Systems