Architecture & DesignCreating Online Application Power Users Using Graduated Usability

Creating Online Application Power Users Using Graduated Usability

Developer.com content and product recommendations are editorially independent. We may make money when you click on links to our partners. Learn More.

Keeping the Web simple and easy has driven Internet usage to more than a billion people worldwide. Anyone with a connection, a browser and the ability to enter a URL can use the Internet today. This simplicity is great for those looking to browse their favorite blog or search for a recipe for dinner, but it has many problems as an application development platform — usability being the primary issue. Of course, tools and HTML compatibility also pose problems, but these are development issues and are dealt with by a few well-paid, trained individuals. Usability affects a greater number of people over a longer period of time.

HTML and current browsers are built to deliver content-rich Web sites, making it easy to navigate between documents. In contrast, applications need complex workflows and usability features to allow users to take advantage of the functionality they deliver. In order to fit applications into the navigation-driven approach of the Web, developers and designers typically use the navigation of a link to perform an action, rather than navigating to a new document. This makes learning to use online applications easy by fitting into existing Web usage patterns, but not necessarily usable.

“Simplicity does not equal usability”

While the aforementioned statement may seem counter intuitive, “usability” encompasses the effectiveness, efficiency and satisfaction with which users achieve tasks in a given application. Because users differ in many facets — particularly in experience and skill level, they will judge the effectiveness, efficiency and satisfaction of the application differently.

Graduated Usability is a concept that, when applied to application design, allows a single application to provide the means for any user, no matter their particular skill set or experience level, to effectively and efficiently use that application. Additionally, an application designed with Graduated Usability will inherently provide the ability to transition users from one skill or experience level to the next. When novice users are transformed into power users, they can more efficiently complete tasks and perform more skilled tasks.

Graduated Usability targets three skill levels of users and defines what is needed to make each more efficient:

  • The Novice User looks to perform tasks easily with little or knowledge of the workflow of an application. Applications that are too complex in design reduce the user’s efficiency and additional resources can be tied up as they seek help to complete the initial tasks. Effective application design draws upon usability paradigms, making movement from one application to another easy through familiar designs, and uses visual keys, such as links, to provide users with suggestions for what to do next.
  • With basic knowledge of an application and the ability to perform tasks, Intermediate Users are able to complete given activities, and seek to do so quicker and more frequently, enabling them to take on additional responsibility. Since this class of users is looking to transition themselves into a power user as quickly as possible, education becomes an important application feature. Education should be an intrinsic application design element, because users will spend most of their time using the application — not the help system, which should be viewed as a contingency plan for the education process. The edification of users should be almost submittal.
  • Completing tasks efficiently is the primary need of the Power User. These users have performed tasks countless times, and multiple step processes seem mundane. The ability to quickly complete tasks make the Power User extremely valuable to their employers, reducing overhead with their ability to accomplish more in less time. Thus, applications need to be designed with the Power User in mind — all users are striving to reach this skill level and these are the users that contribute most to a business’ bottom line.

Graduated Usability isn’t a new concept — most desktop applications use it, Web applications are limited in their ability to be designed with Graduated Usability. As more people leverage Web-based applications as part of their everyday life, for both work and non-work related tasks, more time will be spent using these applications than those on the desktop. However, currently, Web applications offer few alternatives to users: accomplish tasks less efficiently over time, wasting time and money, or move on to better designed applications that can meet their needs.

Designers and developers of Web applications have only a two alternatives as well: build multiple applications to meet the needs of targeted users’ skill sets, forcing some users to seek applications that they can use efficiently elsewhere, or incorporate technology that allows a single application to meet the needs of every skill level. A single application employing Graduated Usability is the ultimate solution; it will reduce development cost and eliminate lost revenue opportunity associated with users seeking other applications.

Lowered usability = lowered productivity = wasted money

In business, productivity translates to revenue, so whether directly or indirectly, Web applications have an impact on the bottom line of business. Continued use of poorly designed applications will eventually decrease productivity, which wastes money. . Complex applications can be too hard for unskilled users, who will waste time as they struggle to complete tasks, while advanced users waste time with applications that do not allow them to complete tasks quickly. As businesses continually look for ways to make employees more productive, Web application usability for employees is a great place to start — particularly since more and more businesses are deploying applications online.

Web based e-mail applications have become hugely popular — businesses use them to lower the cost of deploying e-mail products in-house and individuals use them to check personal e-mail from anywhere with an Internet connection. Most online e-mail applications are generally the same, although there are some exceptions. A typical e-mail application shown in the figure 1 below makes it simple to work with your e-mail, viewing and deleting messages, etc.

Figure 1: GoDaddy.com e-mail application

An Informal Experiment

Experimenting with a few different ways of deleting e-mail will illustrate how a simple task can lead to lowered productivity. As you can see from the image above, users need only follow a few simple steps: check off the box next to the e-mail they wish to delete; select “move to trash bin” from the combo box above; press the “move” button. Or, they can follow another set of steps: check the box next to the e-mail they wish to delete; press the “delete” button.

Desktop e-mail applications allow the same easy process, offering toolbar buttons and menus. However, desktop applications offer higher-level usability features that allow the use of a shortcut key, thereby reducing the steps and time it takes to perform the task. Again, since Web applications don’t utilize rich components in their design, it is not possible to offer advanced usability features due to the lack of functionality of HTML and the time it takes to design, develop and test such features.

An informal experiment showed that it took an average of 5.046 seconds to delete an e-mail. This included the time it took to make the round trip to the server and refresh the page, which was included because the e-mail application is unusable during this process. (Without incorporating the page refresh time it took an average of 2.565 seconds to delete an e-mail). Repeating the experiment in a desktop application, it only took an average of 0.643 seconds to delete an e-mail by pressing the “delete” key (calculated with a hand off the keyboard to start).

Comparing the “delete” key action in the desktop application to the comparable Web-based action, it’s clear how much less time is spent using simplified user interface approaches (see figure below). If deleting an e-mail in a Web application takes 565 percent more time than in a desktop application, one can imagine how much time would be lost if the user was instead restoring an incorrectly deleted e-mail or completing a more complicated task.

Method used Average Time Increase time
“Delete” key – desktop e-mail application 0.643  
“Delete” button – Web application 3.650 567.65%
Combo box and “Move” button – web application 5.046 784.76%

The next table shows the potential cost of all the people using the Internet deleting just one e-mail per day. These numbers are not meant to illustrate that Web based e-mail is a waste of money, but to show how usability affects the bottom line.

People 1,000,000,000.00
Emails Per/Day 1.00
   
  Time Wasted
Seconds 5,046,000,000.00
Minutes 84,100,000.00
Hours 1,401,666.67
Years 160.0076104
   
  Money wasted
Wage Per Hour $1.00
Day $1,401,666.67
Week $7,008,333.33
Year $364,433,333.33

What technology should be used?

Rich components are the foundation of desktop applications, providing developers and designers with the ability to display complex workflows and handle interactions with users through a robust event model. To a user, rich components give them the ability to interact with desktop components in a greater number of ways (e.g., a table of data can be modified with keyboards shortcuts, context menus or by dragging rows). This interaction doesn’t necessarily need to be complex to provide an advanced feature. For example, users can delete a row of data from a table in multiple ways: via the main menu or toolbar, by pressing the “delete” key or by dragging and dropping the element into the “trash” folder. How often have you used the “delete” key in a Web application? Probably never.

While having multiple ways of completing the same task may seem like overkill (or even a waste of time and money), this functionality is core to the third group of user defined by Graduated Usability: power users. They will be able to take advantage of features that new users cannot; making them to be more productive than the novice. Essentially, as users grow more experienced, they grow more productive — something evident in most facets of life, not just when people use great applications.

How RIAs can help

RIA (Rich Internet Application) frameworks available today typically come with a component library similar to desktop applications, whether the runtime is written using AJAX, Flash or Java. These components allow developers and designers to build applications that provide users with multiple ways of doing the same task easily and the ability to eliminate round trip time to the server. Designers using these components will be able to develop applications that meet the needs of the power user, providing them with more complex ways of completing tasks and thereby increasing their productivity.

An RIA component library will differ in implementation, based on the type of platform in use. AJAX will utilize the capability of the browser hosting the application, while a Flash-based application will use the Flash animation engine to render the components; Java platforms will use the Java Virtual Machine to create the widgets. Each platform has its benefits and drawbacks, but the goal is the same: to provide the developer with a component library as robust as a desktop component. Once the components are created, developers can use them to create applications with greater functionality and usability, and then deploy them over the Internet. Following are the types of advanced usability features that are possible with an RIA component library:

  • The lack of Accelerator & Shortcut Keys is one of the greatest weaknesses of Web applications. The keyboard provides the user with an extremely fast way of triggering an action. Shortcut keys benefit the user by: providing the ability to simultaneously use both hands to perform an action; reducing the need to move the mouse and therefore eliminating “miss clicks” and travel time; and ensuring focus is not transferred away from the actionable item, allowing multiple actions to be taken. Keyboard access is virtually non-existent in Web applications (aside from a form or the address bar) and limits the speed at which tasks can be executed.
  • Context Menus provide users with the ability to quickly determine what actions can be applied to items within an application. Context menus are usually activated by pressing the right mouse button, which will open the menu for the currently selected menu. This benefits the user in a few ways: reducing screen clutter and simplify the user interface, as menus are only visible when desired; only showing actions relevant to the selected item; and speeding up how quickly the user can trigger the desired action based on the location of the menu.
  • Drag and Drop provides users with a quick and direct way to reorganize information. Users can select items, then click and move them from one location to another. For example, the action being taken in an e-mail application when the user drags a message from the inbox and drops it into a specific folder is very clear.
  • Composite Components provide users with ability to interact with the data in place, eliminating the need to activate new user interface components in order to modify the desired data. Rich tree tables are one type of composite component that desktop application designers have incorporated into applications to give users increased productivity. This ability to simply modify a field of data in a table, for example, eliminates the need to open a dialog or switch focus to a new panel in order to perform edits.

Tying it all together

As more and more people use Web-based applications, the need for greater usability becomes obvious, particularly when you consider this in the context of the earlier example, and how much money would be lost in productivity each year just by having all Web users delete a single e-mail with current Web applications. Graduated Usability’s effect doesn’t need to be as extreme to have an impact on a business. What if a call center could save 5 to10 seconds per call just by using an RIA solution, or an online stock trade order could be executed a few seconds faster? The ability of RIAs to provide “cool” or “pretty” user interfaces made them a fad, but their ability to significantly increase an employee’s productivity by allowing developers and designers to build applications that are more usable makes them a perfect platform to build your next Web application.

About the Author

Robert Buffone, Principal Software Architect, Nexaweb Technologies (www.nexaweb.com) is responsible for platforms and tools at Nexaweb. Before Nexaweb, he was with Trakus, a technology company for tracking sports in real-time. Buffone possesses deep experience and knowledge regarding Java and Windows technologies, is a leading expert in User Interface design and has received many awards for his outstanding work in the software industry. Along with speaking at leading industry events, including JavaOne and EclipseCon, he has published several articles on various topics, including tool and application development.

# # #

Get the Free Newsletter!

Subscribe to Developer Insider for top news, trends & analysis

Latest Posts

Related Stories