How Virta Health uses Figma to help patients reverse type 2 diabetes
Design is at the center of the healthcare reinvention
Today we can monitor sleep, count our steps, record our heartbeat and even text our doctors — all with a click. Thanks to intuitive design, individuals are equipped to take ownership of their health unlike ever before.
When building experiences in healthcare, the stakes are higher. If your product fails, your patient fails — and that simple equation comes with risky outcomes. Designing for healthcare is complex — there are human lives on the line.
Meet Virta Health, the revolutionary company that delivers treatment for type 2 diabetes and other chronic metabolic diseases without medications or surgeries. This company is on a mission to reverse diabetes for 100 million people by 2025. Launched in 2014, Virta has already seen jaw-dropping results like:
- 94% of insulin users reduced or eliminated usage after 1 year
- 60% of patients reversed their type 2 diabetes after 1 year*
At Virta, design is central. According to David Hatch, Head of User Experience, it has been that way since the company’s inception, “The goal of design at Virta is to make things that allow all types of people to achieve healthy behavior change.”
Igniting the Figma flash mob
At Virta, design is a shared investment across all teams — from designers, marketers, and developers to physicians. The 11 person design team operates as a transparent and collaborative internal hub, touching every piece of the company.
“Other tools we had been using suddenly felt archaic.”
As early adopters of collaborative, web-based design tool Figma — some designers even refer to themselves as “OG Figma users” — Virta Health was designed from the ground up on Figma. Hatch said, “I felt like Figma was the future. The collaborative aspect is where our design culture took off.”
Collaboration and transparency are paramount for this young scaling startup. For Victor Kernes, the newest UX designer to join the team, getting up to speed was no challenge. “I was able to dive right in on day one because everything was current and lived in Figma.” (Fun fact: Victor taught himself to design by using Figma. Listen to his feature on Design Details Podcast).
As Hatch put it, “The idea that people could be untethered from the desktop environment made the tool easy to adopt.” Anyone can access, comment and participate in design from anywhere, on any machine. But the collaboration feature is what really hooked Hatch:
“I like to start a project, get something to a certain state and send the link to our UX Slack channel and ask for help. Within seconds I’ll see cursors jump into the canvas, start duplicating and making improvements. It’s impressive to see your team at work together. It’s like a Figma flash mob. Other tools we had been using suddenly felt archaic.”
Consistent design is intuitive design
The Virta design team subscribes to the principle that consistency is king. For example, if a patient is having a health issue, a physician will need to be able to communicate with their patient as quickly as possible through the Virta app. That path has to be predictable and well-known. There cannot be any unexpected left turns in the design and usability. You have to create consistency across everything. If someone is used to one flow, it can’t be different in another part of the app.
“I felt like Figma was the future. The collaborative aspect is where our design culture took off.”
For Virta, components in Figma are the key to unlocking consistent design. Once an element becomes repeatable, a component is created and UI can easily be duplicated which saves time. Victor explains, “Figma makes the process of replicating design much easier.”
Over time, the Virta team has made their component library more sophisticated. Based on the idea that if you build a component well, it allows for the desktop and mobile version to to exist in that single component and be responsive.
“As a designer who is responsible for creating UI patterns, the one thing I worry about the most is breaking consistent design patterns,” Joey said. “With components in Figma, consistency is created by default.”
In Virta’s visual component library today, everything is based off a structural component and then the team uses nested components to create new components from that base.
The team is also taking that principle of basing everything off a structural component and applying that to code to bake in even more consistency.
Empowering non-designers
With design as the heartbeat of the company, Figma is like the blood supply. Figma files are passing through Slack channels all the time. Marketers are adding copy changes, physicians are providing feedback on prototypes and designers are collaborating.
In the recent relaunch of VirtaHealth.com, the design team was tasked with reimagining the site in an effort to bring in patients in a more efficient way. Stakeholders included marketing, product, leadership and developers and the entire project took place in Figma — from ideation to developer handoff. “It offered us peace of mind,” recalls Joey.
With Figma, anyone could see how the project was tracking at any given time. The product team sat with designers during ideation, marketing was able to adjust their own copy and developers were able to move quickly with Figma. That transparency allowed a seemingly big project to get underway fast with their first page going live in just one month.
“Figma results in us doing more showing rather than telling,” said Dian Xiao, a UX engineer at Virta. “We get better feedback and we can iterate with more up to date information.”
Victor and Alex Tran, UX designers who partner with the marketing team, came up with a self serve-model which helps marketing move faster. Marketing has access to templatized Figma files for social images, landing pages and collateral. They can go directly into a file, spin up their asset, tag a designer using comments for illustrations or tweaks and voilà, their asset is complete.
“Figma results in us showing rather than telling.”
According to Victor, it has reduced at least two, if not more, cycles with design and shaved weeks off the process. Joey states, “The most magical part about working in Figma is that it gives non-designers the power to participate in their own content.”
Dian agreed, “It’s great to have someone visually respond back to what you shared instead of using words or Photoshop. People can build on top of your design while you watch.”
On the app side, collaborating with physicians is woven into the workflow. “What’s important is making sure everything is as functional, succinct, compact and dense as possible while still being very usable,” says Joey. He’ll often send Figma links over to a physician for fast feedback or invite them in during ideation to test a flow. The intuitive nature of Figma allows non-designers to easily jump in. Hatch states, “It’s beautiful to see two sides of house come together with one tool.”
Transforming the future of healthcare
At Virta, the company has come together around this shared commitment to design and has seen real impact this company in it’s patients:
“I’ve learned a new way of thinking and a new way of living. I love the way my life is now.” — Wilma, Virta Patient
“The most important part of being in the Virta treatment is the app and scale that sends in my weight everyday gives me accountability.” Shirley, Virta Patient
By delivering a consistent user experience, they are positioned to make a real impression on the healthcare industry. As Hatch said, “We want to be proud of our designs but the most important thing is to serve and heal our patients.”
*Note that % reversal is defined as the % of patients with HbA1c less than 6.5% who are taking no glycemic control medications or only metformin.
