User Interface Design (UI)

Iterative design is commonly used in the development of human computer interfaces. This allows designers to identify any usability issues that may arise in the user interface before it is put into wide use. Even the best usability experts cannot design perfect user interfaces in a single attempt, so a usability engineering lifecycle should be built around the concept of iteration.

The following key steps form the basis of the process.

• Complete an initial interface design.
• Present the design to several test users.
• Note any problems had by the test user.
• Refine interface to account for/fix the problems.
• Repeat steps 2-4 until user interface problems are resolved.

Atomic design is a methodology composed of five distinct stages working together to create interface design systems in a more deliberate and hierarchical manner. The five stages of atomic design are:

• Atoms: They are the foundational building blocks that comprise all our user interfaces such as type, labels, colours and spacing.
• Molecules: Are relatively simple groups of UI elements functioning together as a unit.
• Organisms: Are relatively complex UI components composed of groups of molecules and/or atoms and/or other organisms.
• Templates: Are page-level objects that place components into a layout and articulate the design’s underlying content structure.
• Pages: Are specific instances of templates that show what a UI looks like with real representative content in place.