UI design is not so much about how an interactive looks but rather focuses on implementing the correct tools in order for the user to successfully accomplish their goals. Because the fundamental principles are so simple, it is easy to forget the basics and stray away from UI design. A strong UI should reflect a balance of good aesthetics and an effortless interactivity which guides the user through their experience.
As mentioned before, each stage that is included in the process of developing an interactive product relates to one another. A user scenario is highly dependent on a user persona to be able to reach its full potential. Where a user persona develops a hypothetical user, a user scenario depicts a proposed situation based on the persona and how they would interact with the product in order to reach a given goal.
The fundamental topics that should be addressed include:
WHO – WHAT – WHERE – WHEN – WHY – HOW
This helps the designer follow a visual navigational path and discover what elements are missing and which don’t work. Therefore, it is important to develop a thorough user scenario in order to create a successful interactive product.
A user persona is the development of a fictional character who is a representative of the intended audience. The purpose follows to reflect the goals and behaviour of the hypothetical users to help designers visualise the user experience.
Some of the fundamental questions that need to be considered when creating user personas include:
What are the tasks the user is trying to perform?
Are there different tasks for different personas?
The basic design patterns include:
Using the program Adobe Illustrator, creating wireframes and mockups are essential to develop which enables the designer to envision what the final outcome will roughly look like. By implementing the ‘Layers’ tool, it allows the product engineer to slowly build their interactive prototype. Through the use of guides, having these foundations are helpful in ways that are powerfully informative to the designer and their team.
Below is a continued example of ‘How to Make Toast’.
The design process should not be overlooked as it provides the designer with insights to their production. In fact, it is during this progression where they fully develop their existing ideas as well as promoting new ones. Bill Verplank breaks this process down into 8 simple phases.
Error – Idea – Metaphor – Scenario – Task – Model – Representation (Prototype) – Manipulation (Interaction)
Through these early developments, it helps the designer to understand, define and frame what needs to be solved and how to overcome it. For example, using a context scenario allows the designer to observe and comprehend the situation, the people and their needs in order to successfully reach their goal.
Utilising a UI flow diagram is another useful tool to visualise an interactive product. It maps out all the pages needed to be included as well as important details such as navigation buttons, titles, rough image placements etc. As mentioned before, for a designer, being able to analyse a structured diagram helps them notice what elements are missing.
Below is an example. (‘How To Make Toast’ cont.)