Archive for April, 2009

A first impression of Accutrack 8

Below are screencasts of Accutrack, version 8.  Engineerica is currently on version 11.  This is the demo that they send to potential customers.  I’m told that the interface is not much different than the current version but there are more features and a larger number of canned reports.  Accutrack comes in several versions, desktop, desktop/online module, hosted, and two different variety of database.  Visit their website to explore the differences between the versions.  Accutrack provides a lot more opportunity to tweak preferences than does Tutortrac, for instance it has a more rules for deactivating a student’s account in case of canceled or missed appointments, and to be a little more technically advanced on the backend, given their version options.  But along with more features comes the responsibility to make the features more discoverable and the product more usable.  Both Engineerica and Redrock Software suffer from a disconcerting lack of inventiveness with regards to user interface design.  Clicking through Accutrack feels as if I’d wandered back to the eighties rather than as if I was working with a sleek modern application such as MicroSoft Office or these seventy two variety of timetrackers that give some sense of the different aesthetics and usability options that are available to developers today.

While scoping out Accutrack I wasn’t too much concerned with the specifics of how the application works, rather I was interested in its look and feel and secondarily my training burden if I had to introduce this to a large and itinerant staff.  The first video, Accutrack-Poking Around, is of me tooling around and clicking randomly through the application which is one of the methods that I use to evaluate software for discoverability and resilience.  The second video, Accutrack-Student, is of me logging in as a student, scheduling an appointment, and then logging out.  The third video, Accutrack-Tutor, is of me logging in as a tutor, checking my schedule, and then logging out.

Click for Tutortrac Student Video Tutorial.

(No Ratings Yet)

 Loading ...

Clockspot: online timeclock

Clockspot is an online timeclock  that we began using in the center after demo-ing several other applications that we rejected because they were too expensive, offered too many or too few features for our purposes, were too complicated, or had poor user interface (UI) design.  Clockspot won out because it was simple to use, does what we need it to do, and is relatively inexpensive given the amount of time saved doing payroll.  The UI is such that we only needed to provide training-by-walking-around.  We only use it as a straight timeclock and do not use the project or task timing functions.  Clockspot has a pretty robust website that describes its features and also has an online demo so I’m not going to go on too long about it.  We have been using it for about six months now and it does the trick.  Three downsides that I’ve experienced is that the application has had one server outage that took a day to work through, support staff is mostly only available by email, and their billing model is geared towards credit card payments.  They will accept PO’s with some prodding. So far these experiences aren’t numerous or egregious enough to be dealbreakers.  If you’re using another time tracker  that you like please recommend in the comments.

Update:  On a scale of 1-5, my get your act together indicator moved from 2 to 3.2.  Nevertheless, not yet regretting my purchase.

Update: Clockspot now has auto invoicing with email notification.

(No Ratings Yet)

 Loading ...

Some thoughts on graphical user interface design (GUI): part 1

A well designed application for the most part is a pretty face on a database.  A pretty face is welcomed but brains and personality make for a complete package.  Constantine and Lockwood’s six user interface design principles along with  two others, the Aesthetics and the Accessibility Principle help in creating engaging and responsive applications.

THE STRUCTURE PRINCIPLE

Your design should organize the user interface purposefully, in meaningful and useful ways based on clear, consistent models that are apparent and recognizable to users.

Clicky, a web analytics program, is an example of the Dashboard screen pattern.  This pattern provides multiple sources of information at a glance so that users can quickly ascertain a state of affairs and take purposeful action.

Macintosh Explorer, a file search application, takes it cue from Windows Explorer.  It’s an example of the Master/Detail screen pattern.  I include it here because it doesn’t depart from expectations, which is in fact one aspect of a well crafted application.  It doesn’t unnecessarily require you to learn an entirely new metaphor in order to use it.

THE SIMPLICITY PRINCIPLE

Your design should make simple, common tasks simple to do, communicating clearly and simply in the user’s own language, and providing good shortcuts that are meaningfully related to longer procedures.

Deleting a file from your computer is a very complicated task.  Yet the metaphor of a trash or recycle bin to which we simply drag and drop a file is both familiar and satisfying.  The ease of use and intuitiveness of this bit of user interaction belies the truly revolutionary thinking that goes into creating effective user interface.  A good application gets out of the way and allows you to get on with it.  A great application assists you in creating extraordinary products that you could not have created otherwise.  A bad application bogs you down in tedium and never gets out of the way long enough to allow you to forget that you’re using it.

The MicroSoft Windows upgrade feature is an example of the latter behavior in that after an upgrade it requires a system restart; however, it repeatedly requests a restart even after a user has indicated that they do not wish to restart.  It also doesn’t provide an option to delay restart for a certain period thereby requiring users to disrupt their focus or workflow and restart, or repeatedly cancel intrusive restart requests.  Macintosh’s Itunes is notorious for being similarly obnoxious.

THE VISIBILITY PRINCIPLE

Your design should keep all needed options and materials for a given task visible without distracting the user with extraneous or redundant information. Good designs don’t overwhelm users with too many alternatives or confuse them with unneeded information.

Clicky also utilizes this principle well.  Notice that while selected functions are visible others are hidden behind tabs and that these tabs are clearly labeled and grouped in a coherent fashion.

Another example of the use of this principle is the Mac OSX dialog box which defaults to the six most frequently used options screen but enlarges to include more choices if the user invokes this option.

Yet another welcomed behavior is a popup tooltip that provides information about what’s behind a button or an icon.  This bit of information saves time from having to click through yet remains hidden until it’s needed.  These flourishes are not only helpful but can be executed skillfully and beautifully thereby changing an application UI rating from A to A+.

THE FEEDBACK PRINCIPLE

Your design should keep users informed of actions or interpretations, changes of state or condition, and errors or exceptions that are relevant and of interest to the user through clear, concise, and unambiguous language familiar to users.

Pageboss is an example of the successful application of this principle.  It is another web analytics program that returns key metrics about a website.  The interesting behavior to consider here is that it takes a while for the application to collect and return this information.   It, therefore, needs to keep the user informed about its current state and how long it will take to complete the task.  I would say that PageBoss gets an A for describing its current state, another A for doing so in a visually appealing manner and a B+ for informing the user about time to completion.  Had the task taken considerable more time to complete, a progress bar with a HH:MM:SS estimated time to completion would have been more useful.

Another example of the effective use of the feedback principle is the file transfer program, Transmission.  From the initial drag and drop to the automatic download, progress and color change to signal completion, Transmission gives conventional and unambiguous indication of its states, resulting in a satisfying experience for the user.

Other examples of feedback are data fields that glow, throb or change color when they gain focus or need user attention, buttons that become de-selectible when pressing them would not be appropriate, and workflow cues such as numbers, arrows or animation that help users to determine in what order to proceed through an application.

THE TOLERANCE PRINCIPLE

Your design should be flexible and tolerant, reducing the cost of mistakes and misuse by allowing undoing and redoing, while also preventing errors wherever possible by tolerating varied inputs and sequences and by interpreting all reasonable actions reasonable.

No doubt you’re familiar with the ‘Do you really want to do this’ popup dialogs that come complete with the ‘Don’t ask me again’ option.  Developers initially assume that users are unaware that their actions might be harmful or irrevocable and so give them the option to backout of the action and once informed to opt out of any subsequent warnings.  A revert to default button is also an example of the Tolerance Principle in action as it keeps a user from making time wasteful or irrevocable decisions.   Given the repercussions, VisualHub, a video conversion application, has a perhaps too humerous although still effective warning for its users who wish to change their preferences.

An example of a poorly designed Tolerance Principle is a web mail client that I no longer use and that will go unnamed. The application will timeout if it does not get any input from the user.  Normally this would be a useful security feature except for the fact that it does not provide a warning before timing out.  It also does not recognize keystrokes as user input for its timeout feature and does not autosave.  Extraordinary omissions for a mail program.  The consequence being that if you type a very long email the program is almost guaranteed to timeout without saving your work.  In fact, it will have timed out leaving you typing unawares long before you invoke the send command.

THE REUSE PRINCIPLE

Your design should reuse internal and external components and behaviors, maintaining consistency with purpose rather than merely arbitrary consistency, thus reducing the need for users to rethink and remember.

Utilizing a familiar metaphor that is used consistently throughout the application can reduce learning time.  Soundsoap uses the metaphor of an electronics device that would be familiar to most users.

Assets such as radio buttons, click boxes, pulldown menus, etc.  should be used purposely and in the same manner and return the same types of result wherever they are encountered. The discussion found on the website linked here provides some insight into the considerations that go into where and how one might place buttons on a web form.  The point is that a developer can place any button anywhere.  A good developer makes defensible standards compliant choices in the interest of user experience.

THE AESTHETICS PRINCIPLE

Your design should have a consistent look and feel throughout.  It should be visually appealing and conform to longstanding principles of design aesthetics.

It is possible to design user interfaces that improve upon a users’ experience solely as a function of its aesthetic design in the same way that a beautifully decorated residence improves upon a resident’s living experience.  Visually appealing applications make use of icon design, formatting and color to create a sense of purpose, occasion and harmony.  It’s important to note that aesthetic considerations are always in service to improved functionality as discussed at usabilitypost.  The point is to move orange juice, [subtraction]; that is, rather than winning design awards the goal is to optimize an application so that users are more productive.  For instance, the use of color is important as it allows a user to quickly and easily scan an application’s interface thereby reducing eyestrain and improving the application’s usability.

The web analytics program Woopra is an example of design overwhelming usability issues.  Notice that the clash of colors does not enhance but rather competes with the data that is being displayed.  Everything on a application window is data that your brain needs to process.  Too much data processing leads to brain drain which does not optimize user productivity.  To avoid this, a good rule of thumb is that a third of any application window should to be whitespace.

THE ACCESSIBILITY PRINCIPLE

Your design should consider the needs of the entire range of potential users including those with accessibility issues and account for their experiences whenever possible.

While color is an important design factor it should be used as a secondary navigation or state change cue as some users who are visually impaired may have accessibility issues.  Users who are colorblind for instance may not be able to notice distinctions that are indicated solely by a color change.  Older or visually impaired users may need to adjust an application’s text size. It should be possible to do so along with other minor adjustments.

Update:  Click to read usabilityposts’ own list of design principles and sylvantechs own very helpful usability list.

Update:  Adobe Air app blog with UI critiques.

(No Ratings Yet)

 Loading ...