- We design and build extraordinary applications for companies looking to make the next great idea a reality.
- learn more
A New Workflow for Web Designers
It was Tim Berners Lee's original vision of the web that online documents be both readable and writable. He notes in his book "Weaving the Web" that that he was disappointed with the way the browser was initially developed as a read only technology, making it expensive and onerous for the asses to publish online content, and essentially creating a top down system, with lots and lots of readers but few writers.
Only recently has the technology that allows anyone to easily publish and edit online documents, in the form of Wiki's and Blogs, been developed. These tools have become so popular, so ubiquitous precisely because they cater to what users really want, fulfilling the potential that the web's founding father had envisioned for it almost 20 years ago.
Continue reading »
Topics: CMS, Web Design, workflow
Pixel by Pixel…Or how I spent my last 2 weeks designing a few icons
"Our product is shipping globally, and we're not going to customize each device to the language of it's destination country. So we need you to design a set of icons that will be used in place of textual messages."
Challenging, but simple enough, right? Immerse yourself in the product, do some user research, brainstorm designs that are meaningful, descriptive and culture neutral, and there you go. Oh, and one more thing...the device's display is 128 x 64 pixels with 1 bit color depth.
Such was the nature of the project I recently worked on, and it was a challenge of a very different kind then I had faced in a while. With either greater resolution or more color depth, It's relatively easy to depict pretty much anything with a high degree of recognizability. Shading, perspective, non-linear surfaces are all time consuming but doable with one or the other. Yet with only 2 colors and not many more pixels at your disposal, your so much more limited in what you can do. Take a look at some early GUI icons to see what I mean...
Since I couldn't use more than 2 colors, I couldn't anti-alias, so I was basically confined to horizontal, vertical and 45 degree diagonal lines. Forget about perspective. Since true perspective doesn't involve straight lines, depicting a product from an angle on such a small scale is out of the question. And shading--which is essential in illustrating that a surface displayed head on is curved--is just a matter of starting on the darker side with a high frequency of black, and then lessening the frequency as you move to the 'lit' side of the surface (Take a magnifying glass to a newspaper add to see what I mean). Again, not an option here due to the small screen size, there just want enough room to do that. I felt a lot like a writer being asked to weigh in on a complicated subject using 50 words or less. They say brevity is the soul of wit. I had to be clear and concise if I had any chance of success.
At 128 x 64, every pixel matters. And at 1 bit color depth, rotating, scaling or otherwise transforming anything in Photoshop is useless because the software automatically anti-aliases, creating shades of grey that were forbidden. So I had to design pixel by pixel--make a 1 x 1 selection, put my hands on the keyboard cursors and get to work. See Wikipedia's entry on Pixel Art for a good reference.
As it turns out, I was more at home on this project than i though I would be when found out the requirements. You see back when I was a kid, the first computer graphics program I ever used was on my father's DOS machine. The program itself wouldn't fit on the computer's hard drive, so it had to be loaded via floppy disk--the old 5 1/4" ones. The computer didn't have a mouse, so almost everything I created had to be tediously drawn pixel by pixel using the cursor keys. It took me months working 2-3 hours a night, but I created some pretty good stuff. In particular, I remember drawing a hockey rink, with players, stands and all, which I'm pretty proud of. Using Photoshop/Illustrator now, with the capabilities so far advanced over what I had to work with at that time, It's hard to see how I did what I did, or for that matter why I spent months doing it. But there's something about taking time to do something right, struggling through the frustration that comes with the absence of 'Undo', picking yourself back up after making a mistake that renders 10 hours of work useless. Creating art is a sprint. Back then it was a marathon.
So I forgot about my mouse, left the color picker behind, and zoomed in at 1600%. I soon found the hang of it again, and I got in the groove I remembered from way back. After a lot more time than I though it would take, I had a set of icons that worked...and that's the key. And in the end, I feel a little more satisfaction than I would have if I was allowed to let Photoshop do it's magic.
Topics: Design
Stock ticker entry fields and usability
Interface design is about balance and accommodation. One of the most important balancing acts an interface must play is in accommodating the diverging expectations of the novice and the expert user. The expert knows what he wants to do, and he expects the interface to let him do it quickly. Just about all the knowledge pertaining to his task is in his head, and he would only be slowed down by guides tutorials, aids or other such helpers. However the novice is looking for exactly what the expert must ignore. These activities are new and unfamiliar to him, and he needs a helping hand. Most of the information he needs to accomplish a particular task is not in his head yet, and the interface must accommodate that.
Yahoo Finance recently added a new feature that caters to both the expert and the novice user. It's a stock ticker entry field, and in this case, I'll define the expert as the one that knows the company's stock ticker symbol, whereas the novice only knows the company name. Until recently the field catered to only expert users. Novices beware. Although it was only a harmless input box, it separated the men from the boys so to speak, by acting like a bouncer beyond who's doors only those in-the-know could venture. If you didn't know the stock ticker symbol of a particular company and you made the mistake of typing the company's name into the box, you were shoved back and rudely warned that that symbol doesn't exist-- as if too say, you don't belong here with the big boys; learn your ticker symbols and then come back.
All that changed, and the hegemony of the expert stock ticker symbol know it all is over. The field now accepts both symbols and company names. Better yet, as you type, the matching results--both ticker symbols and company names--get displayed below the text field, with the company name on the right column and it's stock symbol on the left. So for instance, if you type 'ge', among the results will be General Electric, because its stock ticker is GE. But you'll also see General Motors, and Genetech, because their company names match your input. You can select any one of these using the cursor, but you can also just hit enter or click the submit button and the company who's ticker matches your input will result.
So now you can easily find financial information of any--publicly traded--company you want even if you don't know its stock ticker symbol. And if you do, well just keep typing away, there ain't nothing gonna slow you down.
The Curse of Knowledge
You can never know too much about something, right? Wrong, at least according to a December 30th article in the New York Times. As we become experts in a particular domain, our ability to innovate diminishes.
"Andrew S. Grove, the co-founder of Intel, put it well in 2005 when he told an interviewer from Fortune, “When everybody knows that something is so, it means that nobody knows nothin’.” In other words, it becomes nearly impossible to look beyond what you know and think outside the box you’ve built around yourself."
Reading the article, I couldn't help but think back to my own experiences with this same sort of issue. I blogged recently about two related ideas: how interface designers are sometimes guilty of thinking as designers--when they should be thinking as users, and about the mixed bag that is competitive research, which can limit the designers creative thinking by boxing them into predefined solutions.
Now I see that it's part of a larger problem of expertise and creativity. The more expertise one exhibits in a particular field, the harder it is to think creatively--to so called think 'outside the box', and the harder it is to imagine not knowing what you do. The problem affects whole companies, as a certain way of thinking becomes entrenched, and it gets harder for it to adapt to a changing landscape. The article cites the example of Eveready, the flashlight maker, who's powers-that-be couldn't imagine that their product could be effectively marketed to anyone other than men shopping at hardware stores.
According to Cynthia Barton Rabe, author of “Innovation Killer: How What We Know Limits What We Can Imagine — and What Smart Companies Are Doing About It,” the solution for Eveready, as for any organization bogged down in its own expertise, is an infusion of outside thinking. Bringing the so called novices--the non expert users--into the discussion at the early stages of design, weather it be product or strategy design, opens the door for new ways of thinking that experts have long been insulated from.
Powered by ScribeFire.
Topics: Best Practices, Design, Design Patterns, Domain Knowledge, Ideation, Story Telling
Design can be Used for Good and Bad
Every so often I'm rudely reminded that much of the information I get comes from a source who's goal is to sell rather than inform. It is those times that I'm also reminded of the critical role that design plays in supporting the goals of the organization (wether they be to inform or to sell) by shaping user behavior.
Case in point. I use Yahoo Finance to track my stock portfolio and stay financially abreast of the day. I choose Yahoo over the many others out there because I'm used to it. It has a simple interface and I know where everything is located. It also has great tools, and it aggregates information from many many other sources in one place, which I find invaluable. However I just recently noticed that Yahoo Finance is serving some text ads on the site now. I wouldn't otherwise be too bothered by them, but they've been designed for the express purpose of looking like real (un-sponsored) content. They're right up there on the right hand side of the page, occupying the top of one column in a three column layout. The ad titles are just about the same color as the headlines and links on the rest of the site. And while the other section titles are all orange and bold--designed to give structure to the page and let you know what section your in-- the only way you can tell that your reading ads is from the truly inconspicuous (light-grey on light blue, thin, all caps) 'Advertisement' header.
This really infuriates me, especially because it's a finance site, and I can't help but notice the content of the ads. For instance, right now I'm looking at the front page, from left to right I see a snapshot of the Dow's performance today, a headline saying 'Stocks mixed ahead of jobs report' and a couple of blurbs on 'Hottest China Stock' and '16 Hot Dividend Stocks'. Now I'm sure you can guess which ones are ads. And yet I can't help but see the ads and incorporate them into my understanding of the days financial news. They were designed to be scanned, and that's exactly the kind of information I need to be able to filter out when I'm scanning a page like this.
The fact that these ads persist is a clear indication that Yahoo is concerned less about an informed public and more about using its real estate to extract as much equity as possible.
Powered by ScribeFire.
Dasher - A new way to write
I simply love finding these little gems on my weekly web excursions. This time it's a fascinating new piece of software out there called Dasher, and it allows you to write without typing or scripting. What's that you say? How else can you write? Well...The basic idea is that current methods of typing are inefficient, because they don't learn. Let me explain. Although there are x number of letters in the alphabet, every pressed key reduces the number of available choices for the next key press, and increases the odds that other specific keys are pressed next. For instance, 'E' is much more likely to be pressed after 'H' than 'B' is, and 'O' more likely after 'G' than 'C'. On current writing technologies it's up to the user to learn to be more efficient at writing He than Hb or Go than Gc. But that doesn't need to be the case. By taking advantage of the learning and memorization power of the computer, it's possible to create writing interfaces that guide you through the process rather than just recording what you type. If you'll indulge me in some metaphor, imagine rowing down a river. Dasher is the river with a strong current to wherever your going, and existing typewriting technology is the river with no current whatsoever.
What Dasher does is use language patterns to present likely letters and words to the user based on the letters or words they have already written. The goal is to make writing more efficient by reducing work. There are no keys to press using dasher. In fact the mouse is never clicked. The interface allows one to write by simply navigating the mouse down a path--or tree--through the alphabet. The start screen displays all 26 letters of the English alphabet. You select a letter by moving your mouse next to it. As letters are selected, Dasher displays all available letters again, but this time those more likely to be chosen are larger and therefore easier to select. As you write, you move forward through the tree, and entire words and phrases are displayed in order of likeliness.
Dasher needs some work before I start using it instead of my keypad, but the idea has real merit, and it deserves to be explored more. As an interface designer I see at this tool as a great example of how simple interactions, when thought about creatively, with nothing held sacred, can have potentially revolutionary effects on the way we interact with technology.
Powered by ScribeFire.
Topics: Design, Flow, Interaction Design, Rich Interactions, User Experience
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.
Topics: Information Architecture, User Experience
Writemaps: A web based site map generating tool
Came across an interesting web tool today...Writemaps: A site map generating tool that allows you to build, edit and share site maps.
It's got limited features, but it has two big things going for it:
1 - It's web based, and you can share your files via url. So anyone with a web connection can view and edit what you've created.
2 - It creates presentable sitemaps. The page representations (nodes in the site map tree) have subtle gradients and drop shadows, and the tree diagram contains only right angles, giving your sitemap a polished professional touch.
A few other notes about this tool:
Can't print or save as image, but you can save as XML.
It's got an undo button! (how many web apps do that?)
You can zoom in/out on your map views.
It's dead easy to get started.
In summary, there's a lot of potential here, and I think I might give it a try on my next project.
Powered by ScribeFire.
Topics: Information Architecture, Task Flows, Web 2.0
Help - How do I open this door!
There's no way to intuitively know how to open the doors where I work. The handle--a bar that spans the width of the door--looks like it can be pulled or pushed. What's more, some doors you push to open, and some you pull, and it's completely arbitrary, at least as far as I can tell.
In fact there's one way you can tell what action to take. There's a mechanism at the top of every door. If it's on your side, you push. If it's on the other side you pull. So every time I go to open a door I instinctively look up. I don't break my stride, and it's all very easy. Problem solved.
But I shouldn't have to look up anymore. I mean there are only 4 sets of doors I open on a daily basis. I should know by know which ones I pull and which I push. I should have had that memorized already. Wait...this is leading somewhere design related, read on...
The mechanism at the top of each door was pointed out to me by a coworker. Had he not relayed this useful bit of information I would probably have soon thereafter memorized the door situation, and never have needed to rely on looking upwards. In fact I was on my way towards doing so. I was in the process of constructing a mental model of the pattern of push/pulls that made sense to me; mental models give their owners intuitive understanding of objects and how they are to be interacted with. In this case I was coming up with some sort of construct that rationalized the seeming arbitrariness of the direction the doors swing, a construct that would be intuitive enough to allow me open each door without thinking.
I no longer need to do this, though, because looking up is easier than constructing that mental model, (perhaps because the doors do swing completely arbitrarily, and any model I conceive would be somewhat contrived, and therefore not really that useful). The point is, that I ceased my efforts to find that model, and stuck with what was easy--looking up. And I really never though about that consciously until now. How many other interactions in my day to day life--in all of our day to day lives-- are made up of those same patterns of subconscious thought--finding the easiest way to do something, without ever really thinking about it.
Powered by ScribeFire.
New is Cool
I passed by the Apple store this afternoon, and decided to check out the next generation of iPods. I have an iPod mini. It’s served me well for over two years now, although I am not, by any stretch of the imagination, a power user. In fact I use it regularly for only one purpose—to get me through my workout. Every so often I’ll take a road trip, and it comes with me then too, but not with much success, since I don’t have the necessary accoutrements to have it play through the car stereo.
When I first got the iPod—it was a gift—I was entranced by it. I literally thought it was the most beautiful piece of technology in the world. It was mainly the simplicity. Smooth surface, unbroken by obtrusive buttons, or sharp edges. I spent way too much time keeping it from acquiring the wear and tear that inevitably overcomes any new product.
I was consequently disturbed by my initial reaction to the latest wizardry from Apple. All I could think of was that I wanted one—that the new iPod Nano put my Mini to shame in the coolness department. Now having time to think about my first strong reaction, I don’t rationally think that the Mini is objectively less hip/cool/sleek/ than the new Nano is. In fact I think that if Apple had released them in the reverse order, with the model I now have coming out more recently, I would have felt that the Mini is aesthetically superior to the Nano. Why is that? What properties does a new product exhibit that makes it more irresistible than an older one? How has Apple become so successful at making new seem so much better than not-so-new?
Apple and a few other companies (notably Adobe) have been outstanding at generating mass interest in the same product over and over again through minimal enhancements, but mainly by convincing us that newer is better. I don’t know their strategies because I don’t attend their board meetings, but I do interact with their results. It’s a tremendous advantage for such a large audience to believe that a certain product is ‘in’ simply because it says so.
Powered by ScribeFire.
Chaos and Order
The process of designing (guis/websites/apps what have you) can be very exciting, and ultimately, when a design goes well and achieves its purpose, it can be highly rewarding. But it's also a challenge. Every designer has their own set of struggles that they go through during the design process.
One of the things I struggle with most as a designer is the urge I have to make things consistent, or symmetrical. I prefer order over chaos, I'll admit. I constantly have to catch myself from spending too much physical and mental energy on removing what I see as chaos, and replacing it with structure, consistency, balance and symmetry. It's not that these aren't worthy goals, but my experience is that sometimes those characteristics aren't the key, or even an important element on a particular interface screen or widget. In fact, in many instances I have found that what I consider order is quite an undesirable solution, or at least, not what the doctor ordered.
By instinct I look at my work through a designer’s lens. It is a macro view. I see the overall structure of the interface. I slave over task flows and wireframes, structuring them and fine tuning them so they please my aesthetic and philosophical sensibilities. I judge them by their adherence to my design rules-symmetry, balance, structure, consistency.
But for the judges that matter, the users, the interface is simply a tool that they will use to accomplish a task (or set of tasks). They will judge its success not by any theoretical characteristics, but by how well it allows them to accomplish those tasks. They won’t look at the blue prints. They’ll never get a look at the task flows generated in the design process, nor would they have any desire to.
Internalizing this distinction--the difference between my view, and the user’s view--and embedding it into my design process is one of the challenges I face, and one of the determinants of a successful design.
Powered by ScribeFire.
Topics: Design, Design Patterns, User Research
Thinking like a designer isn’t always good
When designing, I frequently find myself thinking like a designer. I ask questions that a designer asks. I attempt to find clever design solutions to issues I have uncovered while wearing my designer’s hat. I rely on design principles to guide me through the process.
Yet no matter how much experience I have designing, no matter how great a design I think I might have achieved, there will always be something missing if I don’t at some point stop thinking like a designer and start thinking like a user.
This is because if one is not thinking like a user, then no matter how well he or she thinks he has solved a problem, all design solutions are still just conjecture. The designer has to step out of his designer shoes, where he has been using principals, and what he thinks is good judgment to solve problems, and simply be a user. He must ask himself not weather the design works in some abstract sense, but weather he can easily do what he needs to do. If he can answer that question in the affirmative then by definition the design works. Of course it helps if one has a user base to test the design with, but that isn’t always an option. And even when it is, it’s still best to incorporate user feedback as soon and as often as possible in the design process. When the designer doubles as a user he accomplishes this quickly, frequently and relatively inexpensively.
Sometimes it’s hard to switch modes, so to speak—to go from designer to user on the fly. For me the key principal is this: to move into user mode, instead of asking myself questions that begin with ‘Would the user’, I begin questions to myself with ‘Can I’. It’s also important to move quickly through interactions, and trust your first instinct as a user. Your first moves (where you move your mouse, where you click) are generally what more typical of what a user would do, since you haven’t had time to consciously decide what to do (therefore using the knowledge you have as the designer).
The iPhone experience
The iPhone has finally arrived, and I’ve been playing around with it here and there. What can I say; it’s another example of the degree to which Apple’s fanaticism with user experience pays off. As soon as I held it in my hands, I knew that it was going to be fun, just plain fun, to use this thing. How many mobile devices can you say that about. The only ones that come to mind are the gaming devices, Sony PSP, Game Boy, Nintendo DS. I don’t know of any other mobile phones that are actually fun to use.
Two things struck me as key differentiators between the iPhone and the dozens of equivalent products – Smart Phones, PDA’s, etc..--on the market:
First, Apple’s obsession with simplicity is abundantly clear in this device, like none of it’s previous products. This is a culmination, or at least a progression. In a sea of complexity, it seems like they understand modern humanity’s longing for the simple better than anyone, and by a wide margin. The company is quickly becoming the definition of simple technology. Their latest product has only one physical button. Everything else is software. And the software is so simple and inviting, that I’d feel completely confident giving it to my grandmother to use to make a call, or even watch some video, without any instructions.
Also, it’s the little things—the details that would somehow get overlooked in most software—where the iPhone really shines. Things like, the way the screen moves naturally with your finger and comes to a smooth stop—unless your at the end of the scrollable region, in which case it ‘bounces’ up against the edge of the display. Or the way one screen pleasantly fades into the next. Or the way you never seem to need to do any thinking when going from step to step in any process, like sending an email, or sorting you music list. They’ve taken a huge advance in touch screen technology, and, through obsession with user experience, created a true revolution. In anyone else’s hands the iPhone would just be cool, in Apples hands it becomes a paradigm shift.
Pictures that hurt
A picture is worth a thousand words. But images can also be misleading. One of the ways that images can mislead is when they are used to simplify real data for quick scanning. Since they have such a strong impact on us, are so easy to find on a visual plain, and are so easy to remember, content producers sometimes find it useful to replace numeric data with imagery. However, if they are not selected carefully, there is a risk that they will oversimplify complex or nuanced data, and therefore mislead the intended audience.
Take the weather forecast, for example. We’ve all seen the images that the appear near the end of the daily weather forecast on the local news, or in the paper—the little pictures of the smiley face on the sun, or the dark cloud with the lightning coming out of it, or the sun with the rain drops juxtaposed on top of it. Those ubiquitous images are so popular because they serve an important purpose—we’re all in a rush, and we want to be able to get a quick and accurate view of the weather in the next few days.
Since I live in Chicago, the local weather in the summer is crucial. My weekend plans are based entirely on what Saturday and Sunday will look like. I’ve come to rely on my weather forecast widget (Mac OS 10.4 widgets), which features the same type of images in the familiar 7-day forecast.
I’m noticing, though, that the weather is almost always more, how should I say, nuanced than the little icon on my trusty widget. I wouldn’t say that the data is incorrect, but the very act of squeezing the projected weather patterns for the day into a 25 x 25 picture is going to involve excessive simplification, even over-simplification. What happens, though, is that the my brain, which craves simplicity, responds quite well to the weather widget, and the image sticks in my head and gets associated with the day it represents. I’m conditioning myself to look beyond the widget, because I’m frequently disappointed with the way the weekend turns out (more so lately, what’s up with all the rain?).
Which brings me back to my original point. In this instance, real data—not doubt data that exists, like percent chance of rain, humidity level, sunlight consistency, small differences in temperature—are sacrificed for the sake of brevity, and as a result the image is misleading. In general, where there is a lot of data available, content producers are doing a disservice to their audience by removing it and opting instead for the simple image.
Microsoft’s Inductive User Interface
MSDN (the Microsoft Developers Network) has a short introduction to a relatively new trend in the way Microsoft thinks about Interface Design.
Inductive User Interface (IUI for short) is a term that describes the collection of methods and guidelines for designing interfaces that, according to Microsoft, are easier to follow than the current generation of software products are.
According to Microsoft, IUI gained traction as a design process as a result of the research they’ve done on actual users performing tasks on their products. In short, they found that a number of important assumptions that are commonly made by User Experience practitioners are incorrect. They found that, contrary to the commonly held notion, most users are unable to successfully perform even basic computer tasks. The article stated 3 key reasons as to why they have concluded that software is hard to use:
- User’s don’t understand the software’s conceptual model. From the original article:
“The interface design for most current software products assumes that users will understand a conceptual model that the designers carefully crafted. Unfortunately, most users don't seem to ever acquire a mental model that is thorough and accurate enough to guide their navigation. These users aren't dumb — they are just very busy and overloaded with information. They do not have the time, energy, or desire to wonder about a conceptual model for their software.”
- Even expert users never master common interface tasks. From the original article:
Designers know that new users may have trouble at first, but expect these problems to vanish as users learn common tasks. Usability data indicates this often doesn't happen. In one study, researchers set up automated equipment to videotape users at home. The tapes showed that users focusing on the task at hand do not necessarily notice the procedure they are following and do not learn from the experience. The next time users perform the same operation; they may stumble through it in exactly the same way.
- Every piece of functionality on a screen takes effort to figure out how to use. From the article:
Most software products are designed for (the few) users who understand its conceptual model and have mastered common procedures. For the majority of customers, each feature or procedure is a frustrating, unwanted puzzle. Users might assume these puzzles are an unavoidable cost of using computers, but they would certainly be happier without this burden.
Most current software GUI’s aren’t addressing these problems. Instead, assuming the user’s (1) are familiar with standard Interface controls (2) have the time or the desire to learn the software’s conceptual model (3) Are willing to put up with a steep learning curve for additional functionality rather than use a more basic, yet simpler product.
As a result is what Microsoft calls the Deductive User Interface (see image). An Inductive User Interface is one whose screens require the user to figure out what can be done, and how to do it. The more time spent trying to figure out what can be done, the less energy and patience the user has left to actually perform them.
Microsoft’s solution is to design interfaces that induce, or lead, the user through one task at a time. As such, the computer screen should act not unlike an expert standing over the user’s shoulder, directing them through one screen at a time. The four essential ingredients to designing an IUI are:
1. Focus each screen on a single task.
Don’t try to accommodate multiple distinct and possibly unrelated tasks onto one screen. This will potentially overwhelm the typical user, in order to satisfy the expert, or speed user.
2. State the task.
Part of identifying a task, is stating it, clearly. This sounds elementary, but there is actually a lot of literature on the advantages of compact, even terse language in interface design. IUI screen title should use natural language and state the exact task at hand, using verb / object phrases. The example Microsoft gives in the article is from it’s redesign of Microsoft Money: One of the original screen title’s was this too general “Account Details”, whereas the redesigned screen title was “Change account setup”—much clearer.
3. Make the screen's contents suit the task.
Once users have read the screen title they will proceed directly below, to the contents of the screen, IUI’s make that transition effortless, as the tasks associated with the screen are intuitive and natural, corresponding directly with the title (or primary task).
4. Offer links to secondary tasks.
Unlike the Wizard, that ubiquitous and often controversial feature of many a Microsoft product, IUI’s aren’t meant to be modal, and according to Microsoft, aren’t intended to impede the expert user. Adding links to secondary tasks allows the user some flexibility in the way he/she goes about performing their tasks.
Criticisms:
The web is full of interfaces that exhibit many of these same characteristics for a few reasons:
- Relatively slow reaction times as commands are frequently sent over the internet and processed remotely
- Products need simple interfaces so as to flatten learning curves, to thwart the relatively quick abandonment resulting from the democratic, highly competitive nature of the web
Microsoft calls the IUI design process an extension of the Web –Style Interface, and a few bloggers have commented that there isn’t really much new here. Just a rehashing of tried and true design practices applied to the desktop model.
Additionally, there has been much discussion in the blogshpere on the relative merits and disadvantages of IUI. Most comments have lamented IUI’s similarities with Wizards, which have been rightly blamed for dumbing down the population of computer users by unnecessarily shielding them from any complexity, and preventing them from learning.
About Pathfinder
Recent
- Roles Testing For Security
- Blackbird takes the pain out of JavaScript logging
- Making GWT JSON not Quite so Painful
- IDEA - preconference workshop 06 Oct 08
- HTML5, Ajax history management, and The Ajax Experience 2008 Boston
- A Look Back At Past Posts
- Flash Player on iPhone gossip
- Microsoft to Jump on Board EC2
- TAE Boston 2008: The Unsexy Presentations
- The Ajax Experience 2008: Hope to see you in Beantown
Archives
- October 2008
- September 2008
- August 2008
- July 2008
- June 2008
- May 2008
- April 2008
- March 2008
- February 2008
- January 2008
- December 2007
- November 2007
- October 2007
- September 2007
- August 2007
- July 2007
- June 2007
- May 2007
- April 2007
- March 2007
- February 2007
- January 2007
- December 2006
- November 2006
- October 2006
- September 2006
- August 2006
- July 2006
- June 2006
- May 2006
- April 2006
- March 2006
Topics
.NET
2d physics
3d
3D GPS
3D physics
37signals
Accessibility
actionscript
activerecord
Add new tag
Adium
ADO.NET Entity Framework
Adobe
Adobe AIR
Advertising
agile
Agile Development
AIR
Ajax
Ajax Applications
Ajax Bookmarking
Ajax Components
Ajax Development
Ajax Examples
Ajax Experience
Ajax Frameworks
Ajax history management
Ajax Intervention
Ajax libraries
AJAX Obfuscation
Ajax Performance
Ajax Products
Ajax Tools
Ajax Widgets
Amazon
amf
Analysis
Android
Announcement
Announcements
antennae
Apollo
Application Architecture
Application Development
AS3
ASP.NET
Asynchronous Processing
awards
Back Button
Benchmarking
Best Practices
BitmapData.draw
BJAX
Blaze Advisor
blog
blogging
Books
Browsers
Business
Business Reasons for Ajax
Business Rules
C#
Canvas
Case Studies
chess
Chicago
Cloud Computing
CMS
COBOL
code art
Code Generation
Color
COMET
Conference
Consistency
Content Management
CRM
CruiseControl
CSS
Custom Flex Component
data visualization
Degrafa
Design
Design Patterns
Desktop
Desktop RIA
Developer's Notebook
Diagnose
Dojo
Domain Knowledge
Drools
EC2
Echo2
Echo3
Editorial
ERP
Ethnographic Research
events
externalinterface
Ext JS
Facebook
ferret
FileReference
Firefox
Firefox Extensions
Flash
flash awards
flash player
flash player 10
Flex
flexunit
Flock
Flow
Frameworks
front end
front end development
Games
Gauge Component
getting things done
Git
Google
Google calendar
Google Gears
Grails
Graphics
Greasemonkey
Groovy
GStreamer
GTD
Gwittir
GWT
Healthcare
Hibernate
Hudson
IDE
Ideation
IE
IE6
IE7
IE8
ILOG JRules
Information Architecture
Innovation
Instructional Design
Interaction Design
Interview
iPhone
iTunes
Java
Javascript
JavaScript frameworks
Javascript Libraries
JBoss Rules
Jess
Jetty
JIT
Jobs
jQuery
JSF
JSON
JSR-94
JsUnit
Lazlo
Legacy Systems
lightweight
LinkedIn
LINQ
logging
Logical Model and Conceptual Model
Low Pro
Mac
Mash Note
Mashups
Meebo
MetaWidget
Methodology
Microformats
Microsoft
Mobile
Mootools
mouse scroll
mouse wheel
Mozilla
Music
MVC
MySql
NetNewsWire
Object-Oriented
Object Relation Mapping (ORM)
Office
OOP
Open Screen
Open Source
Opera
Oracle
ORM
osx
pagination
Pair Programming
papervision3d
Patterns
Peer Creation
Performance
Personas
PHP
physics
physics engines
plugin
preloader
process
Web/Tech
Product Definition
productivity
Progressive Enhancement
Project Website
Prototype
Prototyping
PV3D
QA
qooxdoo
Radiant CMS
rails
Really Simple History
References
Requirements
Requirements
Alice Toth
Requirements Visualization
Restlet
RETE
Review
Rich Interactions
ruby
rubyamf
Ruby on Rails
SaaS
Safari
San Francisco
Scalability
Scenarios
Scriptaculous
SDLC
Search
Security
Selenium
Semantic web
SEO
Server Side
Silverlight
SOA
Social Networking
Software Processes
Songbird
SpiderMonkey
Sprajax
Spreadsheets
Standards
Startups
STI
Story Telling
Struts
Tamarin
Task Flows
Test Driven Development
Testing
The Ajax Experience
Tilt Component
Tools
TraceMonkey
Training
Trends
Tumblr
Tutorial
Tutorials
Unit Tests
Usability
Usability Testing
User Experience
user experience design
user interface
User Interface Standards
User Research
UXD
Venture Capital
Video
Vision
Visualization
VLC
Volta
Web/Tech
Web 2.0
Web Design
Web Development
Webkit
Weblogs
Web Services
Web Standards
Widgets
will_paginate
Windows
Wireframes
WordPress
workflow
work life balance
XML
XML Metadata
XUL
Yahoo Map AS3 API
YUI
Zeigarnik
Zeigarnik Effect
ZK