EducationTech

Types of User Interfaces

By March 13, 2020August 19th, 2020No Comments

The User Interface (UI) is the space where interactions between humans and computers occur; it consists of information output from the machine, as well as a set of control elements for the user to perform certain actions. These interactions enable an efficient system where machines aid the user’s decision-making process and, in turn, the user can effectively operate it. When building the UI, the goal is to make it self-explanatory and user-friendly so that users can quickly achieve the desired results. 

The growing dependence of many businesses on web and mobile applications places an increased priority on designing good UIs. In this article, we’ll look at the several different kinds of user interfaces and their pros and cons. Additionally, we’ll briefly examine the relationship between users and different types of interfaces to help you to understand where to use a specific kind of UI. 

Table of Contents

 Graphical User Interface

Advantages of a Graphical User Interface

  • Suitable for non-technical users
  • The complexity of actions is hidden from the users
  • Enhanced by attractive visuals
  • Immediate visual feedback
  • Leverages models and imagery from the real world
  • Enables usage of multiple input devices

Disadvantages of a Graphical User Interface

  • Requires power and memory resources 
  • Might have low discoverability 
  • Might overwhelm users with the growing amount of control elements 
  • Hidden commands need to be searched intentionally

 Tips and Tricks

Working with the graphical user interface is tricky. This type of UI often contains multiple menus and other elements that are unique to the GUI, such as keyboard and mouse interactions. 

It should work quickly and consistently, take up an adequate amount of system resources, have predominantly understandable elements to inexperienced users, and meet a number of other requirements. It should have an extensive manual dedicated to the program’s functions, such as which menu item leads where.  

Here are the features that will be useful:

  • Tooltips on menu items and button icons; 
  • A global search for functions and settings;
  • Separation between program functions via different types of menus (pop-up menu with a right-click, quick-access buttons, drop-down menu).

There are plenty of materials on the topic describing tried and true practices, so you don’t have to invent everything from scratch.

Touchscreen Graphical User Interface

The Touchscreen Graphical User Interface requires users to interact with the device with their fingers. It has become a commonly used option due to the popularity of portable devices. You come across touchscreen GUI when you look at almost anything on your phone or tablet. 

The main differences from ordinary GUI are the support of swiping, hold click (often equivalent to the right mouse click), and some other features like a two-finger-tap gesture to zoom/rotate an object. 

Overall, there are multiple pointing actions that users can utilize: length of motion, change in direction, change in velocity, lack of motion, path start and endpoints, pointing, tapping, looping, and time-based motions.

Advantages of a Touchscreen Graphical User Interface
  • Easier and quicker than manipulating a mouse or typing
  • Avoids external devices such as a keyboard or mouse
  • Possibility of adding various motion actions 
  • Accessible to children and elders
  • Zoom-in gestures promote accessibility for visually impaired 
  • Adaptable to a wide range of devices
Disadvantages of a Touchscreen Graphical User Interface
  • Control elements size is limited by mobile display size
  • Additional motions may not be easy to discover
  • May be unnecessarily activated by stray touches

Tips and Tricks

Touchscreen Graphical User Interface can be used in a variety of ways, except for the forms that involve entering a lot of text, which is highly inconvenient for users. Use UI elements like drop-down select and bullet-select, switch, or others similar that act similar to a button. 

Appropriate scaling is also important. UI elements should not look huge on bigger displays; at the same time, users should be able to press the buttons comfortably on smaller devices. Make sure to space out buttons to prevent accidental clicks. Lastly, use touch-related design patterns such as swipe-to-delete or a shortcut to the menu by swiping from the left.

The menu-driven interface employs a series of screens, or “menus”. When a user makes a selection by tapping/clicking on the list format or graphics, it takes them to the next menu screen until they complete the desired outcome. 

An example is the settings menu on your phone. All you can do is scroll the menu and tap items; no other interaction is available. Accordingly, it is used in applications with a familiar, limited, and uniform set of functions. You could put them all under subheadings like “Camera Settings”, “Display Settings”, etc.

Advantages of a Menu-Driven Interface

  • Handy for computer beginners and novice users
  • Low cognitive load on users
  • Familiar interface across different platforms
  • You are in charge of creating an order and a hierarchy for user pathways
  • More control over user interactions 
  • Simple to implement in various kinds of devices

Disadvantages of a Menu-Driven Interface

  • Limited menu options 
  • Sub-menus might be difficult to find
  • Risks of taking up a lot of screen space or being too small
  • Requires unnecessary actions for a simple task

 Tips and Tricks 

Menus are a very intuitive interface because of its limitations. You can scroll through the top completely and get a rough idea of what you can do. However, this is what you can build theoretically.

In practice, one could mess it up. You could create a menu consisting of headings like Settings, Parameters, Tools, Customization, which absolutely won’t be helpful to users. There is no indication of what a heading does and why you need four separate ones for what seems like the same action. 

The menu interface should be well-thought-out so that you can understand what the titles will lead to.  Otherwise, the UX will suffer, and you will force your users to click through all the menu items to find the right one.

 Command Line Interface

A Command Line Interface (CLI) is a text-based user interface for interacting with PC on a low abstraction level. Generally, this type of menu is not intended for the average user. It is mostly used when working with cloud services or carrying out system administrators’responsibilities. 

Many programs and services often have a CLI in addition to a GUI to facilitate automation of tasks. When using bots or communicating across programs, it might be inconvenient to press buttons in the graphical interface. It is much easier to instruct the computer to run a specific console command. 

An example of CLI that people are most familiar with is a terminal of any operating system (Windows, macOS, Linux).

Advantages of Command Line Interface

  • Faster than other types of user interface
  • Less CPU processing requirements
  • Works with a lesser resolution screen 
  • Easily scales in size
  • Possibility to convert repetitive tasks into one command 
  • Ability to trigger cross-application interactions to perform complicated actions

Disadvantages of Command Line Interface

  • Requires experience and/or programming skills
  • Typos in command syntax result in errors 
  • Usually accepts only keyboard input type
  • Not intuitive – requires reading the manual before using it

 Tips and Tricks

When building a CLI, keep in mind your target audience – those who have some experience working with the console. Members of the target audience include programmers, system administrators, and regular users of Unix-based systems. 

However, even experienced users will need some guidance to figure out how to operate the program. CLI is considered the least intuitive type of UI, so make sure your console commands include manuals and instructions. For example, on Linux systems, you can view the command manual by calling it with the –h or –help command.

Also, it is important to ensure correct error handling. If the user submits insufficient parameters to the command or makes a syntax error, it should return an error message. The message should contain enough information to indicate where the problem occurred and offer a manual reference with an example of how it should be used.

Conversational UI

Modern technology is mostly visual, but conversational UI takes advantage of words and language-based communication being as useful, if not more. Conversational UIs allow users to interact with computers simply by telling them what to do. It can be verbal or voice-controlled (like Siri or Alexa) or written (like chatbots). In order to employ the first type, the software should have voice recognition capabilities.

Depending on the complexity of a given tool, it could support rather structured input such as “set a reminder for tomorrow” or more casual queries such as “I need something to entertain a group of six kids for 2-3 hours”.

The invention of this technology signified that users have the option to hold a human-like conversation with their device instead of using computer-specific language. This interface is powered with learning and self-teaching abilities that make them more useful the longer you use them.

For a deeper look into conversational technology, check out our guide on the Voice User Interface.

Advantages of a Conversational UI

  • Versatile in applications 
  • No need to learn new skills
  • Voice provides a realistic feel
  • Connects with users on a personal level
  • Responds with context to build interactions
  • Adapts to gender, tone, accent, and pace of speech
  • Can be integrated into existing apps

Disadvantages of a Conversational UI

  • Limited amount of visual and textual clues
  • Articulating commands might be complicated 

Tips and Tricks

You want to prevent any conversational dead-ends. Otherwise, the user will feel discouraged because of their inability to operate the software, or they will be frustrated that the developers didn’t account for all conversation outcomes. In either case, they are less likely to use the service again.

Make messages concise. Even if you are tempted to answer with exhaustive information, you risk overwhelming your users. Base the conversation on turn-taking that will smoothly progress the dialog.

Leverage the tone and personality characteristics in the words and actions of the UI. Indirect characterization makes the interface more inviting for users. Since people are hardwired to assign persona.

Conclusion

A good User Interface should be easy to use, have intuitive user pathways, allow users to try different options, look pleasing, use suitable colors for key areas, and contain help documentation. 

To make the right choice, consider what your users need and what will simplify the processes within your application. Plus, assess what your users will be most comfortable with. For some, it might be syntax-specific commands or clicking icons, whereas others will find that talking is the most convenient way of interaction with a computer. 

Many developers make the mistake of making application technological in nature without including any social aspect to the interaction. A conversational UI, on the other hand, gives the privilege of interacting with the computer on human terms. The Alan Voice platform is dedicated to helping you implement a conversational experience into your apps quickly and based on your individual needs. 

Leave a Reply

Subscribe to Blog via Email

Enter your email address to subscribe to this blog and receive notifications of new posts by email.