I draw boxes

May 9, 2010

My review of UX Intensive Amsterdam 2010

Filed under: Information Architecture,Interface design,User Experience — Chris @ 11:03 am

UX Intensive - WelkomLast week I got back from the UX Intensive training course run by Adaptive Path in Amsterdam. It was a four-day training course covering a variety of topics in user experience. Day one was on design strategy, day two was design research, day three was information architecture and day four was interaction design.

My knowledge of Adaptive Path started a number of years ago when I first heard about Jesse James Garrett’s famous diagram entitled The Elements of User Experience (which has since become a book). In the diagram Jesse compares informational web sites against web applications and the processes that are involved in creating both. I used to have it up on my wall (at work!) back in 2004 when I first started reading about IA. JJG founded adaptive path soon after publishing the diagram in 2000.

So this was an exciting opportunity for me – the chance to learn from the best in the business, from a company who’s founder was one of my first influences in IA and user experience.

We flew out to amsterdam on the Sunday night and had a great seafood meal at Lucius to start the trip. As someone who was vegetarian for 25 years and only recently started eating meat the meal was an amazing experience. The food was so fresh and pulling out all the winkles, cockles and snails from their shells with all sorts of tools was really fun.

Sticky note creativityThe next day the course started and we were welcomed into a nice venue with a comprehensive pack containing all the printed slides for the course, as well as a notebook, stickers, post-it notes and a sharpie pen. This was a nice, professional touch. Good hygiene.

Day one started with design strategy presented by Henning Fischer, the head of Adaptive Path’s new Amsterdam office. He began by introducing the ideas of Michael Porter, a professor at Harvard Business School. He focussed particularly on the business strategy of Swedish furniture chain, Ikea. Key elements of Ikea’s business strategy that he highlighted were:

  • Self-selection by customers
  • Low manufacturing cost
  • Modular furniture design
  • Limited customer service

Henning then went on to describe the process of putting together a business strategy with the following steps: focus, definition, customer value, and scope. We also completed a variety of exercises to put together a design strategy for a fictional hotel.

Amsterdam canalOverall the day was good but I would have preferred a bit more of an interactive style (involving the audience), some background to Adaptive Path to kick-off the course, and some examples that were more up to date than flickr, blogger and nike+. On the plus side the Michael Porter work was interesting and there was a great exercise on prioritising business opportunities – a scoring system to force clients to make informed choices and tradeoffs when defining strategy.

After the day ended we stumbled across a fairground in Dam Square so had a go flinging ourselves around on a ride ridiculously high in the air! Fun times.

Day two was design research with Paula Wellings, and was all about interviewing users and finding out what they like and dislike. We did a number of exercises noting down our thoughts on post-it notes as the interviews took place, and then grouping the common themes and ideas to form concrete deliverables such as personas and user experience diagrams.

Things started to hot up on day three with Kate Rutter talking about information architecture - Kate had a real rapport with us and her energy pulled us through a genuinely intensive day. For me personally it took me back to when I first started learning about IA 4-5 years ago, with references to the polar bear book, Jesse James Garret’s original diagram, and discussions about metadata and organising information.

Delegates listen intentlyThere was also a welcome nod to the present and the future with a quote from the recent Richard Saul Wurman keynote at the IA Summit, as well as some great slides at the back of the presentation on future trends in IA. These included the firefox operator toolbar which locates metadata within a page, an innovative classification system from wine merchant Best Cellars, and ideas around ‘fluid data’ including Moritz Stefaner’s revisit (for displaying tweets) and Tom Taylor’s Boundaries which uses user generated photo tagging to help define neighbourhoods.

On the final day we were taken on an interaction design journey by Andrew Crow. He took us through a process of first opening up ideas during the research phase and then closing them down, before moving in the the interaction design stage which also involves opening up during ideas generation (or ideation) and then finally closing down when developing a prototype.

I was surprised by the variety of outputs that are possible in interaction design. Andrew showed us not just prototypes but mental model diagrams, venn diagrams, matricies, pie charts etc. etc. I’m going to try to be a bit more creative in the way I think about diagramming my ideas.

Overall the course was a great experience and I learnt a lot. I’m going to follow up on some of the ideas in the future of IA. It also reassured me about my readings and practices over the last few years – I have been reading relevant publications and considering may of the right aspects of my work. The only thing that would have topped it off was a visit from JJG!

January 19, 2009

My first usability testing

Filed under: Information Architecture,Interface design,Technology,Usability,User Experience — Chris @ 9:33 am

Ever since reading Steve Krug’s Don’t make me think a few years ago, I’ve wanted to run my own usability testing sessions. Usability testing is where you sit with people who have never used a site before, (preferably not web professionals) and discuss the site with them as they try and use it. Often their comments and mouse movements are recorded so you can go back and review what they said and did.

The idea is that when you are working on a site you can become so immersed in the project it is easy to forget what normal people actually want out of the website. Business objectives (e.g. “we must sell products and gather email addresses”) and technical constraints (e.g. “we can’t build that function and we have to display the data in this way”) often get a lot of priority on a project, and it’s the job of an IA to focus on the end user.

Usability testing is where you sit with people who have never used a site before, and discuss the site with them as they try and use it

Usability testing is a key tool in doing this – and importantly it provides evidence with which to inform your judgements and back up decisions. A video of representative users saying “I don’t want to give over my email address” or “I don’t understand the data when it is presented in that way” can be a powerful persuasive tool for making changes.

Another important point is that you can test sites when they’re in the prototyping stage – i.e. they don’t have to be fully built. You can create a clickable web mockup of full colour designs, or even wireframes and still get invaluable feedback from the process.

The bottom line for me is that it just seems such a simple and easy way to vastly improve your web sites. At my previous job I wrote a proposal offering to run low budget, ‘lost-our-lease’ usability testing sessions as advocated by Krug. The idea was to do cheap, frequent testing rather than expensive agency testing (which happened about once a year).

In the end they never went for it, and continued to outsource the work. But my new employer seems to be a bit keener to do usability testing, and let me loose to test the configurator for a large car brand we’re working on. A couple of weeks ago I ran my first ever usability testing sessions, with 6 volunteers from my work spending around an hour with each of them on the site.

The bottom line for me is that it just seems such a simple and easy way to vastly improve your web sites

The product

The website I tested was a car explorer and configurator system designed to give users a visual tour of various car models (the ‘Explore’ section), before allowing them to choose and configure their own car (the ‘Configure’ section). The ‘Explore’ section was already fully functioning and live on the web, while ‘Configure’ was in prototype form. I created a clickable version of the visual designs for users to interact with in the test.

In the Explore section you can view one of four models of luxury car in 3D, navigate around it, look inside at the dashboard and interior and change the colour and wheels with real-time updates. In ‘Configure’ you can pick your options from a list and see the price and car photo update in real time.

The outcome

The aim of the exercise was to get 4-6 key recommendations for improving the product, which could then be implemented to improve the user experience. We achieved this and made recommendations to the client, including video clips and justification for the points we made. Overall it was really good to see the users interacting with the system and I’m convinced we made genunie improvements to the system. I hope we can do it again on another project.

July 7, 2008

Should IAs be involved thoughout the web development process?

Filed under: General musings,Information Architecture,Interface design — Chris @ 5:49 pm

A fundamental question for me relating to the information architect role is how we fit in to and interact with the wider web team, and to what extent IAs should be involved throughout the web process.

Information architecture is in many ways the ‘bridge’ between technology and design

My own opinion is that information architecture is in many ways the ‘bridge’ between technology and design – while keeping the user in mind. Therefore IAs should have input at every stage of the project.

Another view is that IA is simply another step in a linear process – a process that goes something like: Strategy > Requirements > IA > Visual design > Build > Test > Release. In this model the IA simply drops in at the beginning of the project, produces some documents, and then disappears as soon as the wireframes are handed over to the design team.

If an IA is doing his or her job well they will make sure they are at the centre of the project

I have worked on projects where both ways of working have been the norm. I think if an IA is doing his or her job well they will make sure they are at the centre of the project. But to do this takes a certain amount of confidence. We have to prove our worth within a team, and this often takes time.

The plain fact is that many web teams have been producing pretty good websites without information architects for many years, and will continue to do so unless we show we can add value.

But information architects are being hired. They seem to be in great demand to me – although there are relatively few roles in total (compared to say, designers) there are even fewer practitioners. So there are people who see value in our role. It’s more about shaping that role once we’re in the door and proving value in our interactions with all members of the team.

When faced with project managers or art directors who believe the ‘thanks for the wireframes, bye-bye’ approach, I think all we can do is try and offer insightful opinion when appropriate and mention that we’d like to be involved throughout the process.

I still believe fundamentally in the integrity of information architecture as a unique role

I still believe fundamentally in the integrity of information architecture as a unique role. We have skills that cross the traditional creative/technical boundaries, and while we are not specialists in these areas we can offer a degree of planning, consideration and communication that produces genuine savings in time and increase in quality of outcome.

This note would not be complete without mentioning Jesse James Garrett’s 9 pillars of successful web teams. His beautifully simple diagram and accompanying essay show information architecture (labelled as ‘abstract design’) as the central ‘pillar’ of a web team, touching every role within the team and providing links between strategy and tactics, and design and technology. Garrett is an IA himself, so he is naturally inclined to argue that IAs are central to any web project – but I agree, and it’s what initially attracted me to the role.

So if team members don’t initially see the value I (as an IA) can add to a project, then I see it as my responsibility to prove my worth to the extent that they seek out my opinion on key issues – and in the end produce a better product as a result. This may take time, but it’s about evolving the notion of a web team and making our own small contributions to the progression and acceptance of our role.

June 19, 2008

First impressions of Axure software

Filed under: Information Architecture,Interface design,Technology — Chris @ 5:55 pm

I’ve spent the afternoon installing and reading about Axure web prototyping software. It takes Visio functionality to the next level, by adding the ability to define and output complex interactivity and AJAX-style controls.

Axure takes Visio functionality to the next level by adding the ability to define and output complex interactivity and AJAX-style controls

You work in an interface that is similar to Visio’s – but you can definitely tell that the software is specifically designed for web prototyping. Whereas Visio is a planning and diagramming software that allows you to do architectural layouts etc., Axure is built from the ground up to enable you to plan web sites in an engaging and accurate way.

This offers an intriguing possibility for me – that of creating interactive mockups of web sites as a part of my IA. I’ve always worked by producing flat, 2D documents that describe the interactivity that should occur with descriptions and a variety of page layouts. I have become extremely fast with Visio over the last couple of years and am quite used to communicating ideas for interactive systems in 2D media.

But Axure really looks like it could be the good IA software I’ve been waiting for. More updates to follow.

June 16, 2008

Good books

Filed under: Books,Information Architecture,Interface design — Chris @ 11:06 am

Two books that have changed the way I look at design.

The design of everyday things

By Don Norman

This has to come first in my book recommendations because for me it is an absolutely seminal work. It will totally change the way you look at the world and how it is designed.

The burden of responsibility moves from the supposedly ‘stupid’ user who can’t understand something to the designer, whose job it is to ensure people can understand how something works from its form

You will start to look at products you can’t use easily or don’t understand and wonder why that is the case. The burden of responsibility moves from the supposedly ‘stupid’ user who can’t understand something to the designer, whose job it is to ensure people can understand how something works from its form.

With practical, fascinating examples of good and bad design from everyday life, Norman reveals the key points in the way users’ minds work when evaluating a product: what it does and how to make it work.

From the set of double-doors that are so confusing someone got trapped in between them, to the fridge that is nigh impossible to program, Norman identifies key weaknesses in these products and opens your mind to simple ways we can make life easier as designers.

Although this book does not deal specifically with digital products, the ideas and concepts apply universally to all types of design. Read it. It will change your life.

Buy the design of everyday things on Amazon UK »

Don’t make me think

By Steve Krug

The genius of this book is its simplicity. Designed to be read in a few hours, Krug’s irreverent style is engaging and entertaining. He makes so many great points this is likely to be word-for-word the best book of its kind.

The genius of this book is its simplicity. Designed to be read in a few hours, Krug’s irreverent style is engaging and entertaining

Using a very visual combination of text, cartoon-style drawings, thought-bubbles and the like, Don’t make me think is a whirlwind tour of key online usability advice. Simple things such as creating a clear visual hierarchy on a web page, and making a tab actually look like it contains the content it should, will form the foundations of all web design, IA and graphic design decisions you make in the future.

Another key theme of the book is that usability testing, per se, should not be ‘big, expensive and rare’ but rather ‘quick, cheap and often’. With the rise of usability testing as big business these days, managers are often put off performing testing due to cost or time inplications.

But it doesn’t need to be this way – ‘little and often’ testing is more useful but rarely takes place. This is certainly borne out by my own experience. People think ‘we need to spend a lot of money to get expert usability testing’, but Krug maintains art directors and IAs can do their own testing with excellent value-for-money results.

Buy don’t make me think on Amazon UK »

June 12, 2008

Yes/no questions: dropdown, radio buttons or checkbox?

Filed under: Information Architecture,Interface design — Chris @ 3:09 pm

Today I came across a dropdown menu in a web form for a yes/no question, and it didn’t sit well with me. Far too much for the user to think about when making their choice.

To enable the user to express a preference in this way you could use:

  • Radio buttons
  • A checkbox
  • A dropdown menu

After googling around I found this interesting discussion and poll on the Isocra consulting blog.

I’d definitely go for radio buttons every time. The priority has to be ease of understanding and speed of cognition for the user.

I’d definitely go for radio buttons every time. The priority has to be ease of understanding and speed of cognition for the user

Nielsen has written that users dislike dropdown menus in general, and I’m inclined to agree – particularly in this case. The user has to consider what the box is asking them, note the ‘please select’ instruction, then [click], consider the options, make a decision, then [click].

A checkbox is technically the correct choice of interface element (it was designed to allow the user to select ‘yes’ or ‘no’ to something). But the supporting copy must be worded perfectly to make it clear to the user what they have selected. Confusing labels are increasingly common in this area, for example “Check this box if you DO NOT want to receive email updates”. So you’re making a positive selection when you’re actually saying ‘no’ to something. Hmm.

So I’d go for radio buttons because:

  • The user can quickly scan both the question and possible answers in one go
  • It is immediately obvious to them that they have 2 options, ‘yes’ or ‘no’
  • They only have to click once to make their simple choice
  • The user is forced to make a choice one way or the other (if neither radio button are initially selected)

Powered by WordPress