(1) Left panel is menu for all pages in the application.  It appears on every page so that users do not become lost in the application.  A color and icon change indicates current page.

(2) Top numbered panel serves as a breadcrumb for the current page.  Colors change to indicate to users where they are in the process.  Number icons change as well for accessibility reasons.

(3) A dialog box appears at the top of the page to indicate what users should do first.  It disappears once users make an initial selection.  Experienced users may disable most dialog boxes through a user preference wizard.

(4) A question mark icon is displayed at top right of screen.  Clicking it opens a text modal box that might also feature a video demonstration.  This feature is contextual and brings up different information depending from what page it is clicked.

(5) A question mark icon is displayed at key functions in case users have specific non-global questions.  Mouseover opens up a pop-up text window.  The four here explain what services are offered by each center and the particulars of group and individual tutoring.

(6) To assist users with navigation, selections are featured in a logical and prescribed order.  Users have to think less about what they need to do.  This increases the likelihood that their default behavior is the correct one.

(7) Users cannot move forward until they complete the form in the order prescribed. Here course, date, type, and submit buttons are not selectable until center is selected.

(8) Course selection is automatically generated either from a predefined list of subjects or from a user’s own course registration previously uploaded by an administrator.

(9) Courses for which there are tutoring sessions are presented differently than courses for which there is no support.  Perhaps using color, icon, or different font such as italics.

(10) Once users have selected a course the date, type and submit button become selectable.  Date and type are optional so they do not have to select in order to submit.

(11) The date can either be written in or users can click the calendar icon to bring up a calendar graphic popup to select start and end dates.

(12) Calendar and start/end input boxes validate in real time so that users cannot enter other than appropriate dates as determined by administrator preference selection.  Here that is seven days in advance.

(13) Clicking submit displays a modal window of search results.  Users can select their preferred appointment times from this modal window without leaving this page.

(14) From the modal window, users will be able to select multiple appointment times before confirming their selection.

(15) Real time validation occurs here as well.  Users cannot select a session that has already ended.  They also cannot schedule an appointment while it is ongoing unless an administrator selects this preference feature nor can they schedule appointments that conflict with current selections or previously confirmed  appointments.

(16) If a search produces no results the user is informed of this fact, explained why it occurred, and provided with next step options.

(17) Users must either confirm or cancel their selection(s) before closing the modal window otherwise they will receive an error message.  This feature prevents them from logging out without completing the scheduling process.

(18) Once the student confirms they receive a confirmation successful message before the modal box collapses.

Since most users will be using the application without an initial demonstration it must perform logically, and handle errors in an intelligent manner.  This design gives users a better visual, functional and feature rich experience while minimizing frustration, confusion, and errors.  The helper features and error handling is unobtrusive and therefore won’t frustrate experienced users.  The design while aesthetically pleasing is utilitarian.  It is neither frivolous nor extravagant.

No related posts.

Related posts brought to you by Yet Another Related Posts Plugin.

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 related posts.

Related posts brought to you by Yet Another Related Posts Plugin.

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 related posts.

Related posts brought to you by Yet Another Related Posts Plugin.

For example, when students check out of our center they are given the opportunity to answer three questions, were you satisfied with your visit, are you planning to return, may we contact you about your responses.  This information is time sensitive and therefore should be easy to access, perhaps displayed on an administrator dashboard with other key metrics available upon login, it should be displayed both numerically and/or graphically depending on user pre-selection, and be tweakable by date, tutor, range, etc.  Since we are interested in actionable information some means for comparison over time and across tutors should be possible. [Google Analytics]   Perhaps also a means for having the program flag occurrences that fall within a certain threshold.  This information should be printable and be easily exportable in industry standard formats such as Word, Excel, and XML.

The point of the above requirements is that the application should be scripted to provide relevant information at the moment when that information would be most useful and to do so without an overwhelming amount of clerical intervention from the user.

This focus on actionable information should be the goal for upgrading Tutortrac, as really very fundamental questions such as which students am I seeing today or how many students are presently in the center require far more effort than necessary to locate and attention to interpret.  In essence the application redistributes tedious tasks rather than removing them altogether, which afterall was the great promise of computerization.

Yet despite these objections, I still think this application worthy of the attention that it will take to make it a better product, if nothing more than there are few viable options.  But, this is a 14 year old application and by any recognizable standard that should be sufficient time for it to have developed into its maturity  complete with the functions that are  standard for a modern internet based product and given the cost, reasonable to expect.

I’m hoping that with this upgrade Redrock Software will deliver on the promise of Tutortrac, that they will do what Steve Jobs famously criticized Microsoft for not doing.  That they will use this opportunity to push to be the sector leader in bringing truly innovative products to their customers.  I’m hoping that Tutortrac 4.0 will be both an evolution and a bold and forthright step into the 21st century.

No related posts.

Related posts brought to you by Yet Another Related Posts Plugin.

Tutortrac’s database setup is interesting.  There is only one database of students and this database gets updated each time there is an upload.  What this means is that individual semesters aren’t repositories of snapshot data.  For example, you can’t go back six years, say, to find out how many freshmen came to your center.  Why?  Because all of the freshmen have now graduated and they are no longer freshmen.  For this reason, you cannot do trend analysis on key metrics without having saved each semester’s data outside of Tutortrac.  No one would think to do this as this peculiar behavior is not widely publicized and unless you’re a database expert it’s unlikely that you’d ask.  This is not a feature.  It was a poor design decision that speaks to the disconnect between what users need and what RedRock is prepared to deliver.  Certainly there should be more documentation available and perhaps popup notification every time that an upload is attempted.  There should also be a one click function for exporting the database into some separate repository where it can be easily accessed when needed.

No related posts.

Related posts brought to you by Yet Another Related Posts Plugin.

No related posts.

Related posts brought to you by Yet Another Related Posts Plugin.

2. Code in boolean and set function into the tutor specialty assignment feature; not, and, or and/or etc. How about creating sessions where the session type or course changes if no students make appointments by a set time. The session type becomes increasingly inclusive until the first sign up at which point the type locks in. Make the program intelligent.

3. Recode “*” so that administrators can decide whether subsequent students who sign in need only be enrolled in the same subject, course or specific section.

4. Provide release notes whenever Tutortrac is upgraded. This would help users to familiarize themselves with changes before students become subject to the changes.

5. Give individual centers the option to have a different maximum number of scheduled sessions per given time period. Have per course per day and per week minimums that are center specific.

6. Provide a way of temporarily constraining the number of appointments students can make per week, i.e. not more than three individual appointments per week. Perhaps tie this in to number of missed sessions so that the function is activated automatically. The more appointments students miss the fewer multiple appointments they can make in a given time period.

7. Provide a way to automatically pop-up different user hints whenever students search for an appointment. Give students option to disable.

8. Code a dashboard of dynamic performance indices and a form creation tool that accesses both analytic and descriptive data. Don’t just package data. Turn this data into actionable easily interpretable information.

9. Wherever possible, use radio buttons instead of drop down menus. They’re just faster, i.e when students sign out and must answer short survey questions.

10. Always couple course codes with course titles. It’s infuriating trying to read reports that only reference course codes. At the very least provide a way to easily perform a find/replace.

11. Make the student worker screen more helpful by allowing student workers to sort student list by tutor, time-order, or alpha-order as needed. Also make sure that the entire list of students is printable, at present just screenshots are possible. Sorted hardcopies are crucial to efficient traffic control. Make student names clickable so that all their appointments for a given period is displayed and easily accessible. Makes service signed in for changeable by student workers in case of wrong entry by student.

12. Student workers cannot get access to useful student information such as appointment and visit history without also being given access to other student information such as address, GPA, SAT scores, etc.

13. Perform a complete design overhaul of user interface. Eye candy doesn’t have to be empty calories. Color, sound, some really minimal animation, and composition can help users to navigate better. For instance, checking out takes about 3-7 seconds too long. The delay contributes to sloppy data collection or input errors. Simply making the text bigger, utilizing more contrasting colors and as before, using radio buttons instead of drop down menus would help. As it stands, the application’s muted gray color scheme and small text make it difficult to read for older students and fatiguing for power users. As an example, the continue button on the sign-out window is too unobtrusive. Some students complete the sign-out process but do not click complete because they don’t notice the button. This is a case where some color, resizing and repositioning would be advantageous.

14. Search for more opportunities to idiot-proof your product rather than hoping users will follow protocol. For instance, students must be encouraged to select a center before searching for a tutoring sessions. If they don’t, they get incorrect results. Students who ought to read the directions but don’t find this quite frustrating. Or, when students search for a subject but none are available, don’t just return nothing.  Explain what happened to students and what are there options and/or give administrators an option to do something useful given this outcome.

15. Provide a more informative student search screen so that students can determine what sessions are available, mixed subject groups, single subject groups, etc. Hiding the choice behind a drop down menu and requiring students to make the selection before searching doesn’t factor in actual user behavior. Place all the choices on the screen and use radio buttons to select. Again the entire composition of the screen should not be an afterthought.

16. Program in some simple fuzzy logic, i.e., if a student makes concurrent appointments and they show up for the first appointment and are still in the center at the time of the subsequent ones then TT should assume that they are there for the subsequent appointments. Perhaps make this feature a selectable administrator option. Students shouldn’t have to sign in and out again. Also, TT should recognize users with multiple accounts, such as staff and student, and query as to which one is to be used. This problem makes it problematic to use TT as a timeclock when most of our staff also have student accounts. Asking staff to keep multiple accounts seems a rather backwards solution.

17. Keep deleted sessions of an ongoing appointment deleted. Re-saves cause the deleted sessions to be recreated without notice, causing scheduling errors.  This would simply require the program to remember that the one session only option was selected and keep that option until user de-selects.

18. Require students to click on an “I have read and agree to policies” button before they can use TT for the first time.

19. It’s impossible for tutors to determine what subjects their students have signed up for without a lot of clicking and nesting. Include subject on the tutor main menu and number of session attended. Don’t require nested drill down to locate this information.

20. Require students to leave or change email and cellphone information when first logging in.

21. Allow more fine-grained control of administrator access/exclusions than what’s available. There’s too much opportunity for unchecked and unrecorded shenanigans. For instance, I may not necessarily want to give another center access to my reports although they would need to have access to their own.

22. When designated staff are scheduling students, make ‘class’ designations automatically create multiple appointments in the same way that ‘private’ designations automatically create multiple appointments.

23. Prevent students from being able to schedule appointments for sessions that have already elapsed.

24. Create a ticketing system for service calls to cut down on having to repeat the problem to multiple technicians. Help desk programs are free and available on the net.

25. Make the default selection from a list, ‘no selection.’ If a selection is mandatory, force users to have to make a selection before proceeding. This feature should activated universally, but especially whenever students are selecting center, service, or course. The lazy choice should never be the wrong choice.

26. Create a mobile web option so that students can interface with TT using their smartphones.

27. Report absences in instructor reports, not just attendances.

28. Make it possible to input more than one IP or domain range restriction for an administrator account.

29. Make Tutortrac calculate total salary as tutor sessions are added to the schedule. This is anticipated expenditures, not time-clock calculation. Recalculate if schedule change, etc.

30. Have key developers intern in a learning Center for a brief period. Doing so would minimize a disconnect between developer and end user. There is a remarkable disconnect. Many of the corrections that could and should be made to Tutortrac are quite obvious if someone used it for a brief period of time, i.e. a login button that doesn’t work properly, a function that is too deeply nested to be readily accessible, user errors that can’t be corrected at the point of occurrence, etc.

31. Create a robust online user community. Keep the moderation to a minimum.  If I want to ask you a question I’ll email you.  I want to communicate with other users.  That’s the point.  Transparency might be uncomfortable but your users are your best resource and the ensuing dialog can only make your product better.

32.  Create a place to leave notes specific to a given semester, beginning and end dates, winter storms, etc.

33. Webcast key portions of your conference.

34. Reports needed – cost per student per tutor/cost per visit per tutor/all reports should easily incorporate warning notices and grades/courses by name & course code.  Really what’s needed here is customer polling, filtering the most useful requests, running it past a statistician and a design consultant and creating a seamless integration among data collection, data mining, data imaging (tables, graphs, and such), and data presentation (report writing.)

35. Decouple canceling appointments override from making appointments override.  It’s possible to want to authorize one but not the other.

36. The lending library component is hopelessly broken.  The latest glitch.  Reserving an item makes Tutortrac start sending late notices to the last person that returned the item.  These sorts of things really annoy students.

37. Provide a robust punch/time clock feature rich enough to be standalone program. What is available is anemic.

38. Make the application skinnable so that visitors don’t feel that they are going to a third part site and can’t bookmark the application and thereby bypass site specific information.

39. Provide support for by appointment only tutoring sessions, i.e inactivate the appointment if students haven’t signed up by a certain date and time, indicate prominently the types of session so students can quickly distinguish, provide tooltips and contextual menus to help students navigate the application.

40. Make it easy to print out the schedule for the day.  Everything that would be helpful to know if Tutortrac gets hosed.  Again, lots of clicking and printing out different sheets to get information that’s helpful to make decisions.

41. Once a center purchases Tutortrac it becomes a hybrid organization. A center cannot commit to the constant pursuit of excellence if Tutortrac does not. Be the company that defines the standard. Consistently exceed users’ expectations. Think different(ly). Think big.

42. Practice ABI, always be innovating.  It’s been over ten years and with a supposedly mature program I’m expecting an iphone application, not finally being able to display to a student who is their tutor when they sign in to the center.

No related posts.

Related posts brought to you by Yet Another Related Posts Plugin.

No related posts.

Related posts brought to you by Yet Another Related Posts Plugin.

No related posts.

Related posts brought to you by Yet Another Related Posts Plugin.

No related posts.

Related posts brought to you by Yet Another Related Posts Plugin.