UXD - User eXperience Design

Blue Christmas

I took time out this Christmas season to reformat my hard drive. Yes, it seems pitiful when you work with these machines all day, and have a chance to spend quality time with loved ones how machine maintenance would top the list of things to do. However, it did give me a chance to mull over a bit of design mystery which seemed a decent enough present to share with you all. Cozy up to the fire and let me tell thee about Windows Vista.
Being a Mac user, I do have a generally favorable impression of the Redmond efforts, I have a healthy background in their CMS system Sharepoint, and felt as long as you keep up to date on their latest and greatest (read beta) releases, you can almost forgive them for not being more mac-like. So armed with my copy of parallels, I installed versions of XP and Vista, and when my hard drive went belly up I decided to keep just the Vista version. Vista has a great deal of interesting abilities. I am a big fan of the voice dictation software/interface. In a quiet room, it is almost faster than typing. I think the paradigm of the 'explorer bar' is pretty well conceived mashup of a breadcrumb menu plus drop-downs. I'm surprised not to see a web version of this, since it really does have a fairly good affordance to the user of traversing a deep directory structure.

What really bothers me about the switch is the overall 'blueness' of the interface. It's relentless, and of course being good web 2.0 citizens, they got their gradient on, so its basically blue gradients for miles. Now, giving them credit, aqua (mac os x's first scheme) had the same problem, blue gradients for days, and the extraneous grey pinstripe thing, but yet it didn't seem as gratuitous as Vista. This is coupled with the inability to 'go grey' as XP used to allow. So, by redecorating, vista has 'painted' itself into a corner, unless users are expected to select their own gradient mixes (yellow to orange, puce to purple) they are somewhat stuck with blue. Also knowing microsoft, these are just bitmaps, so no redecorating is possible without replacing a bunch of .BMP's someplace deep in the WIN32 folder.

At the same time, Apple's Leopard has removed all hints of ever styling the chrome of their windows, even the pinstripe thing is removed and has gone all grey. They have also been having some fun with drop shadows (the 'other' gradient), in early beta's, and in Steve's intro speech, they spoke of how active windows really stand out. That was because active windows had about 100 pixels of drop shadow built in - which they wisely dumped. Overall, no color seems the best choice, in a black text on grey world, it tends to de-emphasize things well enough to let the user focus on the content at hand, photos, and clickable things (hopefully blue).

So, overall, why blue? If we look to web design, its pretty much the default color. It is hard to find a site that does not use blue as a background or decorative accent. Of course it is the 'real' clickable link color, and it is the color of azure sky in deepest summer, which is not a bad thing at all. In fact, since red is out, and yellow is kind of tricky, you pretty much have blue as your only possible primary color choice. However, color wheel not withstanding, it is hard to understand why blue has so much power over our virtual lives. About.com claims it's the color most preferred by men. It is also peaceful, tranquil, and productive. It is the least appetizing color- perhaps why foodtv chose green?

Perhaps web 2.0 has brought a reaction to this overall blueness, noting ebay has gone with yellow, but there will still be a strong reason to pick blue, it's like choosing IBM (pun intended) or the reason Microsoft is still the best choice for many reasons, nobody got fired choosing blue. Every other color has strong emotions tied to it, and neutrality (read grey) while being most suited to 'new' web design tends not to excite people too much. I actually have a difficult time finding a site where blue is not the predominant non-meaningful color. So, while I'm scouring google scholar for some actual research statistics on this phenomenon, please leave your comments on what interfaces sucessfully break this blue flu, and have a happy 2008!

Worst user experience ever....

We were in a meeting talking about possible ways to showcase user experience design when I brought up statistics or quantifiable metrics. Everyone groaned, as they do when I bring things up, but mainly because it tends to be a bit of a sore spot in the world of usability, It seems obvious that good user experiences lead to more popularity, sales and general peace and happiness. However, percentage gains and metrics are suspect since there is no way to have a double blind scientific study of 'usable' vs 'unusable'. Thus, the practice of reviewing and refining the user experience can often be considered optional or put off till after release or just too hard to 'bake in' to the process because it doesn't produce hard numbers. In my defense I did come up with a situation where hard numbers and user behavior told a very interesting story.

The 'worst experience ever' in the title came to mind as an illustration of the confusion and opportunities that surround metrics and usability design. I speak of last months release of Radioheads "In rainbows" (since decommissioned). If you haven't downloaded the music yet, or heard the story umpteen times, it happens that Radiohead created a sanctioned way to pre-offer their new record it for download as mp3. Radically, customers could pay what they wished for it, including nothing. The real story as I saw it came from the way they managed this transaction - in the most confusing, user unfriendly way possible. The site is garish and difficult to comprehend, even though the download to the music is the only goal. You are asked to pay before even sampling the album. When purchasing, the amount is left blank, and in pounds, so no translation of other currency, no 'suggested' price. If you enter an amount below 1 pound you are greeted with errors, any questions or advice explaining the process all appear in popup windows, its a mess. When the user is finally able to complete the transaction, they receive nothing, but wait for an email with download instructions.

With all these hurdles, it only seemed natural to pay nothing, which I did, since it all seemed like some kind of con, as trustful as I am of their brand. After a few days (I did it before 'release'), an email arrives with a download link. Then you can finally sample what you (didn't) pay for. It was my intention to check out the record (which was quite good, actually), then return to offer a few buck donation to the cause. However, you have to essentially re-purchase the record as another 'person' so it seemed as though I would be guilty of 'stealing' it the first time, and I got busy and...well...

Even though it has been a kept secret of the band, news stories came out speculating that as many as 60% of people did not pay. Many commentators used this metric as somehow holding some significance of why and how people think of paying for music. No one mentioned the horrible shopping experience, outside of a few blogs like this one. In all, it should be noted that every person using the site did complete the task successfully, and no animals were harmed in the 'stealing' of the music. The only casualty was the business model. If the goal was to monetize the download, it failed in every respect by making it difficult and unwieldy for the user to pay a fair amount. However, the user was satisfied by getting the music they wanted. So perhaps usability is better defined as aligning business strategy with user goals? I know the statistics on the user behavior was much reported, so perhaps it's time for a double blind study for their next record - with a better user experience will people pay more? Can't wait.

Reading 2.0

This weekend three events got me thinking about books. First of all seeing the excellent adaptation of Pullman's The Golden Compass. I had read the books quite a while back, I think around the time of the beginning of the Potter mania. What surprised me was the previews before the film started. New movies of yet more fantastic adventures of boys and girls with magical creatures, etc, but all revolving around books. The two previews were for the Spiderwick Chronicles and something called Inkmore or some such thing. I suppose it is not a new theme that "a book takes you to another world". The Pullman series, much in the vein of fantasy or scifi, presents an alternate universe to mirror and critique our own. Once turned to a movie, however, the book's themes are washed out a bit due to the nature of editing and visualization. In these other films Spiderwick, and inksomething the writing and reading of particular books itself leads the characters into danger and drama. I suppose, thinking of last years blockbuster, if the wardrobe in the titular novel was instead a paperback, it would present the same theme. Pro-book sentiment is laudable, but something rings hollow in the visualization layer, all these movies tend to look alike. If it wasn't for the acting, the effects and costumes of Compass (and the other two from the preview) reminds you of just about every movie made since "Lord of the rings". So it is actually the book itself that has the most distinguishing characteristics, there is no way to confuse the prose of "Rings" with the language of "Compass", but the movies look the same (and have similar actors). So is the magic world so vividly imagined truly available only on the printed page since special effects have become so sophisticated, yet commonplace?

So while thinking of the written word, I notice Chicago is blanketed recently with ads on the CTA for the Sony Reader. Perhaps related to last months launch of Amazon's Kindle. While I am intrigued by the introduction of these devices, I have a good friend at www.manybooks.net who is a purveyor of online books, and who has been kind enough to let me play with and use these devices. I suppose a recent viewing of 2001 reminded me of what bothers me about them, the scene when the astronauts sit to eat their meal, they have a paper thin TV they carry with them. The TV has no outward controls, but can be manipulated somehow. If ebooks looked and acted like pieces of paper, wouldn't that be the ideal user interface? Seeing all the buttons on these readers causes me to wonder how people are expected to interact with their books. I think the turning of pages is clear enough, but what do the 21 vs 54 buttons achieve that 4, 5 or 0 could not? I can't look at these devices and not think of remote controls or cellphones or a variety of user experiences based on reading and understanding 100 page manuals. Is the ideal somehow like the iphone, you touch the page and it 'acts like paper'? Perhaps it is impossible to not have to manipulate the interface, and that leads to a lack of immersion in the story?

The third event I spoke of was reaching the climax of Moby Dick which has taken me the better part of a year to get through because I receive it as a daily email (250 installments) from dailylit.com. After recommending the Compass movie to a co-worker, they asked if they should read the book first. This struck me as a quite old-fashioned sentiment. Will you get more out of a movie if you have read it first? Personally, I find it impossible in the age of ubiquitous computing to make time to read a novel with blogposts (*ahem*) websites and other distractions. Dailylit cleverly proposes that if you have time to read all your emails, you have time to read a book, abeit chapter by chapter. Taken in small doses, you can tackle a large subject. Moby Dick, due to a somewhat schizophrenic narrative structure, made for a perfect daily short email, and I kept with the story for all these months, and can even think of picking up the actual book for a real read someday. Perhaps the business model is what is really in question, some books and movies make millions while other authors are embracing electronic distribution to try and build readership much like myspace does for new bands.

What are your thoughts on the written word? Are these films/devices only lip service to the wonders of reading? Can we consume the written word within the electronic one without being hopelessly distracted? Or having to read the manual?

Browser Wars : Part IV a new hope?

I've been looking around for some data on the life/death cycle of browsers to append to my earlier post. In my early days, there was much drama about the rise and fall of browsers, and the great capabilities these new browsers would bring to the user experience. And when I say drama, I mean it was deadly dull, waiting years for certain 'problem' browsers to die out, or for less savvy computer users to get a new computer and finally update that clunker and get a 'real' browser. This seemed always to be whatever the latest, greatest beta version by the established titan, or sometimes the crafty underdog. When HTML 5.0 gets integrated into a browser, it will be years for that browser to be adopted, and further years for site developers to take advantage of whatever innovations it offers safely. The days of code bifurcation and browser sniffing are not dead by any means, but they are as usual being 'phased out'. If you were writing the script for the hollywood version of "Browser Wars" here's a possible plot outline (If Michael Bey is involved please give me a cut)

1. 1996 Exposition - the masses seem to discover the Internet and Netscape makes it all possible thanks to Netscape 3.0. The world rejoices and refuses to dump this browser for at least 10 years (it may still be in use today ?!)
2. 1997 Rising action - Internet Explorer 4 introduces a whole new world, special effects, DHTML, proprietary image filters and other goodies that take the world by storm, also, they explicitly link their browser with the operating system, so you can't remove it, and its hell to install a different one (bye bye Netscape). This also starts the nasty reality that windows can only have one instance of IE at a time, so developers rarely have the same browser version as their users, bringing up the popular 'it works on my machine' excuse.


3. 2000 - IE 5 for the mac comes out and makes mac users feel cool, superior, and since it diverges from the inexplicable release that was IE 5.0 (for xp?) it becomes the browser of the hip. Cool innovations include somehow integrating ebay bidding someplace.


4. 2001 - IE 5.5 for windows/mac and the last gasp of Netscape Navigator (7?) all come out in one big dump. Browsers seem to have become massive piles of auxiliary interfaces (email, auctions, unknown amounts of crap). I suppose writing a browser means you should do something with all those eyeballs to make money? The box model is broken, web standards seem shaky. The future doesn't look too bright, users despair.


5. 2003 Climax!- IE 6 comes out to wipe everyone off the map, all those custom hacks for IE have paid off as it destroys all other browsers (mac users need not apply) and the dynasty is secure. It has enough to make web 2.0 happen, but not enough to appease the web standard crowd coming into being. People think about using div's for layout! Since old windows machines all succumb to whatever that horrible virus was, people upgrade their computers and IE 6 gets you about 80% of browser traffic, so microsoft goes off do do something else for about 5 years.


6. 2004 The rebels attack! Mac Safari and OS X comes in to challenge the dominant browser, and on a good day, when the wind is right they can get about 1% of browser versions.


7. 2005 Denoument - The flaws in the reactor are finally uncovered and the plans to the rebel base are brought to Mozilla which takes on the Windows empire with Firefox. Even average users tired of endless security attacks flee to embrace the upstart. On a good day, mozilla gets a 10% share of the browsing pie. WIndows tries to release service pack 2 to win back their imprisoned users, tempers flare!


8. 2006 Ending: The empire strikes back with IE 7, a fully realized, standards compliant docile friendly beast that plays with others and is generally cute and cuddly. However, it breaks all the hacked up IE 6 sp2-only sites and thus people don't accept the peaceful, easygoing IE, and reinstall the evil 6 version, making it the browser we will have to live with for the next 10 years or so.
   
   Or will we?

On the Benefits and Pitfalls of Competitive Research

Competitive research is part of the design process at Pathfinder. By competitive research, I mean spending time getting to know how others have solved the problems you are confronted with.  We do this type of research separately to start both the Information Architecture and the Visual Design phases of our process.

Recently, though, I’ve been thinking about the net effect of the importance that it plays in the Visual Design process.  Specifically, to what extent does it help, and when does it hinder.

One the one hand, it can be really dumb to start designing something without knowing what has already been done in that space.  Starting from scratch can be a real time waster.  It pays to take advantage of other’s successful design thinking as it relates to the problems you have to solve, because they might have been solved already.     

However the more immersed one becomes in a particular domain--the more exposure one has to the state of the art--the more boxed in one can get.  You become accustomed to seeing problems not as challenges in need of creative thinking, but as patterns that conform to some already defined problem/solution set. Then all you have to do as a designer is simply find that matching set.  It may sometimes be easy, even more often than not, and there may be projects when doing this is the best you can hope for under the current constraints, but eventually it’ll hurt you as a designer, because you can get to used to searching for patterns. Cliché as it may be, your creativity is like a muscle. You have to exercise it daily for it to grow.  And not all problems have a matching solution yet.  There will always be unique problems that will require you to solve them on your own, and you’ll be caught off guard if you haven’t practiced using your own design skills.

I would say that for competitive research to be an effective, and positive experience in the long run, it has to be balanced with a healthy dose of skepticism.  As a designer you should open yourself up to what others have done, and in fact realize that it’s very important not to design in a vacuum.  But as you explore those designs that came before you, keep in mind that it’s up to you to use your creative skills to come up with a solution. You can’t let your skills sit in the dark, while you let others do the hard work.  Eventually it’ll come back to bit you.  Take what works.  There’s no reason not to.  But even then, don’t just consume it, deconstruct it.  Take a designers critical eye to it, so you can learn from it and grow as a designer.

Powered by ScribeFire.

Waiting for 5.0

I want to thank my colleague Brian for posting in our sister blog (or the main blog, whichever way you look at it) about HTML 5.0 article in a list apart. I have been working on an entry about some persona work we did at World Usabilty Day a few weeks back and have been stuck coming up with something profound, so stay tuned. As it so happened a part of that article also caught my eye and caused me to flare up a bit in disbelief, and it was a different part, so thus my impetus to get this out, since rash reactions make for the best blog posts anyway. Here is the offending statement:

<header>
  <h1>A Preview of HTML 5</h1>
  <p class="byline">By Lachlan Hunt</p>
</header>

<header>
  <h1>Example Blog</h1>
  <h2>Insert tag line here.</h2>
</header>

When I first read the article that IBM put out on HTML 5, I was smiling for the semantic goodness of all these new elements. Somehow, I imagined this was a way to clear up one of the biggest problems in semantic design, naming conventions and inheritance. In one swoop you could get rid of the scourge of 'classitis, and add a whole level of drop and drag functionality without the baggage of a proprietary solution ala scriptaculous (class='draggable'). I was hoping that you could just create rulesets like;

	

	header {

		the box looks like this

	}

	header h1 {

		the logo/branding looks like

	}

	header ul li {

		the 'utility' navigation looks like

	}

	menu {

	the box is like

	}

	menu ul li {

	main navigation looks like

	}

Semantically I would then have places on an interface that revolve around specific purposes, and have the alphabet soup of tags (h1, p, ul) which when put in those buckets pick up a purpose and display. Then we need no classes, since you should be able to stick to just the tags that brung you. The descriptive simplicity of not having to worry about #nav p and .nav li but you have menu container, fully ready to accept things that make menuing possible. Anyway, this was the illusion, after reading the example passage in the article I thought:

What? There are two headers? Now how do you manage a header (display:none) situation for a print style? Would it be header class=realheader and header class='subheader? Doesn't that defeat the purpose?

Then of course the p class=byline bit - can't any p within the header be considered a paragraph, why call a byline a paragraph? Why invent a subsidary element, could it be made into a <span> just to keep it clear?

So, I somehow thought that HTML 5 would eliminate the need for custom naming conventions, and perhaps classes and ID's were a thing of the past. Then, the article this made me realize that the tags are not necessarily unique in a page, and therefore the 'hook' quality of: getelementbyID finding a single instance is out the window. Then I wept, as this trashes some of my imagined utility of this addition to the language.

I wanted this because my experience is that XHTML and CSS are not well and truly separated. CSS makes little sense on it's own, and reading someone else's CSS while not impossible, is not ideal. You have to find instances of each element in the production code and piece together the puzzle of how things are used and why. Some programs like CSSedit make it a bit simpler, but since XHTML doesn't enforce good practices, and with little effort, you can 'break' the stylesheet by adding elements without definition, or that inherit unwanted or unintended styles. In your own work, this makes things confusing, in trying to understand others work, it becomes a real pain.

<div id="header">

	<ul class="nav">

<li><a href="here.html">Go here</a></li>

<li><a href="there.html">Go there</a></li>

</ul>

</div>

<div id="content">

<div id="nav">

<ul class="sidenav">

<li><a href="here.html">Go here</a></li>

<li><a href="there.html">Go there</a></li>

</ul>

<div class="content">

  <p>stuff is here</p>

  </div>

  </div>

  </pre>

an example of a screwy, yet valid page markup

So HTML 5 gives the addition of a few new tags, and the appearance of some semantic 'hooks' that could lead to a better standard (video is welcome), not to mention search engines can spider and parse our sites more effectively. I think Google is already hip to the id='nav' convention - see an earlier post on my site for this. I am confused and somewhat disappointed by the lack of uniqueness to these elements. While I don't understand the DOM hook thing completely, this seems to make things tougher by having to deal with arrays, but perhaps Brian can explain it to me (or us) if it is a good thing after all.

I started this blog with a long history of HTML and the 22 original elements and their morphing into the however many there are in use today. I dumped that part since explaining the history of why text markup and navigational markup are two different beasts so why expect Berners-Lee or any standards body to tackle all the desires we have for the language. My own goal is to have some level of semantic abstraction so I can classify the user experience in words and elements that everyone can agree upon so we can focus on our unique or non standard elements, for the maximum value add. Messing with navigation techniques for the past 10 years seems a bit of a futile endeavor (could they have come up with a <tabs> tag?), and I'm certain not to have contributed as much as some to new ways to interact with a set of information. I suppose along with classes, ID's and the tags we have we are doing pretty well, and my paradise may be your nightmare, so best leave it up to the browser makers. But thats another post.