How the DoorDash Merchant design team uses ‘Crit Stickies’

Imani Joy Maia
Design @ DoorDash
Published in
6 min readNov 8, 2021

--

Friday morning is one of the most valuable times of the week for the Merchant Design team, as we gather to review and support each other’s ongoing work. We currently use the silent critique method introduced by one of our designers, May Wang.

Silent crits have been a great forum for the team to share work and gather feedback. It gives us extra time to review the designs and process our thoughts before jumping into a discussion. Presenters can also take time after the session to review and prioritize the feedback as needed.

Despite this, there was one aspect of silent crits in a remote setting that wasn’t optimal. In an office, we would’ve been able to walk around a room and view each other’s designs, sharing feedback via sticky notes along the way. How were we supposed to replicate this in a digital environment?

We tried a combination of Google Docs and Figma comments, but each had its challenges: feedback collected outside of Figma lacked context while Figma comments were harder to organize.

We needed a better way to document feedback, and since you can apply the design process to practically anything, I set out to design the ultimate digital sticky.

Discovery

I reviewed our previous critique docs to understand the ways our team managed silent crit feedback. As a result, three themes emerged around our core behaviors:

  • Categorization: We organized feedback based on high-level design categories such as UX/Strategy, Interaction, and Visual. This made it easier for presenters to skim through feedback and choose what to prioritize.
  • Reaction: We cosigned each other’s feedback by using shorthand text and emoji. The most common replies were a simple “+1” or a 👍🏽 thumb’s up.
  • Ownership: We labeled our own feedback, which allowed the presenter to follow up with clarifying questions if needed.

Designing Stickies

Within 24 hours of identifying the need, I had a working prototype released and ready to test. The goal was to ship quickly and iterate often, considering we still had much to learn about the team’s needs around silent crit documentation.

Team Slack message from 1/26/21

Stickies v1 centered around the three themes of Categorization, Reaction, and Ownership.

Each team member had their own sticky component, prefilled with their name and photo. Prominent category labels allowed for quick identification and organization. To provide feedback, each member of the team could simply place their sticky and customize the text area.

For quick reactions, team members could use a separate component called .sticky-reaction. Reaction options reflected the most common emoji our team used.

Refining Stickies

Almost immediately, our team began test-driving and iterating on Stickies. Greg simplified component discoverability by consolidating eight individual components into two components with variants for each person.

Team Slack message from 2/1/21

Shortly after, Matt from our Design Infrastructure team showed us even more variant magic by consolidating Stickies and reactions into a single component.

Team Slack message from 2/3/21

As we continued to use Stickies, we noticed additional use cases to solve for:

Resolving Feedback

During silent crits, our Figma files were becoming filled with dozens of Stickies from our peers. We needed an easy way to see, at a glance, which feedback had been resolved and which was still left unaddressed.

To fix this, I created a ‘Resolved’ variant. The change in color from pastel hues to gray, along with the ‘Resolved’ signifier and checkmark, decluttered the workspace and clarified which areas still needed attention.

Replying to Feedback

Our best feedback often comes in the form of a question, so it became imperative to have a simple way to show a threaded reply.

We noticed this need when some of us began customizing sticky reactions with long strings of text, rather than using a sticky to reply:

We quickly learned that reactions weren’t the ideal space for dialogue.

The challenge was that sticky reactions were never built with long-form text in mind. Text inside a sticky reaction did not wrap, the text size made for poor accessibility, and reactions could not be marked as resolved.

The solution: I created a variant of the sticky for replies. When the ‘Is Reply’ property is toggled on, the sticky displays a reply tail. The reply can then be positioned beneath the original feedback to indicate the relationship between the two Stickies.

The End Result

Stickies went through a few additional iterations: As our team grew, we removed the multicolor backgrounds. We also added an emphasis state to be used (with care) by document owners in order to flag comments of high urgency or importance.

Here’s a look at the final product:

Lessons Learned

It felt pretty meta to design a design process tool and I was impressed with how enlightening the experience was. Here are some of the key lessons I walked away with:

If you don’t see it, create it. While it wasn’t perfect, there was nothing inherently broken about our silent crit process. We could’ve continued without improvements and still gotten valuable feedback out of it. But all it took was a little thought and quick action to improve our process significantly. This side project served as a mini example of the power of one of our DoorDash values, Bias for Action.

Test, iterate, test again. So many different use cases were waiting underneath the surface, only to emerge after repeated testing. Thanks to a tight feedback loop, we were able to go from 0 to 1 with Crit Stickies in a very short time.

Collaboration is key. Everyone on the team felt empowered to take ownership of the Crit Stickies library, and as a result, we ended up with a far better product. We also achieved some great cross-pollination of Figma tricks in the process.

Now that we’re using Crit Stickies regularly, we can’t imagine going back. Over the past several months, we’ve continued to find new uses for Stickies, from annotating user flows to brainstorming in design sprints. Since the recent release of FigJam, we’ve migrated some of our ideation sessions into FigJam — but we continue to use Crit Stickies regularly for crit sessions.

And you can, too! We’ve shared Crit Stickies as a free download in the Figma community. Try it out, customize it, and continue to iterate to find what works best for your team. And if you have thoughts on how best to share feedback in crit sessions, please leave a comment below!

--

--