Back to work

Meta · Messaging

Quick-React to a Message

Making reactions more discoverable on Messenger

Shipped to Messenger's global user base of over 1 billion monthly active users.

Two Messenger phones showing the Quick-React emoji tray open
RoleSole Product Designer
PlatformiOS · Android
TeamMessenger Chat Expressions
StatusShipped globally

Impact

Shipped to Messenger's global user base of 1B+ monthly active users
Feature works across text, image, and reel message types
Collaborated directly with Messenger Leadership to accelerate approval

My Contribution

Sole designer: problem definition → explorations → specs → handoff
Ran dogfooding sessions with engineering to validate pre-handoff
Brainstorming lead across cross-functional partners

01 —The Problem

Discoverability on the way of reacting

People need a lightweight, quick way to respond to messages. Reactions are the simplest form of reply; however, the entry point required long-pressing a message.

Messenger quick-reaction tray — heart, laugh, wow, sad, angry, thumbs up, plus

The Quick-React tray — six default reactions plus a customizable slot

The hypothesis

Increasing awareness of reactions by surfacing a persistent, contextual entry point near the most recent message, will lead to more frequent use without disrupting conversation flow.

02 —Constraints & Considerations

Design principles

No visual clutter

Reaction suggestion should not add more visual noise or distract from the conversation

Contextual relevance

The entry point only makes sense near the most recent message, not surfaced everywhere.

Parity across content types

The solution needs to work coherently across text messages, images, and reels.

No emoji suggestions

Surfacing the wrong reaction could feel worse than no suggestion at all. An inappropriate emoji in a sensitive conversation is a real risk.

03 —Key Design Decisions

Three decisions that defined the feature

01

Entry point

The core tension was between making reactions more visible versus suggesting specific emojis. I explored both. Emoji suggestions lower effort further, but the risk of an inaccurate suggestion outweighed the convenience. A reaction should feel like the user's choice, not the app's guess.

I landed on a persistent but minimal entry point anchored to the most recent message.

Early feedback sessions with the design team confirmed the entry point increased reaction visibility without feeling intrusive.

Other explorations — Icon variants, Mustache text, Bundle reactions and replies

Other explorations considered — icon variants, mustache text, and bundled reactions

02

Content use cases

The entry point had to work across three distinct message types. Using one consistent interaction pattern across all three kept the experience coherent.

Text message variant — Quick-React entry point on a text bubble

Text

Image message variant — Quick-React entry point on an image message

Image

Reel message variant — Quick-React entry point on an Instagram reel

Reel

03

Collaborating under time pressure

This project had a fast turnaround with direct involvement from Messenger Leadership. Prioritization and transparent communication helped keep the project on track. I ran dogfooding sessions with the engineering team to validate that designs were true to spec before handoff.

04 —Outcome

What shipped

Quick-React — reaction entry point on the most recent message

05 —Reflections

What I learned

This project helped me understand the value of user trust vs. speed. Putting into perspective the possibilities of suggesting inaccurate emojis was too-high of a price to pay for the user's overall experience.

It also reinforced that speed and quality aren't opposites. Being clearer about what matters most and protecting that, will make the execution process smoother.