The Ideal Product and its UX

Review of the book “UX/UI Design for Creating the Perfect Product”

Hi! Today I will tell you about what I learned from Yaroslav Shuvaev's guide book “UX/UI design for creating an ideal product”. In order to not make the review too lengthy, I decided to divide it into two parts. Let's talk about SUS, MVPconcepts Personas And JTBDthe difference between MVT And A/B testingabout APIas a factor shaping UX, and much more.

Chapter One: “Physiological Foundations of User Experience”

An intriguing and somewhat funny chapter title, isn't it?

To formulate better hypotheses about what a product should be, designers rely on their own judgment, as well as data about product usage, as well as publicly available facts and patterns that link behavior to metrics.

In this chapter we are introduced to three very interesting facts, two of which I will mention:

1. The faster, the better the user experience. And more enjoyable. That is The faster the user gets what he wants, the higher his satisfaction from the interaction.

2. Cognitive load, if high, leads to slower achievement of results and more errors. It is clear that The more complex the interface, the more likely the user is to make a mistake simply because I didn't understand where to click, how and what it would lead to. That's why it's important to always keep the main rule in mind – it's better to be clear than intricate.

Chapter Two: “Connecting User Experience and Customer Experience”

The very short second chapter explains that the division of experience into client and user is conditional. If interaction occurs through digital touchpoints (website, application, etc.), then this User Experiencethat is, user experience. And if through non-digital (physical presence in a bank branch, for example), then Customer Experiencethat is, the client. And, of course, there is Human Experience, simply put, the experience of all people interacting with the services of a particular company. includes the user experience, the customer experience, and the potential customer experience – Prospect Experience.

Chapter Three: “What is the difference between UX and UI design?”

…when working on user experience design, we operate with more factors than when working on user interface design.

The chapter contains almost no clear description of the difference. I attribute it to the fact that the target audience of the text are designers who understand and know a lot. But as if it was possible to go deeper, right? I studied the information myself. Here's what I can say.

“User experience design covers all aspects of a user’s interaction with a company, its services and products.” – says Don Norman, a cognitive scientist and user experience architect.

UX design focuses heavily on deeply understanding users, their needs and values, their capabilities and limitations. UX designers focus on how a product works and how users interact with it. They strive to create products that are both functional and user-friendly. The author of the book talks about UX factors in the next chapter.

User interface design, on the other hand, focuses on the visual elements of a product’s interfaces. UI designers are responsible for everything from color palettes and typography to fine-tuning layout and overall aesthetics. Because of this focus on combining aesthetics with usability, UI designers must have a solid understanding of visual design principles.

It is important to understand that most often UX and UI go hand in hand, and yet it is possible to say that UX can do without UI (I mean API, for example). This is just for the sake of notes.

Chapter Four: “UX Factors”

In total, this chapter describes 20 factors that relate exclusively to UX. Yes, there will be a text canvas below)

1. Branding

In the first markets, consumers compared cattle (brand in English) and other products produced by different families, and they developed a strong associative link between the characteristics of the products and the brand. This simplified the task of repeated comparison. The next time, the cognitive load associated with the choice was reduced – consumers preferred products with a familiar visual identifier.

Branding is an ongoing process of maintaining and developing a brand’s identity in the minds of consumers. Good branding promotes brand recognition, trust, and loyalty among consumers, so designers conduct thorough market research, define brand guidelines, and maintain consistency across all touchpoints. Design plays an important role in shaping a brand’s identity. People remember and associate brands with catchy or subtle logos, colors, and fonts. When it comes to website or mobile app design, creative UI/UX that aligns with the brand’s principles and messages is essential.

The properties of branding related to consumer behavior are as follows::

1. Product identification is what makes us see a red tin can and think, “Oh, Coca-Cola!”

2. simplifying product comparisons – we prefer the familiar to the unfamiliar;

3. simplification of dissemination of information about the product – we tell our friends about the red can, and not about the fact that Coca-Cola is particularly sweet;

4. transfer of information about additional properties of the product;

5. satisfying the need to demonstrate belonging to a community – buying luxury brand items, for example.

Within this factor, two important definitions are also explained.

System Usability Scale (SUS) – scale of ease of use of the system.

Further I write solely on my own behalf. The SUS questionnaire was developed in 1986 by John Brooke and consisted of 10 questions. It was used to determine the usability of electronic office systems. Since then, the system usability scale has been widely used to evaluate the usability of software and websites to this day. The evaluation is carried out using Likert scale (respondents assess the degree of their agreement and disagreement from “completely disagree” to “completely agree”).

Minimal Viable Product (MVP) – minimum viable product. The main advantage of MVP is that it allows you to understand the customer's interest in the product without fully developing it. The sooner you find out whether your product is liked by customers, the less effort and expense will be spent on a product that may or may not be successful in the market. Brand identity is often created along with MVP.

2. Functionality

First, we are given an explanation of what functionality and function are.

Functionality – a set of capabilities (functions) that a system or device provides. Function – the ability of an object to do work…The user “hires” the product to do something to satisfy his needs.

The interface that is easier, more understandable and more pleasant for the user to interact with always wins. To get ahead of competitors, you need to offer those functions that they do not have, or those that provide a better user experience. Now let's talk about features, in other words, about Product Feature. Autopilot in Tesla cars is a feature. The author of the book gives his own example – entering the application by fingerprint and notes: “Features reduce the load during the process of using the function”.

3. Technical accessibility

Some might say that interface designers have no influence on how an application works from a technical point of view. But that's not entirely true.

The designer can:

• Thanks to preloaders (preloader) and skeleton (skeleton) show that the problem, if any, is not related to the application, but to some other circumstances – for example, a bad connection. It is important that the user does not associate the problem with the product. Preloaders should ideally display the page loading process, and the skeleton – that the interface element is about to fall into place. It is also very important to understand that “the designer must be a direct participant in the development team“, i.e. focus on not overloading the interface with unnecessary, sometimes difficult to implement (and increasing the load) elements.

• Write clear error messages. I already wrote about such messages in the previous review, I will quote myself:

An error that occurs when using the software should not confuse the user. Yes, an error occurred, but! It is important, first of all, explain her (by specifying the problem and providing sufficient information). Secondly, it is necessary suggest a way to solve it. And better yet, of course, in general prevent errors, prompting the user along the way (with visual cues and interaction patterns).

4. Information architecture

In order for the interface to be understandable, it must be designed correctly. Within the framework of this factor, it is explained what is good about card sorting. It turns out that some people think that coriander is a vegetable. How do you find out? Using card sorting, where users can sort cards into different sections and name them themselves. We are also offered to check out online tools like Trello and Miro. And we are also told what a service tunnel is (service tunnel). This is when you want to order everything for pancakes, go for milk, and the app immediately offers flour and eggs.

We can say that we design the structure of the application with the aim of reducing the cognitive load on users.

In order to design a cool and understandable flow, you need to understand how the audience thinks and what they need. To do this, you can use two approaches – Personas And JTBD (Jobs to Be Done)The JTBD method is that People don't actually buy products, they hire products to do a job. For example, a person does not buy a screwdriver because of its features, he buys what the screwdriver ultimately does for him: helps him assemble furniture to make his home look better. Personas focuses on general user portraits, while JTBD focuses on the specific needs of each user. The former considers users as static entities, while the latter assumes the dynamism and changeability of user needs. In short, the JTBD concept helps to identify the true desires and aspirations of the customer when making a purchase, which can be taken into account in both product development and marketing.

5. Narrative style

Understanding the communicative function of a role model allows one to more accurately predict the outcome of interaction and make a decision about the next action more quickly.

Of course, within this factor, we can remember the brand voice and tone. It is impossible to imagine that the texts in a banking offer would smell childish or frivolous. Just as it is impossible to imagine the dry and indifferent tone of Samokat push notifications (I already mentioned push notifications in the previous article, read it). It is important to maintain a balance in terms of style and always remember what principles of interaction with users the brand adheres to.

6. PR

Increasingly, preferences are influenced by such company characteristics as social responsibility, corporate culture, ideology and moral guidelines.

PR is an effective tool for achieving a wide range of company goals, including increasing brand awareness, overcoming various crises, smooth product integration, organizing events, and supporting strategic communication processes. While marketing and advertising are primarily aimed at stimulating sales and revenues through direct promotion of products or services to consumers, PR focuses on building effective relationships and maintaining a positive image of the company among various segments of the population (stakeholders, customers, employees, and the media).

7. Push notifications

It is impossible not to mention that I have already spoken in the previous article about push notifications as a marketing tool. Now a little about push notifications as a factor that shapes UX. Sometimes push notifications are annoying (for example, WB with its “Honey, this is just for you.»), and sometimes useful – Samokat often offers to use some kind of discount in a friendly manner. In general, push notifications not only affect the user experience, making it positive and useful, or negative and causing a huge desire to turn them off. They also affect the real impression of the company. Plus, of course, they are becoming more and more functional – now it is not only text, but also an image, and the answer input field is also being actively introduced.

8. User generated content

When I read the title, the social network that must not be named immediately came to mind, as well as Pinterest, and our own VKontakte with the ability to share posts.

The product may not have a very beautiful UI, may not have very important and necessary for competition features, but it will be loved for the content posted by other users.

And yes, I do go to I not because I am a fan of its interface. But because I want to watch other people's lives, see what they are doing, learn something useful for myself. A designer can help users actually publish content on a social network, for example. How? By focusing on functionality. Posting, sharing content should be convenient, fast and enjoyable. UX design is exactly about this.

9. Marketing communications

A user experience designer takes responsibility for the entire journey, not just the portion that involves the screens of a website or app.

An email newsletter from an online store may include the ability to order a particular product right away, and this should not only be clear, but also convenient. It must be said that marketing and UX are not at all close – the marketing team strives to increase the perceived value of the company's offer, and the user experience designers team – to reduce the cognitive load that we talked about above. The goal of both is to SUSalso mentioned above, People recommended the app to someone as often and confidently as possible, i.e. remained interested. In addition, certain marketing techniques can negatively affect UX, but this is not the topic of the review.

10. Personalization

How convenient that the feed adapts to the user's interests. I recently decided to buy a second dog, and immediately went to Avito to see what golden retriever kennels there were. I was curious, then left, because “a second dog is probably hard”, and the next day I realized that I was offered a lot of ads for the sale of golden retrievers. And again a crazy thought visited my shaggy head…

This chapter explains what it is MVT (Multivariate Testing). However, in my opinion, an important point is not disclosed – the difference between multivariate testing (someone uses the wording multivariate testing) and A/B testing (aka split testing). I don't think it would be great to go into detail within the scope of this review, but I still have to say a couple of things.

While an A/B test compares the original version 'A' of a landing page to a modified version 'B', multivariate testing changes more than one variable, testing all resulting combinations against each other at the same time.

The formula for calculating the total number of versions in MVT is as follows:

[Количество вариаций элемента A] x [Количество вариаций элемента B] x [Количество вариаций элемента C]… = [Общее количество вариаций]

But there is one potential downside: multivariate tests require more traffic to achieve statistical significance than A/B tests, simply because there are more page versions to test.

11. Reputation

…even a small blemish on a company's reputation can be enough to make people stop using its products.

To understand what kind of reputation a company has, one method is used: Sentiment Analysisi.e. the method of sentiment analysis. Most often, reviews are analyzed in social networks and on various sites. Indeed, many people leave a review of this or that place in Yandex Maps or write about their impressions in a post. It is these texts that the analysis algorithms read and mark the sentiment with colors – red, of course, highlights the negative, and green – the positive. In general, a cool tool for understanding the attitude of customers / users to the company and their product. The sooner a gap is discovered, the better. Thanks to modern analysis algorithms, the time from receiving a review to correcting the defect is reduced.

12. Pricing model

The author of the book focuses our attention on the fact that the pricing model (Pricing Model) is one of the strongest factors influencing user experience, and a tariff comparison matrix, for example, is an important tool for a UX designer. Yes, in the 21st century, we all buy subscriptions to certain services, and it is important for us, as consumers, to understand the difference between tariffs/subscriptions and see the benefit.

She [матрица] allows us to convey information, but also performs a communicative function, like a landing page, on which we can once again talk about the functionality of the product and bonuses.

I think it would also be great to read what the author thinks about the role of a UX designer in creating product matrix.

13. Product Roadmap

In other words – Roadmapwhich is created before the project is launched and supplemented during its existence. You could say that it sets the vector in which the entire team will move. You can see how it looks, here.

…the demand for a product is not always directly explained by the need for functionality. Sometimes it is explained by the promise of functionality or the potential demand for functionality in the future.

To ensure a positive user experience, you need a strategic plan that defines what steps need to be taken to achieve the desired results. And a roadmap helps you achieve this goal. What is called a “promise of functionality” is in the roadmap. Sometimes it is enough for the user to see the potential in the product and hear the promise that especially needed functionality will be implemented in the future in order to use it.

It is important to understand that a roadmap is not at all close to a marketing plan. If the first one is about long-term goals and strategies with approximate deadlines, with an approximate list of tasks, then the second one is a detailed description of processes with requirements for all employees, with assigned deadlines.

14. API

API (Application programming interface) – application programming interface.

UX designers who aim to make the user experience as convenient and enjoyable as possible quickly find that API integration is one of the main tools they can use. The book gives an example of improving UX through API integration: the ability to order an Uber taxi through Google Maps without using the Uber app itself. The same option is available in Yandex Maps – you can order a Yandex Taxi without opening the app. Another example is the precious voice assistant Alice from Yandex, which also exists thanks to the API and the ability to communicate with various services. Paying for delivery is incredibly convenient when you can confirm in a second, literally by Face ID or fingerprint, that everything is ok and that you are writing off 200 rubles for nuts with condensed milk and ice cream.

15. Content

In my opinion, this is a fairly confident intersection with factor #8 (based on what I read). The book does not cover this factor at all. I believe that the point is still that good UX contributes to the influx of users and their subsequent activity in the application.

16. Ecosystem

The most obvious example of an ecosystem is Apple, whose devices, such as Mac and iPhone, work well with each other (AirDrop function, iCloud storage). Russia also has its own ecosystems – Yandex has a lot of services: food delivery, taxi, music, cloud storage, and mail. And everywhere there is a single end-to-end authorization: only one account is needed. It is important that all products fit into the ecosystem and are not perceived as superfluous.

17. App description in the app store

Before downloading or buying an application, a person reads its description in the application store (AppStore, Google Play Market) and screenshots – he needs to understand what functions the application has, what it looks like, and so on. Of course, attention is also paid to Release Notes. The book mentioned how the members of the Alfa-Mobile team made almost a TV series out of the release description: in it, Herman and Oleg (you know which ones) were talking. Is it interesting to watch this? At other times – yes.

18. Deep links

Deeplinks (deeplink) is a type of link that takes users directly to a desired point in an app. Deep links can take several forms. The simplest type, direct deep linkwill open the application if it is already installed, and show the user the desired location. Example: we go to Yandex Maps and share a geopoint with a friend in some messenger. By clicking on the link, this friend opens Yandex Maps and sees that very geopoint. Bam!

But what happens if a user deep links to an app they don't have installed? That's where deferred deep links come into play. deferred deep link it can be directed to the app store. The genius of a deferred deep link is that when that user installs and opens the app, they can also get to the desired page. That is, a friend can download Yandex Maps and see the sent geopoint.

Very useful. It's a colossal time saver)

19. Communication with OS

Well, everything is clear here.

…operating systems are real black holes, absorbing functionality that was once an integral part of self-sufficient products.

The book talks about Apple Pay and Google Pay. About how the ability to search internally is a cool thing that saves a lot of time. And that, of course, the data for each contact in the address book is gradually replenished, since the OS draws information from different sources. It seems that iOS does this, including using mail.

20. Integration with voice assistants

Siri, Alice are very helpful from time to time. I like that I can ask Alice (the speaker) to turn on jazz late at night – this is the UX that seems unforgettable, special. Of course, voice assistants, like the same ChatGPT, are an interesting subject for study and development. There are several prerequisites for development, as the author says:

• We often use services in a dialog form. For example, signing up for a gymnastics studio via Telegram.

• The democratization of luxury is taking place. The simplest example is a taxi.

• Trust in robots is growing (although this is debatable and I don’t know if communication with a robot can be pleasant – all these robots in support irritate me).

So we talked about a lot in this review, it turned out to be quite voluminous. So that you don’t fall asleep, as I said at the very beginning, I divided the text into two parts. I think that the second one can be expected by the end of the week. Write what you think about what you read. And for now – have a nice day everyone!