Project Work:
Students are expected to produce professional quality deliverables for their assignments. There are many software options, some of which are licensed and available for purchase while others are open-source and available for free or minimal cost.
I will present deliverables created with Microsoft Visio Professional, Adobe Fireworks, and Adobe Illustrator. Students may use these professional tools or others, including Adobe Photoshop and OmniGraffle. Please do NOT use Microsoft PowerPoint to create your deliverables.
An excellent alternative for students with limited budgets is the OpenOffice.org suite of applications, which includes a drawing tool suitable for creating site architectures and schematics as well as a word processor for personas, scripts, and reports.
Information and Interaction Design Symbols:
- Illustrator Symbols for Sitemaps and Workflows
For Windows XP users, save this file to:
C:\Documents and Settings\<USERNAME>\Application Data\Adobe\Adobe Illustrator CS3 Settings\Symbols
For those of you using Vista or who have a Mac, I'm of little help here... - Fireworks Shapes for Sitemaps and Workflows
Right-click and select "Save File As..." or "Save Link As..." to your computer, then open with Fireworks. If you plan to use these symbols often, I would suggest that you create your own symbol set in the Common Library with them. - Unify Templates from Eight Shapes
Templates, patterns, and processes based on Adobe InDesign for producing nearly all forms of documentation and deliverables for information and interaction design. - Wireframe Elements for Illustrator
Some of the most common elements you might need to mock-up a web site.
Recommended Books
- Information Architecture: Blueprints for the Web (Voices that Matter) (Christina Wodtke and Austin Govella)
- Designing Web Interfaces: Principles and Patterns for Rich Interactions ( Bill Scott and Theresa Neil)
- Information Architecture for the World Wide Web: Designing Large-Scale Web Sites (Louis Rosenfeld and Peter Morville)
- About Face 3.0: The Essentials of Interaction Design (Alan Cooper, Robert M. Reimann, and David Cronin)
- Designing Interfaces (Jenifer Tidwell)
- Communicating Design: Developing Web Site Documentation for Design and Planning (Dan Brown)
- Ambient Findability (Peter Morville)
- The Design of Everyday Things (Donald A. Norman)
- Emotional Design: Why We Love (or Hate) Everyday Things (Donald A. Norman)
- The Design of Future Things (Donald A. Norman)
- Don't Make Me Think: A Common Sense Approach to Web Usability (2nd Edition) (Steve Krug)
- The Humane Interface: New Directions for Designing Interactive Systems (Jef Raskin)
- The Elements of User Experience: User-Centered Design for the Web (Jesse James Garrett)
- Designing for the Social Web (Joshua Porter)
- Designing for Interaction (Dan Saffer)
- Designing the Obvious: A Common Sense Approach to Web Application Design (Robert Hoekman, Jr.)
- A Project Guide to UX Design (Ross Unger and Carolyn Chandler)
- Sketching User Experiences (Bill Buxton)
- Web ReDesign 2.0: Workflow that Works (2nd Edition) (Kelly Goto & Emily Cotler)
- Grids for the Internet & Other Digital Media (Veruschka Götz)
- School of Visual Arts Interaction Design Reading List for the MFA Program
Online Tools & Resources:
- Online Wireframing Information
- Mind Mapping Tool
- 50 Free UI and Web Design Wireframing Kits, Resources and Source Files (HTML)
- 10 Completely Free Wireframe and Mockup Applications (HTML)
- Simple Diagrams (HTML)
- Fifty Sketching Resources for User Experience Designers (HTML)
Software:
- Flairbuilder (AIR application for creating wireframes; free online version, but must buy the downloadable version.)
- OpenOffice.org (suite of office tools, including a drawing tool)
- AceHTML 5 (HTML editor)
- SmartFTP {FTP client)
- FileZilla (FTP client)
- TopStyle Lite (for CSS)
- NVu ("New View") HTML editor and web authoring tool
- PDFCreator (PDF printer driver)
- Inkscape (vector graphics tool)
- Sodipodi (vector graphics tool)
- The GIMP (similar to Photoshop)
- Paint.NET (similar to Photoshop)
- ArtWeaver (similar to Photoshop)
- Scribus Desktop Publishing (similar to InDesign)
- Freemind (mindmapping tool for PC, Mac, and Linux)
- MindNode (mindmapping tool for Mac only)