New Blog: Official Transition

I've moved to WordPress and the new blog is at www.smorgasbord-design.co.uk the feed is at: http://smorgasborddesign.wordpress.com/feed/ and the FeedBurner version is http://feeds.feedburner.com/ smorgasborddesign

Buyers aren't always users

At The Company we've just been introduced to a new expenses system. This system for raising personal and business expenses has been deployed to replace the ageing paper-orientated process that existed before it. The old system necessitated the completion of an Excel sheet which was then printed, receipts attached and sent to Accounts Payable. The problem was that these were invariably untraceable. However, as an end user-experience it was pretty straightforward: use the most up-to-date template, complete, print, sign and send.

The new version is horrendous. This clunky piece of enterprise software (HRMS) sits on a preexisting bit of Oracle kit which manages a host of HR operations. Everything from logging an absence to checking your payslip and updating emergency contacts. For reasons of confidentiality I can't show you screens sadly but suffice to say it is a complete dog's dinner with some of the worst usability I have ever encountered. What's more, the launch of the new expenses system was preceded by a compulsory Flash-based training program. What's that old adage "if it needs instructions, it doesn't work" ?

I'm not denying that the old system needed reform to ensure service levels, audit and security were improved but at the expense of the end user?

What this exposed was the general piss-poor quality of enterprise solutions. Jason at 37signals' blog, Signal vs. Noise, posted a timely article today based on Khoi Vinh's Subtraction piece which highlights and tries to explain some of the failures of the expensive solutions. Essentially the suggestion is that it's not the end-users that are specifying, buying or deploying this junk, it's aspirational senior management who have been persuaded by a round of golf, a night at Spearmint Rhino and a good price to buy what's on offer.

I really wish you, and the people that buy this stuff, could actually see the end result. In a tight, cost and efficiency environment where every member of staff needs to behave as if the business was their own it would do these buyers good to understand the value of their purchase; As Jason so succinctly puts it: "There’s no camouflaging value when the buyer is the user".

(Oh, and we're forced to use Lotus Notes too, but don't get me started on that.)

The Pervasiveness of the Web

Interface orientated blog Functioning Form have used a recent NY Times article to highlight a seep of web-orientated design onto traditional media. Observing rolling news channels and interactive TV offerings certainly shows a similarity with web layout. And not neccessarily for the better. Do we, for example, really benefit from ticking news items below the moving image? Well possibly we do but once you start adding weather data, traffic reports, time and date information, the channel and show identities and possibly a picture-in-picture you have really crowded the real estate.

Where these screens work are in silent environments. The gym, a foyer or reception or at a transport terminus (Liverpool Street sation, London pictured) where sound is muted. Then the moving image becomes semi redundant and the surrounding data (clutter) becomes the focus.

By contrast, the traditional viewer who is able to hear the sound is increasingly distracted, particularly if the story is cognitively challenging. Part of the explanation here may be due to the evolutionary psychology and the way we perceive the visual field. Our high resolution focus is limited to small cone (foveal vision) - items on the periphery (rod cells) of our vision are in low resolution and ignored until they move. Useful for spotting a predator sneaking up on you when you're focusssed elsewhere, also particularly distracting if a peripheral banner ad is blinking on a website or if a news ticker is scrolling on a TV screen. This triage of information is something we should respect, not attempt to interrupt for attention*.

Anyway, back to the main point. High-contrast visual displays and interactive TV programming is apeing the web. Even newspapers are starting to look more web like as online newspapers become less print-like. The trouble is, some of the bad interface stuff is making its way onto this old media.

* - caveat: I realise that distant high-contrast displays like those at train stations are sufficiently far from us so as not to be as profoundly affected by the strength-weakness of foveal and peripheral vision as you might a TV or TFT screen, indulge me.

Unwrapping Apple's Packaging Moments of Truth

Regular readers (if there are any left after this ridiculous hiatus) will know that despite my vocational specialism in web user experience, my desire to comment on an array of customer experience issues is a recurring theme of this blog. Something which I have never touched upon until now is packaging design.

Inspired by a Design Critique podcast I wanted readers to consider the experience of owning rather than consuming a product. More often than not User Experience Architects (UEAs) like me will pour insight and design into the choosing and purchasing of a product or service. We sometimes refer to these as ‘moments of truth’. Experience design shouldn’t stop there though, because the experience itself doesn’t.

In the podcast they discuss the packaging of an iPod (the 1st generation Nano as it happens) which I also own. Where this resonates with me is the fact that I didn’t purchase this product, it was a Christmas gift and as such I didn’t have the purchase experience; my first interaction with the product was to unwrap the box. At this point I’ll skip to the end; the box for my Nano sits proudly on my shelf. I haven’t retained the box for some perfunctory purpose to store the Nano again when I come to move house. I don’t keep it so that I can put the Nano away every night either. I keep it because, in itself, it’s a beautiful little piece of design that is worthy of display.

That morning when I received the gift I remember distinctly being impressed with the occasion of opening the packing. The box opens like a book, or perhaps a limited edition CD, the iPod was recessed into the box and encased in a cellophane wrapper so I could see it clearly and see its virginal newness. The tape that stuck the cellophane wrappers down was printed in an established Apple typeface, the whole package (and I use the word literally and metaphorically) was an example of minimalism and lean design. It almost seemed a shame to ruin it by actually getting the iPod out. However, once having done so it remained intact and thus it remains on my shelf.

And I’m not the only one who was impressed. All over the web you’ll find blog posts, flickr photosets and suchlike documenting the arrival and unpacking of their iPods and other Apple consumables. Apple are thinking experientially about ownership, about the loyalty that owning one of their items creates. Hence why so many of their consumers are brand advocates. This is a wonderful example of marketing extending into ownership to create or strengthen a positive opinion of the brand.

Maybe this is not by design, but by accident. Maybe it’s the result of over-design; a marketing and design team that just don’t know when to stop? Who knows how much this packaging actually costs Apple. Is it the most cost-efficient packaging? Does it protect the item better than the usual bubble wrap and polystyrene? Is it environmentally ethical? To answer some of those questions we might well look at the 2nd generation Nano. This came packaged in a polycarbonate case, reducing the overall size of the box but retaining two core factors – clarity (the item was visible and did not require a cover photo - the item’s form factor was immediately obvious) and secondly, durability (the Nano was safely surrounded by shatterproof plastic). I can’t comment on the environmental aspects sadly but I’m sure Apple’s site has the answers.

Now this may seem a bit vacuous, after all we’re talking about the box for an MP3 player, but perhaps the type of device actually goes some way to explaining the effort Apple have gone to. Would you keep the packaging of, say, a new razor, if it was stylishly designed? Almost certainly not. Your MP3 player is not just a device to be used to perform a needed function, it is more personal than that. It reflects your style and your taste, it’s a personal accessory, a luxury item, a nice-to-have. Of course size helps here too – your new 50” Plasma might say similar things about your success and style but it’s a bit more impractical to store the box for that on the shelf. We need to look at items that compare in terms of cost, size and personal association, and for items that are similar we nevertheless find a dearth in experiential packaging.

I find it’s always worth putting a comparison alongside to illustrate the point even more clearly. Consider an alternative packaging style for consumer electronics, the clamshell. These hugely frustrating ultra-sonically sealed packages have no clear opening and require the consumer to cut them open. These are borne out of a fear from the manufacturer that their item, a highly portable and valuable product, will be divorced from its packaging and stolen. Their products are less popular and compelling than the iPod, Apple can afford to solve the theft problem not by introducing a clamshell but by ensuring customers have to ask for their product, they’re generally not left out on the shelf. Asking for the product only adds to the sense of luxury and exclusivity. Once again Apple have solved a problem in a way that enhances the user experience.

It’s certainly worth taking the time to listen to the (albeit lengthy) podcast over at Design Critique where Tim unravels these kinds of issues in some detail. The podcast discusses a fascinating paradigm of allowing non-dextrous patients (i.e. the arthritic) access to their medication whilst preventing the same medication from being accessed by highly-dextrous children. This problem and its leftfield solution is one which would prove to be a great interview question for aspiring UEAs

Documenting the user interface

I recently spent an hour explaining to a potential colleague what it was that our team do. I’ve discussed this recently partly in reference to a recent Design Critique podcast but, as this particular person is closer to our business, it was possible for me to dispense with the coffee shop analogy.

Instead I chose to trawl through some of the documentation I produce. Since taking Dan Brown’s tutorial at User Experience 2006 and reading his excellent book I’ve become a bit of a documentation junkie to the point where the documentation is clearly overkill for certain smaller jobs. So I thought I’d take the opportunity to show off some of the styles and approaches I’ve adopted.

I tend to start with personas, which, as any number of user-experience articles will tell you, are a foundation stone for understanding how users interact with a system. This involves defining a group of users (generally from research data), building demographic profiles, and understanding their needs and motivations before sketching out the scenarios in which they might find themselves. I present each of these in a summary page and detail page . I am not a huge fan of using photographs to illustrate personas as I think the audience dwell on any physical appearance, so I have borrowed from Loz Gray’s work and introduced iconographic representations. These have the added benefit of being race-neutral and re-usable for various ages.

Having produced these, the next step in the process is to define a sitemap. The sitemap, such as it is, has a limited lifespan. In the next few years I doubt we will see many produced as the web moves away from individually coded static pages. Sitemaps do a great job of representing hierarchy, taxonomy and the long-view of how things fit together but they don’t really give us much insight into how, for example, a complex dynamic service application or something like Google Maps works. More and more I find myself representing stacks of pages in a sitemap rather than individually referenced HTML documents.

That said, in the absence of producing something more ambiguous, like a conceptual model, they are churned out continuously here at The Company. If I am honest, they are welcome relief for me as I am not a great fan of the chore of creating personas and prefer moving around boxes and arrows. I think this can be seen in the detail of my recent sitemaps, which present a considerable amount of information to the build team, the content developers, and the information architects.

For example, this blow-up detail shows the relationship between pages (connecting lines), their hierarchy (top down), their category (blue background), whether they have had content produced (green circle), where they are hosted (colour of title), their reference number (top left of box) their wireframe type (top right of box) and, of course, their title (centre). In other pages, not shown in this detail, I have used the bottom left corner to indicate whether there is any embedded video on the page.

Granted a sitemap like this has gone through much iteration as the project moves through the design phase toward build (hence there are references to wireframes and content) but to me it shows the level of detail to which one can go whilst maintaining an accessible document. The classic example of which is C. J. Minard's seminal diagramatic map "Napoleon's March to Moscow".

From the early sitemap we can walk the personas and their scenarios through the screens and map their journey. Interchangeably known as user-journeys, task flows, page flows or scenarios, these documents demonstrate how well your information architecture (as seen in the sitemap) works. Again, I borrow here from Loz Gray and use an isometric style that I think promotes a clear view of the journey the user takes. Flat 3D boxes and arrows don’t really inspire or compel stakeholders, if you put up a nice diagram like this it becomes easier for your audience to visualise the journey and the sense of the user being ‘presented’ with screens. I have used this approach for the last five months across static and active sites, allowing clients to visualise everything from amending personal details to clicking through a knowledge store or finding help. With the shape set now firmly embedded in my Visio toolbox I can drag and drop shapes leading left and right, different arrow forms to represent strong, weak and conditional paths, decision points (an isometric diamond is a difficult thing to draw indeed), error points and just about anything the sitemap can show.

In several instances, the barriers between processes have jumped out at me when presenting them in this format. Missing links suddenly seem even more obvious, lengthy diversions and crowded critical paths are quickly spotted and revised.

The final step in my documentation journey is the wireframe. Having experimented recently with the low-fidelity ‘page description diagram’ approach – which to me is like describing the front page of The Times when a blurred photocopy would have been more effective – I have resolved to stick to medium-high fidelity wireframes. In part this is because I’ve always liked the creative construction side of wireframing. I’d feel cheated having gone to great lengths in describing personas, the sitemap and the journey the user takes only to be produce an ambiguous written description of a screen. A well considered wireframe still leaves the designers with more than a colouring-in job. The designers can add visual prominence, alter sizing and positioning and consider complimentary form and colour. What I feel the information architect’s job is to do is to say ‘here’s how the page should function, this is where they should look for x, this is where they will find y and these are the relative levels of prominence’. It is less prescriptive than the building architect’s blueprint but considerably less ambiguous than saying “the room in this house should have three windows, two electricity points, a wooden floor and four brick walls”. So, my wireframes show text placeholders, pseudo-latin text, layout, order, scale, complexity and also contain build or dynamic element-related annotation.

I’m pedantic and fastidious about version control and document referencing. All my documents are peppered with notes about page and document versions, titles, page references, disclaimers (“Wireframes do not represent the final design…”), client names, contact details and relevant key/legends. It is crucial when so much documentation is floating around that we have a clear view of what it does, who did it, for whom and when.

I hope this has been an interesting read, please do get in touch (john at smorgasbord dash design dot co dot uk or in the comments) if you’ve got examples of documents you produce or alternative approaches to this kind of stuff.

Information Architecting The Coffee Shop

As a user experience architect I often get asked what it is exactly that I do. A learned friend once explained to me that if you can’t explain your job to your mum then there’s something wrong. I never understood whether this meant there was something wrong with my mum, my job per se or just the title but either way it’s time to address that very issue.

I think I feel that my job is more of a re-labelled Information Architecture (IA) role than anything else but that’s even more ambiguous. Plenty of people have tried to define IA, notably Rosenfeld & Morville (“Information Architecture for the World Wide Web”), Wikipedia and recently, Tim, Tom and Chris Farnum. Having recently discovered Indexed I’m in a bit of a ven diagram mood so I’ll borrow from that and the Design Critique podcast to visualise IA as follows (left). I think this encapsulates what we as IAs try and do, to balance the three (oft-competing) requirements of users, the business and the content we have to organise.

You’ll notice that this definition isn’t tied explicitly to the web. It’s a model that covers all kinds of information interaction and whilst I could sit here on a blustery January day and bang on about web-based IA I think it’s time to talk coffee. It’s quite a good analogy I think for real-world IA, where non-web people can get a feel for what practitioners like myself do.

I occassionaly find myself in need of a new place to go for lunch or for coffee. In Norwich this isn’t easy to do, it’s fair to say I’ve tried most of the sandwich bars and decent coffee shops and what strikes me in the same way it does in towns up and down the country, is the organisation and presentation of the menu board. In London these places tend to be quite busy at lunch with a healthy queue in most places giving you plenty of time to look up and read the menu while you wait. In Norwich there’s not so much time, you’re asked for your order within a minute of entering the shop and if you’re new to the place that’s not enough time. Part of the problem is the bewildering array of choice. Lame stand-ups (and my Dad) regularly joke about the ‘I just want a coffee’ situation when walking into a Starbucks but, coffee aside, sandwich shops like O’Briens have a range of sandwiches, toasties, panninis, ciabattas countless hot and cold fillings, salads and soups. I like variety in my life (!) so I want to try something different and will scan the menu boards looking for combinations, unusual fillings, relishes and breads. This takes time and it’s not helped by poor information architecture.

If I was re-designing a menu board to improve customer journeys in a sandwich shop or coffee bar this is what I’d do:

:: Prioritise. Order the most commonly requested drinks/sandwiches in a section of perhaps 10 items on the far left of the board. Most people scan left-to right and would hit this section first. I would use till data to define the top requested items and order them accordingly. The only risk here is that this is self perpetuating, new people come in an order the same things everyone else does but the trade off is that they’re likely to come back and their natural boredom threshold will encourage them to explore other options later, particularly if the alternatives are promoted successfully…

:: Structure. Group similar items, all the hot food items in one group, cold in another. Then sub-divide, meats, fish, vegetarian. In each subcategory, order these by price, most expensive to least. If there’s a consistent pricing structure, promote it: e.g. bacon and cheese sandwich £2.50, toasted £2.90, think customer journey. People come in and decide first what type they want: sandwich (brown, white, granary), baguette, panini, soup or ciabatta (olive, sundried tomato) first. Then how they want it: hot, toasted, plain then filling. The menu should reflect that from left to right.

:: Display. Use a clear and consistent typeface. Have bold headings, use colour sparingly and intelligently (‘Hot Food’ in red for example), don’t add illustrations. Most people know what a cup of coffee looks like, or what a baguette is. Position the board high and use as much space for it as possible. If your bar has two entrances or queues, have two boards. Consider having a second smaller version close to the till. All too often brand typefaces are used that are fine for the shop logo, napkins or coffee cups but don’t read well from 5m away and 3m below. Use space, less is more. Listing every possible combination is pointless, especially if all your fillings are displayed individually, make it clear they can build their own and promote a few suggestions.

Change it. Be prepared to change the board regularly. When you stop selling lines or start selling new ones, adding them with stickers, hand written notes or another board breaks the structure. It’s like a library getting a new book and sticking it on the end of the shelf. It might get found but it’s more likely to be if it’s categorised and filed appropriately. Be prepared to listen to customers and analyse their habits. Are people saying and buying the same things, can they find your new caramel frappuccino or is it that they just don’t want one? Do you only seem to sell salads to vegetarians, do people know they can have their soup in an oversized takeaway cup?

Ok, so I don’t work in the restaurant trade but to me, that’s a good thing. As a customer I know about the problems I have and as an IA I know of some of the ways these can be solved. I’d love to know if Starbucks uses IAs to define its menu boards before the designers are let loose with their crayons and I’d bet that two thirds of small-town sandwich bars write their menu boards by consulting a long list of what they plan to sell.

Take a look at my very quick sketch of how a well organised menu could be set out. I hope this helps to bring IA alive for some people, feel free to feedback either by commenting on this post or emailing me … john at smorgasbord hyphen design dot co dot uk ... P.S. No more posts about coffee, promise.

UPDATE 3 Feb 07: The guys at Adaptive Path have posted about trying to explain what user experience architects do using a few options. Worth a read...

Supporting Common Pathways And Increasing Simplicity Through Disclosure

Progressive disclosure is a nice term don’t you think? Seems kinda academic when you first read it and then it rather becomes clear, progressively disclosing itself, metaphorically revealing the meaning within. I love it.

Anyway, in UE it refers to the way in which we hide features and functions that are not required, revealing them as the user’s journey progresses. Jakob uses the analogy of the print dialogue box. Going to ‘print’ reveals a stripped down dialogue; page size, orientation, copies. If the user wants more, they click ‘options’ or ‘advanced’ and are shown zoom options, colour settings, resolution, duplex etc. etc.

Stretching the analogy further, we could consider the tree menu system to work as a progressive disclosure. We could think about other examples all over the place on the web. How about the checkout process when you can click to change the delivery or invoice address (and so receive a detailed dialogue) or you can continue to dispatch if the settings are as you wish.

So progressive disclosure is a way of describing simplicity to support the most common pathways. At The Company we try and get masses of this stuff into our online applications. Dynamic layers that open up additional areas of transactional forms when users require a non-standard interactions. We understand that almost everyone is a special case, there are no ‘standard’ customers (and as such we don’t do personas for standard customers). We restrict interactions to the most common operators and offer a second or third set of options on request.

There is a school of argument of course that this prevents people from ever finding these ‘power tools’ but this just smacks of poor design. Make it obvious that there is more you can do and people will naturally explore. Particularly if the first set does not meet their goal. If these request points become decision points (E.g. “have I done all I needed to do”) within the task flow, then that will inform the solution you design. A solution which will ultimately be task focussed and with clear expectations of effect of the user’s action. A notable failure to perform correct user research into an implementation like this can be seen in Word's hidden menus (aside: how to disable hidden menus in Word etc.).

Progressive disclosure has another benefit: perceived hierarchy. By placing the most common activities on the initial part of the process, you are making an implicit statement about its importance; it enables them to prioritise their interaction. This prioritisation solves much of the problem above regarding the perception that the interaction only has a small set of features.

So, to get this right we have had to make some significant decisions: what is first-tier disclosure and what is second-tier? How many options should go into the first tier? (think of only a few … and then remove some), How can we make this initial feature set simple? How shall we reveal and direct users to the second tier?

Well we are solving these problems daily through some obvious UE techniques: Research – we know what our customers do on our site through metrics and qualitative usability testing. We use hierarchical design techniques, card sorting, site mapping and task-flow design to understand what takes priority. We also understand when a linear process might work better, where all features are provided by in a staged disclosure. The trick, as Jakob affirms, is to fit the design to purpose. Is there benefit in progressive or staged disclosure for a given task with a given user group.

Reading this far you will probably have a better idea than you did before.

Visual Guides for Tube Tourists

Two posts today, though I’m separating them so that their headers stand out as separate articles … gotta think SEO …

First is a bit of a cop out. A guy at The Company writes an intranet blog with a central tenet of inspiring great customer service. He’s a bit braver than I, often approaching people in restaurants, shops and the street to interrogate them when they’ve been part of a great customer experience or solution to one of life’s problems. His eyes are always open and recently he took a trip on the London Underground (a subject I’ve mentioned in the past in relation to navigation analogies). I’ll let him take up the story (used by permission):

“…On the tube and got off at Westminster. Now I was off to meet a Customer Experience 'guru' and I had the address but as I was coming up the escalator I was thinking, 'I wonder what exit to take?'. Now, most tube stations with multiple exits have text based signs pointing to each exit. I was surprised and delighted to see the [picture left]:

You see, many tourists won't be able to read the text signs and even Brits like me can often navigate far better through pictures of “what I want to see when I surface” (when I don't know street names).

So, I asked one of the staff, 'Who thought of that, it's bloody brilliant'. And the answer, 'we had a quick team pow wow and the boss asked for ideas to make things better for customers, Trevor came up with that, was given a digital camera and went out on his lunch and took the pictures'. He then said, 'and the best thing is customers seem to like it, and us staff don't lose anywhere near as much time trying to explain directions to people who are a bit confused'. I am not embarrassed to say that I gave him a hug. He looked somewhat alarmed. I asked for Trevor but it wasn't his shift so I wrote a note of thanks and congratulations (ironically on a complaint form as it was all that could be found).

So, anyhow, be a 'Trevor' today. Look at things from your customers eyes - have a pow wow and just do it!”

Cool huh? Ironically the London Tube map was actually designed by Harry Beck in the expectation that users didn’t need it to accurately reflect geography and scale as being under ground meant there were no landmark reference points. Many stations, along with highlighting the colour and having a unique design scheme (e.g. tiling at Tottenham Court Road) feature imagery of nearby attractions in their decoration however it is when exiting the tube that features such as photographs of what’s available at each exit are crucial.

But even more, the point of this piece is to illustrate how great ideas only take a little prompting and really loads of people ‘think customer’ regularly. This idea might have arisen with a staff suggestion box scheme but I reckon it probably would not. Trevor wouldn’t have got round to it, he’d have had second thoughts – thinking it was frivolous. However, a quick pow-wow and boom! Idea’s out there, acted upon and getting men in suits all excited at the same time as expediting the passage of tourists around the World’s greatest capital.

Epilogue: Can anyone else think of any Tube stops that feature imagery of tourist attractions that are in close proximity to the station. For example, somewhere in the tile mosaic, wall designs or in the exit/ticket hall? The most obvious ones are Bank, St. Pauls (before rennovation), Baker St. and, to some extent, Victoria...

Welcome to 2007, Person of the Year, and welcome back monster workloads.

What with freelance work and two major projects at The Company I am royally snowed-under en ce moment so apologies for the lack of posts. I've had plenty of thoughts and continue to archive random print outs with the intention of posting later. The situation should ease toward the end of January and, unlike the Ashes, I shall return.

With best wishes to you, the user (person of the year) and I'll see you on the other side.

Christmas presents obtained: stuff from Reiss, T M Lewin, White Stuff, Oliver Sweeney shoes a Garmin nüvi 300 if you're interested.

Oh, and finally, I'm listening to Unni Wilhelmsen (left) at the moment, absolutely stunning (and available on iTunes in the UK, look for the album Til Meg)

Legal Websites Failing To Make The Grade

Got passed a link to a page on legal gossip site rollonfriday (ROF) today which exposes some dreadful websites. Firstly, the incomprehensibly bad Fletcher Lewis site. Explore the solicitor profiles by clicking the three chaps' faces (Jason, Jeffery and Matthew) ... worryingly this site makes use of sound ...

Though that was bad, it's so bad that it's quirky. What's worse is when you see a site like Turner Parkinson who have clearly seen the involvement of an agency and the end result is a fish-orientated theme with, as ROF puts it, "end of the pier caricatures" on the lawyer profile pages. The ALT text on the menu says "booLawyers", "booTP" and so on ... and their Terms and Conditions page asserts "Before entering our Website you should read carefully these terms and conditions," despite this being on a page accessed in site-furniture rather than on a gateway. At least Surrey-based solicitors Buglear Bate scatter their clumsy offering with no little sarcasm.

finally, just to prove they can get it right some times, Wragge & Co. seems, on the surface of it, to be quite effective. I just don't like the grey on white text contrast.

“We wanted no ghost to tell us that”: Acknowledging Our Expertise In Information Architecture.

We’re moving offices at The Company this week and consequently I’ve unearthed some dusty print outs of articles I meant to read. Some of these will end up in blog items in the next week or so and the first to prick my conscience has been a 2002 piece by Jesse James Garret. It was written at a time when jobs were being cut left, right and centre as the ‘new media’ industry euphemistically ‘consolidated’ itself.

With this in mind, it is quite an introspective and defensive critique of the purity of information architecture (IA), seeking to justify the role’s existence. What Jesse James Garret astutely points out is the tendency to justify every decision we make as being supported by user research and testable to within an inch of its life. Personally, I have dwelt on this as someone with a rigorous empirical background in psychology where, if it was not testable it was not truly meaningful. Taking a 'step back' (one for you, Matt) it is worth considering the role of a print editor. When they make decisions on layout, content and indeed the customer journey through their product, they are not doing this based on eight people in a room telling them what they think. They are using their insight, experience and gut reactions. They are doing what they are paid to do – to make tough strategic decisions about what they think is the right way of doing things without having the safety net of user-research to fall upon.

I wish I made more decisions like this. I wish I was able to be more bold and say, “you know what, this interaction should look like this because my years of experience tell me it should”. Too often, perhaps, we sit and listen to customers tell us exhaustively what they want and then agonise about what they meant. To go back to the wants and needs argument that Marc McNeill so effectively summarised recently, how many people would have sat in a focus group three years ago and said they would need to upload video and share it with the world? Not many, but then came YouTube … likewise, who would have thought kids would want to be creating web pages, writing daily blogs and sharing their lives with the world on an unprecedented scale? Not a huge amount but then came MySpace.

Now, I’m not saying that IAs would have foreseen YouTube or MySpace ahead of their users – if we all had that foresight IAs would be being paid a lot more – but it does demonstrate that user-research doesn’t provide all the answers.

If we dwell on making the most usable sites as defined as the sites that pass the user test then we become no better than the teacher who schools their pupils in just enough to pass the exam. The exam in this example is no more reflective of the challenges of life than the user test is reflective of the continued experience of a website by thousands upon thousands or users. The trouble is, testing and metrics deal largely with the quantifiable elements of experience, time taken, click volumes, conversion. Unfortunately these are the predominant currency of business and unless you present such information higher up the chain your credibility is called in to question.

To return to the publishing editor analogy, the editor is top of the tree. Their decision is respected not just because of the experienced opinion but because in the hierarchy there are few people above them. Information Architects on the other hand sit lower down, we don’t have that power and all too often we find our work being passed up the chain, interpreted, interrogated and ultimately ignored as the wishful thinking of an idealist. Peppering a report or proposition with research is our way of protecting our ideas, wrapping them in cotton wool to survive the journey to the senior manager’s desk.

At the end of this journey what lands on the manager’s desk is a collection of research quotes and some proposed designs. What is missing is the insight, the explanation of how we leapt from someone saying they wanted to be able to change their address to a panel in a wireframe with ‘change my address’ on it.

Fortunately the assertion by Jesse James that IA as a distinct role would fade away have not proved correct and in many organisations there exist a team of such professionals. Granted, we have had to broaden our horizons and think about technology and business at the same time but, at our core, we can still be information architects.

Nevertheless the advice still holds true. We should trust our abilities more and occasionally eschew the temptation to commission research at every turn to support our work. We must be prepared to act on hunches and still show our working. Explain and annotate why we have made these decisions but not be afraid to say it was our personal decision and not the decision of 83% of survey respondents. These hunches and gut reactions allow us to work and react faster. Take AJAX for example – we have not had the time to test and research this stuff adequately but we are under immense pressure to deploy it sooner rather than later for the UE and technological benefits. We should be brave enough to generate great interfaces using AJAX implementations based on our experience and get this stuff out there without waiting for XYZ Ltd to fling something out and observing how they get on.

In time, I hope senior management will begin to trust these hunches and – when augmented by the right amount of research – will begin to believe the value of the small collection of experts in their web teams. I’ll paraphrase for my final thoughts: Research data and formal methodologies do not guarantee better architecture. Better architects guarantee better architecture.

The Excel 2007 User Experience

Finally got round to reviewing a blog post from MSDN about the User Experience design supporting Excel 2007. Of course this is all related to my recent exposure to the Microsoft UE process but I’m very interested in this post as it interrogates the charting functionality of Excel.

I have always hated the generic purples, blues and greys of Excel charts that adorn the lazy man’s presentation, pin board or meeting notes. Ignoring the power of colour in visual communication (<- excellent blog link) and the need to engage their audience, many users of the ubiquitous spreadsheet simply deployed the wizard to create a generic chart. In this regard Microsoft approached the problem with the end-users’ problem in mind: how do I create a good looking and meaningful chart? When I create charts in Excel I take a (probably excessively) long time over the style and colour to ensure it’s clear and compelling. More often than not, I’ll begin my charting process by sketching out what I want to see before tracking back to the data to work out how I need to tell the Wizard to work. I consider myself and experienced (but not expert) user of Excel but it’s clearly the users without the time and experience who pump out the sort of drab chart output I described above. So the process needs to work for power users and novices. Sometimes the best charts are mutli-type or multi-dimensional. So, for example, you use bars with lines on two axes and maybe some colouring to demonstrate some other variable. Working out this kind of stuff the first time you hit the ‘make a chart’ functionality has previously been impossible. One of the great featurettes of photo editing software has been the preview functionality of applying changes. Adding this sort of creative sandbox to the charting process enables users to tinker and play with their chart in the wizard environment without getting to the end and committing themselves to the wrong design, only to have to re-launch the wizard to amend it.

The end result for customers has been a template heavy solution that suits beginners and non-creative types but where the design crumbles is its lack of support for power users. As one commenter puts it, the support for people working with complex data has made way for “fluff to make column charts with gradient colours”. Whilst Microsoft have to cater for the large number of business users that just need to present some simple data, the fact of the matter is the tool is powerful enough to be used to analyze far more complex data sets and by ignoring these users they seem to have missed a trick. However, one final ray of light, in responding to these comments it appears Microsoft continue to listen and, where possible, they’ll begin to introduce such functionality in later releases. Too bad their UCD wasn’t quite representative enough.

Do Users Want, Need or Desire A Startup Sound?

Couple of quick ‘hmm that’s interesting’ links. Firstly, related to my Vista post the other day, here’s a short NPR piece on the new Vista startup sound. They only get to the nub of the matter towards the end of this clip so I’d be really interested in other people’s opinions on auditory feedback in interfaces. It’s not something Tjeerd mentioned last week but it’s clearly something Apple take seriously too …

Secondly, I’m always a fan of Marc McNeill’s posts over at Dancing Mango (etymology of the title?) so was delighted to read the ‘needs vs. wants’ item last week. Coming as it did on the back of Dan’s UX2006 session which had already got me thinking more profoundly about personas, this post is a good reminder about interrogating user motivation. Some of the comments it has received are a little rambling but worth reviewing all the same.

PhotoSynth and Vista. A Leap forward in User Experience?

A lot of good stuff coming out of Microsoft recently. The presentation by Tjeerd at UX 2006 showed some lovely attention to detail for GUI design in Vista (even if some people insist it's a Mac rip-off) and then there's this PhotoSynth stuff from the Live Labs. I blogged about the demo video in August and now there's a working demo available. Be warned, you do need at least a Gig of RAM and admin rights on your PC.

Regarding Vista, There are plenty of jerky videos of Vista on YouTube but I'd read it straight from the proverbial horse's mouth here and take a look at Tjeerd's pages here.

Not sure if PhotoSynth quite works how i'd hoped it would but I do think there's a function of how many photos have been loaded in and how fast the PC is. Several times I clicked in for a closeup and got the other side of a building instead and I'm not sure quite how the 3D dot-map should work - is is a quide to the space you're in? Is each dot a unique photo?

User Experience 2006, London, “User Experience Documentation”.

It was inevitable that I’d want to blog about my session yesterday at the NN/g ‘conference’. What is unexpected however are the amount of thought provocations that I noted down throughout the day with little ‘Blog’ tags attached to them, some of which will end up as fully-fledged posts, others of which are, on reflection, nothing more than idle guff.

I’m glad I chose not to lug a laptop into the city and thereby blog on the day, and I’m even gladder that I took the preliminary letter’s advice to wear several layers too; the room we were in at the Millennium Hotel in Gloucester Road was borderline Arctic during the morning session. Not that that seemed to bother the extraordinary amount of Scandinavians that seemed to be in attendance. I still do not know whether their predilection toward User Centred Design is the consequence of having a Scandinavian guru at the helm (Jakob) or whether it is simply one of those accidental cultural niches that seem to develop. Either way, they were there in numbers, speaking embarrassingly great English and having a justifiable confidence in their abilities. The second largest group of attendees seems to have been the BBC. Looking down the delegate list, I would suspect that half their ‘new media’ department were there in one form or another.

I was there to learn from Dan Brown. An erudite New Yorker (now resident in D.C.) with a dry wit and a decent book to promote. We were a tough crowd, not because anyone was particularly controversial but because despite his attempts to lighten to mood with references to his experiences as a proud new(ish) father something was getting lost in translation and our continental delegates seemed more keen to read ahead in their slide packs. For the record, I thought he was a solid and amusing presenter and frankly when you are dealing with a subject as potentially dour as sitemaps, flow charts and wireframes then any smattering of humour is appreciated.

Dan’s approach has been to simplify web development documentation into ten key deliverables split by ‘User Needs’, ‘Strategy’ and ‘Design’. In the session at User Experience 2006 we looked at personas (user-need), sitemaps, flow charts and wireframes (design). As always, the best way to learn is through a combination of practical exercise and demonstration of the good and the bad, with appropriate discussion around the same. Within fifteen minutes of the session starting, we were already in and creating personas. This was absolutely the right thing to do. As we picked these apart, we progressed through what must have been a cathartic therapy for Dan as he displayed a healthy portfolio of confusing diagrams, schemas and flows from his past, this was a theme persistent through the rest of the day. Dan’s honesty in showing ‘hyperdocumentation’ (by which I mean diagrams and data visualisation on a large and complex scale) from his own collection was a compelling insight to the workings of a man who’s mind he freely admits craves the release of encapsulating his thoughts on paper and on file. Many of his examples showed an exquisitely sensitive use of colour and design to convey a wide range of attributes. A document that seemed inaccessible at first was presented gradually until it made complete sense.

He was challenged repeatedly on his intentionally inconsistent approach to documents (ironically it was internal document inconsistency that prompted me to attend the session) and his response was considered: no two projects are the same; no two audiences for those documents are the same. Bear in mind at every planning stage for your work those people who will be reviewing the document, and the document’s purpose. It seemed that there is no need to slavishly follow a given set of rules (e.g. that personas must show x, y and z and that sitemaps should be formed of boxes and arrows) if the document’s purpose can be communicated effectively without doing so.

Before I attended the conference I blogged that it was expensive and that you have to pay for the privilege of learning from the experts. In Dan’s case and, at the risk of sounding sycophantic, I am glad The Company paid up because it was worth every penny.

I’ll be returning to the themes of documentation and providing examples of my own styles in the next few weeks. Tomorrow however I intend to run through some examples of User Experience tweaks in Windows Vista following Tjeerd Hoek’s plenary session demo at User Experience 2006.

Finally, quick hellos to some people I met at the session: Tero Tikkanen (Vaisala Oyj, Finland) and Nick Pleydell-Pearce (Global Beach [yikes! flash only site], UK)

:: Update with Dan's slides originally posted on slideshare which contain the examples not in our take-out packs.

Mum, today I got an A* in Information Architecture

Remember my post about kids wanting to be User Experience Architects? Well this post from Adaptive Path proves that Information Architecture is so easy* kids can do it ... and they want to :)

* - I'm joking about the easy part. It's not and it costs lots to pay people like us to do it really ... (that's a joke too, sort of)

British Web Users Search Less - But Find More

An update to my recent post about odd search behaviour, a colleague sent me a list to Jason Lee Miller's interesting article the opening paragraph reads:"Recent numbers are showing that Google is an even heavier hitter in the United Kingdom than in the United States. But it also appears that UK Internet users are conducting fewer searches, and finding what they need more often." The debate of course is whether this is a true cultural difference or one of coincidental accident.

UPDATE: 24.OCTOBER.2006

The search stuff just keeps coming. Boxes and Arrows have a great piece about search behaviours. Combine this with their notes on Quantifying the User Experience and suddenly I've got a compelling need to get inside our site's search logs ... what are people looking for and how?

The Rise of the User Experience Podcast

The rise of the user/customer experience podcast. A brief summary of current offerings with their three most recent posts…

Boagworld (not strictly a UX podcast but relevant all the same):
> Podcast 53: Ecommerce Usability (09.OCT), 52: JavaScript Libraries (02.OCT), 51: Better Google Listings (26.SEP)

UXpod (Gerry Gaffney’s regular podcast)
> Ethnography (09.OCT) World Usability Day (02.OCT) Market Research (22.SEP)

DesignCritique (Products For People, “Encouraging useful and usable design for a better customer experience”)
> World Usability Day (15.OCT) Alarm Clock Critiques (29.SEP) Wristwatch Critiques (10.SEP)

IA (Jeff Parks’ Canadian-orientated Information Architecture ‘cast)
> User Centered Design (sic) (04.OCT) Plain Language and Usability / Business Process before Technology (01.SEP) Using Metaphors / The Information Architect as Universal Translator (01.AUG)

“Ambient Signifiers” Subtle indicators to make you feel you’re on the right path

The web gives you the chance to do things that aren’t easily achievable in the physical word. It allows us to build metaphors and equivalent processes in a unique way. Take, for example, the fact that when you go to the supermarket you probably approach each aisle in the same order and generally from the same direction each time. Or, perhaps, when you go to your favourite spot on the coast in Cornwall you might take the same coastal path walk that you’ve done for years. Now, this is all fine if nothing ever changes, it becomes so familiar that you could do it without conscious navigation but what if they moved some items around on the shelves or they put a few houses along the coastal path, introduced some stiles and cut down a significant hedgerow? Though the route would be familiar it would not be implausible that you could get lost.

This happens all the time on the web. In fact, in the case of online banks, changing even the homepage style-sheet can result in hundreds of calls to a call centre to check that the site is still the same and is not a phishing cover-page.

Digital Patina
Back in 2002 when the BBC were doing a site re-design they introduced the idea of ‘digital patina’ (it may have emerged elsewhere beforehand, I’d be keen to know if it did) whereby a well-trodden path began to emerge online for return visitors. So, for example, if you regularly visited BBC Sport, the Sport section on the .co.uk homepage would darken over time. The point was not to ensure you always found the right link, your regular visits prove you had no trouble finding it, but rather it was to ambiently re-assure you that the site recognised you and was moulding to you like a well-worn pair of jeans. The BBC described it as ‘having a conversation with the user’.

In other cases this sort of subtle, unconscious cue of familiarity has a more direct role in keeping users on the right track. Underground or Metro networks the world over have to cope with both familiar and novice users completing the full spectrum of navigation paths from the short-stop to the long-haul. Over the years a host of navigation aids have been introduced: station names, coloured lines, matching carriage colours. In the case of the Tube in London the famous map takes its form from the very fact that the traditional ambient signifiers (landscape markers) do not exist underground. These are the obvious ones, but not everyone would realise that the ornate tiling at Tottenham Court road and at other parts along the network is a direct response to the need to introduce identifiable signifiers for the illiterate, which now work as effective ambient visual cues for today’s passengers. In Tokyo, the metro system is replete with unique chimes at each station, reminding the absorbed or dozing commuter that they are on the right route or perhaps providing an unfamiliar ‘wake-up call’ when they’ve over-slept or missed their stop.

Well Trodden Path & Visited Link Colours
There are two possibilities here for the web: Firstly, present some simple cookie-based JavaScript control of the CSS that identifies return visitors and applies style-sheet changes over time. Secondly, that the use of subtle, ambient cues is deployed across the site for everyone’s benefit. Taking these in turn it seems to be clear to me that the first is not widely applied, it didn’t even survive on the BBC and, as good ideas spread so rapidly on the web, I would assume that it simply doesn’t provide any benefit. The the well trodden path is retained in the users mind, much like last year’s footprints do not survive on the coastal path. It used to be the case that visited hyperlinks would be a different colour but this has declined over the years (through a natural coding evolution and the erosion of the ‘blue underlined’ hypertext convention) to such a point that users don’t expect this to happen and, from the usability tests I have seen, they don’t seem to be aware it is when it is employed. The only place where it still works effectively on a massive scale is Google, reminding you of which links you’ve tried.

Secondly, the subtle use of ambient signifiers to aide navigation is widespread on the better architectured sites. The use of relevant colour schemes (e.g. BBC channels online mirror their TV equivalents in colour and typeface), the subtle section colouring for Google, Froogle, Google Groups, Google Maps and Google Directory. But sites could go further. One cue which has developed by accident has been the use of different visual styles for secure or registered-user areas of sites. Traditionally many of these areas were built by IT departments whereas the main sites were built by marketing and creative agencies, the latter changing frequently whereas the secure/registered areas remain consistent. There is often a jump to a new window, occasionally stripped of navigation elements and so on. All of these visual cues remind customers that they’re not in Kansas anymore. Whilst there is a case for better brand alignment (particularly for reasons of consumer trust) which I and Marc at dancingmango (and here)have discussed recently, there is also a strong benefit from letting customers feel the join.

Still Logged In?
To end, two final examples. Sharing access to a PC (despite there being lots of capable hardware in the flat) means that I am forever going on to Amazon (UK), browsing around and then going to add stuff to my basket or wishlist before realising I’m logged on as my other half. Amazon are not good at making it obvious when you’re logged in. the “Welcome, John …” text is lost below the navigation tabs and I’m usually so task-focussed that the first thing I do from the homepage is search, ignoring the ‘recommended for you’ images which might have provided a first line indication that I wasn’t supposed to be there. I’d say this is a weekly usability annoyance that, even given the frequency that it occurs, as a user continues to thwart me. It genuinely surprises me that Amazon haven’t picked this up in testing. I simply don’t feel logged-in. On the flipside, the more contemporary styling of the US Amazon site instantly lets me know I’m in the wrong country without having to look for the $ signs. Finally, take a look at newsmap, a site I’ve mentioned in the past, try and work out what ambient signifiers are at work here … hint, it’s to do with recency and popularity…

The beauty of all this low-frequency stuff is that it doesn’t involve radical re-designs, adding noise to the page, icon development etc. etc. etc. It simplifies and clarifies the user experience. It makes sites feel bespoke or, in the BBC sense, as if they are having a conversation with you, but without needing to employ significant amounts of personalisation functionality.

References
:: “Ambient Signifiers, How I Learned to Stop Getting Lost and Love Tokyo Rail” – Boxes & Arrows
:: “The Glass Wall, The Home Page Redesign 2002” – Liam Delahunty
:: newsmap – data visualisation with ambient signifiers

Body off Baywatch, face off Crimewatch ... do customers prefer it to function, look good or both?

Fortunately in the blogosphere (eeugh) someone somewhere will be talking about a topic that's pertinent to your current interests. This week my regular read of Marc’s dancingmango site hit a nerve (in a good way) by talking about transactional regions (“Most retail banking web presence is just not connected”). At The Company my colleagues and I were recently debating whether transactional areas should look different from static ‘brochureware’. I think they should, or at least that it doesn't matter if they don't. In the olden days, Jakob used to say that web-based applications shouldn’t ape browser interraction. But this was before XHTML and JavaScript reached near universality and the vast majority of users expect a rich interface.

Marc’s spoken in the past about breaking free from linear form completion in a wonderful post (“Shoot the wizard! Designing a real world form”) and I support this idea of complete user control. Where I differ from him, and to return to the point, is that I believe customers appreciate a pared-down approach to look and feel on transactional sites. Yes there are legacy issues and, from our own back-end, I know these things tended to have been built by systems guys rather than web designers but the effect has been that there tends to be less distractive marketing guff (page bloat is another thing .. see below) and provided they’ve been interatively designed and user tested, things tend to work functionally.

I’ve mentioned in the past that I think the future will see us move to a more conversational web and increasingly customers will eschew sites that hark back to the days of padded table cells in favour of sites where the brand fits their expectations and aspirations - but we’re not there yet. We’re still, as consumers, focussed on speed and task efficiency and so sometimes keeping the box of crayons away from the menu board helps keep this focus. That said I am aware of situations where non-native web coders (and by that I mean teams where the day job is back-end code) have been left to develop the presentation layer and the result is bloated code, high page weight and long download times. Not to mention accessibility and cross-browser compatability issues.

In short, I don’t think we need to sweat it too much when transactional elements measurably work but don’t look great but I do think we need to worry when we separate static from transactional for cost and infrastructure reasons only to find that we’re suddenly using a top-nav where a left nav was before and the page loads would test the patience of a narcoleptic sloth. Marc cites some great examples where this disconnect has resulted in sloppy coding on transactional sites (HSBC image and First Direct image).

My final caveat is that this holds true for financial services sites and the more tedious transactional elements online. It’s pretty brand dependant; Lloyds TSB for example don’t need an exciting online banking service, they need one that’s quick, fully functional, compliant, compatible and secure. On the other hand if the Apple store was all this but visually dry and plain you’d start to feel a disconnect with the brand because, for someone like Apple, their consumer brand runs right through the entire customer lifecycle.