Project 2: Wireframe

Due: Monday Feb. 14, end of class

Create a wireframe that acts as an information architecture, establishing where content will go: menu items, article features, sidebars, etc. The wireframe may be composed using Adobe Illustrator, and will be handed in at the end of class, Feb. 14. Illustrator documents should be saved as PDFs. Address the following:

• Where will the main menu appear?
• What about submenus?
• Should the submenus be dropdowns? Flyouts?
• Be sure all menus are navigable.
• Do you need a sidebar, and if so, what content goes there?
• Are there models for your website, existing frameworks that you can reference?
• If you reference models, be sure they're appropriate.

Submission format:

• max. width of 960 pixels
• do not worry about relative versus absolute positioning
• use a grid
• show main wireframe of index, and any other sub-pages or sub-designs if they are different from the main/home page
• consider that wireframes will need to be composed in CSS and HTML so use restraint when designing your layout
• imagery is not needed for the wireframe
• you may use the fonts you plan on using, and be mindful that you must use some "referenced" fonts, such as Google Web Fonts or FontSquirrel, so at the minimum, use fonts in your Headings h1 through h6 for your wireframe to show us the look and feel
• Illustrator file as PDF
• compose your wireframes large enough for us to view on the digital display

Project 2: Mood Board

Due Thurs. Feb. 14: Students must create an image board to visualize the likes and dislikes of your audience who has been identified as your persona, your user base. The mood board is intended to aid your design and creative direction in the next phase. You may find images of your users and place them on this mood board. Also, gather stylistic, photographic, and illustrative imagery that your audience would find appealing, and that you may include on your site. Textures, icons, fonts, popular culture material, or any other visual references are fair game too. Use Illustrator to build a 34-inch wide by 22-inch high format, upon which you place all of these elements. The final board will be submitted as a PDF to Turnstile2 (see submission at end of this post).

Examples of mood boards can be found at sampleboard.com/ and moodshare.co/. But you must use Illustrator to build yours. Students must have at least 20 images, including, but not limited to:

• 3-5 patterns or textures
• color swatches
• people, places, or things
• total of 3 website screen captures = competition, similar-content sites, and similar-aesthetic sites

You may gather digital or printed imagery, but in the end, you must submit a digital file for all of us to review. Any photographs you source must have a reference, be it a link, artist name, photographer name, or magazine/book/newspaper title. Images without sources will not count toward your project grade.

Due 12:30pm, start of class, Feb. 14 Submission format:

• submitted to Turnstile2
• 34-inch wide by 22-inch high
• full color or black and white imagery
• typography, such as the fonts you think your audience would prefer, should be set in 72-144 points for us to see on the display
• PDF placed in VCOM 262-002 - Tselentis directory
• we will review student work at our next class meeting