The Social Perils of Pressing Buttons
How Cultures are Built Upon UI Minutiae
A bunch of social networks walk into a bar. Facebook is already a little drunk, and he’s putting his arm around everybody, calling them his friends and poking them in the stomach, insisting they should remember him from college.
Twitter has a magnetic personality, but only talks in witty one-liners. He tries to buy a drink for a fun girl named Tumblr, but he backs off when she starts ranting about “the patriarchy.” He turns his attention to her friend DeviantArt, a tiny goth chick reading manga.
Pinterest is a well-dressed lady who’s busy trying to talk to Reddit about posh wedding cakes. Reddit is definitely smart, but bad with women. He keeps adjusting his glasses and trying to convince strangers to become atheists.
LinkedIn stands apart from the conversation, but now and then he taps someone on the shoulder. I’m just trying to make a connection, he says. Aren’t we all.
Every internet community has a distinct culture. Just visiting the front page of each place suggests this, and hard data supports it. Online communities vary greatly by age:
As well as gender.
The subject matter varies by network also. The table below shows how much people share content in certain categories, as compared to the average category. For instance, it confirms that Reddit is a nerdy place where people talk about science and technology, but not fitness. Keep in mind that many people use multiple networks but discuss different topics on each one.
There could be many reasons for the cultural differences among social networks, but as a UX guy, one strikes me the most. I believe the interface elements — not the branding per se, but the boring nuts and bolts like buttons and search bars — serve as a community blueprint, not only gathering a unique group but establishing social norms and customs within it. Furthermore, I believe this is necessarily true of any social network. To understand why that would be the case, we need to explore an obscure social science.
Semiotics 101
Because we cannot read minds, we communicate through middlemen like language, facial expressions, traffic lights and so on. There’s a science to this, and it’s called semiotics. You could call it the study of meaningful communication.
All communication could be broken down into three elements: the object, the sign, and the interpretant. The object is any aspect of reality you wish to express. The sign is the vehicle used to communicate the object. The interpretant is the recipient’s interpretation of the sign. In conversation it breaks down like this:
Object: what you mean
Sign: what you say
Interpretant: what they think you mean
Common sense stuff, and I’m going to make some really obvious observations about it because they will help us later.
- In an ideal semiotic process (flawless, honest communication), the interpretant will be the same as the object, or at least sufficiently similar.
- Assuming you’re not a telepath, you cannot cut out the middleman. Anytime you communicate anything, you must encode your thoughts into a sign for others to interpret.
- This normally happens in a certain order. First you think of an object, then you find the proper signs to describe it, then the listener decodes into meaning.
- There are numerous ways this process can break down, because it depends on both your ability to encode your objects and the listener’s ability to decode your signs. In that sense, every human interaction is like a game of telephone, with the potential for meaning to be distorted or lost.
One more obvious thing. In a face to face conversation you are giving off many signs besides your words: tone of voice, facial expressions, posture, and so on. Understanding people requires summing up all the signs they’re giving you. When you move a conversation online, a lot of signs are taken away. In the interest of understanding one another, we had to come up with new signs to compensate. ;-)
Signs for the Internet Age
The emoticon might seem like a spontaneous creation of teens on AIM, but it was actually the product of a discussion among computer scientists at Carnegie Melon, who needed a way to indicate sarcasm.
I propose the following character sequence for joke markers::-)Read it sideways.
— Scott Fahlman, 1982.
Fahlman’s discovery didn’t win the Nobel Prize, but it did make the online communication of attitude and feelings more efficient. It’s an elegant sign which even transcends language barriers. 30 years later we’re still using the :-), as well as crazy variants like (╯°□°）╯︵ ┻━┻ and graphical emojis and reaction GIFs.
But suppose people online want to have a larger-scale discussion. The :-) sign says I’m smiling, but how do we say 100 people are smiling? Email and chat can handle conversation, but how do we pursue community-oriented goals like consensus, solidarity, popularity? That requires a much more sophisticated approach. First, we’d need to compile the expressions of individuals into some meaningful aggregate. The best way — or at least the most convenient way to do that, would be to convince users to express themselves using some preconstructed signs of our choosing, which can then be counted and processed mathematically.
But how do we get people to use our made-up sign? Like the smiley, it has to seem familiar. It must symbolize users’ intentions or feelings toward one another by somehow imitating them, or at least making some recognizable reference to them.
In semiotics, a sign that resembles or imitates the thing it signifies is called an icon. And the most primitive pre-made sign on the internet is a button. Hmm, this might be simpler than we thought.
An online environment constructed around signs of this nature is called a social network.
Following the Procedure
Brief aside here — If you like creepy psychology research as much as I do, you probably know the Milgram Experiment. You can watch it here, but basically, a fake authority figure convinces people to shock other people for getting trivia questions wrong. For each wrong question, the voltage was increased. If the shock-administrator started to object, the authority figure could usually persuade them to continue shocking the “test subject” with gentle encouragements, such as:
Please continue.
The experiment requires that you continue.
It’s important that you follow this procedure exactly.
Of course, the Shock Generator did not actually do anything. The people answering questions wrong were actors, and the real test subjects were the people who thought they were administering the shocks. In many cases they continued all the way to the highest voltage. The experiment has been recreated numerous times, with similar results.
Psychologists and philosophers will explain how the experiment shows that blind adherence to authority and irrational reverence for scientific research can lead to crimes against humanity. As an interface designer I offer a much more mundane takeaway. If you make someone sit in front of a button they will probably press it.
Like Button Observations
Facebook’s like button is pressed 2.7 billion times per day. It is by far the most frequent action taken on any social network, making it one of the most common, if not the most common way people express themselves on the internet. Since there are already more Facebook users than Catholics, it may be fair to say that, by sheer frequency, the like button now constitutes a significant fraction of all human attempts to communicate.
Apparently the like button was originally going to be called the Awesome button, but that was vetoed. They needed a word that felt mild and effortless, with none of the zeal of love, nor the complexity of compassion, nor the decisiveness of agreement. In the west, thumbs up serves as a generic approval, similar to not-quite-meaningless constructions like “Attaboy. There ya go.” It’s supportive, yet cheesy, with no emotional investment.
These details, no doubt meticulously researched and tested by people like me, come together to form a sign with the desired connotations. The like button is support without effort. Endorsement without agreement. Positive enough to encourage, distant enough to stay safe, and vague enough to seem appropriate in almost any context. The like button is a cheery, almost cutesy, all-purpose acknowledgement. It’s kind of like,
The ubiquity of this button has at least two social effects:
- It produces a culture of affirmation, simply by being the lowest effort action available. Even if you want to change your mind about liking something, you must seek out a sometimes hidden option called ‘unlike’, which is not normally a word in that sense. Dislike is not in Facebook’s vocabulary.
- It alleviates the need for conversation. No longer are you burdened to type out ‘thats cool’ when your friend publicly describes their breakfast. Just click The Button. This leads to the impression that Facebook makes it easy to maintain friendships. Whether two people clicking the same button repeatedly constitutes a friendship is another discussion.
These subtly affect peoples’ relationships in plenty of ways. Sometimes they produce weird interactions of a sort unique to Facebook.
Bob likes that Alice almost died? That can’t be right. He’s probably just trying be supportive, which Alice is presumably wants, but he is too lazy to use words. If the like button didn’t exist, Bob would have had to express sympathy in his own words. But the ready-made response proved too great a temptation, even when it was clearly inappropriate. This is surprisingly common, and Facebook once considered adding a sympathize button for exactly this scenario.
Hopefully Alice will discern Bob’s good intentions. Even if she doesn’t, it’s not like misunderstandings are unique to Facebook. But a more interesting version of this problem can happen when the proper emotional response to a message is not so obvious.
It’s not just that Alice doesn’t know what Sarah means by ‘liking’ this. It’s than Sarah might not know either. Maybe Sarah read the status and thought what a waste of money that was, but then again, it makes Alice happy. In her ambivalence, Sarah thought about making a nuanced comment, and then chose the path of least resistance. She clicked the like button. Now every time she sees Alice’s message she will be reminded of her decision by the words, you like this. Naturally, Sarah will agree with herself.
In short, Sarah didn’t know how she felt, Facebook’s interface subtly suggested that she might like it, and now she does. I will call this phenomenon Shrodinger’s Like: Sometimes, you neither like or dislike something until you click the like button. Then you like it.
If it seems unlikely that the mere presence of the like button could alter Sarah’s opinion, I can think of several well-documented cognitive biases that would lead to this. First is automation bias, which is the tendency for people to favor automated suggestions over their own reasoning. Then there’s the bandwagon effect — Facebook shows that other people have liked Alice’s message, without showing who may have disliked it. Then there’s choice supportive bias, which means that people retrospectively believe they made decisions for better reasons than they did.
The point is that the environment plays a role here. By opening a discussion about something tragic, or even something controversial, Alice is going against Facebook’s natural grain. It’s a place where all your contacts are “friends” who acknowledge your existence by “liking” everything you say and do. It is a place to constantly express approval and happiness. You can of course do otherwise — we’re not talking about censorship or mind control here — but you will always find the interface gently guiding your behavior toward the ordained path.
Please continue.
The experiment requires that you continue.
It’s important that you follow this procedure exactly.The Persuasive Role of UI
Let’s return to semiotics for a moment, and the fact that we have to communicate via some kind of middleman, such as language. In social media there is another middleman: the interface. The user must communicate their intentions toward one another by clicking buttons and interacting with whatever UI elements are available.
UI is different from language in that it reorders the steps in the semiotic process. First you are presented with some signs, then you decide if you have some sufficiently similar intention. As we saw with Alice’s friends, this reordering introduces a stronger possibility of the sign misrepresenting, or even altering its object.
Before we start throwing tomatoes at the very concept of social media, remember that we cannot cut out the middleman. The whole point of a GUI is to present people with actions they might want to take. Presenting the user with choices without influencing their behavior is probably not possible, and may not even be desirable. People want to know what they should do.
In UI design, this principle is sometimes called the law of preferred action. The gist is that, although people think they want options, more options lowers the chance they will do anything. Fortunately you can nudge people out of decision paralysis by making a suggestion:
In a web app, the preferred action is almost always clicking a button. As a rule, it is frequently visible and frequently clicked. Most commonly, it’s a colored button in a neutral-colored interface, associated with a one-word verb. Send. Compose. Tweet. Follow. Reply. The preferred action is inviting, simple to understand, and easy to do.
A social network may have a number of preferred actions in different contexts, but for the purpose of this discussion let’s focus on one important kind: the way the app expects you to respond to someone else’s post. You’ve seen someone’s content, and now you’re likely to click some readily available sign which will let the creator and the public know how you feel about it. What is that sign called, and what does it do? Each network’s answer both reveals and perpetuates that network’s culture. Let’s look at a few to see how their culture relates to their preferred action.
Pinterest came out of nowhere in 2011 and developed a big user base with a distinct culture. For starters, though every social network has a gender bias, Pinterest is on the more extreme end with women outnumbering men almost 3 to 1.
This is probably not due to marketing. Pinterest presents itself as a general interest site, and if anything, it goes out of its way to target atypical users with masculine tropes:
But once manly men take the bait, they are greeted with a front page displaying a cross-section of interests that may strike them as “cute things for rich ladies.”
Indeed, the numbers bear this out.
Granted, to some degree every network is what you make it, and there are plenty of things to explore off the beaten path. When I use Pinterest (and I do!) it ends up feeling less Martha Stewart and more Ridley Scott.
So yes, Pinterest can be used for anything, but in practice certain interests are overwhelmingly dominant. Perhaps there are several reasons, but I think the clearest explanation is that the preferred action, pinning, is conducive to these interests.
“Design is shrinking the gap between what a product does and why it exists.” — Sahil Lavingia, founder of Pinterest
Pinning things to pinboards is not a random metaphor. It’s iconic in the semiotic sense: it imitates something many people interested in crafts, fashion and cute things already do. Here’s a couple of actual pinboards.
The self-described goal of Pinterest is inspiration. Like a physical pinboard, the interface encourages the collection of items that are fun to look at and fairly self-explanatory even when small and randomly arranged. In this way, the act of ‘pinning’ compliments the nature of inspiration: low-commitment, spontaneous, stimulating.
The self-proclaimed front page of the internet, Reddit has not one preferred action but two equal and opposite ones: upvote and downvote. This immediately sets it apart from Facebook, Pinterest, Twitter, Tumblr, and many other networks, which does not offer the user a sign to express disapproval or disagreement.
If you’re not a Redditor, this video explains quite well what it is and why people use it. Basically, it’s a public forum where upvoted posts and comments move up the page, so everyone sees them first.
It’s not just about declaring to the world what you like. First, the interface never uses the word ‘like’, nor any sentiment-oriented words. For instance, you do not “favorite” posts to refer to them later, you “save” them. Likewise there are no emotive icons like hearts and thumbs-up, only up and down arrows. Second, like voting in an election, voting on Reddit is anonymous, so it’s not a way to broadcast your viewpoint or tastes. Instead, users consider it good etiquette to vote based on how a comment contributes to discussion.
But why have a downvote button that moves posts down the page? Wouldn’t a positive button alone sort the content properly, like other networks? No, because the downvote button changes the meaning of a post’s score from popularity to consensus.
Say a corrupt politician posts a blatant lie on Facebook. 1000 people read it. 200 gullible people hit the like button. The other 800 people know better, but their opinions aren’t tallied. Facebook simply says “200 people like this.” If the same situation happened on Reddit, the critics would have a voice. They would drop the comment’s score below zero, which would result in it being automatically hidden. Redditors refer to such posts as “downvoted to hell,” and it does happen to celebrities. This can serve as a check on capital-driven media, effectively censoring even the rich and powerful if they say something stupid enough.
But every design decision has its trade-offs. The downvote button means mob justice is swift, and Reddit can create echo chambers where quality contributors are punished for deviating from the groupthink prescribed by the eloquent ignorant.
For better or worse, the plain-text interface and ruthless democracy of the preferred action make for a design somewhat opposite of Pinterest. Unsurprisingly, its culture is opposite as well. Reddit is 74% male, and a niche intellectual topic like cognitive science is about as popular as crafts and weddings combined.
500px
Let’s end with one of my favorite interfaces. 500px (“five hundred pixels”) is a social network for photographers. Because the site “knows” I’m a sucker for art portraits of ladies, my home page this morning looked like this:
This is not a crop. Once you scroll past the top navigation, this is the entire interface. It resembles an art gallery more than a news feed. I see no buttons, no comments, no friend lists, no branding, no extraneous colors, and no information… until I hover over a photo.
Ah, there we go. A Facebook-style like button, a Pinterest-style favorite button, a username, a profile pic, and a timestamp. If I click the photo, I also see its popularity, comments, and who liked it. All the usual social features are there. But crucially, these elements did not invite me from afar; they awaited my interest, and when my interest shifted, they vanished.
This is a pleasing aesthetic choice, but let’s examine the effect. The lack of visible buttons on the homepage makes the preferred action of 500px simply looking at photos. This is reinforced by the fact that total “photo views” is the first number displayed in one’s profile, whereas total likes, favorites or comments are not displayed anywhere.
We might say the entire photo is a button, and clicking it just displays its full glory. All other actions and information are inconspicuous, even when visible. The Like button exists, but unlike Facebook, I don’t feel I ought to press it.
Here are a few community consequences I’ve observed from my own use of 500px.
- No vacation pics, no babies, no family photos. Since photos have no context, only interesting ones gain traction. I just click whatever is appealing; because the interface is no respecter of persons, neither am I.
- I sometimes recognize my favorite photographers by their style, but have a hard time remembering their names or faces. This is the opposite of most social networks.
- Since the homepage and the preferred action are purely visual, language barriers seem unimportant. I’m an American browsing a Canadian-based social network, but I frequently see popular content from people with names like Георгий Чернядьев. I think that’s Cyrillic?
TL;DR
The relationship of each network’s interface to its culture is no accident. Each network exists to persuade us to do particular types of things, or to think in a certain way. They give us signs that suggest our intentions, and therefore inform our goals as a group. Again, this is not evil, it’s just the nature the beast. Let’s look again at the above networks, as well as a few others, and think about how their various “main buttons” could influence our way of thinking.
The preferred actions are more than buttons; they are the words put in our mouths as we talk to one another. As such, our social behavior will naturally grow in the direction guided by the interface, like plants growing toward light.
In other words, interface design is a form of leadership. It ought to be undertaken with the reverence and wisdom leadership requires.
