How to create a peaceful User Experience

Nathan Keen
14 min readJan 8, 2018

--

I previously wrote about the problem of our very angry and divided online experience, and unpacked where conflict comes from.

Very briefly, conflict comes from differences we see in others, and we can control our response to these differences.

You can be highly assertive without being aggressive. You can be highly empathetic without ignoring issues. That is, instead of the fight or flight responses to conflict, we can choose a third way: we can make peace.

My main point was:

to improve users’ experiences we need to actively encourage peace, rather than just bring people together, or remove people who disagree.

But this is not a theory lesson.

Let’s talk about practical UX patterns we can build to reduce conflict in our apps.

I uncovered several ways in which Twitter is particularly unhelpful, and we’ll start there.

Twitter actually maximises conflict because it provides:

  • Little if any context
  • Little if any nuance
  • Little if any tonal references
  • Little if any supporting evidences or reasons
  • Little if any personal connection
  • Little if any identification or validation
  • Little if any reward for a thoughtful response

We’ll deal with these one by one.

Create space for better context

How many times do you hear of people complaining about someone pulling what they said “out of context”? Yet it makes great news and helps us to pile on hate towards our favourite politician or celebrity we love to hate.

Misinterpretations, fake or dodgy data, and out-of-context content fuel gossip and slander. In turn, this creates distance between people, easily destroying friendships.

Keep information with the original context

Internal business software like instant chat should aim to have business-related conversations within the context of the tasks or projects they are about. Chat is for casual chatting, but conversations relating to a task belong with that task. That’s why email is so draining when we use it for talking about tasks. Email lacks the context of the task and project the conversation is in.

Most project management tools, like Asana and Trello, are getting it right today by putting chat technology in with tasks. Asana goes a step further and recognises the need for separate project-related chat.

Asana’s team conversation panel

With footnotes on the web, we don’t have to make all sorts of abbreviations like they do on paper. We can provide all the information people might want in context, like the limitations of the study, the bias of the author, or other comments. This can be hidden until a user clicks on the little link, or added in as a tooltip.

Help to find lost context

But sometimes the rabbit-hole is too long and the original context is lost. There are two ways we can combat this. Firstly, train people to spot poor data. Secondly, train people to write better.

Spotting poor data

Currently, we only have fact-checking sites like Snopes and ABC Fact Checker that try and do this — but you have to go looking for this. Why not bring it to your own website, and make it into a game? Get points or badges for spotting logical fallacies or spotting incomplete data. StackOverflow doesn’t make much of their badges, but they’re fun.

Some of StackOverflow’s badges

Or like Wikipedia, enable other users to flag or tag certain phrases with things like: assertion; needs a source; gossip; etc. or ask questions like: what else does the data show? What about …? This would be most helpful right next to the content, rather than below or in another section (provide the context).

Wikipedia allows tagging of data to show it’s incomplete or biased

There’s also the behind-the-scenes discussion that goes on with every edit, but the average user doesn’t see this so it’s not that helpful for peace-making.

This could be on news sites, blogs, but also for any data numbers, words, images, videos — anything.

In turn, it’s helping people write better. Others are reviewing your writing. And it’s in-context so it’s useful — not buried in a comment box (out of context) that no one can find. Like Medium’s inline comments.

Create non-linear conversations

Not all conversations are the same. In the West we have a blind spot towards thinking of the individual rather than the collective. There’s a similar blind spot in that we think linearly, as opposed to cyclical or holistic thinking.

So, we create linear conversations: one-way conversations that suggest there is only one answer or one path to view a certain issue. Of course there are often multiple solutions.

Linear conversations also bury people in the detail. Holistic or cyclical thinking help to get the big picture. Among colleagues and bloggers, there are always things to learn from wider or different viewpoints.

Debate.org immediately creates two sides to a topic, creating an interesting learning experience. Whereas Wikipedia attempts to put controversy in one section, as if there were no controversy about anything else. It also presents a single view, as if all information could be unbiased. Wikipedia thus creates a bubble, a one-sided view, whereas Debate.org creates space for multiple sides.

Debate.org intentionally pits two sides to attempt a healthy exchange of ideas

We could create make it really easy for commenters to add a table for pros/cons or other similar compare/contrast views.

Here are some other ideas:

  • Use a canvas that allows circles and text, to create Venn diagrams
  • A user or admin should be able to create connections to more than just one prior comment. This is where something like a mindmap or a flow chart could be useful. Why not have a simple flow chart tool in your app?
  • Allow creation of anchors (<a> links) to certain parts of discussion so an overview can be easily created.
  • Allow creation of mind maps so people can summarise multiple views quickly
  • Create a new format for ideas or decisions. Perhaps users can just type in ‘pros and cons’ and it will re-format it into two columns.

Where structured data like mindmaps or charts are made, you could allow others to add their alternatives or nuances.

Add nuance and complexity

How often have you thought that some concept is “not as black and white as that”? This is the importance of nuance. It is different, but not necessarily opposite, from “keep it simple, stupid”, and Steve Krug’s “don’t make me think” maxim.

We shouldn’t simplify to the point where it destroys vital information. So a short text-box, or a character limit, or simple linear chat or forum conversations are not places suited for nuanced discussion.

If your app is gaining significant conflict, why not give people the tools to build a better argument? These could include a mindmap, flow chart, or tables for compare and contrast arguments? Let administrators — or users — add summaries of comments or tags, with links to the detailed discussion.

You can keep it simple by providing the very basic toolset, but leaving the complexity to embedded mindmaps from MindMeister or flow charts from LucidChart. (Embedding those work on your site, right? And it’s responsive and easy?)

Then, reward people greatly for adding in charts and mindmaps. Setup a new social structure where nuance is rewarded, rather than pathetic swipes at people.

Add balance

Another similar rut we fall into is that we problem-solve everything as if there is only one answer. It’s more nuanced than that.

Not all problems have a linear answer. Sometimes it’s about balancing two or more competing but complementary things.

Team vs Individual

Teams need to work well together, but too much ‘open plan’ can destroy solid, focused time. Online, we notice this with too many notifications that want to draw us back in to the latest conversations: but apps should have a ‘focus’ time where you are not notified of anything. Otherwise, like me, you’ll just turn off all notifications.

Control vs Freedom

No one likes an overbearing management, but to move to a completely flat structure simply doesn’t work: no one can tell anyone off, tough questions aren’t asked, and, just like the flat structure among peers at school, cliques and hierarchies will form anyway. So it’s a balance.

Many apps today seem to assume a flat “everything is awesome” structure. Don’t. Allow appropriate management controls so performance, accountability and the ‘tough questions’ can be asked.

Quality vs Cost vs Time

Usually clients want something high quality and low cost and they want it done yesterday. But ‘you get what you pay for’.

Instead of assuming everyone has unlimited budget and cost, assume they have to balance and re-balance the ‘triple-bottom-line’.

If you offer a service, why offer only premium options, as if all people want high cost, high quality services? You could promote more inclusivity (and less elitism) by allowing ‘the little ones’ in with fewer features at less cost.

In the actual app or website, allow people to change times (dates), costs, and quality controls easily, in bulk, and easily notify others of those changes.

Try to add tone and attitude

The tone of the written word is often completely lost. How can we signal to people that we’re being sarcastic, light-hearted, or serious? We usually have to add more words. In this day and age, surely we can do better.

In part we have this through emoticons. For sarcasm we might add a face sticking out their tongue :p or a wink ;-) or write </sarcasm> or just /s. For something light-hearted, we might use a laughing or smiling emoticon :D or even say “lol”. But this doesn’t necessarily come through, especially if it is only at the end of the sentence, or small.

Just as bold, underline and italics are common markers we use for emphasis, why not have other styles for sarcasm, light-heartedness, seriousness or other tones? We often use a lighter tone for ‘helper’ text next to or in a form: can this and other styles be given for people?

What about having an option to change the background style of the comment depending on your choice of the ‘mood’ of your writing?

This writing is in a ‘fun-loving’ mood rather than a serious comment (which might potentially start a punch-up):

Why not allow micro-video answers?

Alternatively, allow a small photo to show your body language (or better emoticons).

Many text editors do not allow emoticons, but they are vital for showing tone and attitude. Make sure they’re available, and understandable.

Give due weight to evidence

We all hate the stereotypical used-car salesman approach, with layers of deception and slick psychological tricks used to trick you into buying something.

Deception, lying and magic tricks may at first seem to create great rapport with people, but eventually you create great rifts between people when they find out they’ve been duped.

When your application focuses on casual chat, and yet expects to cater for deeper, more meaningful discussions, it will fall short. The popular or most vocal will win, because the tools are in their favour. Instead, more structured content such as tables and mind maps, ‘sticky’ content carefully curated and summarised, will help to rebalance the discussion.

‘We only ‘like’ around here’

It’s popular to build applications that have likes or hearts for a post or item. This however, can be used as a peace-breaking exercise in that the most popular opinion wins. The carefully argued and evidence-based posts — too long to read — get canned. A rift is created.

Alternatively, it can be a peace-faking exercise in that the only options one can choose are likes — but not dislikes. When people can’t be critics, when they’re forced to act happy, they’re internally made less happy. (Yes, positive-thinking doesn’t always work.)

Instead of bland ‘likes’ or even upvotes and downvotes, particularly for feature requests, ideas, or any opinion-based decision tool, it’s better to focus on understanding differences. Why do lots of people like it? Lots of people like sugar, but it doesn’t mean it’s good for them. So we can’t fake peace by preventing the negative opinions. (And the negative opinions should be tempered by focusing on the evidence or reasons, rather than basing it on their opinion.)

Why not a ‘why’ button? A ‘what do you mean by that’ button? A ‘please explain’ button? (Not necessarily literally — but shift the focus.)

If you have to use likes, why not like a certain sentence, and dislike a certain sentence? That would provide better feedback for the writer/company — and readers.

Amazon’s ‘helpful’ / ‘not helpful’ buttons in the context of their review section are also, well, helpful. But it would be better to allow people to highlight a particular line that was helpful, rather than the whole. Or even to allow people to tag anything: helpful, like, dislike, ad-hominem, illogical, bias, needs source, and so on.

A couple of ideas from Amazon you could add

Create personal connection

I’ve tried ‘selling’ stuff to complete strangers in the CBD before. It’s thrilling stuff. You can get into really deep conversations because you have no personal connection and therefore no cost if you stuff it up or they don’t like your ideas.

You could also hurl abuse, and get away with it.

That’s what’s it’s like online too — people talk in ways they wouldn’t normally because there’s little if any personal cost. They talk under an alias, and they are talking with strangers. It’s also why it’s quite easy to get frustrated with an outsourced customer service operation — they are so distant, it’s impersonal and almost robotic.

But you don’t talk to people face to face the same way. There’s a certain level of respect that comes with personal connection.

Any way in which we can replicate face to face online is going to promote respect for other people. LinkedIn requires you to know the people you connect with before you can link in with them. Of course you can lie, but, that would take more effort. Facebook creates strong mapping with your real life to create more personal connections. Apps often try and connect you with your friends, like Strava — which measures your cycling or running — so you can share the experience with people who care.

Don’t follow ‘dark’ UX patterns

Are you building trust and rapport first, or just using and abusing people’s personal information?

If you’ve collected data from your own tests that show a higher email subscription rate when the checkbox is pre-ticked, the ‘right’ thing to do is not necessarily what gives you the better rate. From a peace-making point of view, you only want to sign people up who know they’ve signed up. Otherwise, you’re potentially undermining people’s trust in you, because you’ve used their email in a way which they believe they did not sign up for.

This is part of ‘dark’ UX patterns, and is not new, but it is something to combat as part of being a better peacemaker.

Have a verification process

When you can write practically without any barrier, it tends to promote ‘trolling’ — bullying and spastic comments that benefit no-one. It’s like talking to complete strangers: there’s a certain freedom to say whatever you want to say, even if it’s very hurtful, because you’ll know you’ll never see them again.

But there’s a tension with wanting to allow people to use your application easily. Stack Overflow does this quite well. They make a quick signup process, but only allow you to do certain things until you’ve earned your reputation within the site. So, for example, you may not be able to ask your question until you’ve answered someone else’s (each section has slightly different rules). You might not be able to up-vote an answer. You might not be able to comment. It’s called “earning the right to speak”.

Your application will be different — but the principle of earning the right to speak is true in real life, and probably would do good things to your app too.

Verifying through other means that people trust can also be very effective. Licenses could work, such as verifying an identity through your state’s car license registration. Allowing easy visual identification through a photo so you’re not anonymous is good. Sharing with your friends, or only allowing friends to connect, could be good.

Slow the speech down

Much of what we regret in communication is ill-considered words, too quickly spoken. If the topic might be religion or politics — or any other potentially conflict-ridden area — there should be a different area, or alternate mechanisms to facilitate those discussions.

For example, we don’t just ‘chat’ about business ideas, we need a bit of structure to help the conversations flow in the right way, and so use the ‘business model canvas’.

We should have some measure of structure available in easy reach for other topics too so that the conversation can be guided into what we know would actually be useful.

Even just a simple comparison of two opposing ideas, with serious attempt to understand the why’s and how’s of each side is helpful.

Don’t assume (make an ass out of u and me)

A principle can really help here too, to slow down the conversation. You know when someone says something weird, and you laugh at them? Well, if it’s done online it’s much easier to notice that reaction and stop it before you write it. Instead of laughing (unless you know it is sarcastic), realise that you laugh because you have no idea where they are coming from. A peacemaker will not create division through derision, but rather assume they misunderstand something.

Let me state it again from a different angle: assume the best, and ask clarifying questions, lest you create a needless division. Ask them ‘why’ questions (not in an interrogative tone of course). You’re highly likely in the end to appreciate their perspective, and you may even grow in your respect for them.

Allow drawings

We put ourselves in a box if we ‘must’ stick to just words. Why not allow people to easily scribble something with their finger or mouse?

Drawing aids our understanding so well that we say “a picture is worth a thousand words”. When people can see what you’re saying, it reduces misunderstandings — and therefore conflict.

We allow people to add their signatures via their finger these days — why not allow people to draw in a similar way in comment fields? In an “email us” form? In any interaction? There are plenty of plugins and ideas around HTML5’s canvas and various Javascript libraries to facilitate this.

Passively teach the good

(One more! Coming from Facebook rather than Twitter.)

We’re familiar with spell-checkers and grammar-checkers underlining words and phrases that need editing. It shouldn’t be too hard to use another dictionary to check against words which are peace-breaking or peace-faking to help us improve that angle of writing.

Peace-breaking words are often aggressive, and final (my way or the highway). This is probably where a dictionary is the best approach. StyleWriter, a Windows program to help users write English clearly, uses a dictionary to highlight cliches, sexist and legal words, for example.

Peace-faking is not quite wrapped up in words. It’s an absence of information. This is the sort of absence you can only pick up from an extended period of collecting data about a person. Based upon what a person likes, or actually purchases, you can see material from the same category that they have missed. But this is not the typical “you might also like” or “people who bought this also bought” auto-suggestions. This is an anti-suggestion, designed to get you think outside the box and consider the same topic from a different angle. Appropriate titles might be: “have you considered these alternate opinions?” or “extend your understanding”. It could be based on what people have seen on your site: “are you aware of these?”.

Conclusion

Nothing can guarantee a peaceful experience, of course.

But if you’re expecting to foster a shared respect of differences among people, there are some clear things that we can do and shouldn’t do.

It’s clear that just getting people together isn’t going to create a friendly and fun time. What’s needed is some active encouragement of peace-making to spark a better experience.

There’s so much more once you start seeing through this lens! Keep the conversation going through the comments.

Why not a clap for each thing you’ve learned here?

--

--