📜 ⬆️ ⬇️

Testers voyeurism: how to spy on people and why?

How UX - Testers? Earlier, Antonina Hisametdinova at the testing conference Heisenbug talked about the correct display of errors, and deciphering that report gathered many views on HabrĂŠ. And in December, at Heisenbug 2018 Moscow, she talked about why the tester should spy on users - and this report was also well received by the audience. So now we have prepared a text version for it.




My name is Antonina, and because of my profession, I spy on people. Why do it and how to observe correctly? And whose task is to “make interfaces convenient”: UX or QA?

Why watch people?


In the book "How to feed cats" I met the capacious expression "square-nesting thinking." Many developers, managers, business analysts draw such "square-nested" diagrams:



The designer receives a logical sequence of actions and draws the screens, and the tester only needs to verify the result with the specification. The scenarios look something like this: “I went in - I saw it - I paid for it”. This is the "ideal use cases".

That's just a person's thinking is not so rational and consistent, as it depicts a flowchart.



In the life of the user, instead of “I went in, I saw, I paid for,” a whole bunch of different thoughts arise: from “how do I use it at all?” To “will my money be stolen?”

And our “perfect use case” turns out to be short, and some of the user's thoughts break the whole script, forcing him to leave. These are blocker thoughts. We learn to look for them, watching people.





How to observe correctly?


UX researchers have many methods.



But for non-researchers - all this is too difficult, so I simplified this classification to three methods.



You can chat with users, spy on them or make them do something and then spy.



Chatting right


In order to make the results of observations more relevant, it is necessary not to make mistakes. These five are the most common.

1. Do not ask for opinions


First, you do not need to ask a person for an opinion about something. Especially with friends .

I'll tell the story. In our company, the designer chose the font for the mobile version of the site. At the same time, he approached almost all his colleagues with the question: “Is the font normal?”.
“Normal,” everyone said.



At the same time he received irrelevant responses. If he had seen how people read in reality, he would have paid attention to some details.

For example, the distance to the screen of the phone or how the person squints. If he had asked not to estimate the font size, but to read the text of the site, he would have noticed that the person brings the phone closer if the font is really small.



When we conducted such a small test, we noticed that 16 pins are really small.

2. Mark exactly what you want to check.


A small study, like any study, needs a hypothesis. First of all, mark what you want to check.

Very often I meet such feedback collection forms, where a person is invited to evaluate the convenience of the interface.



Problem: 10 people sent a positive review, and two sent a negative one. So, two out of ten is not very convenient. What to do with this information is completely unclear. Therefore, it is necessary to specify the hypothesis.

For example, in the application form in our service, we noticed that the user is constantly faced with an error about the minimum amount of remuneration.

We formed the hypothesis that the user does not understand how much the minimum amount is. Although this information is on the page.



When we conducted the study, we realized that people do not notice the gray signature below the form. As a result, we have redone the design.

The formulation of an exact hypothesis makes it possible to focus on a real problem and not be distracted by other details, such as, for example, assessing the convenience of form.

3. Do not expect a positive response.


A very common mistake among novice researchers is to wait for a positive response from a person.

For example, my friend asked me to give feedback on the new design of Yandex.Navigator. He passed the test task, it was one of his tasks. He looked at me like this:



“Well, how? Do you like? Good design? I did not sleep for two nights, I painted. In general, if the design is cool, they will take me to work. ”



Frankly, the design is bad. Very thin lines, non-contrast colors, strange points, small fonts. There are a lot of nuances that you can find fault with.

But when looking at you with wet eyes, waiting for praise or evaluation, it is very difficult to do. I would prefer to lie to a person than give him some truthful feedback.

We, as developers, do not need flattery, we need truth.

4. Do not force to dream


Another item, my favorite. Even experienced researchers fall for it - they make people dream. To be honest, it’s like phone sex. “What functions should the product of your dreams have?” Or “Would you like to buy a product that would have this function?”

Don't do that. Because very often the fantasy of man and reality are different.



Let's give an example from IT life. For example, the director of an online store decided to conduct a study. He has a hypothesis: people do not understand when the refrigerator will be delivered, so they do not make an order. He asks the respondents: “What would you do to find out these delivery times?” The respondent could answer: “Probably, I would call the store.” The manager blinks his eyes, he sets the task, the unfortunate designer draws this application form. It is very difficult for him, because the marketer came again and asked to add banners. All this does not fit into the order form. As a result, the cunning designer decides to hide the phone in such a tooltip.



Development saws all according to TZ. The tester drops a task to check if the tooltip pops up, if he has the right paddings and fonts - that's all, the task is released in production.

But someone even checked whether people would call the store to find out the delivery time? Who addressed the call center with this question?

Such unnecessary tasks could have been avoided if researchers and managers would stop asking the user about his fantasies.

5. Remember the socially approved answers.


All people lie. But sometimes it's not because people are bad. And because society forces us to lie in order to meet certain standards.

For example, according to a Levada Center representative survey, 2.3 million Russians have accounts with betting companies. And experts who work in these betting companies believe that there are approximately 3.5 million accounts.

And this means that 1.2 million Russians would not admit to the interviewers that they are somehow connected with bookmaker business, because this is not very accepted in society or embarrassing.

Interfaces also need to take into account socially approved behavior. In this regard, Skyeng works fine. This platform brings together a large number of students with a large number of teachers. This platform is unprofitable, so that a person, having stumbled upon a teacher who does not like it, leaves and stops carrying money to the company.

Therefore, the question of changing the teacher is very acute. But as a user, it is very difficult for me to tell a person that I do not like his voice, appearance, or we have different interests. Therefore, Skyeng made the function "Try another teacher." In this case, they write, this review will receive only a personal manager. Only these words can help reduce the outflow of paying customers in the service.




Small details


You can watch endlessly, but now I will share the little details that I have already found in people, so that it would be a little easier for you to look for them.

First of all, this is a mania for all "disable", forcing not to work. We have a shop near the house put such a robot, it was later removed.



I don’t know what he had to do, because he hadn’t worked since day one. But, nevertheless, people approached this robot and constantly poked him, raised his hands, raised this leaf, looked into his face. That's what reminded me of it all:



People behave in a similar way when we turn off some buttons until a person completes the entire form. They still continue to poke this button. This disable-trend came to designers from marketing, when at a certain moment someone on Medium or on VC wrote that if the button zadizayblit, the conversion will increase. In fact, without tests and complex studies, it is impossible to understand when it is worth doing it and when it is not.

Here is an example of life on this topic. I made an order in Sportmaster and found the same jacket on Ozone cheaper. They have such a function: if you find a product somewhere cheaper, you can write to them, and they will lower the price to you. I decided to try - wrote the price of the jacket, tried to enter the phone number, but faced a strange bug when the numbers are not displayed. I do not know what caused this, I did not even see some kind of error. I could not send this application form either, because the button is zadizabled.



Naturally, I went to Ozone and bought this jacket there. But here's the problem: the developers most likely did not even know about this bug and that I ran into it, because it did not fit in with each other - I just closed this form. Therefore, you need to turn off the buttons with great care.



Another pattern. I drew attention to the fact that even quite decent people who live in decent houses, in elevators, little by little they begin to crease something like this, tear off corners, secretly sculpt gum. Of course, we all remember about social approval, no one admits this to the interview. But, nevertheless, people are vandal.

In the interfaces, they vandalnichat the same way, especially when you have to wait a long time. What do I hear from developers when I draw their attention to a long download? "Well, I go there loader bahnu then, everything will be fine." Not really.



Here is such a wonderful example from life too. I open the Cob in the browser, and then a huge pop-up pops up on the whole phone, and I have a big phone.



Koub works faster in the application, this pop-up tells me. I think, okay, persuaded, times faster, then I go there. I open it, and there the eternal spinner is spinning. I waited a minute, freaked out, went back to the browser, and also took down the application. All this is what: people hate waiting.

There is a great service from Google called web.dev, which works through the Lighthouse API. It allows you to evaluate a lot of parameters, including the download speed of the site. All this is done quite simply, you can simply enter the address of the site, and it will immediately give information. I propose to pay attention to two selected index:



The first is the speed index, the second is the time to interaction. According to different sources, the numbers are about the same: Speed ​​Index should not be more than 1.25 seconds. Please note that our service has 4.5. Interaction time at 3G speed should not be more than five seconds. In most services that I managed to check, the time reached 10-15 seconds, and this is very common. All this matters when a person uses your product outside of the perfect Wi-Fi.

Therefore, it is necessary to establish some reasonable limits of expectation. If you need to turn the spinner to 5 seconds - this is normal.



But if a person needs to wait longer (say, a minute), you should use some alternative elements: for example, a loader with a load indicator. There are situations where the user is not clear how long to wait. For example, this download files. At this moment it is very important for a person to give an opportunity to do something else.



This is a screenshot of the Yandex.Disk application. I often look through my photos there, and when I need to download something on my phone, I click download, and a pop-up appears that fits perfectly on all guidelines, but completely blocks my ability to continue viewing. A file in the subway will be downloaded for a very long time.

It is much more difficult when we cannot predict the speed of loading or interaction. Very often such a situation happens in the blockchain, when a transaction is processed from a minute to an hour, and, perhaps, it will never be processed at all.



Greatly in terms of this, the service is Changelly. They made such a dummy download with a loader.



First, we seem to be waiting for payment, then as if we are trading, then as if we are sending. In fact, all of this is a single process, but this is done simply to calm the user, because any operations with finances make people very nervous. At this point, we also do an important thing: saving a person from waiting-vandalism. Because when he looks at something that moves, spins, loads, it is much easier for him to react, and he stops poking at the buttons, constantly updating the page, and this reduces the load on the server and ultimately increases the speed of the site.

Therefore, I highly recommend testing the download speed not only in my office, but also leaving it. You can limit the speed of the browser, but the trash tests are always "in the field."

Also pay attention to the connected analytics scripts or A / B tests, plug-ins, add-ons, feedback systems and other services - all this also affects the download speed, and you need to test "with full equipment" of the site.

If the load or process can not be reduced, users can take something else, even if it is a fictitious story.


Tips


We love to do hints in the interfaces, there are special designers who deal exclusively with onboarding and hints. But here's what I noticed in the offline world: you walk up to the door, grab the handle and pull it to see which way it opens, which one it doesn't. At the same time, the prompts “From myself”, “On myself” usually do not work at all.

There is such a thing as affordance - this is what the interface offers the user, its predictability and patterned use. For example, if the door needs to be pushed, the handle can not be done. In this case, real physical predictability is more important than writing.



But for some reason everyone loves to still write these instructions. Even in the settlement center of my hometown, a woman, when she fills out documents for registration and discharge, and this usually takes an hour or two, puts a sign: “IN CONNECTION WITH THE ACCEPTANCE OF DOCUMENTS, I WILL BE. PLEASE DO NOT DISTRIBUTE! "

Naturally, people still approach and distract, it takes even more time for women, she gets annoyed. The same problem could be solved differently, using the physical properties of the elements.

For example, in the St. Petersburg metro there is such an amazing thing that blocks the inlet. A person comes to the checkout, realizes that he can not shove anything there, turns around and is looking for another way, silently. Explicit non-text characters always work better.



If you can tell the same user text or a hyphaic process illustrating the process, the cognitive load of these methods will be very different. The text is a very serious blocker: if a person needs to read the text to figure out how something works, most likely, he will leave. A person is more likely to understand the gif:



Unfortunately, it is not always possible to avoid long texts or instructions. For example, in one of our services, we cannot yet fasten a technical payment service, so we use third-party payment services, and we host a small instruction:



It seems to us that everything is clear, but the manager and I decided to conduct a small corridor test.

We approach people in our office who are not working on a project (this is important), and we are trying to get them to do something through our interface. Any prototype will do for this, you can not even code it right away.

We force a person to do something (here it is, the third item from our methodology), we look at what he is doing and draw conclusions.

Here is what we found. The button at the bottom right is called “check payment status”, and we meant that when we clicked on it, the person had already read the instructions and paid. But in fact, our respondents poked at this button, thinking that the payment would be in the next step.



This is similar to the pattern that came to us from the distant nineties-zero, when you had to press "Next-Next-Next-Next-Done".

This pattern is so ingrained in the subcortex of people that they do not read what is written on the button and immediately click "Next." At the same time, our headline said that at this step it is only necessary to “choose the method of payment”. We thought and decided very quickly right on the test server to change something.

We changed the title, which now said “pay now”, and really made “Next” from the blue button, when instead of checking the payment status, we send a person directly to the payment service:



Approximately 90% of gross errors can be avoided with such small corridor tests. It does not take more than 15 minutes.

Very often, people think that designers can immediately paint perfectly and beautifully. But it is not. No one is to blame for the fact that the interface has some problems with convenience. Corridor testing allows you to understand how predictable the interface is in principle.



Habits





I think no one needs to explain what this icon means. From the younger generation, which is now actively using all devices, not all have seen the floppy disk. However, many designers are afraid (and rightly so) to replace this diskette with a USB flash drive or a cloud. More habits work in the offline world.

For example, in my bathroom I shifted the mirror from the left to the right. Every morning I get up like a zombie, and after about five minutes, when I completely combed my hair, I realize that all this time I was not looking in the mirror, but at the wall. So our brain jokes with us.

In general, the brain and the tester are very similar. They like to automate everything, just with the help of habits. Our habits are a kind of autotest. So we save energy and do not waste resources, not realizing some of the actions. What are user habits?

Geographical
Habits in interfaces is very important to consider. Classic: "Durov, return the wall." When we have absolutely no difference that we have confused everything in the interface, and a man, like a blind kitten, cannot find a tray.



It is very important to use the “cat tray” method. Who has the seals, well aware that moving the tray is dangerous. When we move it, we try to do it slowly and see if the cat has noticed that we moved it. In the same way it is necessary to do in interfaces. If you need to move a button somewhere, try to test it first on a small group of users. Maybe they are used to constantly poking at her and will now automatically poke at another.

Interaction type
There is also a habit of the type of interaction. Now visual patterns are gaining momentum, when a person gets used to interacting with one element, then goes to another site, and there the designer decided otherwise. This causes some suffering.



For example, we recently switched to Figma. This is a tool to draw pictures to designers. This tool is very similar in operation method to the browser. At the same time, Figma has such a plus, and Google has such a plus. At Google, he opens a tab where you can choose what to show you in this tab. But the creators of Figma decided otherwise. This plus they create a new file here, in this form.

When I went to talk with colleagues about this pain, I noticed that each of them has about 50-60 of these newly created files: they accidentally do this, thinking that it will be just a tab, and in fact create a new file. Deleting these files later is painful and difficult. Therefore, try to adhere to such patterns that are widespread so as not to cause this pain to the user.

Character
There is another very similar to this habit - symbolic. This is when we use “Save” icons.



For example, in the old Word there was an icon that selected text color, and an icon that made text selection, and they were spaced apart.



But when Google Docs came, he decided that it would be one button with tabs inside. At the same time, I personally and a lot of people I know completely forgot about these tabs, because they know that this icon changes the color of the text, and if you once switched to highlighting, the next time it will also work.



Two years passed, and finally Google moved and again smashed these icons as in the good year 98, for which many thanks to him.

Ritual (performed for peace of mind)
In addition to these three habits, there is another interesting thing - these are ritual habits that are performed for peace of mind.



What does the dove? Sociologists have long been exploring this form of habits, and they conducted such an experiment: they shoved a pigeon into a special container, where food was served. After some time, we noticed that the depth began to make strange movements with its wings or to stretch its head.

It turned out that this is a ritual habit, some kind of small superstition, that the pigeon thus seems to cause feeding. Then they checked it on other pigeons, and it turned out that the pigeon began to perform these actions at the very moment of this chaotic feeding. Thus the ritual habit was formed.



So that you do not think that I am lying, here is this dove, and this is a Skinner box, you can google and read about this experiment in more detail, there are a lot of interesting details.

People are not much different from pigeons. Ritual habits are formed not only by pleasant things, such as feeding, but also by pain.

For example, no one needs to explain about the situation when the program crashes, and you frantically try to remember when the last time was saved: six hours ago or yesterday. This pain caused my ritual habit to press Ctrl + S all the time.

But when we switched to Figma, which is able to autosave, like all modern tools, this habit has not disappeared. Over the course of the year, I constantly press Ctrl + S.



Figma perfectly fulfills this habit: it shows here such a tooltip, where it is written that the work is saved automatically. At the same time for Figma, such a tooltip costs absolutely nothing, it has nothing to do with its technical feature, but at the same time it makes me happy: I get confirmation that the work was not in vain, that it was saved.

"People are not very smart"
Often we mistakenly build some diagrams, logic, and then our ideas about people are simply broken about reality.



There was a very interesting report on how to lose 30% of users due to one error in the interface.

First, the creator of this service launched a targeted advertisement on such a “Before Correction” screen. It shows how logical the designer has grouped all four items by the type of “input”: input via VKontakte, via Facebook, via Twitter and via e-mail. But targeted advertising led more to new users, and if they did not want to give this service to the social network, they entered an e-mail and password, clicked the “Enter” button and could not enter. People still have not learned to distinguish between entry, registration, authorization, although this pattern has been working for a very, very long time. These people were freaking out, leaving the service, because they did not understand what the error was, what invalid login / password meant.

After the creators of this service lost approximately 200,000 rubles on targeted advertising, they decided to do something with it and replaced “Login by e-mail” with “Registration by e-mail”. Now, on one page, oh my god, suffer, designer, everything is grouped illogical.But this fix made it possible to return those 30% of new users.

By the way, about "freaked out". Here is an excerpt from my favorite cartoon, Steven Universe, which very clearly shows how people work with interfaces:



How people act when something goes wrong: we just close our eyes and start poking. Even my husband often does that. Not because something will work from this, but because we are so used to it. This pattern is called "tantrum."

It is very easy to track if you start to follow this.


At the moment when a person pokes at a phone or a site like this, the designer sees such a wonderful picture in his web analytics: they press my buttons, everything is fine, everything works. Not really.This bright spot may mean that 10 different people pressed this button during the day, or one person pressed it 100 times during one second. By tracking these multiple clicks, we can find bugs much faster. For this you need to specifically configure analytics.



The last pattern, no less interesting, is “pogo sticking”. It came from SEO, from distant zero years, when people tried, as best they could, to raise their sites in issue. They used not very honest methods: for example, they gave an inaccurate description in the original links. Moving on such a link, the person saw that there was something wrong, and immediately “jumped” back, as if on a pogo stick device. But in the end it had the opposite effect: the site went down in the issue. This pattern should be avoided. Now it refers not only to SEO, but also to different interfaces.



The easiest way to demonstrate this is with the example of an online store. Using web.archive, I got a screenshot from Ozon in 2016. That was just two years ago. Notice how the item card is made. There is only a description, price and button "In the basket." But before a person wants to add a product to the cart, he must read more about this product.

What is he doing? He watches the issue, opens tabs, many tabs, and then scans them for items like / dislike:



At the same time, of course, views grow, analytical reports are fantastic, a million site views per month.

But what do people do with these tabs? For example, they looked at the issue in the shoes: "Oh, cool leather shoes." They open the page and immediately see in the big photo that this is not leather, but suede. I'm not at all friends with suede, so I close the tab right away.



So a person can have 10 or even 100 tabs open. Views grow, but for some reason, money is not added. People do not order products from all these tabs that they have opened.

And there is still such a problem. The man scrolls for a long time, looks: “Bullshit, bullshit, bullshit. Oh, cool shoes. He opens them in the same tab, looks: "Damn, suede." Returns to the previous tab. And there all over again!



That is, we have forgotten that we need to save the place of the scroll when returning back, and this is some kind of nightmare. Imagine you scrolled down to the 100th page. You no longer need shoes when you are returned to the beginning.

Then, with the help of the ritual habit, now we open any tabs in a new tab. Well, what if someone knows where it will open.

Many online stores have learned to deal with it. For example, Lamoda, like many others, has a quick view function. We can open any product in the pop-up and, without losing context, see any information that we need.



Unfortunately, the online store Ozon still does not have such a function.

Such a pattern allows a person to get the information he needs much easier. At this point, we can note that site views are falling, and this can be scary. But you should not be afraid of this, because the numbers and user satisfaction are often not related.

The same can be observed in professional interfaces.



But in the online store it's all tied up for money, and we can measure it financially, so we make some changes faster. But in complex products, as a rule, people are busy sawing new features, and not the convenience of the interface. And very often, in order to see some information, you need to open an invoice in a new tab and see the information there, although with the same modal windows we can avoid this pogo sticking.



Context of use



I mentioned the context of use so many times today, and this is the last point I’ll talk about today. We have an advertisement about summer in St. Petersburg S7. In general, they hung all over the country, but in St. Petersburg it was especially painful. Because the St. Petersburg summer is such that they even joke about him in Novosibirsk. Well, the result:



Probably, at this point, marketers should have guessed that if you go out into the fields and watch how people interact with their advertising, then next time you can do something different for Peter separately from the whole country.

The context is very much tied to what surrounds the person. For example, it is very often possible to encounter a problem when a designer draws 3-4 points on a map, “I drew, I did a good job” - and then it turns out that, for example, in St. Petersburg on Dumskaya Street there are much more bars than three. If on the desktop we can increase the size, then on the mobile phone this interface turns into a complete unusable shit.



The previous Heisenbug was an excellent report.about geolocation testing in Badoo: there testers, among other things, went around London, where there is the same problem with bars to test how accurately and well geolocation works for them. I do not think that they would not have noticed such a usability bug. Although it is very difficult to find a person responsible for this, it is difficult to understand whose it is a cant, whose work it is.



In addition to the environment, a person has a rich inner world, his thoughts and feelings. Using these details, you can interact with the interface in the same way. For example, if something went well, we can ask a person on his “thank-you stream” to leave a comment, so many people do:



In principle, I agree, I go to this service, tick, write good words, do not even mind writing the title .

And when I click on the “Title of your review” field to enter a title, an authorization selection suddenly appears under this field:



I understand that something is wrong here, my level of gratitude drops, but I'm still ready to leave a review. Since I don’t want to give my social networks to an unfamiliar service, I choose email, and then I’m setting it up: I understand that I’ll also register me now. But no, I'm sorry, I don’t like you so much to register in strange services.

And we observe how, in a seemingly logical and ideal scenario, conversion depends only on the inner feeling of the person and his fall in motivation.

In addition to such details, there is also a context, about which we for some reason very often forget: in fact, there are many other digital products on the Internet besides ours. But when we send a person 50 pushes a day, we somehow forget that another application also sends these pushes and in the same way violates our scripts.

In addition to other services, many teams forget that even within a single holistic product there are other commands with other “microservices” that can interfere with each other. For example, here is this chat with the Tinkoff Bank.



At one time, they implemented such tooltip and either the designer is guilty, or the tester tested them so badly, but these tooltip cannot be hidden except to erase all the text, and they block the messages of the call center operator, for example. He writes some important information, you are crushed to the end, and this paragraph covers the text - nothing can be read.


UX or QA?


No one knows the answer to the question "who is to blame," and I would like to talk to you about this. Who should do convenience testing? And do they give it to do at work?

Our company managed without processes to build such a story, when the tester has the right to vote. When we tested one of our sidings, the tester noticed that the dies look like accordions. There was a feeling that if you poke at the others, something should open up, although in reality it would not. It was designed as a bug, but then the designer came and said that it was he who designed the headings.

I believe that such issues should be solved jointly, and there is no separate responsibility of a certain person. But at this moment it is necessary to argue with the designers, and it is quite difficult. At the end there will be links to books that can be read to download in this.

The arguments of the designer are often strange.



To argue with this is difficult, but possible. For example, if the designer speaks about his expertise, it is not necessary to dispute it. No need to offer ready-made solutions "to do wrong, but like this." It is better to throw some challenge and identify the problem, and then he will not think that someone is trying to attack his expertise.

If a person is an art historian, then motivate him: "You are an expert, you will succeed, you can do it beautifully." It is difficult to dispute researchers, since relevant research is practically non-existent, few are engaged in matte. No need to dispute, it is better to hint at diversity - this is a trend, and "you need to take care of all users, including minorities."

No need to try to solve everything in a logical way - people are illogical and irrational. To get a beautiful, clear and user-friendly interface, you need to remember that the quality of a product is not determined by how the product meets the specifications, but by how ready it is for human illogicality.

If you have any questions - write to the comments or my Facebook . And finally - useful literature:



If you liked this report from the previous Heisenbug, please note: the next time the conference will be held on May 17-18 in St. Petersburg . Tomorrow, February 1, tickets will rise in price - so it’s more profitable to decide now than to wait for full information about the program. Available information and purchase of tickets - on the website .

Source: https://habr.com/ru/post/436196/