Illustrating Balanced and Inclusive Teams

The influence of brands on society can’t be underestimated. The technology industry in particular is extremely unbalanced when it comes to diversity, and there is little doubt that a lack of representation in tech brands plays a role — if people don’t see themselves represented in tech branding, it’s unlikely they’d consider tech a welcoming place to work.

As a member of the technology community, Atlassian realized its responsibility to depict a more diverse and inclusive vision of collaboration. The Creative Team addressed this opportunity in a number of ways as part of a major brand refresh and found that illustration could be an especially powerful tool to support their effort.

In this session, Sara and Trace from Atlassian, discuss their journey towards creating an illustration system that reflects more inclusive teamwork. They will share some of the challenges they’ve encountered in building a representative brand and lessons they’ve learned along the way.

Sara VanSlyke & Trace Byrd – Illustrating Balanced and Inclusive Teams

Sara and Trace will be talking about making illustrations more inclusive… first they want to acknowledge the irony of “two fo the whitest people you’ve ever seen, talking about diversity”. It’s not the job of minorities to promote diversity, it’s everyone’s responsibility.

In the US there is an almost exact 50% split between males and females in the population; but you wouldn’t know that to look at congress. This shapes peoples expectations, as do your own products regardless of whether you intend it.

When Atlassian rebranded in 2017, inclusion was part of the process and it was reflected in the illustration style. Atlassian uses a lot of illustration in its brand, so it’s quite powerful. It also has the same problems of stock photography – where there are easy-but-cheesy images to illustrate things like “teamwork”.

Lessons learned

  1. understand the difference between diversity and inclusion
    1. diversity is quantitative, people are represented
    2. inclusion is qualitative, people feel included
  2. challenge assumptions about your audience
  3. visual diversity
  4. conceptual inclusivity (eg. body language and power dynamics)
  5. communicate and empower

Illustration is a great chance to demonstrate representation. When showing people doing things, you can break the usual stereotypes about roles and who can have them.

Challenging assumptions was particularly difficult at Atlassian as it’s a company for developers, by developers. Atlassians are used to thinking the customer is really exactly just like them. But in reality when it comes to diversity and inclusion, the audience is everyone.

Visual diversity required Atlassian to lose the blue and white “meeples” (like the stakeholder) because although they were neutral in some ways, people mentally defaulted to white and male. An attempt to move to more human figures started with “no skin tone”, but that’s not a thing because it just defaulted to the default white background. Then there was a terrible over-correction to cartoonishly stereotyped images.

Ultimately they came to a nice set of subtly hinted illustrations, but people didn’t recognise themselves in them.

They tried using brand blues as skin tones, to avoid the entire problem. But it made groups look too homegenous and left it open to interpretation – including a default to white.

The current set of meeples strikes a more nuanced balance. Individual characters do have elements that define race, gender and so on. But they have a wide enough range to avoid stereotypes or homegenisation.

Composition can still create issues. In one example shown, the men were placed noticeably above women in the image, so even adjusting the number of people did not change the implied power dynamic. The fix was simple – swap a male and female figure so there was equality in the placement.

Action and role can still be difficult. An attempt to include a character in a wheelchair accidentally emphasised their disability and not their agency. The solution was to move the disabled character into a different role in the image.

Just creating design assets doesn’t mean everyone will know how to use them. The meeples are published at Atlassian for anyone to use. To remove guesswork, they assigned diverse groups to common background colours; so if in doubt just pick a set with the common background and it should be acceptably diverse. Also the icons for job/role are badges that can be added to any meeple, to avoid tying a particular person to a particular role.

Continuous improvement is better than delayed perfection. – Mark Twain