Home > Articles

Design Differences: VUIs Versus GUIs

  • Print
  • + Share This
Voice User Interfaces (VUIs) are a new concept to many who now have the task of doing everything it takes to develop a VoiceXML application. This article describes the difference between the VUI and the long-familiar GUI.
This article is adapted from Voice Application Development with VoiceXML by Rick Beasley, Veta Bonnewell, Mike Farley, John O'Reilly, and Leon Squire (Sams, 2001, ISBN ).
From the author of

Voice User Interfaces (VUIs) are a new concept to many who now have the task of doing everything it takes to develop a VoiceXML application. Major differences between VUIs and other types of UIs you may have designed in the past include the following:

  • VUIs are invisible. As far as users are concerned, VUIs exist only in their minds. VUIs must be designed to make the lightest possible demands on users' memory and cognitive processing. This is the most critical difference between VUIs and GUIs, and drives most of the design differences.

  • VUIs are single-mode interfaces. In a practical sense, the only input method to a VoiceXML application is sound—which is also the only output medium. Single-mode interfaces can't communicate with users as effectively as multimode interfaces such as WIMP GUIs.

  • VUIs must be task-focused. All UIs should be task-focused, but the limiting characteristics of VUIs demand a simple workflow with minimal branching. Compact, task-focused applications maintain user interest and user awareness of where they are in an application.

  • VUIs are used in environments that compete for users' attention and cognitive processing. VoiceXML applications exist in part to support a mobile culture. Applications used while driving, walking, working, and so on must be simple. Prompts must be designed to require as little as possible of users' memory. Error-causing conditions in applications must be identified and avoided.

  • There are currently no standard VUI elements that correlate to GUI elements such as Home, Back, error dialogs, and online help. You will have to build in correlating structures with VUI elements and associated application processing.

Web Browser UI Comparison to a VUI

For the sake of comparison to VUIs, let's examine an example of a GUI used to access Internet content—a representative web site displayed in a Netscape Navigator browser window.

Figure 1 illustrates a simple web page viewed with a Netscape web browser. The screen real estate associated with the browser display is divided into three basic areas, as indicated on the figure:

  1. The operating system window "frame" around the browser

  2. The browser software components

  3. The page display area

Figure 1 A web page displayed with the Netscape Navigator browser.

Each of the basic areas impacts the UI in ways you need to understand to transfer your knowledge about web GUI applications to new Internet access methods such as VoiceXML.

Window Impact to UI

The operating system window, indicated by the number 1 in Figure 1, impacts the UI in several ways:

  • It provides a frame that defines the application's boundaries. You won't confuse objects on the desktop, for example, with objects associated with the web application because you can see where the application begins and ends on the screen real estate.

  • It provides controls you can use to change the size of the display or exit the application completely.

  • It provides a name that gives you a high-level indication of what you're doing inside the window.

The operating system window serves as a point of reference and control as you use the application.

VUI Implications of Window Impact to UI

A VoiceXML application needs to provide at least some of the functionality provided by the operating system window. For example, the VUI should give users the following:

  • A mental model of what the application can do

  • Easy access to application exits

  • The understanding that they are using an automated application

Browser Impact to UI

Browser-specific elements, indicated by the number 2 in Figure 1, provide these UI components, among others:

  • Home—Takes the user to a known point of reference independent of the user's current position in a web application

  • Back—Takes the user back one step

  • Bookmarks—Provides users with a way of storing and accessing important or frequently used web pages

  • Location—Shows the user the URL of the current position within a web site or application

  • Status bar—Confirms to the user whether the application is working

VUI Implications of Browser Impact to UI

Obviously, the VUI can't deliver visual information to users. In addition, there are currently no standards for VUI equivalents of Home or Back. When you design your VoiceXML application, you have to include navigation-related terms in a grammar and then provide software that "responds" to the terms in ways that make sense to users.

At a minimum, you need to provide the following:

  • Home equivalent—A term or phrase that returns users to a known starting point, such as the start of your application or the main menu of a voice portal

  • Back equivalent—A term or phrase that allows the user to back up one step at a time

  • Status equivalents—Audible hourglasses, audible icons, or recorded announcements that convey system status to users

Page Display Area Impact to UI

Page-specific elements, indicated by the number 3 in Figure 1, also provide UI components:

  • Home—In this case, Home represents the starting point of the web site or application, not the application-independent point represented by the browser's home button.

  • Content—Graphics, sounds, text, video, and animations that communicate the purpose or goals of the page and support page tasks.

  • Hyperlinks—Links that transport users to different locations within the site or application.

  • Forms—Elements that collect user input and transfer it to the application for processing (not illustrated in Figure 1).

VUI Implications of Page Display Impact to UI

You may have noticed the potential for confusion about the Home UI function. In the web GUI paradigm, it can refer to an application-independent point (the browser's Home button), or to a starting point within an application (a Home button inside the page display area. Your VUI may need to support two different home-equivalent terms in a grammar:

  • A term such as "Go Home" to return to a voice portal

  • A second term, such as "Start Over," to return to the starting point of your application

VUIs can't communicate the same variety of content types as a web GUI. You may have to reduce your expectations about what your application supports, based on the capabilities of a sound-only communications channel.

But VUIs can support the equivalents of the following:

  • Hyperlinks—Elements that allow users to move through your application

  • Forms—Elements that define user input data and direct its use by application processing

  • + Share This
  • 🔖 Save To Your Account