UI – User Interface Design

ansleyuser2User Interface design requires a good understanding of user needs. There are several phases and processes in the user interface design and depend on the project whether it is for websites, applications or devices.

The first phase focuses on requirements gathering – assembling a list of the functionality required by the project to accomplish the goals of the project and the potential needs of the users.

Field research is the analysis of the potential users of the system by studying how they perform the tasks that the design must support and conducting real tests. Typical questions involve:

  • What would the user want the system to do?
  • How would the system fit in with the user’s normal workflow or daily activities?
  • How technically savvy is the user and what similar systems does the user already use?
  • What interface look and feel styles appeal to the user?

Information architecture – development of the hierarchy of the process and information flow.

Prototyping – development of wire-frames that concentrate on the interface’s hierarchy of content.

Usability inspection – letting an evaluator inspect a user interface, or conduct usability testing which should be used early on in the development process.

Heuristic evaluation (established usability principles) – is a usability inspection method that identifies usability problems. It specifically involves evaluators examining the interface and judging its compliance with these principles. These evaluation methods are now widely taught and practiced in the new media sector, where UIs are often designed in a short space of time on a budget that may restrict other types of testing. The main goal of heuristic evaluations is to identify any problems with the design of the user interface. Usually, the problems discovered are categorized – often on a numerical scale- according to their estimated impact on user performance and acceptance. The evaluation is conducted focuses on user tasks to provide feedback to the developers on the extent to which the interface is likely to be compatible with the intended users’ needs and preferences.

Heuristic evaluation is usually done by one person which reduces cost and time. Most heuristic evaluations can be accomplished quickly, but depends on the size of the project, its complexity, the purpose of the review, the nature of the usability issues that arise in the review, and the competence of the reviewers. This cuts down on design errors. Jakob Nielsen’s hueristics are probably the most-used heuristics for user interface design. His published book Usability Engineering are as follows:

  • Visibility of system status – The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.
  • Match between system and the real world – The system should speak the user’s language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.
  • User control and freedom – Users often choose system functions by mistake and will need a clearly marked “emergency exit” to leave the unwanted state without having to go through an extended dialogue. Support undo and redo.
  • Consistency and standards – Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions.
  • Error prevention – Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.
  • Recognition rather than recall – Minimize the user’s memory load by making objects, actions, and options visible. The user should not have to remember information from one pat of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.
  • Flexibility and efficiency of use – Accelerators – unseen by the novice user – may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.
  • Aesthetic and minimalistic design – Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.
  • Help users recognize, diagnose, and recover from errors – Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.
  • Help and documentation – Any such information should be easy to search, focused on the user’s task, list concrete steps to be carried out, and not be large.

Another set of categorized heuristics from Susan Weinschenk and Dean Barker provide the following twenty types:

  1. User Control – heuristics that check whether the user has enough control of the interface.
  2. Human limitations – the design takes into account human limitations, cognitive and sensorial, to avoid overloading them.
  3. Modal integrity – the interface uses the most suitable modality for each task: auditory, visual, or motor/kinesthetic.
  4. Accommodation – the design is adequate to fulfill the needs and behavior of each targeted user group.
  5. Linguistic Clarity – the language used to communicate is efficient and adequate to the audience.
  6. Aesthetic Integrity – the design is visually attractive and tailored to appeal to the target population.
  7. Simplicity – the design will not use unnecessary complexity.
  8. Predictability – users will be able to form a mental model of how the system will behave in response to actions.
  9. Interpretation – there are codified rules that try to guess the user intentions and anticipate the actions needed.
  10. Accuracy – there are no errors, i.e. the result of user actions correspond to their goals.
  11. Technical Clarity – the concepts represented in the interface have the highest possible correspondence to the domain they are modeling.
  12. Flexibility – the design can be adjusted to the needs and behavior of each particular user.
  13. Fulfillment – the user experience is adequate.
  14. Cultural Propriety – user’s cultural and social expectations are met.
  15. Suitable Tempo – the pace at which users works with the system is adequate.
  16. Consistency – different parts of the system have the same style, so that there are no different ways to represent the same information or behavior.
  17. User Support – the design will support learning and provide the required assistance to usage.
  18. Precision – the steps and results of a task will be what the user wants.
  19. Forgiveness – the user will be able to recover to an adequate state after an error.
  20. Responsiveness – the interface provides enough feedback information about the system status and the task completion.

ansleyuserUser Interface design (UI) or user interface engineering is the design of the user interface for machines and software, such as computers, home appliances, mobile devices, and other electronic devices, with the focus on maximizing the user experience. The goal of the user interface design is to make the user’s interactions as simple and efficient as possible.

Good user interface facilitates finishing the task at hand without drawing unnecessary attention to itself. Graphic design and typography are utilized to support its usability, influencing how the user performs certain interactions and improving the aesthetic appeal of the design; design aesthetics may enhance or detract from the ability of users to use the functions of the interface. The design process must balance technical functionality and visual elements to create a system that is not only operational but also usable and adaptable to changing user needs.

Interface design is involved in a wide range of projects from computer systems, to cars, to commercial planes; all of these projects involve much of the same basic human interactions yet also require some unique skills and knowledge. As a result designers tend to specialize in certain types of projects and have skills centered on their expertise, whether that be software design, user research, web design, or industrial design.






Opening New Tabs for External Links



Why make your users “backspace” their way back to your site from an external link? This is not only bad User Experience, it also hurts your Analytics.

Owners and developers of websites need to think about how to handle links. Many understand the theory behind handling links, but not everyone thinks about it, and many are so sure they know something that’s based on history, but no longer applies.

Browsers nowadays open new “tabs”, not “windows”, allowing the user to view the new page while leaving the page they left on your website available to them. Browser tabs are very easy for your visitors to use. Most users have many tabs opened when they are browsing.

If you have links that lead visitors away from your website to another’s website, why not open their site in a new tab? What if your visitor decided to X out of the page? If you didn’t set up target=”_blank”, your site is gone, too. Makes no sense. Xing out of both tabs is always an option for them, but without it, they are gone, maybe forever.

Sometimes users browse for information purposefully leaving tabs open to reference back to, and actually collect these pages to consume information as they continue to scan. When users want to go back and forth, the tabs make it easy.

You can also save resources by opening external links in new tabs and users won’t need to load your site again.

This tactic of not opening a new tab also hurts your Analytics. If your user clicks an external link in the same tab, it is saying he/she is leaving your site, when perhaps they just wanted to read the outside article, and come back to finish something on your site.

Of course, internal linking inherent to the navigation of the site, should never open in a new tab. Surfing your website should be an easy user experience. Why make your user “backspace” their way back to your site? Makes no sense.

Making your links open the right way is important for Analytics and User Experience.