This video does a great job of demonstrating the wireframing process from lo-fi to hi-fi wireframes.
Continue Reading
Ergonomics for Interaction Designers
Posted on 30. Jan, 2010 by Chris McQueen.
Rob Tannen presents an insightful guide to Ergonomics for Interaction Designers.
This presentation is based on a number of articles found on Rob Tannen’s website: Designing for Humans.
Continue Reading
Microsoft's Vision For 2019
Posted on 04. Nov, 2009 by Chris McQueen.
Some inspiring User Experience design from Microsoft… for once.
The most interesting and engaging technology here is demonstrated right at the beginning in the form of an interactive education platform. Unfortunately however, I think the business applications are far more likely to see the light of day, such as the touchscreen business cards and meeting console.
Continue Reading
Business Analysis and User Experience Activities
Posted on 30. Oct, 2009 by Chris McQueen.
During the Opencast Matterhorn Leadership and Planning Meeting, Allison Bloodworth and Judy Stern of UC Berkeley Educational Technology Services provided an overview of the Business Analysis and User Experience roles and processes. The Matterhorn BA/U Team was proposed as a unified team working together as a cross-project resource to help the Matterhorn team understand & design for user and business needs that will be more likely to be adopted and used successfully.
Continue Reading
My Tool of Choice: Adobe Fireworks
Posted on 08. Aug, 2009 by Chris McQueen.
Prototyping tools can be a huge benefit to design workflow. However, it seems to me that the most common wireframing applications (Visio, OmniGraffle, Axure RP) whilst fine for producing low-fidelity mock-ups, are a barrier when taking the finished design through to production… Honestly, how many web designers, web developers, user experience professionals or otherwise really want to commit to re-working, re-drawing and re-coding a final design once the final design decisions have already been made?
…And so in steps Adobe Fireworks.
Ok, ok, so I agree that the idea of “re-work” is a slightly heavily weighted if not clumsy argument and there is no such thing as a tool for all seasons, one-stop shop. Of course, I’m not suggesting that Firework’s CSS and HTML export functionality is anything more than a handy rapid prototying and user testing feature. Nor do I think Photoshop should take a back seat when dealing with web (subtle cough) “photography”. I do believe however that as part of an iterative workflow, Adobe Fireworks really stands out.
In a nutshell, Firework is a hybrid imaging application that includes powerful vector tools to create non-destructive scalable elements and tools to optimize graphics for the web by using the native PNG format to keep layered file sizes low. Interestingly, one of the original goals of the Fireworks development team was to create a program in which users could do all their work without ever having to jump to another application. Having said that, integration with other Adobe (previously Macromedia) products is seamless. With the advent of Rich Internet Application and Adobe’s commitment to Flex, Fireworks CS4 allows Flex components to be inserted into a design making it ideal for the design development of Flex (and Flash) based web applications. For those still not content with Fireworks out of the box, it can also be extended by those who are familiar with JavaScript or Flash.
Whilst long time users of Adobe Photoshop may find it difficult to migrate their workflow to Fireworks since Photoshop has been the web design tool for many over a decade, Fireworks CS4 now has improved support for import of PSD files and preserving all slices made in Photoshop.
In the end, yes, it is about choice. However, Adobe really has succeeded in creating a tool that can be integrated into your existing workflow, and enhances your productivity by functioning as both prototyping and design applications.
Useful stuff:
- Smashing Magazine presents: Adobe Fireworks Tutorials and Dowloads.
- Adobe Products: Fireworks.
- Adobe Fireworks Development Center.

