How to Practice Inclusive Motion Design

Ricardo Roberts
The Startup
Published in
10 min readFeb 26, 2020
Design by Hung Le, Illustration by Carlos Alegria.

If you had a chance to read our previous article, The Truth About Inclusive Motion Design and Why It Matters, you know that inclusive motion design critically examines how content is created and how visual communicators and artists portray images on-screen to communicate with viewers.

The ultimate goals of inclusive motion design are representation and accessibility. To unlock them, it’s necessary to consider both the process and the outcome. Before we jump into the process, it’s important to set yourself up for success first.

Your Team

In inclusive motion design, it’s critical to assemble a diverse team, keeping in mind that diversity can mean many things: age, background, experience level, ability, expertise, gender, and ethnicity, to name a few. If your internal teams don’t include members of your target audience, hire a freelancer or consultant, if possible.

Ensure your team is comprised of people who understand general biases, as well as their own ability biases. For creatives, an ability bias is defined as how we see the world using our abilities as a baseline. No matter who you are or where you come from, we all have inherent ability biases based on our specific life experiences.

Minority creatives in our profession might even conform his/her/their style to what is socially accepted to gain employment. The personal ability bias, in this case, is influenced by and defined by external biases.

To become an inclusive designer, first, we need to recognize our own ability biases and learn to spot the ability biases in others.

To create meaningful and lasting change, underrepresented talent should not only participate but also hold leadership roles on creative teams whenever feasible. To put the current lack of leadership into perspective, consider this: While women command 73% of purchase decisions across the globe, only 29% of creative directors are women. It’s clear that women must be more equally represented on design and creative teams, particularly in positions of leadership.

How can your team think beyond the generic notion of diversity to move the conversation forward?

Challenge everyone to push the envelope by empowering those who are traditionally underrepresented on screen

The Inclusive Motion Design Process

The process starts with a diverse team behind the scenes.

Step 1: Empathize

In the discovery phase, it’s important to ensure you fully understand the specific project goals and business objectives. This is a crucial, behind-the-scenes step that enables you to move forward in an intelligent, inclusive manner.

If the client’s goals don’t address inclusivity, be proactive and show them how you can increase the size of their addressable market through InDe.

Step 2: Define

During behind-the-scenes pre-production work, you must identify the business problem and get familiar with the target audience. If you don’t understand the audience, conduct research using tools such as surveys, focus groups, and informal chats. You can also ask questions of people who do understand the audience. What interests them? What do they look like? Where do they shop, play, and live? It can be helpful to vet concepts and designs against a persona spectrum.

Step 3: Ideate

Ideation takes place behind the scenes during the creative development phase. Every decision you make in this phase should answer the business problem you defined and speak directly to the target audience. Who is on your team matters at this point because oftentimes, our ideas come from our own biases.

Step 4: Implement

During production, you must design and create with the target audience in mind, carefully thinking about and eliminating any unconscious bias.

Here are some general tips for incorporating inclusive motion design on screen:

Send a strong, positive message with your designs. We are all equal, interdependent, and better and stronger together. Avoid “us vs. them” messaging and refrain from perpetuating negative stereotypes or hierarchies.

Be bold and unafraid. Don’t fall for using the illustrated utopian style that defines corporate communications or marketing efforts at large. Treat your subjects equally. Consider what kind of environment beyond the idyllic would be authentic and appropriate.

Characteristics of The Ideal Average / Illustrated Utopia

Real people are not uniform, extremely fit, confident, cartoony or extremely happy at all times. Be aware of your subconscious and ability biases and accepted popular norms about these environments. Be real, be authentic, and be sensitive about how you portray people. It’s 2020 now, it’s okay.

Create characters that represent the full spectrum of humanity. People in the real world vary in size, shape, height, facial features, age, gender, skin tone, and disabilities.

Go beyond simply applying different skin tones to portray people of different ethnicities. This is disrespectful and minimizes the differences that make us all unique.

“I think there’s negativity in not wanting to show these varieties of features/things that make us all different and are identifiable elements. It suggests in a way these differences are wrong or bad. Eliminating them creates a negative connotation” — Monique Wray, Illustrator, Designer & Animator

Make anthropology and ethnography essential to your work. Challenge the accepted standards of beauty in popular culture, which tends to favor the European definition of beauty.

Don’t use the same features for everyone. It’s not difficult or time-consuming to intentionally give illustrated characters some variance. Even if the brand guidelines don’t explicitly allow this, you should push the envelope and be a champion for diversity and inclusion. You’re doing the brand a favor because it’s likely something they didn’t think of (there’s that pesky unconscious bias at work again).

Image from “Drawing People” by Joumana Medlej

We’ve benefitted tremendously from Joumana Medlej’s book, “Drawing People”. In it, she says,

A good knowledge of anatomy is indispensable to draw the human figure, but it is only the beginning. Left to our own devices, we instinctively draw people like ourselves, and in particular, people of our own ethnicity.

The serious artist or illustrator, though, sooner or later finds him/herself confronted with the anatomy and physiognomy of people of different, diverse origins — and the need to know how to portray them. To keep away from the word “race” with its ugly outdated ideological baggage, I use “human-type” or ethnotype to describe human diversity in population groups (as opposed to individuals).

We illustrators cannot hide from the way people look. To avoid perpetrating grotesque cultural errors such as those that ran amuck in the days of colonialism, we need to know what physically defines the populations of different parts of the world. As my work often deals with ethnic themes, I searched high and low for some kind of guide but found none. So I put this one together for anyone who aspires to create characters true to nature and not draw Africans that look like Europeans with dark skin — an erasure of physical identity that is just as insulting as a racist caricature.

Make underrepresented people core participants. When depicting groups of people on screen, underrepresented people should not be last-minute additions to satisfy corporate diversity requests. Depict women and underrepresented populations in strong, leadership roles. Ensure they convey confidence through their body language, movements, and key poses.

Unless your creative brief narrowly specifies your target audience as “youthful 20-year old somethings,” challenge the norms by asking questions about representation.

Do all my characters have to be skinny? Is using the same height, age, ability or skin tone for everyone authentic? Is the lightest skinned youth in the center frame a target hero or is he there because of my ability biases?

The scenes you create should celebrate equality and give equal visual importance to everyone. Careful attention is required to maintain balance.

If you explain your design decisions and present the business case during the exploration phase, your inclusive design approach has a much better shot at getting green-lit.

Make a confident design decision to empower your viewers and own it.

Portray people with disabilities in a thoughtful, positive light. People with disabilities are highly underrepresented in the media, despite being the world’s largest minority at one billion strong.

Whenever possible, include strong lead characters and supporting cast members that are blind, in wheelchairs, or have another visible disability. Be authentic, and never use or create stereotypes. Producing Positive Disability Stories: A Brief Guide, written by Lenovo’s Accessibility and Inclusion Advisor Haben Girma, is well worth a careful read. One of Haben’s main points is that positive portrayals promote inclusion and increase opportunities for education, employment, and social integration.

When describing someone with a disability, use neutral, person-first language (“He is quadriplegic,” not “He suffers from quadriplegia”).

Vet for authenticity and positive representation each step of the way. We all have unconscious biases, so you may uncover subtle messages that could be misconstrued as insensitive. These missteps are often unintentional, but you must be prepared and trained to carefully look at these issues. It’s better to find unconscious bias early on in the creative process versus after a final piece has gone public. This is one of the reasons why assembling a diverse team and “designing with, not for” is so crucial.

Follow best practices to ensure accessibility.

  • Adhere to the American Disability Act guidelines for video. Here’s a great resource for making online video accessible.
  • Design infographics and supers to be consumed by the widest range of audiences possible by ensuring there is sufficient contrast between the background color and text. Use size, placement, and color to indicate importance, as 8% of the world is colorblind. Use sans serif fonts. Be consistent and clear with your design choices. Be extra critical about ensuring your supers, titles, and cutaways are consistent and that they work together to communicate key messages.
  • Design with subtitles and closed-captions in mind by leaving enough space at the bottom so the text doesn’t obstruct key visuals. Use closed captioning best practices designed by the FCC. Sometimes you can build subtitles right into the design, which helps designs maintain consistency and mitigates issues for people viewing the content on mobile phones with the sound off.
  • If you work in After Effects, download our free expression template to create responsive subtitles. All you have to do is change out the text and everything else will adjust accordingly. This template is meant for modern online media with title safe set to 10%.
  • Q&A your titles, supers, and captions by looking at them on a mobile phone from a distance of about two feet, and make sure all selections are visible and selectable without the need for complex gestures. This ensures that people with visual and fine motor skill impairments can clearly read the information on their screens. It also makes it easier for people without disabilities to consume your work.

Step 5: Feedback

The final step is to gather feedback and reflect on hits and misses from your team, your client, and the target audience. Various online resources allow you to cost-efficiently poll your target audience and get critical feedback. Use that feedback loop to learn, adapt and reiterate on the next project.

To ensure constant evolution and improvement, do post-mortems with teams and reflect internally on what went well, what could have gone better, and what was a complete disaster.

The Inclusive Motion Design Feedback Loop

Work In Progress

We’re the first to tell you our process isn’t perfect. InDe is a new concept in motion design. Hung and I are working hard every day to improve what we do and hone our thinking. It has been challenging to develop this approach and to document the process, but it’s worth every single moment.

Since we decided to focus on inclusive design and dedicate ourselves to continuous learning and recognizing our personal biases, our point of view has radically changed. We see every detail through a different lens now and hope this process helps other brands, studios and agencies do the same. It has been eye-opening for our clients, and we’ve been humbled by their willingness to be bold and challenge the status quo.

Our mission at BIEN is to help improve and modernize brand guidelines one at a time until all illustrated and animated content is as diverse and inclusive as the audience it’s supposed to serve.

We challenge everyone reading this to do something today.

Leadership:
• Hire diverse people and include them early on
• Train existing teams to use the inclusive design process
• Revise brand guidelines
• Monitor and evaluate content to ensure they meet InDe standards

Designers/Illustrators:
• Overcome your ability and unconscious biases
• Ensure your work is ADA compliant and accessible (where possible)
• Implement ground-up, boots-on-the-ground change, no matter how subtle. For example, draw a black or brown hand — like Diógenes Brito did for Slack

Producers/Account Managers:
• Include this process in discussions with in-house team members, vendors, and clients to ensure an optimal outcome. Trust us, your clients will appreciate the extra care.

If you have ideas, thoughts or even criticism, please give us a shout. We’d love to hear from you.

This article was written by Ricardo Roberts (Executive Producer) and Hung Le (Creative Director) of BIEN. For the companion article, read The Truth About Inclusive Motion Design and Why It Matters.

If you are in a leadership or design role at a studio, agency or brand, you can make a difference by sharing this post on social media and with your colleagues. Thank you!

Stay in touch — hit us up on Instagram and LinkedIn.

Last but not least, we’d like to give a big shout out to the following people who helped with this article and/or provided input:

Nicole Kraieski — Design Lead, IDEO
Sam Bass — Motion Designer, Animator, Illustrator, Freelance
David Jeffers — Sound Designer, Disability Advocate, Freelance
Joumana Medlej — Illustrator, Author, Educator
Shari Holly — Director of Operations, PIPELINES
Monique Wray — Director, Illustrator, Animator, Small
Rafaela Sanchez — Producer, Red Antler
Carlos Alegria — Illustrator, Motion Designer, Freelance
Sianey Montes de Oca — Motion Designer, Freelance
Caro LC — Motion Designer, Illustrator, Freelance
Margaret To — Motion Designer, Illustrator, Freelance

--

--

Ricardo Roberts
The Startup

Executive Producer @ BIEN, the inclusive motion design studio based in Los Angeles, CA. www.thisisbien.com