Removing barriers: How Liliane Canvas Control is empowering designers in the face of disability

The Liliane Canvas Control plugin for Adobe XD helps those with physical disabilities design efficiently and effectively with Adobe XD. To learn more, and download the plugin - click here, or head over to the Liliane Canvas Control plugin page to learn more about the project.

Why are there so many problems in apps with assistive technology built in?

This was the Google search that Liliane Claudia, then a marketing major in college, typed in during a moment of frustration. Liliane had had her fair share of challenges with technology – at the age of 14, a medical accident left her quadriplegic, unable to use her hands with devices. Despite her disability, she continued her studies with the aspiration of working as a marketing manager. Little did she know, at the time, that this Google search would lead her down a different path – to a successful design career, and a life-changing opportunity to help other designers with disabilities.

“I was beginning to realize I wouldn’t have opportunities [as a marketing manager], due to a lack of inclusion. I was starting to consider other things. And that’s when I thought, ‘Well, I have so many difficulties with problems in apps, I’ll look for a solution,’” says Liliane.

“In order to apply accessibility, to find those solutions, I had to take a step back and learn about UX. So I began learning about UX…And I totally fell in love with it.”

Despite Liliane’s challenges, she has been able to create a successful UX design practice, as both a designer and as an influencer. Designing in Adobe XD, using only her chin to manipulate the cursor, she creates experiences for clients and offers a unique perspective on product design. She has an exceptional workflow, but it was far from perfect. That’s when the Betim MG Brazil-based designer came together with community members and Adobe to create a new plugin – one that would solve a major workflow issue for her and other designers with disabilities.

Liliane Canvas Control, designed in Adobe XD.

Liliane Canvas Control: A plugin for Adobe XD to empower disabled designers

Learning how to design user interfaces with XD and slowly levelling up her UX design skills, Liliane was able to not only become a working UX designer, but also an outspoken advocate for more accessible design.

“For me, it means a lot of independence. My favorite quote is by Jakob Nielsen, and he says ‘These tools, they were built to help us be independent.’ They need to give us independence when creating, and the future of the design is to be accessible to all people. Not to mention that I’m able to pay my bills today!” says Liliane, with a laugh.

To design with XD, Liliane uses an adapted trackball mouse, which she moves with her chin. As successful as she was, there was a fairly major point of friction that was slowing down her work considerably: it was very difficult for her to pan or zoom in her designs, since she cannot hold down a second key at the same time.

Every time Liliane wanted to zoom out, or pan quickly, she’d have to call up a virtual keyboard to activate a modifier key. It was frustrating and a business blocker for her, and so Liliane shared her frustrations with her colleague and now friend, design leader Vitor Guerra. Vitor, by then an Adobe XDI for the Americas and responsible for the Design 2020 publication, knew that he needed to help Liliane in any way he could. He reached out to me, and the three of us began brainstorming a solution, iterating on options using XD:

We had lots of calls to really understand Liliane’s problem, validate and invalidate our assumptions. That was very, very key. She said she really enjoyed our curiosity there, our willingness to really wear her shoes. The solution we landed on was to create a plugin for Adobe XD that would allow Liliane to access panning and zooming controls right from the design canvas. To make this happen, I reached out to developer Fabricio Farias who promptly accepted the challenge and started to build, working iteratively with Liliane the whole time. Thanks to XD plugin APIs, we had a working version in just one day.

“After I started working on this project, I started thinking about every tool I use, or even the tools I’ve built, and thinking about whether they’re really accessible. I have a whole new outlook on these issues, it was a transformative experience,” says Fabricio.

A dramatically improved workflow, and a levelling of the playing field

The Liliane Canvas Control plugin went through several iterations before the final design was decided. Liliane extensively tested each iteration, providing her feedback along the way, with Vitor and I making the changes and trying to find the best solution. We landed on a final design, and after some expert work by Adobe XD designer Larz Hsu to make the plugin ‘feel more Adobe,’ via the Spectrum design language, it was deemed ready for development. Fabricio took it from there, and within a short time, the final version was delivered to Liliane. She says it has already made a dramatic impact on her work.

“Since I use my chin to work on my designs, the plugin helped make everything more agile,” she says. I feel like my work is quite a bit faster now!”

Thanks to the availability of this plugin, many more designers will be able to effectively use Adobe XD to express their creativity, and like Liliane, carve out opportunities for themselves in the UX design space. For Liliane, the experience of creating the plugin with Fabricio and Adobe reminded her of her number one goal with her work: to empower other designers with disabilities, and to work with brands to make sure applied accessibility is more than just a buzzword.

“My mission is to figure out how accessibility is able to help these people. Designing is about creating experiences, and they shouldn’t have to worry about their limitations to work,” says Liliane, who is also a founding member of Redesign for All, a company that focuses on having accessibility as an innovation agent for products and services.

Liliane Canvas Control is available now in the Adobe plugins resources page, and every member of the team, from Vitor and I, to Fabricio and Larz, to Liliane herself, are so proud of how it was created and, most of all, how it will help others. Liliane hopes to see more action, like this, at product design tables across the world.

“Designers need to think of everyone, not just the power user, and people have many needs that are unexplored. Technology is so advanced today yet there are still so many products forcing us to use our hands. This is my mission: showing designers how it’s possible to evolve. Accessibility is much more than having access. It is about creating experiences,” says Liliane.

This whole experience proved that good will, good tools such as XD, collaboration, focus, and real problems to tackle all result in great solutions for users. Thank you for reading!