While there have been a number of exciting developments in the digital product space to help people with disabilities, there still exist many products with fundamental accessibility issues making frequent daily tasks cumbersome and even broken at times. For example, a user may not be able to read critical content because the text is too light in color and they have low vision or are outside in the bright sunlight.

Many of these fundamental issues can be addressed if accessibility design guidelines are applied at the design system level. This makes the design system even more effective at it’s task of saving time and resources as well as providing a more consistent experience for the end user.

In this talk, Jen Devins, walked us through three strategies to efficiently bake accessibility into design systems.

Focus on system wide building blocks first

Baking accessibility into the foundation of your design system is a critical place to start for a thoughtful, holistic solution. Apply color contrast guidelines to the overall palette to help users with low vision; ensure the state system considers clear focus and selection indicators to help keyboard users; provide clear and concise labels to common icons to help users who are unable to see the screen; ensure touch targets are large enough for users with low mobility or simply with larger fingers.

Embrace standard interaction model patterns

Another important accessibility guideline is to ensure all users can navigate efficiently regardless of how they interact with the product. For example, relying on only keyboards is common for people who find using a mouse challenging due to arthritis as well as power users who feel keyboards are faster . But what if you don’t rely on keyboard all the time? How are you supposed to know the best interaction model?

Luckily, there exist a number of industry-wide resources such as he WAI-ARIA Authoring Practices from W3C that document expected behaviors. Following these standards will better meet users expectations and reduce time spent reinventing any wheels.

Document action items for people implementing the design system components

While a design system with accessibility baked in can greatly help increase product accessibility, there is still work a product team will need to do once the implement the pattern or component in context. Recommending ways to group elements for more efficient navigation as well as indicating visual elements that will need labels are great examples of action items to make teams aware of.

---

About the Speaker

Jen Kozenski-Devins | Head of Google Accessibility UX

Jen has been a UX Designer for 20 years and over time found herself immersed in the world of inclusive design and accessibility. Her goal is to learn from users and educate product teams on ways to make products more inclusive. During her career at Google, Jen was a design manager on products such as Search, Google Analytics, and G Suite and is now the Head of Google Accessibility UX. Before Google, she worked on the main shopping experience at eBay.

Respected design systems like Apple’s Human Interface Guidelines and Google’s Material Design cover best practices for the most common user situation: focused on their phone, holding it about 12” away. But how do we adjust that guidance when our user is trying to maneuver a car through a busy city following instructions to pick up a stranger through 2 second glances at a phone mounted 24” away?

In this talk, Linzi Berry, Design Systems Lead @Lyft shares how Lyft went about designing a system around situations, how their quality principles and guidelines adapt, why accessibility, legibility, and tap targets matter, and how you can begin to tackle your design system from a situational perspective.

In this talk, Julie Zhuo - VP of Product Design at Facebook gives an overview of her top tips for getting and giving feedback and include several examples from her experience.

The talk includes questions to help challenge your perspective around giving and receiving feedback. Various feedback scenario prompts are put up on a slide and you can practice working through these conversations. It is effective if you do that with a partner. The partners will then give feedback to each other on how each delivered and received the feedback and then switch roles. Each person will have a chance to go through several scenarios as both the deliverer of the feedback and the person receiving it and discuss how they could have been more effective.

Some examples:

• You have to tell your top performing employee that his work did not meet your standards. You want him to stay motivated and continue performing, but you know he gets defeated easily and will take this feedback personally.

• Your most senior employee just quit and her deputy wants to know about the future of your team. You're sitting down in a 1x1 with her and want to encourage her to stay and feel positive about the company.

In this talk, Kathie Pham, Staff User Researcher at Twitter shares how they start with the customer – from problem definition, prioritization, to execution – when working through one of the most challenging problems on the internet.

She walks us through how her research enabled the team to understand the complexity and nuance of the problem, but also discusses how to make meaningful progress when grappling with varied customer needs.

Machine learning is arguably the most important trend in technology today. From predicting what you’re going to say before you say it to fabricating lifelike videos, ML is a powerful technology.  

But designing great user experiences for machine learning -powered features presents unique challenges to a product designer: How do you create a mental model for a system with thousands of parameters? How do you explain recommendations from a system that has no rules? How do you provide user control? How do you respect user privacy expectations and tackle issues like ML fairness? 

In this talk, Paul Lambert, Product Manager @ Google discusses the challenges he and his team encountered and techniques they developed in building machine learning features in Gmail and Inbox. He has worked on Smart Compose, Smart Reply, Nudging, Priority Inbox, Highlights and other ML-powered productivity features shipped to over a billion users. 

Watch next Annika Crowley, Interaction Designer @ Google talking about Creating Great UX with Imperfect AI

Machine learning is arguably the most important trend in technology today. From predicting what you’re going to say before you say it to fabricating lifelike videos, ML is a powerful technology.  

But designing great user experiences for ML-powered features presents unique challenges to a product designer: How do you create a mental model for a system with thousands of parameters? How do you explain recommendations from a system that has no rules? How do you provide user control? How do you respect user privacy expectations and tackle issues like ML fairness? 

In this talk, Annika Crowley (Interaction Designer @ Google) discusses the challenges she and her team encountered and techniques they developed in building machine learning features in Gmail and Inbox. She also shares strategies that they’ve learned over the last couple of years at Gmail and Inbox about how to create great user experiences with imperfect AI.  

Watch next, Paul Lambert, Product Manager at Google discussing how to build great machine learning experiences for Gmail.

Investing in the infrastructure of a DesignOps team early on as you scale may allow you to create those conditions where designers can do their best work, make the communication system meetings as efficient and effective as possible and be really intentional about how you onboard and train people during different stages of growth.

Recently — during a Rethink event earlier this year — I sat down with four wonderful women leaders shaping the DesignOps practice:

• Courtney Kaplan, Director of Design Program Management, Facebook;

• Meredith Black — Frmr. Head of Design Operations, Pinterest;

• Adrienne Allnutt — Director, UX Design & Research Ops; LinkedIn

• Lauren Liao — Director, Strategy & Ops, Design & Research Lead, Twitter

We discussed the role of Design Ops discipline, their approach to operational design during different stages of growth, how to advocate for getting someone in the role, and ways to foster better collaboration and alignment as the organization scales. 

People usually associate Design Systems with polished final designs, cleanly mapped to production code and accompanied by a nicely documented site. This talk isn’t about those systems. It’s about all the other ones. The scrappy, simple, reusable components you use all the time, without thinking. The ones that help you express quick ideas, arrange sticky notes for research, or provide photos and names of people from your team to offer more realistic examples in your designs.

In this talk, Noah Levin, Design Manager for Figma shares some examples, tips, and best practices to be scrappier with your Design Systems and speed up the design process for everyone. He believes designers should only have to design a basic building block once, and everyone else should benefit immediately, without needing to put in all that extra work to create polished finalized documentation.

In-house teams may spend months defining principles. But what makes great principles and once you have them, how do you apply them effectively?

In this talk, Selene Hinkley, Product & Design Systems Content Strategist will discuss content strategy techniques for design principles, and the context for how to translate design principles into experiences. She will share examples of how design principles help Shopify solve real-life problems, and how to define content formulas and page templates for writing solid design principles.

Facebook has over 2 billion users who are spending a reasonable amount of time on the app, and for a company of this stage, growth and time spent aren't the biggest problems anymore. When the company scales to this stage, how do you foster a collaborative environment focused on quality and long-term goals?

In this talk, Amanda Linden, Director of Design at Facebook shares examples and lessons learned on aligning teams around what the people problems are, measuring success and performance, as well as establishing a design bug resolution process where the design org works as one to implement pattern changes across the entire app.

Designers today are caught between shunning redline specs and being overwhelmed to learn new skills to bring their designs to life. Out of this tension comes design systems – not only a more efficient way to design, but a better a way to bridge the gap between design and engineering.

In this talk, Mike Dick, Design Systems Lead at Survey Monkey shares his experience leading design systems for companies like Twitch and Quora, and a deep dive on how SurveyMonkey's design system was built to empower design and engineering teams to come together to refresh their 20-year-old product.

The design challenges we face are becoming larger in scale and and more complex. As designers and developers, we need more systematic and abstracted methods to continue building great products.

The past couple of years, Airbnb has been systemizing UI design & development on web and mobile platforms with a design language system (DLS). In this talk, Karri Saarinen, Principal Designer at Airbnb discusses what are their learnings and challenges in creating and evolving a cross-platform system for a large, fast growing and design lead product company.

Color is subjective, emotional, and complex. How do you design a cohesive color system for your product that is both emotive and branded, but also usable, accessible, and flexible enough for the future?

In this talk, Linda will take you through how their design systems team at Lyft took a mathematical approach to build Lyft’s new color system (Spectrum). 

Linda shared how they created a color system that both designers and engineers can understand, the tools they made to develop and share their palettes, and how they approached a scalable system built to take Lyft through future brand refreshes and app redesigns.

Introducing a design system successfully doesn’t happen overnight. It often takes months, if not years, to create full adoption and use of your system. In it’s early stages your system can feel like it isn’t working or providing value. So, how do you get your design system up and running?

In this talk, Joey Zingarelli, Product Designer at Pinterest, shares practical tips on how to get your team designing and building your product within a new set of rules and guidelines. He talks about how to avoid the pitfalls of enforcement and get your system to empower, rather than hinder, your team.

While some companies have full-time teams of designers and developers, some can only do design systems work in their spare time. As an individual contributor, you may feel pressured to be a great engineer as well as hone your visual and interactions skills—or maybe you enjoy both but find companies often make you choose one over the other?

Despite being in the fortunate position of working with full-time design systems team, Diana Mounter, Design Systems Manager at GitHub, is not immune from feeling imposter syndrome or envy towards design systems team. Diana will share some real-talk behind design systems work, taking a look at industry examples in comparison to her own experiences, how they strive to do things at GitHub and what the future might hold.

It seems like every year, there’s a new hot prototyping tool. But how do you know what tools are worth investing time in? Isn’t knowing one enough?

Learn from Shana Hu, Product Designer at Pinterest, how keeping key prototyping principles in mind can help you make smarter decisions about your design tools and process. Shana shares how she decides when to use which tool, including why she uses Framer to dynamically generate layouts and pull in real data.

Our best ideas often start out by looking like really bad ideas. Prototyping can be an effective way to spread new ideas and help others see an idea the same way we see it.

In this talk, Zach Johnston, Product Designer at Dropbox walked us through how to communicate ambitious design ideas through prototypes and shared how he and the team at Dropbox have used prototyping to shake up traditional thinking. 

Zach turned our focus to two modes of prototyping: 

1. Prototyping to understand

2. Prototyping to be understood

Prototyping to understand

This is the explorative prototyping when you create dozens of prototypes all trying to solve the same problem. The goal of this prototyping method is to try to figure something out and understand an idea for yourself. Ultimately, we want to figure out the answer for ourselves, how does this feel in our hands.

Prototyping to be understood

This type of prototyping is focused on selling an idea, conveying an idea, getting buy-in from your stakeholders on a project that may have a major impact or simply getting people to understand that idea in the same way that you do. This type of prototyping is extremely powerful since it keeps explaining that idea over and over again without you being in the room.

How do you know when it’s time to switch mode from one type to another?

Zach would argue the importance of prototyping to be understood as being effective in three key moments: 

• To simplify a complex solution - When you’re trying to explain your idea to someone, but people don’t quite get it, use prototyping to simplify something that seems super complex to others down into something that is really simple and just makes sense.

• To provoke a discussion - If people are ignoring your idea, help them engage and get real critical feedback

• To spread an idea - Use prototyping to convey the message across the entire company. Get people excited to engage with the idea, talk about, build on.

Zach, summed up his talk by talking about four practical tips that are useful when switching modes. 

1. Invest in a foundation

As soon as you realize that you’re going from lots of small prototypes into one epic big prototype it’s time to take a step back and invest in a foundation. Often prototypes take weeks or months to be built. A solid foundation helps designers and engineers understand your space, how things work, and have them build on that idea. 

2. Cut corners

This helps you to save time for yourself and for your users. Start with a kit. Think from your user's point of view about what is necessary to convey the idea. 

3. Test that the prototype is usable

Ensure people don’t struggle to see what is clickable what is not. If necessary, add some guidance to the prototypes. Make it feel more like a walk through than a click adventure. 

4. Share with context

Give people insight into what ’s the point of this prototype. Create a document which includes a short introduction, the general purpose of the prototype, a walk through the prototype. 

Most importantly, Zach leaves us with a question: What ideas are you working on today that you can use prototyping to help people understand? What idea is ready to be understood? 

There is no one way that works for growing companies and scaling teams during different stages of growth. Processes change depending on scale, shifts in team culture, and how the company works. As the company grows, bottlenecks suddenly appear as an indicator of the increasing complexity of the organization. How do you ensure there is team alignment & effective collaboration during different stages of growth: Early Stage, Middle Stage, Late Stage?

In this talk, Frank Yoo, Director of Design at Lyft, shares practical examples and strategies he has used along the way as a principle stakeholder at Lyft to navigate the transitions at different stages of growth.

Designing products at scale is challenging. Solutions often take years to build and they need to work across languages, backgrounds, and contexts.

In this talk, Jeff Smith, Product Designer at Facebook, speaks to how Framer has been a critical tool in his process, designing for 2 billion people at Facebook and shares his workflow using it to get a product from concept to launch.

Looking around you might think all Design Systems enter the world fully formed, built by elite teams and empowered by executive mandate. Nothing could be further from the truth. For many of us, what appears authoritative today, at one point was a hustle. What seems polished now, was at one point a hack. If you look to the start, you won't find anything awe-inspiring. What you will find is an imposter with a plan.

In this talk, Ed shares practical strategies for influencing adoption and building authority so that you can transform your aspirational design system into the real deal.