Designing an Effective User Interface
Good user interface design is one of those things that are invisible when done properly. When a learner is using an elearning module, a great UI keeps the interaction smooth and makes sure the learner understands what to do at any given time. When done badly, it becomes an obstacle for the learner to struggle around while they’re trying to learn the content, and impedes their experience. Think of the UI as a tool for the learner to interact with the material, the way a mouse allows you to interact with your computer. A well designed mouse should be comfortable to use, requires minimal attention to work, and won’t distract you from the screen. Your UI should be the same. Think about designing your UI from the learner’s perspective.
Make everything as clear and easy to understand as possible, and avoid surprises. Of course, this sometimes necessitates labeling, especially for buttons or icons of things for which there is no standard visual representation. An icon for ‘Menu’ might also be the icon for ‘Notes’, ‘Resources’, ‘Table of Contents’, or something else. Labeling the ‘Menu’ button helps clear up the confusion and reduce the amount of thinking the user has to do figuring out what the button does. Also, using different icons for ‘Notes’, ‘Resources’, etc. will help avoid conflating those buttons with ‘Menu’ without even having to read the label.
Depending on your elearning module, you may not have to include instructions on every screen. For most, one or two screens at the beginning explaining how the module works may be enough. Specific instructions may need to be written for unique screens. At no point should the learner be wondering what to do next. When writing instructions, keep them short and direct, to avoid misinterpretation. If in doubt, run the screen by another person to see if they understand it the same way you do.
When designing creative elearning courses, there may be a theme to the module that is not necessarily based on computer or web designs. Your UI could be a smartphone, a café, or a golf course. Or it might be a simple corporate Powerpoint presentation. Regardless of the direction the elearning takes, make sure you follow the rules and conventions of the design you choose to maintain consistency. For instance, a traditional elearning course might use the graphic on the left for users to navigate a series of increasingly difficult activities.
However, an elearning course that has a building theme, where this is an elevator panel that takes the user to activities on each ‘floor’, that becomes more advanced the higher they go, the graphic on the right would make more sense based on how we understand elevator panels to work.
