The Ugly Duckling of Web Design

As web designers we focus heavily on skills such as HTML, CSS, and design. However, there are other skills that we should learn too. One, I like to describe as the ugly duckling of web design.

The story of the ugly duckling introduces us to a family of cute ducklings and one ugly cygnet. On the face of it the ducklings were the cute ones, the ones we should like. However, by the end we discover that the cygnet grows up into a beautiful swan and outshines the others.

When we start in web design we love the ‘cute ducklings’. We learn things like CSS techniques, interface design and jQuery. However, I believe there is an ugly duckling in our midst. One that will eventually grow into a beautiful swan. That skill is empathy.

Admittedly on face value empathy is not a candidate for such a high accolade. However, I believe it is an essential skill for every web designer.

Why is Empathy so Important?

Empathy is the ability to understand and share the feelings of another. This is crucial for anybody other than an infantile web designer churning out the most rudimentary of websites in almost complete isolation. Empathy underpins everything we do.

This begins with our ability to empathise with users.

Empathy With Users

Empathising with users is a fundamental skill exercised by all those involved in the web design process. To create truly “user-friendly” websites we need the ability to understand and share the feelings of our users.

Unfortunately, more often than not, we lose this ability among the pressures of delivering the site on time and within budget. We stop worrying about how our decisions will make users feel and instead go for the path of least resistance.

Empathising with users throughout the design and development process ultimately benefits everybody. Users are happier, clients end up with a more effective website and you increase your reputation.

Of course a lot of us already consider ourselves user centric. But do we use our ability to empathise outside of the websites we build? I would argue it is just as important to empathise with our clients as it is with their users.

Empathy With Our Clients

The client may not always be right, but it is important that they are always happy

We all like to vilify and stereotype clients. We dismiss them as argumentative, ignorant and naïve about the web. But are they really? Perhaps if we learned to empathise more, we would discover that they are not two-dimensional caricatures.

Empathising with clients needs to become a fundamental part of our job. Projects would run more effectively if we took the time to understand and share the feelings of clients. We will also meet less resistance because we communicate in a way they understand.

If we empathise with our clients a better working relationship will emerge that, at worst, would lead to better references, and at best to more work.

We need to remember that we work in a customer service industry and so understanding the client is a part of the job. The client may not always be right, but it is important that they are always happy.

It is also important that our empathy does not just extend to those who have authority over us (the client or boss). We also need to empathise with our colleagues.

Empathy With Our Colleagues

It’s human nature to divide the world into us and them. Developers vs. designers. Project managers vs. sales and marketing. The list could go on. However, when it comes to web design people from many disciplines need to work together to deliver an effective solution.

It is hard to empathise with somebody from a different discipline. Their priorities are different and when they look at projects they see different challenges and opportunities.

We must work hard to see the world from our colleagues' perspective. If we understand what they care about and put their perspective on a par with our own, projects will run smoother, the team dynamic will be more productive and you will see a better culture within your organisation.

The benefits of empathising with clients and colleagues are fairly clear. However, it is also in our interests to empathise with our peers in the web design community.

The Need for Empathy in the Web Design Community

Working in web design is not like working in a mature field such as engineering, medicine or architecture. The web is a young environment where innovation is happening on a daily basis and the rules are constantly changing.

This extreme pace of innovation is due in no small part to the healthy debates that rage across the community. The web design community is always discussing something from broad philosophical debates about the role of accessibility, to specific disagreements about implementing a certain HTML 5 tag.

We should encourage these discussions as a healthy part of the web design community. However, often they could do with being tempered by some empathy. There are too many posts that can come across as aggressive or confrontational. This happens because we get caught up in the heat of the discussion.

We need to be careful that our discussions do not descend into personal attacks.

It is prudent to consider for a moment how our reply will make other parties feel. By attempting to empathise we will diffuse a lot of flame wars before they even start.

Ultimately this benefits everybody because healthy debate is not hijacked by personal disagreement. Although it is good that we challenge each other this should always be done in a supportive and encouraging way that considers the feelings of others.

By now hopefully I’ve demonstrated the benefits empathy can bring in all aspects of our job. The next question is: how do we nurture it?

How to Nurture Empathy

Becoming more empathetic towards our users, clients, colleagues and peers is not rocket science. In fact, it is common sense. However for something that is supposedly common it is often rarer than one would hope.

Perhaps this is because our line of work attracts a disproportionate number of people who would be defined as somewhere on the autistic spectrum. Many of us are not naturally empathetic.

With that in mind I want to outline 4 techniques that will help us understand and share the feelings of others.

Really Listen

I have heard conversations between web designers and their clients or colleagues, where the web designer is putting so much thought into defending their viewpoint, that they are not actually listening to what the other party is saying.

I’ve also seen user testing sessions which haven’t been about the user, but instead have been an exercise in justifying decisions the web designer has made.

In usability testing the face a user pulls when confronted by a certain piece of functionality can often be more enlightening than what they say.

The same applies to clients, colleagues and those in the wider web design community.

It is particularly important to bear this in mind when communicating in a non visual way. Many of the arguments we see in e-mail, Twitter or the blogosphere happen because these mediums do not offer visual cues.

We must not to jump to conclusions about people’s underlying emotions or motivations when we lack verbal cues.

In situations like this where others disagree with us, we should not immediately react negatively. Instead we should ask ‘why’.

Ask Why?

The question why? is possibly the most useful tool in our empathetic arsenal. Often what we say is not what we actually mean and isn’t reflective of the underlying issue. Asking why? digs a little deeper and helps understand what is really going on.

When a client asks you to make their logo bigger, asking why may show that their concern is not the logo but their brand values. In usability testing asking the user why they chose to click on a particular link helps understand their thinking.

Equally, when a colleague or peer criticises your approach to a particular problem, asking why may help you see their point of view and not get immediately defensive.

You cannot get a better tool than asking why if you want to understand others and share their feelings . However, there are other practical tools that enable you to build empathy into your working processes.

Tools to Help us Empathise

Empathy is not just about being touchy-feely. There are practical steps you can take to understand and associate with others better. These include:

User testing: Alongside tools such as personas, user testing has always been crucial in understanding how users feel about interacting with websites. Yet as I have already said, we often use this testing to confirm our own decisions and not for listening to users. This needs to change if user testing is to be an effective tool.

Stakeholder interviews: Stakeholder interviews are an invaluable way of understanding and sharing the feelings of our clients and their colleagues. Sitting down with key stakeholders involved in a project and talking about their jobs, responsibilities and attitudes towards the project will give you a better insight into their thinking. This can prove helpful when their opinions differ from your own. You will find yourself in a better place to find common ground and keep the project moving.

Kickoff meetings: Having a meeting at the beginning of any project is a crucial part of learning to empathise with the client. It is especially important that this meeting happens face to face if possible. This gives you a chance to really get to know the client. Face to face meetings enable you to pick up on visual clues, talk about non project related aspects of their job and generally get to know them better. I often find the most valuable part of a kickoff meeting is when we take the client out to the pub for lunch. You get a better insight into their character and personality there!

Daily team meetings: When it comes to your colleagues, daily team meetings are a useful way of understanding them better. These constant ‘touch points’ allow you to discuss the challenges they face and defuse any disagreements before they become too big. As with clients, a meeting over a pub lunch is something you might wish to consider from time to time. It is at meetings like this that you discover a colleague has been grumpy due to personal reasons and nothing to do with work. This helps you empathise with them and be more sympathetic.

Job shadowing: One of the biggest problems in empathising is not understanding what others do. A designer looks at a marketer and wonders what they do sat in front of their screen all day. Equally the marketer can’t understand why it takes so long to draw a few ‘pretty pictures’. How hard can it be? The solution to this problem is work shadowing. Give others the chance to watch you work and ask if you can sit with them for a day to see what they do. Its easier to empathise once you understand their job.

The Moral of the Story

I started this post talking about the ugly duckling. However, the comparison I used was not the intended moral of the story. As it happens, the story of the ugly duckling teaches us not to judge people too swiftly.

This is also the point I am trying to drive home here. Perhaps if the observer of the ugly duckling took the time to look past the superficial he might have come to understand why the duckling was different.

We need to do the same. Clients are not evil, users are not stupid and our colleagues are not annoying. We simply need to take the time to understand them better and share their feelings. If we do so we will find projects run smoother and a consensus is easier to find.