Usually we begin designing the interface with the development of users’ portraits - who they are, what they do, why they use it, what information they seek, and what the final result of the interaction should be. This helps intelligently locate information and distribute visual accents.
Designing and prototyping interfaces
Designing user-friendly interfaces and experience of interaction
Awards
6 awards
4 nominees in UI/UX
What is the design and prototyping of interfaces?
Interface design is the development of a user experience of interaction with a service, a site, an application. In short, the design task simplifies the solution of the user task and prevents errors when interacting with the system.
A clickable prototype is a product of designing user interfaces, it is possible to understand on the prototype whether it is convenient to use the interface, whether the user's tasks can be solved.
During design, three key components of a viable product are considered:
- User needs,
- Financial and organizational capabilities of business,
- Technical ability to implement a projected solution.
When do I need to design an interface?
New product development.
For new projects, lots of attention is paid to market analytics, analysis and study of the target audience, its needs and tasks. An accurate understanding of future users and the ability to predict behavior are prerequisites for creating a user-friendly interface. Ideas and functionality are visualized in a prototype, an instrument where the visions of the entire team and the owners of the product are synchronized.
A high-fi prototype is used for testing with potential users. Getting feedback from potential customers, you can quickly make edits by optimizing the functionality. This will help to save development resources in the future, avoiding "rework". The finished prototype of the interface is the basic platform on which marketers are oriented (evaluation of SEO promotion, etc.) and developers (understanding the functionality that needs to be developed).
Redesign of the existing project.
When you redesign an existing site, service or application, you need to keep in mind that there are users who are already used to the interface, so the task is not only to improve the existing interface, but also not to lose regular users by drastically changing the interface.
Analytics of the current site is the key source of information that will give answers to the question, what exactly needs to be improved and how. Such tools are used in the redesign: analysis of statisticall systems (Google Analytics), qualitative and quantitative research of the audience, analysis of user behavior, subjective satisfaction metrics, etc. In the process of analysis, hypothesis (assumptions that can be improved) are collected and the current audience of the site is involved in verifying the the hypotheses with the help of surveys, usability testing, scenario modeling, etc.
75%
– increase in the revenue of companies known as "design unicorns", which invest in a high level UX
UI/UX process in Evergreen
— compulsory stages of development
Comments on the design process
Scroll to see other reasons
- Analytics and collection of requirements - a deep and complete understanding of the future target audience and its needs is a key principle on which we rely in the development of the interface. Until we can’t understand for whom we create the prototype and what motivations of the user are, we do not proceed to the next stage. In the process of analytics, the client is also deeply involved, providing all available information. At this stage, the market, competitors, target audience, and users are analyzed, functional requirements are collected, the restrictions and limitations of the project are specified.
- Mockup is a low-detailed prototype, which task is to synchronize the understanding of all the participants in the design - the client, designers, analysts, etc. The mockup includes pages needed to fulfill key user scenarios, all other secondary pages are drawn at the next stage. Faster creation of such a prototype makes it easy to edit, change the structure and components in the process of discussion with the team, without significant losses.
- A highly detailed prototype is a complete prototype of the future product with all the scenarios and interactive activities. This prototype fully conveys the essence and functionality of the project - it works as a real site. With the help of a prototype, you can test the usability of the interface, which saves time on redesigning the project when it is already designed and released into the world.
- Testing is the best way to verify the correctness of all hypotheses (assumptions that users will behave exactly that way). Testing is carried out live or remotely, its essence boils down to the fact that the potential user performs targeted actions. User experience (success, errors, emotional satisfaction) are analyzed and, if necessary, corrections are made to the prototype.
Testing prototypes
Testing is checking how the user interacts with the developed interface. To perform the testing, you need a highly detailed interactive prototype, which is similar to the real product. Testing is internal (testing live with a moderator) or remote, which is conducted using special services.
Why do I need to test?
Confirmation of hypotheses. When designing the hypotheses are formed and testing allows you to check whether the user behaves as the designer assumes.
Improved interface. Determining where in the interface the user does not understand how to proceed further or he makes mistakes.
Error correction. Testing allows you to identify errors already at the design stage and fix them on a prototype is easier and cheaper than on a finished project.
What should I test?
Navigation
Navigation. It allows to make sure that the user can easily navigate within the content structure. The navigation tree is tested and card sorting is performed.
Behavior
Observation and analysis of user actions when performing a task. A full-time or remote usability testing and testing of the user's focus is conducted.
Perception
It is checked whether the prototype of the project corresponds to the mental model of the user. A test-comparison of two options or a 5-second test.
