Word: Skeleton Screens
Definition: A blank version of the page currently loading. Users generally see gray boxes where images will soon appear alongside gray lines denoting areas where text will load.
Thoughts: This is a common user experience technique is used as a page load distraction device. It is a common alternative to the loading spinners, beachballs of death, and agonizing progress bars.
By displaying skeleton content, it gives the user the illusion that things are happening immediately. When the user sees something, anything, appear on screen, she tends to be less impatient knowing that her command has been heard and action is taking place.
Reference: I first came upon this term reading Luke Wroblewski‘s blog in reference to his mobile app Polar, which utilizes the technique.
Skeleton screens can be seen all over the web and on mobile. Pay attention next time you’re waiting for a Medium article to load or you’re opening up your LinkedIn app.
Word: Readability and Legibility
Definition: Readability is the measure of complexity in the words and sentence structure of a piece of content. Legibility is the ability for people to see, distinguish, and recognize the characters and words within text.
Thoughts: Not to be confused with “legibility”, readability is about reading level and the ability to parse and understand sentences at varying levels of complexity.
Legibility is not about the understanding of a sentence and instead, is concerned with whether someone is physically able see and distinguish the text.
Reference: Both readability and legibility play into user experience. It is known throughout the UX community that users tend not to read most text on a page. Therefore, the text that is presented should be short, to the point, and easily understood at a quick glance. Fewer and less complicated words are important when designing a user experience for all audiences, particularly when the text is not the end goal for the user.
Legibility is equally important because you cannot have readability without legibility. This means that text on a page should be sized appropriately (or have larger options), contain strong contrast with page color and other page elements, and should be written in a clean, less decorative typeface.
Here’s an example of good readability and legibility from the Slack homepage. The text is written in short concise sentences making it easy to understand and great for quick skimming. Additionally, the legibility is great because of the contrast between the font and background color. It is easy to distinguish the hierarchy of important based on size and weight.
Now an example of the bad from SquareSpace’s “Feature Index” page. The legibility is very difficult here. Notice the extremely low contrast between the font color and background — not to mention the small font size. This is an example where designers chose visual aesthetics over usability and legibility. The readability is not great either because the amount of text and length of the sentences make it difficult to skim and understand quickly with ease.
Word: Roach motel
Definition: A wide-ranging group of “dark ux patterns” that describe user experience techniques in which users can easily get into a certain situation but then, intentionally, have a hard time getting out of the given situation once they realize it is undesirable.
Reference: I first came upon this term on DarkPatterns.org and it seemed like the absolute perfect way to describe the occasionally nefarious practices taken by certain designers when they are not transparent with their users.
Example: I’m sure you’d like an example so you know what all that grumbling above is about. Have you ever had an extremely difficult time unsubscribing from a subscription service? There always seems to be too many screens and checkboxes that need vigorous attention before you can truly unsubscribe. I bet it only took one click for you to subscribed to the service! So why does opting out takes you down a rabbit hole of despair?
Just yesterday my boyfriend went to cancel his 14 day trial of the subscription book service, Scribd. Not only was the unsubscribe hard to find, but he had to sit through at least 5 screens asking if he was sure he wanted to leave. (For the record, he was 100% sure at the first screen). Even the Scribd help section lists the final step of this process as “‘Select “Deactivate your account’ on the bottom of the page and follow the onscreen prompts.” Why are there even prompts at all?! This should not be a hard nor time consuming process.
There is something to be said for a company that practices dark UX patterns and assumptions can be made about how they value their users.
Word: Anticipatory Design
Definition: When decisions are made and executed on behalf of the user, thus eliminating the need for choice.
Thoughts: The goal of this type of design, as stated by Aaron Shapiro in a recent Fast Co. article, is to essentially relieve the user of any decision making because the choices are instead made for her. The elimination of decision, reduces steps, and thus reduces task time. The key here is automation through machine learning.
Anticipatory design is based on previous knowledge of user behaviors. Think about the future of buying airline tickets. The idea being that you will no longer need to fill out long forms and enter in personal information. Instead, the application will see on your calendar that you are attending an out of town wedding and book your tickets for you based on previous purchasing habits like preferred airlines and travel times.
Question: How much of user experience is based on the notion of user decision-making? How does automated choices change our mental model as UX designers?
Word: Third person effect
Definition: The notion that a person exposed to persuasive mass media communication believes it to have a greater effect on others than on herself. The person will essentially over predict the influence that such techniques will have on others.
Reference: The third-person effect was first introduced by W. Phillips Davison in 1983. Davison’s theory says that people not only overestimate media impact on others, but they also deny that the mass media has an impact on themselves.
Thoughts: The way messaging influences user psychology is important to remember when designing anything meant to effect user decision-making. People do not like to think of themselves as easily swayed because it means that we are not in control or thinking freely. While this does not have a direct effect on a UX research method or a specified UI trend, it is helpful to understand and consider when making design choices meant to influence others.
Word: Query Effect
Definition: The notion that people can and will make up an opinion about anything, and will do so if asked, regardless of how much thought they’ve given the answer.
Reference: I first came upon this term in a discussion about user interviews by Nielsen Norman Group. NNG warns UX practitioners to beware of this effect during interviews because it may result in disingenuous information regardless of user intent.
“It’s dangerous to make big design changes because “users didn’t like this” or “users asked for that.” If you ask leading questions or press respondents for answers, they might make up opinions that don’t reflect their real preferences in the slightest.”
Thoughts: User interviews provide extremely rich information but it is important to ask about a user’s experiences instead of seeking opinions. Make sure to tread cautiously here. As Henry Ford famously said, “If I had asked people what they wanted, they would have said faster horses.” Keep that in mind!
Word: Change Blindness
Definition: A perceptual phenomenon in which an observer does not notice the introduction of visual changes to an existing image.
Reference: Think about the games you played as a kid that flashed the same image twice but the second time something was different and you had to figure out what that was. This is surprisingly difficult! It is difficult because there is an interruption in our visual perception and because of the speed in which this happens, our eyes have a difficult time fixating on those changes and interpreting them.
Thoughts: Now think about a time you submitted a form only to see an error message. Then you have to identify which form field the error occurred in. Why is it so hard to find the form field with the small red “x” next to it? Change blindness, that’s why! The subtle change between the form pages is not enough to easily identify the problem and therefore we become a frustrated user as we search for the erred field. This is just one of many examples of how change blindness can effect user experience. It is important to think about this while designing subtle interactions.
Word: Social Proof
Definition: People are influenced and guided by the behaviors, actions, and beliefs of others.
Thoughts: Social proof can be used in design to influence users’ thoughts and actions. Take a moment and think about Amazon’s review section. Would you really buy a microwave that was reviewed by 300 people and had 1 out of 5 stars. Most likely, not. Why is that? Because the crowd has a strong influence on your decision in this situation, that’s why.
Dr. Robert Cialdini’s book Influence: The Psychology of Persuasion details how social proof plays into human insecurities and the innate desire to do the right thing.
Social proof can be utilized in user experience design in a multitude of ways like demonstrating product credibility (through reviews and ratings) and encouraging adaption and acceptance (like following a Twitter account because you see many others follow the account as well).
Question: How, if at all, has social proof influenced the development of social media services? Is social media even comparable to the definition of social proof outlined above?
Word: Status quo bias
Definition: The cognitive bias that says people typically prefer consistency over change. The tendency to like things to stay relatively the same, which forms a baseline in the mind. Any change from this consistent baseline is perceived as a loss.
Thought: This psychological principle plays into the theory of loss aversion. Status quo bias can be reduced however, by exposing users to other choices (assuming, somewhat obviously, that those choices were equivalent or better than the current option). The lesson here is that change is best accepted by users when introduced incrementally.
In Chris Nodder’s book Evil By Design he uses an amazing metaphor to describe illustrate this cognitive principle,
“If you place a frog in hot water, it does its best to hop straight out. However, if you place it in cold water and then heat the water up slowly enough, the frog won’t attempt to jump out.”
Essentially, Nodder wants us all to think of our users as frogs, and I’m down with that!
Question: Can you think of a good example that refutes this? How can we make the frog stay in the hot water from the beginning?
Word: Diary studies
Definition: A form of qualitative research that is used to capture self-reported data from participants over a set amount of time, providing key information about how people use products in context.
Reference: Diary studies are not unique to user experience and were first utilized in a variety of other fields such as anthropology and psychology. They also a key research technique in the medical field during clinical trials or disease treatment.
Thoughts: While there are many different forms of diary studies and even more ways to conduct them, UserTesting.com defines the typical method as, “Users self-report their activities at regular intervals to create a log of their activities, thoughts, and frustrations.”
Diary studies provide rich temporal and contextual insights that can help establish behavior patterns and demonstrate strong user habits and opinions.