Travel

Design a website to promote travel to a small local destination. Explain your design by creating an interactive prototype. Focus on designing with grids, layout, type, and image choices.

Choose a site in the DC area, a place of local rather than national significance and not a museum.

Suggestions:

• Fort Reno Park
• Mt. Pleasant St. NW
• Downtown Anacostia
• Carroll Ave. in Takoma Park
• Canal Park.

Not:

• M St. in Georgetown
• National Portrait Gallery
• White House Visitor’s Center

We are following an abbreviated interaction (or user experience, more conventionally) design process so that this project can focus on your gaining expertise with prototyping tools, and on designing affordances and signifiers within screens.

For the first week’s critique, bring in sketches for three different concepts. Show us color, type choices, grids, layouts, and image possibilities.

Specifications

• Create the site as a prototype using Figma or (with instructor permission) another tool.
• Build a website of one or more pages.
• For this project, build the site for a desktop/laptop browser. Pages must scroll vertically. I strongly suggest a window 1200–1440 px wide, but please leave margins around text content.
• Consider accessibility when choosing element sizes, click target sizes, and colors.
• Body copy should almost certainly be 16 px.

Two hints: First, spend most of your time working at 100% zoom. New designers have a habit of working zoomed-out on Figma, which makes their type and design elements too small. Second, give yourself margins at the sides of the page and between elements. You can have a margin even if a background image runs all the way to the edge of the page.

Content

• Write meaningful headlines.
• Body copy, asides, and captions can be text that you wrote, or text that you sourced from an AI and then edited for reasonable sense. No lorem ipsum.
• Create any images that you use.
• No one says that tourism sites need to be about photographs.
• Images do not have to show a place, but if they do, they must depict your place. (Go visit your place with a camera or a sketchbook.)
• If you do find that you need a map, please put care into preparing the map. If the site were live, you would want either an embedded map (from a service like Felt, Mapbox, or Google Maps), or a thoughtfully designed static map image.

Objectives

• Experiment with ways of navigating information.
• Improve designs through iteration and through usability testing.
• Develop layout, typography, and detail design skills for screens.
• Develop image choice and art direction skills for the screen.
• Explain interactive projects using design documentation and prototyping tools.