Usability Quote of the Day

July 4, 2009

Good designers can create normalcy out of chaos; they can clearly communicate ideas through the organizing and manipulating of words and pictures. -- Jeffery Veen, 2000   (via interaction-design.org)
Upholded by feed dot informer dot com

Saturday, December 31, 2005

Happy New Year 2006

Happy New Year - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Friday, December 30, 2005

A TV where you plug into the front

Making TV cable management usabile ...

"Since getting behind your TV to plug and unplug stuff can be a royal pain in the ass, all the cables travel through a tunnel and plug into the front of HP’s latest rear projection TV (oh, and Crutchfield, why are Smiling-Help-Man’s face and the Car Editor’s photo bigger than the actual product shot!?). And the area lights up so you can see what you’re doing. And the whole thing’s hidden by a door. Pretty snazzy. And it should be if you’re gonna drop $5k on a TV."   continued ...   (Via Signal vs. Noise)

Making TV cables accessible. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Making TV cables accessible.

The interface as a spec: including stories inline

Adding information to an interface ...

"Our very first Getting Real post was about saying no to the functional specifications document. We suggest building the interface first and using the actual screens as the functional spec. Read the post linked above to find out why.

There are times, however, when the interface doesn’t provide all the information required for the programmer to hook it up. Designers should always present the programmer with the multiple states of an interface element so the programmer understands what to display when this or that happens. But sometimes designing the static states takes more time, and doesn’t quite represent reality, as well as a brief note about how the functionality works. The key is to make this note in context — right next to the interface element its describing. The combination of real visuals and a brief contextual note shrink the chances of misunderstanding to near zero.

For example, we have tag functionality in the Sunrise app we’re developing. So, in order to fully explain the “entering a tag” functionality, we mocked up the basic UI and then included a story underneath the UI elements."   continued ...   (Via Signal vs. Noise)

Tag Interface. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Tag Interface.

How To Write an Effective Manual

A good manual is part of product usability ...

"Erin Massey of the Chicago Tribune newspaper (registration required) has written a nice article on the importance of product manuals. Although she interviewed me and included several quotations, she missed the most important lessons of all. So let me provide them here.

Is a manual important? Yes, but even more important is a well-designed product, one so well conceived and constructed that either the manual is not needed at all, or if it is, where the manual can be short, simple, and easy to understand and then to remember. How is this accomplished? By following some simple rules.

Hire excellent technical writers. The technical writing profession is an essential component of any design, just as important as designers, interaction and usability specialists, and engineers."   continued ...   (Via jnd.org)

Not a short manual. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Not a short manual.

Web fonts and typography

Website usability can be enhanced with fonts ...

"Up until a few years ago, choosing one of the two or three available typefaces, specifying a colour, and setting a font size was all you could do to affect the typography of a website. While web typography is still very limited when compared to that of print, the CSS support in modern browsers now allows web designers to actually think about typography.

Knowing how type on the web works, and more specifically how type on a computer screen works, will help you understand how it is different from print typography. And that will help you make better typographical design choices. I won’t go into further details, and instead point you to Andy Hume’s comprehensive SitePoint article on the subject: The Anatomy of Web Fonts.

The article explains the technology used to display type on computer screens, goes through the basic principles of web typography, including comparing some common web fonts, takes a look at how you can work around the current limitations, and hints at what may be available in the future. A great read."   continued ...   (Via 456 Berea Street)

Anatomy of web fonts. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Anatomy of web fonts.

GIS technology and the end-user experience

Usability is needed for GIS applications ...

"GIS is a technology, not a business process. As a result, taking GIS into the field by itself creates a number of potential challenges. Applications can be too slow, with learning curves that are too steep for rapid acceptance among end-users.

To ensure a successful transition, utilities will likely need to implement GIS with integrated field design. When considering your options, it is important to focus first on the end-user — not the solution itself.

New tools for field users should be easy to operate — preferably easier than accepted methods. The ideal field design solution incorporates all the information and functions needed to complete the job — such as work orders, specifications, GPS data, design tools, and maps — in an intuitive interface."   continued ...   (Via Putting people first)

GIS End-User. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

GIS End-User.

Thursday, December 29, 2005

Skype, Remember The Milk, Interface Design That Makes You Smile

Good interface design interacting with the user ...

My favorite part of Skype’s IM tool is the smiley button. Its placement in the border between the chat pane and the compose box always makes it look like the person you’re talking to just smiled at you. That’s nice.

Makes me smile back. Every time I glance at it. Whether or not there’s a smiley in the chat pane - I’m smiling, and I think that makes for a happier exchange. In the same way people can hear if you’re smiling on the phone.

This morning I signed up to check out Remember the Milk. Their sign-up process has persistent messaging for form field validation like email, password, username, etc. Though the powers of AJAX, it updates as you type. That real-time response made the annoyance of another login/pass form nearly a joy."   continued ...   (Via MNteractive)

Signup Feedback. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Signup Feedback.

Delicious Lesson and Social Network Ecosystems

Getting value from the interaction ...

"Joshua Porter brings up a wonderful point he is calling the "Delicious Lesson". The Del.icio.us Lesson is incredibly important, as it is one thing that many tools and implementations of the social web do not get. The person must get value for their interaction in the service or it will fade.

I see so much focus on the technology, the interaction components, the network effect, etc. But, the driver for these services that are successful is that they have a direct primary value for the person choosing to use them.

A Little Effort for Greater Personal Payback - Jeff Hawkings (the inventor of the Palm device and pen-based writing language (Graffiti) Palm used) talks about the most important point for people to adopt and learn Graffiti was it gave the person value. Jeff points out that learning Graffiti took a little bit of time, but people could see value of learning Graffiti as it made for a quicker input of information. There was personal value that did not take a lot of initial effort to learn, which returned a much greater value."   continued ...   (Via Off the Top)

Learning Graffiti. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Learning Graffiti.

Wednesday, December 28, 2005

The positive side effect of big text: less text

Larger and less text is positive ...

"Some think big is in while others think big is dumb. Others call big insulting:

But I wonder if we belittle users with visuals that implicitly say, “Hey, you’re too foolish to choose what to do next, so I’ve put a really big button right here just for you.”

Our take: Like everything, the key is moderation. Too much of anything is a bad idea. However, if you’re going to err on the side of bigger or smaller, I’d take bigger. Now I’m not talking 48 px type everywhere, but 14 px vs 10 px with the occasional big headline. Newspaper design has been around a lot longer than web design and they’re still sticking with big huge headlines.

And then there’s the positive side effect of big text: less text. The bigger the text the less you write and nearly every corporate website could use less words. Better words are more important than less words, of course, but less words would be a great start."   continued ...   (Via Signal vs. Noise)

Large text = less text. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Large text = less text.

Towards a learner-centred education system

User-centered education getting some attention ...

"The British educational thinktank NESTA Futurelab argues that the logic of education systems should be reversed so that the system conforms to the learner, rather than the learner to the system. This is, according to them, the essence of personalisation, which demands a system capable of offering bespoke support for each individual in order to foster engaged and independent learners able to reach their full potential.

Two recent documents are available for download:

- Vision document
- Personalisation and Digital Technologies"   continued ...   (Via Putting people first)

User-centered learning. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

User-centered learning.

Tuesday, December 27, 2005

Fewer templates, more user experience

Building usability into website design from the start ...

"We’ve been getting quite a few work proposals in the last few weeks - which you’d say is by any standards, a good thing. But the percentage of people (even on very high places) who have no clear notion of how user-centered design and information architecture should work for their company and websites is astonishing.

It’s almost 2006, let’s talk 2006 - I’ve said this before, but I’ll repeat: “The key to successful web applications is how much it puts the user in the center of the process”. What this means is that any design, for any webpage or web-application needs to take into consideration the user, not the looks.

The notion that a page needs to be pixel perfect before usability snaps into the process is wrong. Usability, user experience and information architecture need to be present from the start of development and design. This means that if you’re looking for people to send you “3 photoshop templates” of pages, you’re driving steady against the wall of “bad investment."   continued ...   (Via WeBreakStuff)

Photoshop Template. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Photoshop Template.

New Mercedes S-Class dashboard goes LCD

Trying for a more usable dashboard display ...

"Now you really won't want to have your on-board computer crash -- AutoSpies caught a glimpse of a new Mercedes S-Class where all the regular analog gauges have been replaced with a configurable LCD dashboard that can display different gauges, data, or even video. Not sure how much it'll cost as an option, but the dudes over at AutoSpies seem pretty floored by what they saw."   continued ...   (Via Engadget)

Mercedes LCD. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Mercedes LCD.

Semanticons reveal the meaning of files

Using semanticons (photo icons) as a memory aid ...

"The latest issue of Technology Research News (TRN) contains a short item about how photos can make icons meaningful. Researchers from Northwestern University are working on semanticons which will help us to quickly identify files. After analyzing a file name and its contents, their system uses a database of pictures to generate a semanticon, a specific icon based on the file type or the folder where it resides. Apparently, early users were able to navigate through their directories 20% faster than when looking at regular icons."   continued ...   (Via ZDNet)

Semanticons. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Semanticons.

The Year in Tags

The state of tags in 2005 ...

"This was a big year for tags. You could even say that tags went mainstream in 2005 (if tags were a band, they’d be The Killers). So, given we’re at the end of 2005, I thought I would take a look back at the major announcements and events in the world of ad hoc, user-created metadata.

These are the events I thought were important (feel free to add your own in the comments):

Technorati introduces tags (January). Technorati’s tags was the first implementation of distributed tagging (i.e. T’rati doesn’t own the tags the way Flickr does–it picks them up from blog posts while it’s crawling). It’s been criticized, but it’s widely used."   continued ...   (Via You're It!)

Technocrati. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Technocrati.

Saturday, December 24, 2005

Happy Holidays

We wish you all a very happy holiday ...

Happy Holidays - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Usability Research: Key Findings 2005

A nice summary of findings ...

"Originally written by the Pragmatic Ergonomist, Dr. Eric Schaffer.

- BROWSE OR SEARCH
On sites with clear labels and prominent navigation options, users tend to browse rather than search. Searching is no faster than browsing in this context. (Katz and Byrne 2003)

- COLOR AND GRAPHICS
Users pay attention to what they are paying attention to. Sometimes things that are quite obvious to the designer are invisible to the viewer/ users. (Simons and Chabris, 1999)

Color, shared background and co-location are stronger grouping cues than outlines. (Beck and Palmer, 2002) Layout on a Web page (white space and advanced layout of headers, indentation, and figures) may not measurably influence performance, but it does influence satisfaction. (Chaperro, Shaikh, and Baker, 2005)"   continued ...   (Via Robin Good)

Usability Findings 2005. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Usability Findings 2005.

Friday, December 23, 2005

Choices In Dialog Boxes

Dialog box confusion in terminology ...

"Most applications today present dialog boxes with questions and often present two or more choices. As example, if you close a modified document in an application the Save dialog appears and present two choices, Yes and No. Where Yes indicates that the user want to save the document and No to discard the document changes. In addition the Save dialog often contains the Cancel option where the modified document will not be closed."   continued ...   (Via User Interface Blog)

Notepad Dialog Box - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Notepad Dialog Box.

Usability Studies 101: Making Cookies

How vistor specific navigation aids help usability ...

"The NextStage CRO explains how to develop visitor-specific navigation for your site so that your customers come back and convert.

Visitor Designed Navigation makes use of visitor-based information to create recognizable, high interest navigation paths for visitors to your website. We started this discussion by investigating weblog data in "What Comes Next?", then showed an alternative method of using weblog data for information-rich sites in "MIPS are Next". Both of the methods described in these previous columns are excellent at giving this visitor an idea of what other visitors found interesting.

We're going to continue the discussion of Visitor Designed Navigation, and this time we're going to be visitor specific. The technique described here has proven useful on information-rich sites and can be a great boon to all other sites as well."   continued ...   (Via iMedia Connection)

Breadcrumbs. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Breadcrumbs.

Thursday, December 22, 2005

Call for Support: WebRadio is way in to looking at Customisation and User Behaviour

Customizing with skins effects user behavior ...

"The PROSKIN Project is researching the effect that user interface skins have on interaction, specifically as to whether there are correlations between user profile and observable interactive behaviours. Proskin stands for PROfiled SKINs.

PhD student Nick Fine at Brunel University is looking at how giving the user the means to change their user interface may have significant impact upon the quality of interaction, even for apparently subtle cosmetic changes.

He says: 'The ability to re-skin or customise the user interface is fast becoming a common feature of many software applications and operating systems."   continued ...   (Via Usability News)

ProSkin WebRadio. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

ProSkin WebRadio.

Icing or cake?

Usability is not everyones priority ...

"People who know me know I have misgivings about the phrase "user experience". Sometimes the phrase is appropriate (e.g., when discussing a purely recreational interaction), but oftentimes it is used in a lazy way to describe a raft of benefits of UCD. Today I encountered a good example how the phrase "user experience" can pollute the minds of people.

I was talking with someone who had previously engaged a well known "user experience" consultancy for advice. The consultancy has a fine, international reputation, and I have seen some of their work, which is good. I'm not slagging their ability in the least. But what I do object to is how they cast the benefits of UCD. They talked the standard talk about improving user experience. The message came through clearly. Yes, user experience is good, but face it, it really isn't our highest priority. Sure, it is nice to offer a good user experience, I'm sure our employees would be grateful, but the really important issues are functionality, how we can value from our databases."   continued ...   (Via Modules and Wholes)

Usability is icing on the cake? - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Usability is icing on the cake?

Usability Redefined: Howability, Taskability, Recommendability, Profitability

Several old vs. new comparisons when defining usability ...

"OLD Ease of Learning: How fast can a user who has never seen the user interface before learn it sufficiently well to accomplish basic tasks?

NEW Ease of Doing: How fast can a user accomplish the desired task? How much time? How much energy applied per unit of measured time?

Why better? Takes into consideration users doing something versus knowing how to get it done; practical and concrete measures; accounts for situations where learning is not needed nor desired. Deliberately factors out the need for learning, education, or necessary assistance."   continued ...   (Via WebWord)

Mario: Easy To Use. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Mario: Easy To Use.

Taking on QWERTY's illogic

A new alphabetical keyboard to consider ...

"John Parkinson thinks the world has been tied to an Industrial Age keyboard for long enough.

One of a long line of entrepreneurs and scientists who have been outraged by the seeming illogic of the standard QWERTY keyboard, the 62-year-old electrical engineer is showing off a new, rival keyboard design next month at the upcoming Consumer Electronics Show in Las Vegas.

He touted the idea at CES last year, too, but this time, he has actual keyboards that will be released to distributors in February. After years of hunt-and-peck typing, he's convinced that there is room for change and that if he can show the way, bigger companies might follow.

"For the longest time, I thought, like everyone else, there's nothing you can do about QWERTY," Parkinson said. "In the end, some ideas occurred to me, and I decided to do something about it myself."   continued ...   (Via CNET)

Alphabetical Keyboard. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Alphabetical Keyboard.

Personas: User Experience Resource Collection

A good list of persona links ...

"Discussion articles

Accessibility in the analysis phase: personas
The purpose of personas is to make the users seem more real, to help designers keep realistic ideas of users throughout the design process. A persona with a disability includes the same specific characteristics, demographics, experience level, and personal details as other personas. Personas that include accessibility considerations also include a description of the limiting condition (disability or situational limitation) and the adaptive strategies for using the product.

Accessibility in the analysis phase: user group profiles
User group profiles describe the characteristics of product users, the people who use a product. Because many designers start out with little or no familiarity with accessibility issues, adding accessibility considerations to user group profiles is particularly important."   continued ...   (Via Dey Alexander)

Accessibility Persona. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Accessibility Persona.

A Look At Motorola's New User Interface Review

A better mobile phone interface ...

Yes. Finally. A new UI from Motorola.

For starters, gone is the dedicated menu button and its 4 horizontal lines icon. The menu key, while making some sense, was always a point of contention for users looking to possibly move to a Motorola phone from one that was built by another manufacturer. Over the years Motorola has made a number of concessions of this type, such as swapping the position of the red and green call buttons. This isn't to say that Motorola was wrong in putting the red button on the left, just that everybody else did it the other way around. Which is what they do now. Well, the same situation applies to the menu button. I think it is a fine idea, even if the icon was not too clear, but the fact that none of the other major manufacturers made use of a similar design meant that Motorola handsets were always different from what non-Motorola users were used to."   continued ...   (Via MobileBurn)

Motorola A910 Interface. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Motorola A910 Interface.

Wednesday, December 21, 2005

New guidelines for the design of ICT products and services to be used by young children

New product design guidlines for children ...

"Manufacturers and service providers are starting to design, test and launch a stream of new products specifically for young children. To support the development of these new products and services, ETSI has published a guide.

The leader of the task force which produced the new guidelines, Anne Clarke, says that 'children under 12 years of age are becoming a significant consumer group for advanced computing and communications services. In some cases, children as young as four or five are using 3G phones and the Internet'.

The European Telecommunications Standards Institute (ETSI) plays a major role in global standardisation of technologies, including telecommunications and broadcasting. ETSI unites around 700 member companies from nearly 60 countries, including manufacturers, network operators, administrations, service providers, research bodies and users."   continued ...   (Via Usability News)

ETSI Website. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

ETSI Website.

Label your form controls properly

On clickable form labels ...

"In Label - the secret element, Robert Nyman points out how annoying it can be to use a site that does not make proper use of the label element to associate form controls with their labels.

I second that. Placing the cursor on a tiny radio button or checkbox can be tricky. However, if the corresponding text has been associated with the radio button or checkbox you can also click the text. Much easier, wouldn’t you say? Unfortunately that is one area where my favourite browser, Safari, falls short of the competition.

Oh, how I would love to have clickable form labels in Safari. Pretty please, give us clickable form labels soon!"   continued ...   (Via 456 Berea Street)

Safari Browser. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Safari Browser.

The Quantum Mechanics of Users

Finding out what the users really think ...

"People have commented that "creating passionate users" means nothing more than "listening to users like we always have--DUH!" But if it were that simple, we'd all be producing--and using--products and services that people love. That meet real needs. That fulfill real desires. That help people kick-ass.

How, then, to explain the Grand Canyon-sized gap between what users really want and what we so often produce as a direct result of our sincere listening? Maybe the physics is wrong...

Light can behave as a wave, until you ask it to explain how it got from point A to point B, in which case it can behave as a particle. In other words, asking light to explain itself can change the very nature of how we perceive it. And this notion that sometimes "observing an event changes the event" comes up in many areas of quantum physics."   continued ...   (Via Creating Passionate Users)

Determining User Priorities. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Determining User Priorities.

Some Hard Lessons in User Interface Design

How the UI for a login screen was fixed ...

"When you register for the Holidailies portal you must select a username and a password. They become your credentials to post to the portal. We normally have a few cases of forgotten logins on opening day. This year, however, we had a significant number of people—nearly 5% of the registrants—reporting login problems.

Developers tend to blame the stupid users when problems occur. But when it's 5% of the users reporting problems you can't even try to trot out that lame excuse. Typically, these problems arise due to flaws in the user interface (UI). I believe that's exactly what happened in Holidailies. The registration difficulties probably resulted from two bad UI decisions that I made.

This year, we used nearly the same registration process as last year. The only thing we changed was the way that we assigned usernames. Last year, when you registered for the portal you had to choose a username and enter it into an empty form field. This year we provided a default username value. When you entered your contact email address into the form it also was copied (by the magic of javascript) into the username field. That provided a default value that you could choose to keep or change. A significant number of people (114 out of 165) chose to keep the default."   continued ...   (Via Chromium Switch)

Holidailies Website. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Holidailies Website.

One Billion Internet Users

Big need for usability due to increased websites in China as well as the US ...

"The Internet is growing at an annualized rate of 18% and now has one billion users. A second billion users will follow in the next ten years, bringing a dramatic change in worldwide usability needs.

Some time in 2005, we quietly passed a dramatic milestone in Internet history: the one-billionth user went online. Because we have no central register of Internet users, we don't know who that user was, or when he or she first logged on. Statistically, we're likely talking about a 24-year-old woman in Shanghai.

According to Morgan Stanley estimates, 36% of Internet users are now in Asia and 24% are in Europe. Only 23% of users are in North America, where it all started in 1969 when two computers -- one in Los Angeles, the other in Palo Alto -- were networked together."   continued ...   (Via Alertbox)

Internet Usage. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Internet Usage.

Ditch site maps? I think not...

A site map does not take the place of good navigation ...

"Building and maintaining a site map or site index is, like on-site Search, fixing the symptom and not addressing the true problem,” writes renowned usability guru Jared Spool in his most recent posting, What about Site Maps and Site Indexes? (thanks to James Robertson).

Mr. Spool is a smart guy. A web leader. A true guru. But he’s dead wrong on this issue. Well, partly wrong.

Jared maintains that if the site navigation or ‘scent’ is good, you don’t need a site map. Wrong. Even regular users go the site map once in a while. Yes, navigating the sites navigation tree or categories is preferred, followed by using the search engine, but sometimes users just want a site map to have a bird’s eye view of the entire site... to see how content relates to each other, particularly first time users.

Spool also intimates in his above comment that search is redundant if your navigation is good. Tell that to IBM, Cisco, Oracle or anyone else who has millions of pages on their intranet. I dare anyone reading this to ditch their search engine and then sit back and see what the employee or customer user says...."   continued ...   (Via Intranet Blog)

Sitemap. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Sitemap.

Tuesday, December 20, 2005

6.831 User Interface Design and Implementation

An open online graduate UI course from MIT ...

6.831 introduces the principles of user interface development, focusing on three key areas:

- Design: How to design good user interfaces, starting with human capabilities (including the human information processor model, perception, motor skills, color, attention, and errors) and using those capabilities to drive design techniques: task analysis, user-centered design, iterative design, usability guidelines, interaction styles, and graphic design principles.

- Implementation: Techniques for building user interfaces, including low-fidelity prototypes, Wizard of Oz, and other prototyping tools; input models, output models, model-view-controller, layout, constraints, and toolkits.

- Evaluation: Techniques for evaluating and measuring interface usability, including heuristic evaluation, predictive evaluation, and user testing."   continued ...   (Via MIT OpenCourseWare)

Smart Kiosk. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Smart Kiosk.

The Shock of the New: Designing for the Post-Consumer (Part 2 of 2)

The future role of social practices in design ...

"Last week, as I was chatting enthusiastically about a new style to my (very cool) hairdresser Amanda, she pulled out a Blackberry to retrieve an email from her tattoo artist in New Haven. Somewhat taken aback, I asked her about her new accessory. She wryly answered: “I’m a businesswoman.”

On one level, I’m not surprised that Amanda has a Blackberry. She is successful, and certainly Blackberry functionality is useful for a busy stylist. Dressed in her Tokyo-Goth street-couture, it surprised me that Amanda seemed so much cooler and more interesting than my conception of the typical Blackberry user.

We’re socialized to recognize products as signs of particular character attributes. Cultural critics hypothesize that consumers acquire particular products to project the attributes associated with those products—in this case of the Blackberry, social importance and business cachet. A product like a Blackberry (or a Louis Vuitton bag, or a Hummer, or any number of such markers) signals social status by proxy."   continued ...   (Via frog Design Mind)

Mod gadgit for social recognition. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Mod gadgit for social recognition.

Sensible Forms: A Form Usability Checklist

Tips for creating usable forms ...

"Computers are supposed to make our lives easier, not more difficult. As usability-conscious designers, we can make our users’ lives easier by thinking about the way people interact with our websites, providing clear direction, and then putting the burden of sorting out the details in the hands of the computers—not the users.

It’s that last part that we’re going to focus on here. We’ve all heard and read about big usability mistakes time and time again: “Don’t use images or flash for navigation,” “Don’t use Javascript for links,” and I certainly hope we’re all applying those lessons in our work. It’s often the smallest usability quirks, however, that create the biggest annoyances for users, especially when it comes to HTML forms. Follow these guidelines, and you’ll be off to a good start.

Use the right field for the task - With so many form elements to choose from, each with distinct advantages and disadvantages, it can be difficult to decide which elements to use in a given situation. Use radio buttons, checkboxes, and select boxes appropriately: for radio buttons or checkboxes, use the fieldset and legend tags to group the elements logically under an obvious heading. This grouping keeps the form manageable to users, as it can be broken down into smaller pieces in their minds."   continued ...   (Via A List Apart)

Radio Buttons. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Radio Buttons.

Living La Vida Virtual: Interfaces of the Near Future

What the virtual future has in store for us ...

"Personal computing is in an awkward adolescence right now. On one hand, we are rapidly moving into ubiquitous computing environments that let people constantly interact with the omnipresent network; on the other, the devices and interfaces we are using to enter these new frontiers provide woefully inadequate user experiences. Let’s take a look at one of the key technologies that will take mobile user experiences to the next level: holography.

Holography and the State of Input - The primary reason why the BlackBerry® became such an enormous success is its miniature QWERTY keyboard, which lets people rapidly enter information and, in the process, made easy-email-while-on-the-run a reality. Earlier devices such as cell phones and Palm® PDAs provided a substandard means of communicating with a computing system, but the BlackBerry took the well-established and long-practiced QWERTY keyboard interface and employed it in a practical and portable form. This allowed people to engage in a more natural human/computer interaction."   continued ...   (Via UXmatters)

Holographic Interface. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Holographic Interface.

Small Multiples Within a User Interface ::

The use of small multiples for complex information ...

"Many software programs provide access to, and let users work with, large amounts of information. In addition to interactions that allow users to create, edit, and expand massive data sets, these information-rich applications must also support effective data interpretation.

Data monitoring, reporting, and modeling applications require people to makes sense of large amounts of information quickly and easily. It should come as no surprise, then, that for such applications many interface design problems are actually information design problems. As a result, we can leverage information design solutions when tackling such problems. Using small multiples is one such solution.

“Small multiple designs are graphical depictions of variable information that share context, but not content.”—Edward Tufte"   continued ...   (Via UXmatters)

Small Multiples. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Small Multiples.

Monday, December 19, 2005

On Tagging Interfaces and Usability

A new user interface design for tagging ...

"Over on the Signal vs. Noise weblog a post highlighted the different tag input interfaces used by some of the major players and asked "Can't we all just get along?" This post touches on a topic I've been putting a lot of thought into these days as I plan out the next version of Tags.App, my tag-enabling plugin for Movable Type. I thought I'd highlight some of the observations made in that post and go on to present my own findings.

The post shows examples from Del.icio.us, Flickr, 43 Things and Amazon. Del.icio.us uses single word tags separated with spaces. Flickr follows a similar path, but allows for spaces by optionally wrapping multiple words in quotes. 43 Things uses commas to separate multi-word tags instead of spaces eschewing the need for quotes. Amazon allows spaces and avoids commas and quotes entirely by restricting one tag per text box instead of the one box holds all like the others. Amazon also blow out the interface with an auto suggest interface widget.

The post concludes, "when you've got a new technology, inconsistency is to be expected. With all these different formats still be around a year from now or will a standard emerge?" I wouldn't consider tags a technology, but I do believe this type of interface experimentation is a necessary part of evolving user experience."   continued ...   (Via Appnel Internet Solutions)

Flickr's use of tagging. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Flickr's use of tagging.

Web 2.0 Dead?

A detailed discussion with links about the current state of Web 2.0 ...

"It was bound to happen sooner or later, but it was a little sooner than expected. Richard McMannus explains why Web 2.0 jumped the shark as an follow-up to his Web 2.0 is dead. R.I.P. post. This pronouncement has an impact as he is co-writing a book on Web 2.0 for OReilly Books (with Joshua Porter) and writes Web 2.0 Explorer on ZD Net. In Richards explanation he gives the prime reason is to get away from the hype and cynicism.

Tim OReilly describes Web 2.0 in rather long detail. But in the more than a year that the term has been around it has not been used in any specific specific sense and it quickly turned into a buzzword with little meaning. There are some profoundly different things taking place on the web, when we compare it to the web five years ago. These things seem to be best described by their terms and pointing to what has changed and where we are going now. Richard writes that he will still largely be writing about the same things, but will not be using the Web 2.0 moniker."   continued ...   (Via vanderwal.net)

Google - Rich Interface.  - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Google - Rich Interface.

Marketwatch: A little too real-time?

A case of technolgy being ahead of the interface ...

"Marketwatch, just because you can doesn’t mean you should. Do you really need to embed stock quotes in your articles that update in real-time every three seconds? Real-time when I opened the article is nice, but having the prices flash and change every few seconds is pretty distracting when the changes are displayed in paragraph form like this:(below)

A little sidebar or embedded floating box would be cleaner and easier to scan too."   continued ...   (Via Signal vs. Noise)

Marketwatch. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Marketwatch.

But is it memorable?

Designing for memorability ...

"So your product, training, documentation, presentation, blog, whatever is interesting, but is it memorable? Do you want it to be?

Where were you when you heard the news about 9/11? Chances are, you remember. What did you eat for dinner last Tuesday? Chances are, you do NOT remember (unless dinner involved a hot date, your birthday, a fist fight with the waiter, or some other emotionally-charged event). Just as emotions can tell the brain that something is worth attention, emotions also tell the brain that something is worth recording.

The number eight is arbitrary, but the numeral "8" overlaid on a picture of the spider (which brains are preprogrammed to react to), helps "burn in" the link between spiders and the number 8.

The number eight is arbitrary, but the numeral "8" overlaid on a picture of the spider (which brains are preprogrammed to react to), helps "burn in" the link between spiders and the number 8."   continued ...   (Via Creating Passionate Users)

A memorable spider. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

A memorable spider.

Navigating Complex Waters: Product Design’s Perfect Storm (Part 1 of 2)

How product design is changing ...

"It wouldn’t feel like the proper end to 2005 without some sort of dramatic, sensational prediction. So I’ve taken it upon myself to declare the following:

Product design, as we know it, is finished.

An audience of product fetishists might find this assertion unthinkable, given all the pop-business literature declaring “design” as the new black. Yet despite the most glowing laudations about the growing importance of design by business gurus (and even some of our favorite bloggers), the fact remains that professional designers are responsible for less than 2% of our constructed environment.* That means that most of the products you surround yourself with are not designed: the user experience is not crafted purposefully, the aesthetics are often haphazard, and the functionality is less well thought out. (This is not to say that designers always execute well on these fronts—think: Windows—but with “designed” products, there is a greater likelihood that you’ll experience some sort of organizing logic.)"   continued ...   (Via frog Design Mind)

Product Similarity. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Product Similarity.

The ABCs of the BBC: A Case Study and Checklist

A detailed discussion about the structure of indexes as a tool ...

"It is said that a tenth century Grand Vizier of Persia took his library of 117,000 volumes with him whenever he toured his kingdom. He trained his caravan of camels to walk in alphabetical order so that he could always find what he wanted. Luckily, these days it is somewhat easier to organize and present your content in alphabetical order.

A-Z indexes are sometimes seen as the less desirable counterpart to other navigational elements such as sitemaps and, especially, search. However, A-Z indexes can be a valuable secondary navigation tool, especially for large sites with a lot of granular content.

Because there are already a number of excellent articles online that talk about the value of A-Zs, I’d like to outline instead what we did at bbc.co.uk in the first half of 2005: namely, repositioning the site index as a viable secondary navigation tool. I’ll also offer a checklist of eight areas to consider when thinking about creating an A-Z site index. The list has already proved useful in advising BBC colleagues with no background in indexing or information architecture on how to painlessly create local A-Zs for their particular areas of content."   continued ...   (Via Boxes and Arrows)

Top of Index page. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Top of Index page.

Sunday, December 18, 2005

Improving Usability for Screen Reader Users

Tips for making screen readers usable ...

"Simply ensuring your website is accessible to screen reader users is unfortunately not enough to ensure these users can find what they're looking for in a reasonably quick and efficient manner. Even if your site is accessible to screen reader users, its usability could be so incredibly poor that they needn't have bothered coming to your site.

Fortunately, there are a number of simple-to-implement guidelines that you can follow, which not only drastically improve usability for screen reader users, but for all web users:

1. Descriptive headings
2. Descriptive link text
3. Lists"   continued ...   (Via Usability News)

NextUp Screenreader. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

NextUp Screenreader.

Beyond Menus and Toolbars in Microsoft Office

An Office 12 interface presenatation given at BayCHI and available for downloading ...

"Farewell, menus and toolbars. More than 20 years after the introduction of the Macintosh, software has outgrown the basic building blocks of today's standard user interface. The upcoming version of Microsoft Office does away with the top-level menus and toolbars in favor of a new task-oriented, contextual user interface.

This talk will provide a historical perspective on the evolution of the Office user interface and the battle against the mounting complexity of the product. You'll get a behind-the-scenes look at the different design iterations, and an in-depth look at the new Office UI constructs, including the Ribbon, galleries, contextual tabs, and the MiniBar. You'll also learn the ideas behind "results-oriented design," which Jakob Nielsen wrote, "might well be the way to empower users in the future."

With 400 million Office users potentially making this transition, would embracing these concepts solve problems in your own products? A question and answer session will follow the talk."   continued ...   (Via BayCHI)

History of Microsoft Office - User Interface Design, Human Computer Interaction (HCI), Ergonomics

History of Microsoft Office.

Exploit Natural Mappings in Interface Design

Poor mapping of controls and displays reduces usability ...

"The on-screen guide for my Direct TV box looks roughly like this:

Direct TV Display - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Direct TV Display.



The control on my remote that causes the current channel to move up and down looks like this:

Direct TV Control. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Direct TV Control.



If the problem here is obvious to you, you too may have a future in user interface design. If you thought to yourself, "hey, they screwed up an obvious natural mapping," then you are probably already involved on some level.

Just to make it perfectly clear what I am talking about, the orientation of the controls are out of whack. From my perspective, the channels increase going down on the screen but going up on the remote. The fact that the two don't match causes me to change the channel up when I meant to change it down, and vice versa, pretty much constantly." (Via Dan McKinley)

Friday, December 16, 2005

What about Site Maps and Site Indexes?

If the scent is right, the site map and index are less important ...

"Recently, I posted about our current thinking on on-site Search. I said it was, in essence, how users deal with the scent on the page failing them. Fix the scent problems and the need for on-site Search diminshes quickly.

Site maps and site indexes fall into the same issues.

In an abstract way, you can think of a site map or site index as a Search utility where all the functional search terms are already presented as links. Instead of requiring users to guess at the possible Search term, you list them out. In a site map, you typically list them in related groupings of content (as perceived by the designers of the site). In a site index, you list them in alphabetical order."   continued ...   (Via UIE Brain Sparks)

Google Sitemaps. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Google Sitemaps.

Toshiba Brings Peace of Mind to Simple Cellphone Users

Another attempt to simplify complex technology ...

"If you’ve ever gotten a desperate call from your parents, from their land line, begging you to help them figure out the new cellphone they just purchased, you’ll be happy to hear about Toshiba’s V50T. An easy-to-use cellphone with something called “simple modes” built in, you can personalize your menu to only show features you use (such as making and receiving calls), and dump the rest. You can also enlarge the type for easy reading, and for kids and/or teenagers, you can actually limit the amount of talktime and phone numbers that can be dialed. I’d say that’s a score for frustrated parents paying way too much in overage fees. Minimal features include a 1.3-megapixel camera, miniSD card slot and 2 TFT displays. Comes in 4 colors."   continued ...   (Via Gizmodo)

Toshiba V50D - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Toshiba V50D.

Maps: Putting Ourselves in the Picture

The Frappr interface ...

"UN is offering a week of interesting map interfaces and activities in the run up to the festive season. The last is Frappr, a social software application that runs on Google Maps to bring groups and locations together. So, communities of interest and communities of geography meet at last in the online world.

Here are answers to the questions you are no doubt forming if you haven't tried it out yet.

'1. What is Frappr?
Frappr is an online tool that lets you map out the zip code where you live, work, vacation, or anything else! You can then share your unique URL with friends and find out where the rest of them live and work in relation to everyone else."   continued ...   (Via Usability News)

Frappr Website. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Frappr Website.

Thursday, December 15, 2005

Web browsing getting better on cell phones

Mobile devices finally getting better with Web interfaces ...

Browsing the Internet on conventional cell phones -- like the ones that come free with a service contract -- has not exactly been a user-friendly experience. Dealing with clunky browsers, long download times and page after page of text menus is just no fun.
But getting online with those inexpensive cell phones is getting better.

Software companies are developing better applications that make mapping, searching and e-mailing easier. Networks are getting faster and more reliable. And the phones themselves are getting easier to customize.

"Usability is hugely important," said Gartner analyst Van Baker. "If it's too cumbersome, too complex, then people will reject it as they've done earlier."   continued ...   (Via Charlotte Observer)

Mobile Web Browsing. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Mobile Web Browsing.

I Am Your Density

Making the Office 12 interface look simple ...

"A comment we've heard again and again about the Office 12 interface after people use it or see it demoed live is: "wow, it's so much better than I imagined just by seeing the screenshots." Several people made that comment to me once again after my talk at PARC Tuesday night, and I wanted to write down some thoughts on the subject.

Fundamentally, there's a kind of UI that is built with great screenshots in mind. Generally including big, shiny buttons with copious whitespace on all sides, these interfaces look extremely simple and easy-to-use in "back-of-the-box" marketing screenshots. The screenshot-optimized interface is generally low-density, with only a few controls on the screen at once.

We've definitely thought about this in designing boxshots for marketing materials in past releases of Office. The picture we show on the back of the box is what the product looks like the first time you run it. But one of the problems with the current Office user interface is that it tends to degrade over time--toolbars pop up over your document and never go away, things get accidentally moved, Task Panes pop up automatically, etc. When we do site visits, we often see Office screens that look more like the picture below than the one on the back of the box."   continued ...   (Via Jensen Harris)

Office 12 Ribbon Density. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Office 12 Ribbon Density.

Maps Special: Watching Alice in Wonderland play out

A unique way to view text ...

"UN is offering a week of interesting map interfaces and activities in the run up to the festive season. So far all the maps have been geographically-inspired but today's is an old favourite of information visualisation: a reminder that there is more to spatiality than location. "TextArc" is W. Bradford Paley's delightful rendering of the words of "Alice in Wonderland" - and other texts - in a spectacular arc. It will call up the text of the book for you and dance about linking words as it progresses or you can click on a particular word and look at the web of connections. Part art, part information design and part joy to behold.

Paley says: 'Suppose your boss hands you a 500-page book with no index, no table of contents — no metadata at all — and says you need to know the key ideas expressed in the book, where they’re concentrated (but don’t miss any important single mentions!) and, if there are main characters, who are they and when they enter and exit. Then he says the meeting starts in five minutes. TextArc, a visual concordance/index, might give you just enough to wing it..."   continued ...   (Via Usability News)

TextArc. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

TextArc.

Wednesday, December 14, 2005

Reassuring Users with Inukshuk Content

Building confidence enhances usability ...

"At User Interface Engineering, we use the term "inukshuk" to describe the type of content found in the UNI profiles. It's the name of stone figures created by Inuit hunters as guide markers. The hunters arranged the piles of stones in the likeness of human beings, signifying to other hunters that someone already has passed through and experienced their same journey. An inukshuk provided reassurance and empathy to others and alleviated an Inuit's fear that they were off the track.

In our research, we've seen that, just like the Inuit hunters, users on the web want reassurance that others have shared their experiences. Many times, users are contemplating important decisions. To understand if they are making the right decision, they often want to go beyond facts. They want to know if it "feels" right.

Inukshuk content, when done well, can give the user confidence in a way that factual content can't. The Inukshuk content assures the users that other people have been there before, following the same path they are currently traveling. The users see that these other folks have made it through the decision process and can gain reassurance in their own decision."   continued ...   (Via UIE)

Inukshuck Content - Patient Stories. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Inukshuck Content - Patient Stories.

Usability v. Human Factors in Complex Mobile Systems

A systems approach to usability ...

"There's been much discussion lately about how important design has become for mobile solutions, applications and devices. Nearly the first eight years of my career were devoted to questions of usability, suitability, design and even survivability of complex systems developed and deployed by the U.S. military. I've come to enjoy the equally mistrustful expressions from the military towards preceived academic nature of studying human performance and systems design which considered the human as part of the system; and the mistrustful expressions from those in technology about any phrase that includes the word military. There's an assumption that military products are somehow low quality which is astonishing when you consider that the Internet which enables email, the web and other services was designed and built by contractors serving the military much in the same way that my work did.

Market responses to solutions and devices like the iPod, the Razr and the Treo demonstrate that consumers value design and the advantages to a systems approach to the user experience."   continued ...   (Via 3G)

Systems Approach to UI - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Systems Approach to UI.

Structured Blogging has (Re)Launched

New tools for building Web applications ...

"Structured Blogging has launched and it may be one of the brightest ideas of 2005. This has the capability to pull web services into nearly every page and to aggregate information more seamlessly across the web. The semantic components help pull all of this together so services can be built around them.

This fits wonderfully in the Model of Attraction framework by allowing people and tools to attract the information they want, in this case from all around the web far more easily than ever before."   continued ...   (Via Vanderwal)

Structured Blogging Website. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Structured Blogging Website.

10 Places You Must Use Ajax

A guide to Ajax usage ...

"It's been well over a year now since GMail changed the way everyone thought about web apps.

It's now officially annoying to use web apps that haven't replaced clunky html functionality with peppy Ajax goodness.

Here are places Ajax should now be required in a web application:

- Form driven interaction.
- Deep hierarchical tree navigation.
- Rapid user-to-user communication."   continued ...   (Via Alex Bosworth)

GMail - User Interface Design, Human Computer Interaction (HCI), Ergonomics

GMail.

Tuesday, December 13, 2005

Maps Special: The missing Layer of Personalised Places

Maps getting more sophisticated ...

"UN is offering a week of interesting map interfaces and activities in the run up to the festive season. Today's is the "Boston HyperMap Atlas" by StrataVarious, demonstrating what the company calls 'innovative user controls'.

Based on the maps functionality appearing from the major search engines and supplementing their functionality, the Hypermap Atlas 'is a demonstration of the powers of layered "smart graphics" for learning about geography'. The Boston Proper Atlas was launched in August 'to show how interactive mapping can go to the next level of organising place-related data for desk-top travel and viewing relationships between multiple map features."   continued ...   (Via Usability News)

Boston Hypermap - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Boston Hypermap.

When tagging doesn't work - a comparison of two sites

Tagging does not work for all websites ...

"As an information architect, I love the idea of tagging (or folksonomies) as much as everyone else. I have had tremendous success using del.icio.us to find information that is difficult to surface with search and love clicking through flickr tags looking at interesting photographs.

But sometimes the concept just doesn't work, even in domains where we'd think it should.

I'd like to compare two of my favourite podcast sites - Odeo and IT Conversations."   continued ...   (Via DonnaM)

Odeo Website. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Odeo Website

Monday, December 12, 2005

IRS Makes Less Taxing Web Site

A usability redesign case study ...

"A major redesign of the Internal Revenue Service's public-facing Web site makes search and navigation less taxing for users.

The IRS' Web site was launched in 1996, as the Digital Daily. At the time, the site was more of a communications vehicle than a business tool, said George Coffin, chief, public portal branch, Internet development services, Electronic Tax Administration, in Lanham, Md.

In 2002, the site was bulked up and renamed IRS.gov. Major changes at that time included the implementation of Vignette Corp.'s Vignette CMS (content management system), as well as a new look and feel for the entire site."   continued ...   (Via eWeek)

New IRS Website. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

New IRS Website.

Synonyms Need Love Too

The use of synonyms in minimal interface designs ...

In the humane vs inhumane… err, I mean “minimal”… interface debates synonyms don’t seem to get much respect. You would expect this from the minimalist crowd but many otherwise humane people seem to have little regard for method aliases. Here are a couple of examples.

Charles Miller - Having two otherwise equivalent ways to perform the same operation is bad user-interface design, and it’s bad library interface design, because the existence of the synonyms actually adds to your cognitive load by making you choose between them.

Joey DeVilla - I do have one complaint about the Ruby approach — method aliases. While it’s convenient for luring in programmers from other languages, I think it actually detracts from code readability to have two method names mean the same thing."   continued ...   (Via Peter Williams)

Synonyms - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Synonyms.

Intranet Portals and Scent are Made for Each Other

The relationship between Information Scent and Intranets ...

"Organizations are becoming increasingly dependent on their intranet -- the internal web-based network they use to communicate and function. Many organizations are finding the content and functions available growing at a voracious rate.

In some cases, we're seeing the amount of content available growing at more than a gigabyte each month. How does the intranet designer ensure that employees can productively find the important content and functions, with minimum frustration, with a network growing that quickly? Many designers are turning to Portals -- a set of pages that act as a launch point for every dive into the intranet's ocean of content.

On most intranets we've studied, employees start their intranet session by bringing up the portal in their browser. From their, they drill into the institution's network until they find what they want.

Portals are unique to intranets. The Internet doesn't have portal pages."   continued ...   (Via uie/Jared Spool)

Information Scent - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Information Scent.

Web Usability: Why Do We Overlook the Obvious

The importance of usability to retail sites ...

"As the holiday season grows closer, and my shopping intensifies, I can't help but notice how many online retailers don't seem to be paying attention to the usability of their sites.

With the time, money and effort put in to establishing yourself in the online marketplace, it doesn't make any sense to drive customers away from your site. Whether it is poor design, confusing navigation or any of the other annoyances that can drive potential customers away; not focusing on the user's experience within your site is going to cost money and undermine your overall marketing efforts.

There are a number of things an Internet retailer can do to increase their presence in the search engines. Accomplishing this should in turn increase the traffic to the site, which in turn should increase conversions. When this increase in traffic does not correlate with an increase in sales, one reason could be usability."   continued ...   (Via )

Amazon. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Amazon.

Head First HTML/CSS finally ships!

A new book about HTML by well regarded authors ...

"Eric and Beth's Head First HTML with CSS & XHTML is finally shipping on Amazon. This is the book I have been waiting for so I can finally learn more about the front-end of the web instead of languishing in the web's dark underbelly (in my case, the Java back-end).

The book is stunning--the Freemans (driving force on the Head First Design Patterns book--one of the top five bestselling computer books of 2005, and winner of the Jolt Cola/Software Development Award), are software/web geniuses. I don't say that lightly--both hold multiple CS degrees, Eric was the original inventor and co-creator of LifeStreams, and both are former Disney executives, where they led some of the entertainment company's most ambitious web-based intiatives. Most importantly, they care about their readers and have crafted each page of this book (all 694 of them) to help those of us who still need to learn this stuff "get it" with the least amount of pain, the deepest understanding of the key things that matter, and have fun at the same time."   continued ...   (Via Creating Passionate Users)


Head First HTML with CSS & XHTML


Recommended Book


Check-out more books at Usernomics.

The Best Web 2.0 Software of 2005

A categorized listing of the best Web 2.0 sites ...

"It's getting towards the end of the year and I'm feeling the need to take stock of where we've actually come with Web 2.0 in the last 12 months. So much has happened in this space recently and a tidal wave of innovative, high-quality software has been released this year. So much in fact, that it's hard to keep track of it all. While many of us talk about Web 2.0 ideas, there's no substitute for pointing to concrete examples. And this also gives credit where credit is due to all the hard-working folks building the next generation of the Web.

So in spirit of the holidays, here is a list of some of the best Web 2.0 software that I've come across so far. You may have heard of some of these, but hopefully you'll find a few nice new Christmas presents under your Web 2.0 tree."   continued ...   (Via Don Hinchcliffe)

Web 2.0 Runner Up Sites. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Web 2.0 Runner Up Sites.

Introduction to Web 2.0

A good summary introduction of Web 2.0 ...

"Web 2.0 is an umbrella term referring to the ongoing transition to a full participatory Web, with participation including both humans and machines. Web 2.0 is characterized by the following themes:

The Read/Write Web: In which the Web is seen as a two-way medium, where people are both readers and writers. The main catalyst for this is social software, allowing communication and collaboration between two or more people.

The Web as Platform: In which the Web is seen as a programming platform upon which developers create software applications. The main catalyst for this is Application Programming Interfaces, or APIs, allowing communication between two or more software applications.

The term "Web 2.0" was coined by Dale Dougherty of O'Reilly Media."   continued ...   (Via Squidoo/Joshua Porter)

Web 2.0 - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Web 2.0.

Math On Demand (Office 12 Coolness, Part 4)

New features with Excel 12 ...

"Here's a neat time-saver in Excel 12. Let's say that you have some numbers somewhere in the Excel grid, in this case monthly sales figures for the branches of a store:

Excel 12 Grid. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Excel 12 Grid.


Now, let's say I wanted to quickly find out the average or total sales for some or all of my store branches. In Excel 12, I simply multi-select the sales figures of the store branches to compare and look down in the status bar at the bottom of the screen:

Excel 12 Matches - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Excel 12 Matches.



As I select numbers in the grid, the status bar automatically updates with the most commonly computed simple formulas. The status bar can display Average, Count, Numerical Count, Minimum, Maximum, and Sum".(Via Jensen Harris)

Pasionate Users Talk Different

The need for usercentric words when designing Web 2.0 applications ...

"Listen in on a conversation between three airplane pilots, and--assuming you aren't a pilot--you might understand 50% at best. Listen in on a conversation between three software architects, and even a new programmer might not have a clue. Snowboarders have their own terms. So do plumbers, photographers, librarians, ministers, dancers, realtors, musicians, graphic designers, and filmmakers (best boy? gaffer?).

But there's a world of difference between a specialized lexicon of domain-specific terms and buzzwords.

Domain-specific terms compress information, while buzzwords often masquerade as information."   continued ...   (Via Creating Passionate Users)

Passionate Lexicon. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Passionate Lexicon.

The Design of Type

An overview of recent developments in type font design ...

"Type seems to be getting a lot of attention these days. Here are a few recent ruminations on typography:

The Elements of Typographic Style Applied to the Web
Richard Rutter of Clearleft is bringing principles from The Elements of Typographic Style to the Web one at a time:

“In order to allay some of the myths surrounding typography on the web, I have structured this website to step through Bringhurst’s working principles, explaining how to accomplish each using techniques available in html and css."   continued ...   (Via Functioning Form)

Typographic Design - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Typographic Design.

Sunday, December 11, 2005

Interfaces

An excellent series of articles from HCI 2005 produced by The British HCI Group (PDF Format) ...

HCI 2005 - User Interface Design, Human Computer Interaction (HCI), Ergonomics

HCI 2005.

Saturday, December 10, 2005

W3C looks to improve speech recognition technology for web transactions

Setting standards for voice interface design for commercial use ...

"W3C, the standards-setting body for the Internet (World Wide Web Consortium), is has completed a draft for the important VoiceXML 3.0 - technology enabling voice identification verification. While normally associated with voice commands, it has the potential to greatly speed and improve the accuracy and positive proof of online transactions.

Some larger net businesses are even using it to confirm orders and verify identity. Many, however, have become increasingly worried about the reliability and security of these transactions with fraud and identity theft on the rise. Error rates have been around 1 to 2% - unacceptable for ironclad business transactions."   continued ...   (Via PhysOrg)

Voice Transactions. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Voice Transactions.

Wanted - Spec Owner

Spec Owner - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Spec Owner

(Via OK/Cancel)

Distraction or Narrowing: Looking a Little More At Live Search

The current state of "Live Search" ...

"Ajax opened the door to immediate actions. One of the first types of problems that immediate action was applied to was in the area of search. Here are a few examples.

Google Suggest was an early demonstration of the concept of Live Search. As the user types in the Google search box, the top search terms that match the user's input are shown in a drop down. If I am looking for 'Tom Cruise' only 5 characters are required to match this search term ('tom c').

I have never used Google Suggests for anything more than a demonstration of how live search works. I rarely need help in finding search terms based on four or five characters I have typed. Don't get me wrong, I think it is wonderful code, snappy response and perhaps has some purpose. I just have never found it personally useful. I mean if I am going to look up Tom Cruise, I perhaps might find it useful that it completes it for me and spells it correctly. But I think I know how to spell Tom's name."   continued ...   (Via Looks Good Works Well)

Google Suggest. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Google Suggest.

Friday, December 09, 2005

Simple KISSes and surprises

A discussion about "Reasonable Minimal Interfaces" and the Principal of Minimum Surprise ...

"Wow. Elliotte's criticism to the so called "Humane Interface" API design "school of thought" has spawn an Internet wide discussion (meme?) about simplicity in API design.

So I decided to review yesterday's entry, and go take a look at the Internet, to try to see what makes an API a good API. At least for me. And this is what I've found (and, as always, all feedback is welcome).

Surprise, surprise... Yesterday I talked about the importance of following idioms and language conventions. Today a principle backs up this idea. The so called Principle of minimum surprise (or "Principle of least astonishment") states it clearly:

In user interface design, programming language design, and ergonomics, the principle (or rule) of least astonishment (or surprise) states that, when two elements of an interface conflict or are ambiguous, the behaviour should be that which will least surprise the human user or programmer at the time the conflict arises, because the least surprising behavior will usually be the correct one."   continued ...   (Via Let's Swing!)

Google Web API. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Google Web API.

Bold predictions for the savvy designer, 2006 edition

UI predictions for 2006: in, out, and neutral ...

"Andy beat me to it by a day, even though I’ve been brainstorming this article for weeks. If our names weren’t gracing the cover of the same book, I might pick a fight (kidding, Andy).

Fortunately, I think there’s still plenty of room to take a second look into my crystal ball of web dev (first one was in 2004), with an eye squarely on what 2006 will bring."   continued ...   (Via Authentic Boredom)

Big Button Look - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Big Button Look.

Google Password Strength Feedback

Using Ajax for password strength feedback ...

"We often talk about one of the un-sexy core advantages of Ajax is the ability to do validation where you want it (right where the user is working) but validated securely on the server-side.

As we do this, we can offer interesting feedback to the user as they enter in the form data.

When you create an account at Google, they let you know how strong the password is as you type it. From too short, to weak, to fair, to strong."   continued ...   (Via Ajaxian)

Google Password Strength - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Google Password Strength.

Thursday, December 08, 2005

Simplicity Rules

Tips for achieving simplicity ...

"It is interesting to look at simplicity from the developer side of the equation for a change. Martin Fowler has kicked over a hornet’s nest with his thoughts on the humane interface . This has a lot of very smart , and very pragmatic developers talking about simplicity in objects, methods and behaviours.

Good software thinks of the users first and makes life easy for them. Humane interfaces follow that principle.

This is why frameworks like Ruby on Rails , Django , and TurboGears work so well. They do a lot of the work so that I don’t have to. This is a great discussion that will only benefit developers on other platforms as this meme gets incorporated."   continued ...   (Via David Crow)


The Humane Interface: New Directions for Designing Interactive Systems


Recommended Book


Check-out more books at Usernomics.

Scent, Search, and the Pursuit of User Happiness

A UX audio presentation and PDF now available ...

"Happy Users are the brass ring of web site design. Ultimately, the designers of every site have making users happy as their primary objective. However, many designs end up frustrating instead. Since 1996, User Interface Engineering’s main research objective is to understand how to achieve designs which produce happy users.

UIE’s researchers have found that user happiness is directly tied to whether the users accomplish their goals on the site. What prevents users from accomplishing their goals? Almost always, it’s poor design caused by a design team that doesn’t have all the information they need to make the right decisions.

In this entertaining and insightful presentation, originally presented as the keynote at the 2005 Web Design World Seattle conference, Jared M. Spool will share practical design strategies from highly-effective web sites."   continued ...   (Via UIE Brain Sparks)

Slide from presentation. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Slide from presentation.

MIPs are Next

More about information-rich versus content-rich navigation ...

NextStage's CRO suggests leveraging your visitors' curiosity with "MIPs" or "MORPs" in the site navigation to drive traffic.

We began a series of columns on navigation aides in the last column, What Comes Next?, all of which are based on the concepts of landmarks and visitor-designed navigation. In that last column we offered a tool for guiding visitors through websites based on information gathered from the website log files. We're going to continue that discussion, this time describing a navigational aide that works best for information-rich, not necessarily content-rich, sites."   continued ...   (Via iMedia Connection)

Most Interesting Pages (MIPS) Navigation. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Most Interesting Pages (MIPS) Navigation.

Some Hard Lessons in User Interface Design

A practical example of a UI error ...

"Today, I learned a couple of lessons in user interface design. Unfortunately, they were learned the hard way. Or, in other words, I sure f----d up that web site.

When you register for the Holidailies portal you must select a username and a password. They become your credentials to post to the portal. We normally have a few cases of forgotten logins on opening day. This year, however, we had a significant number of people—nearly 5% of the registrants—reporting login problems.

Developers tend to blame the stupid users when problems occur. But when it's 5% of the users reporting problems you can't even try to trot out that lame excuse. Typically, these problems arise due to flaws in the user interface (UI). I believe that's exactly what happened in Holidailies. The registration difficulties probably resulted from two bad UI decisions that I made."   continued ...   (Via Chromium)

Holidailes Website - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Holidailes Website.

Know Your ABC's (Office 12 Coolness, Part 3)

A new sort feature in Office 12 ...

"One of the features I always wished Word had was the ability to alphabetize a list of words. I always copied my words into Excel, fixed them up one per row, sorted them there, and then pasted back into Word. Imagine my surprise when I discovered that Word has had this feature since version 2.0!

Formerly a hidden gem on the Table menu, most people think of the Sort command to sort rows or columns within Word tables. The secret is that, despite being on the Table menu, the Sort command works just fine without a table.

In Office 12, we've added this feature to the Paragraph chunk on the Write tab--and you can use it to sort part of your document very quickly."   continued ...   (Via Jensen Harris)

Office 12 Sort Command - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Office 12 Sort Command.

Humane Interface

An interesting distinction that resulted in several conflicting comments ...

"Hanging around the ruby crowd for a while, I've come across the term 'Humane Interface' quite a bit. It describes part of the rubyist attitude to writing class interfaces, I think it also sets up an interesting contrast between two schools of thought in designing APIs (the other is the MinimalInterface).

The essence of the humane interface is to find out what people want to do and design the interface so that it's really easy to do the common case.

The obvious contrast to a minimal interface is that humane interfaces tend to be much larger, and indeed humane interface designers don't worry too much about the interface being big. This isn't to say that classes with humane interfaces need be larger in terms of implementation. The fundamental functionality of the two is often quite similar."   continued ...   (Via Martin Fowler)


The Humane Interface: New Directions for Designing Interactive Systems


Recommended Book


Check-out more books at Usernomics.

ASTD 2006 International Conference & Exposition

American Society for Training and Development ...

ASTD 2006. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

ASTD 2006.

Wednesday, December 07, 2005

Increased Sophistication of Websites changes Web Accessibility Priorities

The most annoying and useful features reported by users ...

"The increased sophistication of websites has changed the priorities of web accessibility – with effective in-site search, good navigation, and clear, well-constructed content now the three most important usability issues for disabled internet users - according to new research from user experience consultancy User Vision.

The research asked a cross-section of more than 200 web users, with a variety of impairments, to rank, in terms of importance, the factors which aid their ease of use when online. Clarity of content – using straightforward language and a clear, simple layout – was regarded by 88% as ‘very important’. Good navigation – the ability to know where you are within a site – was regarded as very important by 65%, followed by the use of meaningful and clear hyperlinks (63%).

Factors traditionally perceived as the fundamental accessibility issues have become comparatively less significant. Good use of ‘alt tags’, for example, was only regarded as ‘very important’ by a third of respondents - while among the visually impaired users, a surprising 25% found alt tags not important at all."   continued ...   (Via Usability News)

Questionnaire - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Questionnaire.

Microsoft Office 12: Big Changes, Big Learning Curve

A good overview of all the interface changes to Office 12 ...

"When Microsoft says the next version of Office is its most important revision in over a decade, it's not kidding. New XML-based default file formats and a major interface revision are intended to make the market-dominating productivity suite more flexible and accessible than ever.

While veteran users may find that the changes in the new version, code-named Office 12, take some getting used to, they seemed well worth the adjustment in my initial tests of the first beta release. The final version is scheduled to go on sale next year.

Even before the technical beta's release to 10,000 partners and customers, Microsoft had previewed Office's startling new interface, which all but does away with previous drop-down menus and toolbars.

Instead, we get a set of tabs in what Microsoft calls the "ribbon," an inch-high toolbar that displays key functions relevant to the selected tab. Click on the Write tab in Word, for example, and the ribbon shows font and formatting options as well as the cut, paste, and find/replace functions that used to live in the Edit menu. A number of functions, however, are still accessible only via menus that pop up when you click on down arrows, either in the ribbon or from the File button located to the left of the tabs."   continued ...   (Via PCWorld)

Office 12 Ribbon. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Office 12 Ribbon.

Introduction to Eyetracking: Seeing Through Your Users' Eyes

The first in a series about eyetracking and usability testing ...

"This article is the first in a series of articles on eyetracking that will appear in UXmatters. Over the coming months, I’ll use eyetracking to evaluate a lot of world-renowned user interfaces—including Web sites like Amazon.com®, Google™ News, and eBay®; Rich Internet Applications (RIAs); and desktop applications—and analyze quantitative eyetracking data to provide best practices for designing user interface elements like navigation systems, menus, and forms, and for effective ad placement.

For some time, usability professionals have evangelized the term discount usability testing. Discount usability testing was a product of the early years of the Internet. Its techniques promised to provide a simple, fast, and relatively economical way of conducting usability studies and improving users’ experience of the Web and other software user interfaces. However, such studies are mainly qualitative and subjective. The data reflect users’ conscious thoughts and feelings as well as the observers’ impressions. Some think this is the best, even the only method of conducting usability studies, but there are other—in some situations, perhaps better—ways of evaluating user interactions. Eyetracking offers unique benefits and provides a practical alternative to conventional discount usability testing."   continued ...   (Via UXmatters)

Eyetracing in operation. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Eyetracing in operation.

Georgia Tech develops gesture system for cellphone games

Perhaps some new UI opportunities with gesturing ...

"If the team at Georgia Tech’s Mobile Technologies Group has its way, you may soon be waving your cellphone around in order to play games with it. The group has developed a system for gesture-based games that uses the cellphone’s camera to track hand movement. Prototype games include a version of Pong in which the player moves the whole phone to the left and right to control a paddle, and a drawing program that they say “demonstrates the various degrees of freedom.” We can only imagine what kind of gestures they’ll put together so you can play Doom on your phone."   continued ...   (Via Engadget)

Gesture Phone. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Gesture Phone.

New Fonts For Documents

Nice new fonts for Office 12 documents ...

"Last month, I introduced Segoe UI, the new user interface font for Office 12 and Windows Vista.

Of course, you spend most of your time in Office not looking at the user interface, but working with documents. Times New Roman has been Word's default font since Word 6.0 introduced support for TrueType fonts. Although there are numerous other options available, most documents today are produced in Times New Roman, Arial, or more recently the Web-friendly choice Verdana.

Office 12 ships with six brand new fonts designed for use with the content in your document. Each of the fonts is optimized for ClearType and suitable for use both on-screen and in printed documents.

Below, courtesy of Microsoft's Advanced Reading Technology team, are pictures of the six new fonts along with brief descriptions of each font."   continued ...   (Via Jensen Harris)

Corbel type font. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Corbel font for a clean screen.

Tuesday, December 06, 2005

For Trembling Hands (Office 12 Coolness, Part 2)

Continuing Office 12 UI features ...

"Today's episode: You're standing up on stage in front of a thousand people who have come to watch you talk. The house dims, and the bright glare of stage lighting burns down on you. Nervous, with sweaty palms and shaking hands, you prepare to start your presentation. What will the audience think of you? Will they like what you have to say? Have you prepared enough? Did you expect a larger audience? Smaller? Oh geez, I hope the demos work...

Many of us have been there... up on stage, getting ready to present a PowerPoint deck. Or maybe in an important meeting with clients or potential supporters of your big idea. You're probably presenting on a laptop with a TrackPoint or a TrackPad. These mouse substitutes are hard enough to use with great precision in general; when nervous, they can be almost impossible to use.

All of these thoughts are going through your head, your hands are shaking, it's tough enough to use a TrackPad anyway... and PowerPoint makes you click a tiny 12x12 button in the lower-left hand corner of the screen to start the presentation.

This is one of the only buttons in Office people regularly use under high stress, and it's arguably the smallest, hardest to click button on the screen."   continued ...   (Via Jensen Harris)

Slide Show Icon.- User Interface Design, Human Computer Interaction (HCI), Ergonomics

Slide Show Icon.

Monday, December 05, 2005

HCI2005 Feature: Alternative business Models for HCI

The future of the HCI business ...

"Usability News [6] reported that 'The UK market, worth £90m in 2004, will grow by a further 25% in 2005, to between £108m to £117m, driven by increased awareness of the benefits of improved website usability and accessibility'. As well as being a more sophisticated profession, clients are better educated in accessibility and usability and demand higher quality services and added value. This is a positive change from the struggles of advocating UCD in an economic downturn.

Rather than the dogmatic gurus of the past the profession is now made up of a diverse mix of sophisticated and media-savvy experts. It is easy to be complacent about the future in this climate and to forget the lessons of the dotcom crash of a few years ago. At that time, usability professionals struggled in a market that was dominated by cost-cutting. The problem then was that usability had a limited business offering that focused on optimisation. Critics [4] pointed to the commonsensical nature of usability research and its antipathy to design. They pointed to a profession that was dominated by a few vocal usability ‘gurus’ who echoed companies’ fears of risk and spending on research and development. Given the excesses of the boom, this made sense in the short term.

As a long term strategy for sustainability, optimisation has a limited shelf life: once a product or service is optimised the work is finished. In this light, it is worth considering how usability can be integrated with other business processes and services."   continued ...   (Via Usability News)

HCI2005 - User Interface Design, Human Computer Interaction (HCI), Ergonomics

HCI2005.


Ajax Sucks Most of the Time

Ouch, just say no to Ajax ...

"Judging from the email I receive, the most controversial statement I have made in my Alertbox columns so far was to make "the use of Ajax" one of the mistakes in my list of top ten mistakes in Web design.

For new or inexperienced Web designers, I stand by my original recommendation. Ajax: Just Say No.

With respect to the use of ajax by highly skilled Web designers, I have changed my opinion somewhat: people who really know what they are doing can sometimes use ajax to good effect, though even experienced designers are advised to use ajax as sparingly as possible."   continued ...   (Via Alertbox)

NO Ajax. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

NO Ajax.

If It Feels Good: Skateboarding toward the future of digital user interfaces

An interesting perspective on the future of UI ...

"When I’m not busy creating user-interface prototypes, I’m co-director of the local Public Skatepark Action Committee. The two gigs aren’t as dissimilar as you might think; a skatepark, after all, is just a user interface for skateboarders, and one with a lot of design challenges. But instead of dealing with code, I have to think in terms of steel and concrete. On one side you have a myriad of choices from prefab to design-built concrete and steel. On the other side you have vocal “consumers” that will let you know when you get their UI wrong—leaving you with an empty park marked up with free, um, “market research reports” in spray paint.

Anyone using, designing or selling a product with a digital user interface can identify with this scenario. Not that someone will walk into Best Buy and tag “This MP3 Player UI Sucks”—at least not anyone who wants to stay out of jail. But just as new trends in construction have changed skatepark design, so, too, has technological progress enabled us to build better UIs. This is helping us design products—whether it be skateparks or game controllers– that don’t just look good, but feel good, too.

Devices are getting more powerful, and buzzing technologies (like AJAX and many other acronyms I won’t make your eyes glaze over by listing here) are allowing designers to create new possibilities from better-looking designs to rich animation.

These technologies are demand driven, sparked by the trend away from modular solutions–easily configured, pre-produced pieces (whether they be pieces of code or pieces of a ramp)–into more engaging and full experiences. Skateboarders are already onto this trend. There are nearly as many devoted to fighting modular skateparks as there are building them."   continued ...   (Via Gizmodo)

Skate Park Development. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Skate Park Development.

Distance learning- Choose your medium with care

An example of an online talking head video not working well ...

"I’ve taken a handful of distance courses in my day. The dynamic residency of being prior military, mixed with a continuous search for an HCI/Human Factors program has frequently led me to the web instead of the classroom. As such, I’ve experienced several versions and delivery methods of education from afar, here are two types that sum up nicely what I’ve seen:

- A Java course through Southern Methodist University. It was delivered via DVD, assigments and interaction was done through a standard webCT, blackboard forum type environment. (it’s a classroom based webapp)

- A business (global marketing) course through Rensselear Polytechnic Institue (rpi.edu). It had the same online interaction (more or less), but the lecture was streamed to me on my PC.

I found I had a better all around experience with the SMU course even though the subject matter of the RPI courses was a more interesting (academically.. the Java was just a refresher). I did well in the SMU course, and not so well in the RPI ones.

It seems blatantly obvious after reading this article by Jakob Nielson. I’ve always wondered why that was; ok, well, not exactly- I probably could have told you why.. this article has always been in my mind, just never verbalized."   continued ...   (Via MNteractive)

Talking Head. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Talking Head.

Tag formats: Can't we all just get along?

Lack of standardization with new technologies such as tagging ...

"First, there was tagging with spaces between keywords and all seemed good:

del.icio.us Tagging. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

del.icio.us Tagging.


But there are some problems with this method. What about compound phrases? What if I want to tag something “white house” instead of with the separate tags “white” and “house” (which changes the meaning) or “whitehouse”/”white+house” (unintuitive)? Enter comma delimited tagging.

Yahoo Tagging. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Yahoo Tagging.


When you’ve got a new technology, inconsistency is to be expected. Will all these different formats still be around a year from now or will a standard emerge?"   continued ...   (Via Signal vs. Noise)

Talking-Head Video Is Boring Online

Talking head does not work for computer videos ...

"Eyetracking data show that users are easily distracted when watching video on websites, especially when the video shows a talking head and is optimized for broadcast rather than online viewing.

As broadband connectivity has grown, websites have increased their use of video clips. Unfortunately, many of these videos are produced for television broadcast and are thus unsuitable for the online environment.

In 1997, I wrote an analysis of TV vs. computers that still holds: broadcast TV is a medium for relaxation, where the "user" sits back and becomes immersed in whatever the program directors decided to air. In fact, TV users are usually called "viewers," emphasizing their passive mode of engagement. In contrast, computer users sit forward and drive their own experience through a continuous set of choices and clicks.

Because of this fundamental difference in user experience, broadcast video feels boring on the Web. There's nothing to do, no choices, no user control."   continued ...   (Via Alertbox)

Eyetracking of talking head video. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Eyetracking of talking head video.

Inline Contextual Actions

Adding additional detail with mouse hover ...

"This is a belated post, but certainly still relevant. Last month, Bill Scott wrote up a great overview of various “mouse hover” interaction elements including: inline editing, rating, flagging, zooming, and exposing additional detail.

I added to his list by pointing out that mouse hovers can include both additional details AND multiple actions. This makes additional actions immediately usable and removes the need for a page refresh and link back to the original context (the traditional web interaction for exposing additional actions).

Many times, users just need a bit more context to understand the implications of an action and do not need the screen real estate a full page provides. Instead, these additional details can be exposed in a mouse hover."   continued ...   (Via Functioning Form)

Additional Actions with Mouse Hover. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Additional Actions with Mouse Hover.

Sunday, December 04, 2005

Practicing Usability in Hong Kong

A good perspective on usability in Hong Kong ...

"Here at the uiGarden, we have been having discussions on whether there are cultural differences between practicing usability in the West and the Far East. In an exploration of the theme, we interviewed Apogee’s own Daniel Szuc and Josephine Wong. They give their own uptakes of the discussion and offer us their insights from their own experiences of working in Hong Kong.

Apogee - What are some of the differences you notice with user behaviour(s) in Hong Kong?

Daniel – We have seen users’web habits mature very quickly over the last 5 years as the web has become more main stream in Hong Kong, including banking, paying bills, broadband TV, buying tickets, blogging, shopping etc. To my surprise, the web took some time to arrive in full force in Hong Kong so we have really only been watching people use it since 1999. It will be interesting to watch the differences between not only users in Hong Kong, but users across the region including: mainland China, Singapore, Taiwan and India to name but a few."   continued ...   (Via uiGarden)

Hong Kong. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Hong Kong.

Just Kiel on what Games Designers are talking about

We can learn a lot of UX strategy from game development ...

"The middle of this webpage (ie, you have to scroll down a little to see what I am talking about), the November blog of Just Kiel, is taken up with a lengthy report back from the Games Design Technology Workshop by participant Kiel M Gilleade of Lancaster University.

Detail is a bit sketchy but it is interesting as a report because of what it indicates took place and because there is too little coverage of games, especially as the elements of fun and emotional engagement so central to games are beginning to be taken seriously by other interaction designers. Talks and speakers are linked from the page.

For instance, David Freeman's presentation: 'This talk was concerned with how emotional experiences are engineered into games, specifically game play. Freeman began with analysing the emotional qualities of a series of images taken from his book "Creating Emotions in Games" and how they can build complex emotional relationships with the player."   continued ...   (Via Usability News)

Creating Emotion. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Creating Emotion.

The difficulty of being easy

Making it easy is hard to do ...

"There is a joke among engineers that a lot of high-tech companies go broke because their customers are too stupid to use the gizmo they're selling. That may be funny to engineers, but it's no laughing matter for millions of American consumers.

When is the last time a house sitter or baby sitter came to your home and you spent 20 minutes trying to explain to them how to use the TV and DVD player? Or how about this scenario: You fly off to a vacation, renting a car at the airport. After you get going, you spend the rest of the afternoon trying to figure out how to turn on the windshield wipers, or the lights, or the air/conditioner.

The problem is that geeks design gadgets and normal people struggle to make them work. Too many gadgets are counter-intuitive. Why, for example, would you have to hit the “start” button to turn off a Windows XP computer? Or why, on many cell phones, do you push the “end” button to turn the darn thing on?

A Xerox engineer explained at least part of the problem when he said, “It's really hard to be easy."   continued ...   (Via LompocRecord)

Making It Easy. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Making It Easy.

Paper: mobile web development in Japan

A detailed paper about current web design practices and mobile web development in Japan ...

"Back in March, I wrote a paper about mobile webdev practices in Japan for a conference at Berkeley - my paper was accepted, but apparently, the publication process is delayed quite a bit. As I don't like waiting, I decided to go ahead and make my paper available online (under a CC license).

Instead of immediately diving into the mobile webdev topic, I felt is was necessary to start with some context: I first explain about device independence, and then compare 1990s webdev practices (i-mode started in 1999, when IE5 was a novelty) with web standards. Then, I focus on the current state of the Japanese web and explain what I believe should change. So, those who don't need all the contextual talk may want to start from section 4."   continued ...   (Via wg)

Vodafone Live! - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Vodafone Live!

HYBRID: Interview with Marko Ahtisaari

A great interview discussing the need for simplicity of mobile device interface design ...

Marko Ahtisaari is the Director of Design Strategy at Nokia. If his name sounds familiar, it is probably because his father is a former UN diplomat and president of Finland.

Marko Ahtisaari was among the speakers at this years' Ars Electronica conference in Linz, Austria. The theme of the conference was HYBRID - Living in Paradox, a theme which very much relates to Marko's personal and professional life. Sebastian Campion met him for a talk about the past, present and near future of the mobile telephone.

At a moment in time, when the mobile industry is pushing ever more technological features and functionalities at people, what do you think are the most important needs to design for? At Nokia, we believe that people are increasingly looking for simple and sensorial products. And so, the challenge is: how do you make an elegant simplicity that hides the complexity in the overall interface and experience of the product? This is a real design challenge and opportunity so we spend a lot of time at that. The theme at this conference is 'hybrid' - is there a better example of a mass-market hybrid product than the mobile phone?"   continued ...   (Via Danish Design Centre)

Nokia Mobile. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Nokia Mobile.

Saturday, December 03, 2005

BayCHI Meeting - Tuesday, December 13, 2005

Beyond Menus and Toolbars in Microsoft Office, Jensen Harris, Microsoft

Farewell, menus and toolbars. More than 20 years after the introduction of the Macintosh, software has outgrown the basic building blocks of today's standard user interface. The upcoming version of Microsoft Office does away with the top-level menus and toolbars in favor of a new task-oriented, contextual user interface.

This talk will provide a historical perspective on the evolution of the Office user interface and the battle against the mounting complexity of the product. You'll get a behind-the-scenes look at the different design iterations, and an in-depth look at the new Office UI constructs, including the Ribbon, galleries, contextual tabs, and the MiniBar. You'll also learn the ideas behind "results-oriented design," which Jakob Nielsen wrote, "might well be the way to empower users in the future."   continued ...   (Via BayCHI)

BayCHI - User Interface Design, Human Computer Interaction (HCI), Ergonomics

BayCHI Chapter of ACM SIGCHI.

A quick primer on Social Network Analysis

A good overview of social networking ...

What is Social Network Analysis? A social network is a map of the relationships between individuals, the analysis involves a study of these relationships.

How do you do a Social Network Analysis?

Step 1. Design your questions. We’ve discussed this a little here.
Step 2. Send out your questions as a survey. Surveymonkey is a great online tool for this.
Step 3. Export the survey results into a visualisation package. Personally I like Netdraw.

This produces output like:"   continued ...   (Via Anecdote)

Social Networking - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Social Networking.

Friday, December 02, 2005

Idea for comment pages: Where did I leave off?

A good idea for a "comments" interface ...

"Here’s an idea to improve the experience of reading comments.

First the problem. Comments usually trickle in one-by-one. To read the latest, you jump to the bottom. For hot topics, it’s different. Every time you come back, there may be another five or ten comments, and finding where you left off requires careful scanning and scrolling. I often think to myself “Just show me where I left off!”.

Here’s a solution. When someone revisits the comment stream, display a clear separator that says “The comments below this line are new to you.” You could do this by setting a cookie when someone visits the permalink page with the ID of the last comment. On subsequent visits, compare the cookie with the current number of comments, and insert the separator accordingly. Throw in an anchor on top (“Take me to where I left off”) and you’re done. I imagine this wouldn’t be so hard now that Javascript is less painful."   continued ...   (Via Signal vs. Noise)

Comments - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Comments.

Native-looking widgets in Flash

If it looks like a duck and quacks like a duck, it should be a duck ...

"A few months ago I picked up a copy of About Face 2.0 on a whim, and boy was it an eye-opener.

One of the tenets of user interface design that I came away with after reading this book was that UI design is not just about how the things look, it’s also about how they behave. If two things look similar but behaving in different ways then you’re going to end up confusing your users.

This applies equally in the real world too, as anyone who has tried to pull the handle on a ‘push’ only door will tell you.

One example given was that you shouldn’t make something look like a native OS widget if it isn’t going to be have in the same way. I now cringe whenever I see examples of Flash/ UI widgets being themed to look like native Microsoft Windows or Mac OS X widgets."   continued ...   (Via Dynamic Flash)


About Face 2.0: The Essentials of Interaction Design


Recommended Book


Check-out more books at Usernomics.

Super Tooltips

How tooltips are implemented in Office 12 ...

"Today, I want to introduce the way we've integrated help content into the Office 12 user interface: a feature we call "Super Tooltips."

The idea is simple: tooltips are successfully and frequently used by people at all skill and experience levels. We wanted to take the design of tooltips in Office to the next level. "Super Tooltips" (just a code name) were born.

First, every tooltip contains the feature name and keyboard shortcut (if it has one.) This is the bare minimum you'd expect from a tooltips in Office, and we haven't changed that. No surprises yet.

Next, we add to every feature's tooltip a short text description letting you know what that feature is for. We've written these in the form of: "This is the right feature to use if you want to [tooltip text here]." The concept is to give you the idea of what a feature is for without needing to look it up in help or in a manual."   continued ...   (Via Jensen Harris)

Super Tooltips. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Super Tooltips.

Usability Studies 101: What Comes Next?

Making the most frequently requested Web pages readily available ...

"NextStage's CRO talks about how to find the ideal navigation for your website in your web logs.

A few columns back we talked about placing landmarks on webpages to help visitors recognize where they are on the site and how they got there. We're going to devote this column and the next few to ways of improving visitor experience via navigational aides. The concept we're going to be working with is… Visitor Designed Navigation.

People who've attended my seminars know about Visitor Defined Navigation. It makes use of website logs to determine the most interesting pages to visitors over time and makes those pages readily available. To date, clients using this technique have found it a valuable tool in keeping visitors on their sites longer and establishing a communication channel that would be denied to them otherwise."   continued ...   (Via iMedia Connection)

Web Page Frequency. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Web Page Frequency.

Experience attributes: crucial dna of web 2.0

Toward a definition of Web 2.0 ...

"The industry has spent a lot of time defining Web 2.0 and mapping its DNA. But as we attempt to emulate the fast-growth success of the Web 2.0 darlings, we need to zero in on the parts of the DNA that actually create this noteworthy new value.

What put the 2 in Web 2.0? Your instinct may tell you that some of the DNA-like attributes of Web 2.0 have been around for some time, and in truth, many have. So why didn’t we see Web 2.0 offerings popping up years ago? Because these older attributes, while significant, weren’t enough to produce viable Web 2.0 products.

Some of the attributes we associate with Web 2.0 were introduced and commercialized as early as the mid 1990s; let’s call these Foundation Attributes. The figure detail below is part of a PDF that separates these “significant but not sufficient” attributes from the more recent Experience Attributes, those that create the kind of value that’s caused the recent excitement over Web 2.0."   continued ...   (Via adaptive path)

Foundation / Experience Attributes. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Foundation / Experience Attributes.

Heckling Adaptive Path

Questioning several points in the previous artcle ...

"First, go and read “Experience Attributes: Crucial DNA of Web 2.0” over at Adaptive Path.

Read it? OK, let’s take a closer look.

The industry has spent a lot of time defining Web 2.0 and mapping its DNA. But as we attempt to emulate the fast-growth success of the Web 2.0 darlings, we need to zero in on the parts of the DNA that actually create this noteworthy new value.
Uh, we do?"   continued ...   (Via Signal vs. Noise)

Questioning. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Questioning.

Thursday, December 01, 2005

Prioritizing Design Time: A Long Tail Approach

Spending time on the design of pages where users spend most time ...

"Do you find that you spend an inordinate amount of time fretting over your homepage? Is it the one page that gets the most attention from your design team? How about other parts of your company? Does it get attention even from people who aren’t on the design team?

We see this all the time. On nearly every one of the projects that we work on, and even the ones that we only hear about, we observe the same thing: the homepage has the highest priority in the design food chain. Much more energy is spent deciding what will go where on the home page than any other page or section of the web site.

Here is what The Long Tail of UIE.com looks like:"   continued ...   (Via UIE Brain Sparks )

UIE Long Tail - User Interface Design, Human Computer Interaction (HCI), Ergonomics

UIE Long Tail.

Storyboarding Rich Internet Applications with Visio

A detailed tutorial for using new Visio stencils to storyboard Web 2.0 Web pages ...

"With the recent rise in popularity of web technologies such as Flash and AJAX, it has become possible to create richer user experiences on the web. Even though these technologies are not actually new, we are now seeing their widespread adoption. Within the last six months, we have seen the christening of the term “AJAX” and its broad acceptance. Most major websites are adding rich interaction to their existing features.

The Visio storyboard stencil library - The storyboard stencil library contains four basic tools:

- Storyboard Name. Describes the storyboard scenario and is used to reset the interaction animation.
- Storyboard Step. Describes a step in the animation and shows or hides interface elements as needed.
- Click. Used to document the user interaction with the mouse.
- Drag & Drop. Used to document a drag and drop interaction."   continued ...   (Via Boxes and Arrows)

Interaction Stencil - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Interaction Stencil.

Cover Pages: Cool Things In Office 12 (Part 1)

New features in Office 12 ...

"Today, I'm starting an ongoing series on some of my favorite things in Office 12.

I'm going to start with something that I've recently found to be a timesaver when creating more formal, professional documents and memos in Word: the Cover Pages gallery.

From the Insert tab in Word 12, click "Cover Page." A gallery of pre-made cover pages appear, organized from most snazzy to most business-like."   continued ...   (Via Jensen Harris)

Cover Page. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Cover Page.

Gap backwards

Placing the emphasis on the experience ...

"What’s wrong with this message from the Gap? According to Power to the People at A List Apart, the emphasis is off.

They’re saying the right things, only they’ve got them backwards. “Latest technologies”, “innovative tools,” and “new features” are pretty much meaningless if the “shopping experience” isn’t better. Now, I don’t want to pick on Gap, but this illustrates (rather well) the point I’m trying to make: Put the people first, then devise simple solutions - the experience is what matters."   continued ...   (Via Signal vs. Noise)

Gap Message. - User Interface Design, Human Computer Interaction (HCI), Ergonomics

Gap Message.

<< Home
.