I recently posted a slightly nerdy interaction design blog post over on the Different Website.
Spelunking is an outmoded term for ‘caving’ – the recreational sport of exploring caves. It can also be a metaphor for user interface exploration, where a user must explore the features or content of a system by diving deep into a ‘cave’ (i.e. area of a system) to do a task, only to need to come out again to do the next task or step.
Interface Spelunking Part 1
I recently posted a slightly nerdy interaction design blog post over on the Different Website.
About three years ago, I presented at UX Week 2007 on a topic that in hindsight, probably was best left to some kind of tutorial. At the time, I had been specifying the interface behaviour of highly conditional and rich internet applications (think flash, ajax, etc) through an adaptation of Jesse James Garret’s Visual Vocabulary.
I just stumbled across the old presentation and took another look. It’s not all bad, though I think I completely lost my audience given the convoluted nature of the topic. You would be forgiven for enquiring whether this is a good use of time – diagramming rich interface behaviour – when you could be prototyping the interface instead… it smells a bit like documentation gone mad.
It was at least an interesting thought experiment and one I’m posting it here because maybe one day, someone will find it useful for something. If you do, let me know.
Aarron Walter makes some salient points about designing products to elicit an emotional response over on Carsonfield’s Think Vitamin. He makes a nice analogy that usability is equivalent to edibility of food. Yes, food has to be edible. But what about tasting good? That’s how emotional response equates to design.
“Positive emotional stimuli can build a sense of trust and engagement with your users. People will forgive your site or application’s shortcomings, follow your lead, and sing your praises if you reward them with positive emotion.”
So, I wonder in what circumstances we may want to provide people with something other than positive emotional stimuli through our products and services?
OZ-IA is an information architecture conference held here in Sydney annually. I presented this year on a topic which has occupied me the past few years: Selling user experience design and the value of design thinking to business.
The thrust of the presentation goes like this:
- We, as a profession, have largely failed to make great product experiences.
- There are certain people that matter in the world of design, and it’s not designers. It’s the people who pay to have things built
- Communicating the value of design to people who pay to have things made needs to be better done by the industry. They call this “Selling” and we can learn it from traditional salesmen.
The second part of the article I’ve been chewing on for the past while is now up on Boxes and Arrows.
Building the UX Dreamteam – Part 2
In this second part of a two-part series, UX manager Anthony Colfelt follows up with some solid considerations when looking for your next superstar. Building a dreamteam goes beyond looking for tight technical skills: personal chemistry is needed to find that perfect match.
The latest project I worked on used Microsoft’s Expression suite to deliver a working prototype of a Windows application in Windows Prenentation Foundation (WPF). Expression is actually four different programs: Design; Blend; Web and Media. Clearly aimed at taking some of Adobe’s market share they enjoy with Flash, Dreamweaver, etc, Expression can deliver Web sites, applications, “Silverlight” (can be thought of as a Flash-like plugin that plays Silverlight files in a Web browser), rich apps and also Windows Presentation Foundation (WPF) apps (Lots of MS Vista was built using WPF I hear). XAML is the main code format that Expression produces. XAML is a language that describes the interface layer, and is similar to Scalable Vector Graphics (SVG) in its appeal (rendering of interface objects as vectors based on code rather than as pixels which don’t scale well).
Expression facilitates workflow between disciplines in the development team as it separates the presentation layer from code quite well. Both can be generated simultaneously and there’s no longer a need for a developer to translate a designer’s vision with lines of code – invariably a vulnerable communication process. Well, that’s the promise anyway… but yes, there’s a big ‘but’ here.
Leaving aside the immaturity of the application suite, while relateively slick for a Microsoft product it has got some nasty usability issues. In terms of flow, it runs a distant second to Adobe’s products, which have been refined over the last decade and a half or so. Indeed, getting around some basic functions like relabeling layer elements seems like a chore by comparison. Unfortunately, the fact that an interface has been designed over the top of an underlying interaction architecture defined by programmers is fairly typical of the way Microsoft builds software. Credit to the design team who did a reasonably good job at pushing boundaries where they could and put some very pretty lipstick on this little piggy. Not all the applications in the suite are difficult; the ‘Design’ tool isn’t too bad. It’s not as powerful as Adobe Illustrator, but pretty similar to it for the most part. But where Microsoft had to invent something that didn’t have a good example to follow (e.g. the ‘Blend’ tool), the resulting software is cumbersome for we UI designers to use.
The ‘Design’ and ‘Blend’ tools share some of the same functions, but ask the user to learn slightly different interface paradigms to do them. This contributes to the feeling of “anti-flow” aka ‘frustration’ that washes over you when trying to do things that could be done simply with Adobe products.
‘Blend’ when working in WPF is trying to create a very different underlying structure to interface objects than designers are used to thinking about. Grids, Stack Panels, Frames and other ‘Containers’ are a foreign model when you are used to just placing bunch of elements onto a page so they look right. This takes some getting your head around to say the least. Supporting documentation on when to use what ‘Container’ and why some ‘Containers’ are better suited to certain applications is not comprehensive. Add this learning curve to usability issues and frustration turns to exasperation rather quickly. Some may retreat to the familiar, comparitively friendly environment of Adobe Illustrator, exporting XAML from it using a plugin (which doesn’t do the cleanest translation job either) and giving that to the programmer to construct the ‘Container model’. That kind of defeats the point of Microsoft Expression if we’re trying to get designers to put their edits directly into code via ‘Blend’.
Perhaps its unfair to compare a product that’s just recently come to market with one that’s been honed over time and does something fundametally different. But with that said, there are some things that seem patently broken about ‘Blend’ (known bugs aside).
In my experience, developers hate using WYSIWYG tools because they don’t do a very good job at interpreting intentions and create overweight and messy code as a result. In essence, that’s what ‘Blend’ is – a WYSIWYG code editor. Typically, your programmer won’t want to use ‘Blend’ to create the complex, object-oriented control structure inherent with software of any magnitude. They’ll most likely want to use Microsoft’s Visual Studio instead because it’s what they’re used to and frankly is does a better job of helping them to code than ‘Blend’ does. In this case, you will run into terminal problems trying to use ‘Blend’ to edit design artifacts nested in controls (usually also fed content by a data source). This is of course, unless your developer is aware that you need to use ‘Blend’ to edit your design elements and structures their code accordingly. How you do that, I don’t actually know. But I believe it can be done. If I find a link to something that outlines best practice for this, I’ll post it to this blog.
In summary, I’ve used blend for about 4 months now. Not day-in, day-out, but for weeks at a stretch at least. I still dread opening it and battling through doing simple things. Toward the end of the project I’ve just finished, we were back to filing design bugs for developers to fix (or not) because we couldn’t get at design elements because the project had not been architected ‘just so’. So why did we use Expression? Is it just immature? Or is it destined to be difficult for designers to use? Only time will tell.
After much writing and re-writing, the first part of an article I wrote called “Building the UX Dreamteam” is now up on Boxes and Arrows. Boy, who would’ve thought that putting together your thoughts could be so hard? I’m very happy that I had good editors, in particular, Chris Palle who really directed me how to cut this article into shape – Thanks mate.
“Finding the right person to compliment your User Experience team is part art and part luck. Though good interviewing can limit the risk of a bad hire, you need to carefully analyze your current organizational context, before you can know what you need. Herein lies the art. Since you can’t truly know a candidate from an interview, you gamble that their personality and skills are what they seem. Aimed at managers and those involved in the hiring decision process, this article looks at the facets of UX staff and offers ways to identify the skills and influence that will tune your team to deliver winning results.”
The Slides, Handouts and Podcast of my talk at Adaptive Path’s UX Week 2007 are here for your viewing and listening pleasure.
If you’d like to join the myfamily site set up to discuss this topic, download the handout and see the last page for a link.
“Flow diagrams are a key component of an interaction design specification. Jesse James Garrett’s Visual Vocabulary uses a set of simple shapes to diagram user flow and illustrate basic relationships between webpages. However, using Visual Vocabulary to describe more sophisticated behaviors of “rich” interfaces — enabled by technologies such as AJAX, Flash and Ruby on Rails — can sometimes prove challenging. But with some additions and creative modifications, Garrett’s language can actually be used to effectively communicate the design of a rich or conditional UI.
In this session, you will:
- Gain a deeper appreciation of the power and flexibility of Garrett’s Visual Vocabulary.
- Discover how to utilize an augmented Visual Vocabulary to describe the dynamic nature of rich or conditional interfaces.
- Learn tips and tricks to improving your flow diagrams through the addition of key information.
- Find new ways to bring unrealized clarity to your specifications, illustrated via a series of specific examples.”