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 CS6 Shapes for Sitemaps and Workflows
Illustrator CS4 Shapes for Sitemaps and Workflows
Open this file in Illustrator and copy the shapes as needed. You can edit the text labels on each copy of each shape. - 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. - Omnigraffle Symbols for Sitemaps and Workflows
This library was generously provided by a student (thanks Nina!) Unfortunately, I do not use Omnigraffle, so I may not be of us much help opening or installing it. - 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. - Sketching Templates for Wireframes
Print these templates and use them as guides for wireframe sketching before taking the concepts into a digital form.
Recommended Books
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)