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

Conference

GDES-220 fall 2019 (David Ramos, American University Design)
ramos@american.edu · office hours · interaction design resources

Build a website for a hypothetical conference about technology, design, and society. Aim to create a site that would convince a potential audience member to attend. 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

The conference

Date, location, and audience

The conference should take place in about four months—your choice of dates—and should last for 1–1.5 days. Events take place in Washington, D.C. or elsewhere, at your choice of venue or venues. (Consider an educational institution or a major hotel.) You may choose audience and other details as you wish.

Possible topics

“Right now, my field must tackle describing a world where falling in love, going to war and filling out tax forms looks the same; it looks like typing.” (Quinn Norton)

Choose one of these topics, or propose a variation on one of these topics.

Speakers

Your conference must include at least seven speakers from this list. You may also include speakers who are not listed, but the conference topic must follow logically from speakers on this list.

Phases of work

See the class schedule for due dates.

Phase 0: Getting to know topics

Look through the example websites and conferences on this assignment sheet. Observe how they use images, how many types of pages there are, how design elements carry over from page to page, and how many different types of type are present.

drawing of this design phase

Phase 1: Research and conference idea

Look at who the speakers are—think about their careers, but also about the sorts of things they’ve written. Explore ideas for conference topics, and do background research about the issues.

drawing of this design phase

Phase 2: Visual systems and components

Start by gathering the visual elements that go into your design. Show us two (2) different concepts. Explain these concepts using:

Documentation packet template in InDesign (ZIP), if you would like to use it.

You’ll also need a list of pages or a site map.

drawing of this design phase

Phase 3: Pages and layout

Refine your design direction, then prepare layouts for pages. Pursue two concepts. (We’ll settle on one during critique.) Sketch out your layouts, keeping both mobile and desktop browsers in mind.

You probably need three or four types of pages. Create page templates, then reuse the layouts and code across the site.

drawing of this design phase

Phase 4/5: HTML/CSS and content

Produce a live site in HTML/CSS. Start by completing one page, perhaps the front page or a page type you’ll reuse. Then make templates for the other pages.

Write the text for your site, gather images, and insert copy and images into the HTML.

Turning work in: bundle your code, PDFs of your sketches, and a readme.md file into a folder and ZIP compress.

Website specifications

Content

Technical

Examples

Conference sites

Notable for design

Consider typography, layout, image use, structure, and pacing.

Systems