Stitch Fix accelerates design sprints by collaborating in Figma

Personal style service Stitch Fix made waves in November as the first tech IPO led by a woman in 2017. Since then, its market cap has nearly doubled. The company won the hearts of consumers with an elegant app and website experience that makes receiving (and in some cases returning) a monthly box of clothing fun instead of daunting.

To adapt to their growing user base and the ever-changing nature of the web, Stitch Fix uses design sprints — like hackathons for design — to troubleshoot challenges. From the get-go, they’ve relied on Figma to stay aligned and on track, according to Stitch Fix Head of Product Design Ellen Beldner.

Step 1: Sprinting in the Cloud

Now that they’ve completed over half a dozen successful sprints, we sat down with Ellen to learn how our cloud-based design platform fits into each part of the process.

The best design sprints start with ideation, whiteboarding, and a ton of crumpled up Post-it notes. Stitch Fix designers, engineers, marketers and project managers test out solutions until the perfect one emerges, shining with straightforward simplicity. Then the real fun kicks off: designing a prototype using Figma.

Because Figma runs in the browser, the team doesn’t waste any time during this transition. Everyone can open a shared file with a simple URL — from the PMs using PCs to the comms designers who are diehard Mac loyalists.

Ellen explains:

With Figma, the design sprint attendees can skip the usual steps — buying, downloading and installing a menagerie of applications — and move straight into prototyping.

Step 2: Brainstorming and critiquing in tandem

In this early prototyping stage, design sprint attendees inevitably hit some challenges. Perhaps their oh-so-simple feature idea is far more difficult to execute than they’d expected. In other cases, changing one part of a flow ripples through the rest of the user experience in an unexpected way. To work through these kinds of hiccups on tight deadline, teams need to collaborate quickly and effectively.

Here’s a common design sprint scenario: One person needs immediate feedback on a wireframe, so they ask others for a second opinion.

Without Figma, people would either need to huddle around one person’s computer, effectively stopping the design process, or export and email the file.

Stitch Fix avoids all that using Figma’s Multiplayer feature. If anyone on Ellen’s team needs feedback, she scrolls to their trouble spot and immediately rattles off suggestions. She also leaves feedback via Figma’s commenting function, or quickly draws a mock-up in the file to demonstrate her suggestion.

“There’s no possible way for something like Sketch or Photoshop to do this job,” Ellen explains. “You’re going to have four people working on four different versions of the file and you’re not going to be able to see what people are doing.”

Ellen says this makes detailed feedback much easier, erasing the need to schedule meetings for walk-throughs. During one particularly hairy sprint, a designer showed her eight or nine ideas. Ellen went through each one, left comments, and sketched a few mockups to illustrate her points. The designer was then free to pop back into that same URL to study the critique whenever she wanted.

“Everyone is able to edit the same source of truth in the same file at the same time, and that lets us work so much more quickly and coherently,” she tells us. “When we are creating prototypes of a higher fidelity, Figma makes it much easier for everyone to stay aligned.”

In short? Figma shuts down potential project management chaos before it even begins.

Step 3: Shared components kill the busy work

Time is of the essence during a sprint. Teams have zilch wiggle room for busy work, like replicating the same icon over and over in every design frame. This is where Figma’s shared components — reusable instances of UI elements — come into play.

During one sprint Ellen’s team prototyped a card-based design system. It was a serious challenge because it meant testing which combination of cards would be most effective for certain users. To do this, her team took advantage of Figma’s shared components feature.

When they changed the master component all of its instances would also change, saving them a ton of time on useless busywork. Not only that, but designers could drop in instances as Ellen forged ahead to the navigation tab. This gave everyone more time to gnaw over high-level problems.

“I want my team to spend time thinking about high level UX problems, rather than mindlessly repeating busy work,” Ellen says. “Figma helps them do that.”

Step 4: Other departments jump in to wrap up

A design sprint is a hybrid beast of multiple departments, not just designers refining the same prototype ad nauseum. Marketing, engineering and design sweat side by side in the sprint trenches.

Figma runs in the browser (think: Google Docs of design), and everyone can jump in the file at the same time. As a result, the design team works in parallel instead of sequentially. To do their part of the job, developers and copy whizzes don’t have to wait for designers to finish wireframing.

“I come from a history of collaborative work cultures, something that’s very important for me to recreate here at Stitch Fix,” Ellen tells us. “I love the way Figma makes it easy for people to pull up what another designer is doing and make a comment.”

The marketing team especially benefits from Figma, a surprising revelation considering they don’t normally work with design tools.

“I don’t know if you’ve had this experience, but working inside of a design tool is usually a nightmare for copywriters,” Ellen says. “They have to write and edit copy strings for every single element. Trying to do that in a way that is efficient is crazy.”

Now the copy team pops in during the later stages, spritz a headline here and some microcopy there before engineering builds everything out. They can test out what text length displays best and experiment accordingly.

“When we used Sketch in previous sprints it was difficult because we had to constantly update each other,” she explains. “Grabbing the text from marketing meant opening up Google Docs and copy pasting.”

Stitch Fix’s stamp of approval

“Figma unlocked collaboration across departments, so that everyone could solve the tough problems together,” Ellen concludes. “I highly recommend it for accelerating design sprints to a higher level.”

Have you or your company used Figma during a design sprint? We’d love to hear your story! Please reach out to us via Twitter or email: [email protected].