Deliveroo serves up fast designs for a mouth-watering delivery experience

Morgan Kennedy

Craving authentic Japanese street food but don’t want to venture out? No time to pop out for some vegetarian tacos for lunch? With Deliveroo, you can get nearly any food delivered right to your door or office in under 30 minutes. 

Founded in 2013, Deliveroo now operates in more than 500 cities and towns across 13 markets, including: Australia, Belgium, France, Germany, Hong Kong, the United Arab Emirates and the United Kingdom. By offering fast and reliable delivery accessible via a well designed app, where customers can track where their food is on their phones, Deliveroo has experienced astounding revenue growth and was announced as Europe's fastest growing company by the Financial Times earlier this year.

Cooking up designs across silos

The team behind Deliveroo’s magic consists of more than 40 people across content, research and design who work together to create products for consumers, riders and restaurants. The design team has ramped up its efforts with new staff to keep up with the rapid growth and expansion of the company. 

However, as the team expanded, silos developed among the various product groups. Disparate tools used throughout the design process - like Sketch, Dropbox, Zeplin, Abstract - further accentuated these islands. “We had too many tools and silos, which prevented us from collaborating effectively, maintaining consistency across designs, and being as nimble as we need to be,” says Raphaël Guilleminot, senior design manager at Deliveroo. 

Image from Deliveroo.Design

Despite constant communication, the team felt there was still a disconnect. “We had file synching issues across different versions of our app,” says Guilleminot. “To try to manage this, we were shooting files back and forth on email, which is very tedious.”

Aimee Quantrill, who leads the content design team at Deliveroo, also believes the previous design tools were inhibiting collaboration. “The way that we used to work was like a custody agreement,” she says. “The product designer would have the file in the morning and then the content designer would have it in the afternoon."

We constantly had to keep double checking with each other, sending each other screenshots and Slack messages. There was a lot of backwards and forwards that just didn’t need to be there.

Letting the magic begin

Despite being apprehensive about changing tools, it didn’t take long for designers at Deliveroo to get excited about Figma because of its collaborative functionality. “When we discovered that Figma lets us work in one document, the whole team was immediately on board,” says Quantrill.   

One of the critical breakthroughs was allowing the content and design teams to collaborate together in harmony.“When content designers and product designers are on the same files, the magic starts to happen and new ideas flourish,” says Guilleminot. After a successful pilot, Deliveroo adopted Figma, making the effort of managing various design files and keeping them in sync a thing of the past.  

Before we were taking screenshot and sending each other Slack messages or emails or Google docs, because we had to use a separate document for the content.

Putting 'open and collaborative' on the menu

According to Guilleminot, Figma has changed the way the design team at Deliveroo works. “Figma has turned us into a much more open and collaborative design culture,” he says. Quantrill agrees. “It’s massively demystified the way that design works, so people can see how we work and think,” she says. “Being able to work collaboratively on one document means that product designers, researchers, engineers, and product managers can all see the process of content design.”

The open, collaborative culture extends beyond the design team. “We can get input from people around the business who were maybe a bit nervous about doing that before,” says Quantrill. “Figma is much more accessible to people who aren’t design focused or working in the design field.”

Onboarding new designers is easier as well. “Because we’ve grown so fast over the last 11 months, and because content designers work with so many different stakeholders, one of the things we’re often required to do is to learn a lot of different tools,” says Quantrill. “It’s a lot easier when somebody joins the team now. We show them Figma, talk them through it, and then leave them to explore everyone’s work in their own time.”

What’s great about working in Figma is that engineers can see all of the thinking that’s gone into the design and also propose edge cases. We can now talk about edge cases in a much more open way and understand and map them out.

Taste testing design ideas more efficiently

Besides collaborating in the same file, the team at Deliveroo also appreciates that comments, thoughts, and opinions all live in one document. “What’s really cool with Figma is you can turn on comments and really get a sense of the project without having somebody walk you through it every single time,” says Quantrill. “It just feels like you’re much more connected to the actual work.”

Aisling Lee, product designer on the consumer core team, agrees. “Figma helps me give and receive feedback faster and more efficiently than before,” she says. “If I’m looking at someone else’s file, I can provide quick answers to questions and get feedback on those answers straightaway, which is great.”

Lee also describes how Figma has improved how Deliveroo runs design crits. “Before when we got feedback in a design crit, we’d write comments down on Post-It notes or type them into notes on our laptop and then translate the notes to the actual design file after the fact,” she says. “But with Figma, you can now comment straight beside the piece of user interface you’re working on.”

Cooking up designs at scale with a design system

Another major benefit for Deliveroo is Figma helps the team get from idea to finished product quickly by taking the friction out of a multi-tool process. “Before we had to jump between four different pieces of software,” says Guilleminot. “Now that everything happens in Figma, we get to results faster.” 

He credits the Deliveroo design system created in Figma with helping achieve that speed. “Many people build design systems for consistency,” he says. “And while that’s a good by-product to have, what we care about most is speed of execution.”

Deliveroo has one master library in Figma that holds all of its brand information and which feeds into two sub-libraries, one for its consumer products and one for internal tools. “What’s really great with Figma is that when we make changes to our master library, everything gets updated in one single swoop,” says Guilleminot. “It makes it a lot easier to make changes at scale.”

Elevating design across the company

By effectively replacing five tools with Figma (Abstract, Dropbox, Marvel, Sketch and Zeplin), the teams work is not only streamlined but also, accessible company wide. Guilleminot believes using Figma has increased the understanding of the design team’s work within the growing Deliveroo company. “People have a sense that we’re not just drawing pretty pictures,” he explains. “With our work ‘out in the open,’ they see that we’re actually doing a lot of exploration and making products more delightful. Everyone from product managers to executives are looking at our work, and that elevates us in the company.”   

Figma really understands what it’s like to work as a product designer day in and out. All the little things that we do that are normally tedious, Figma alleviates straightaway with features like Smart Selection. It’s the little things, but over time the little things really accumulate and make our lives much easier.