Designing for AI: lessons from Firefox Shake to Summarize
Shake your phone, and any web page becomes something you can actually read. Here’s what designing that feature taught us about AI UX.
Mozilla wanted more people to download Firefox. Together we built a reason: Shake to Summarize, which turns any page into a short summary when you shake your phone. It got a special mention in TIME’s Best Inventions of 2025. These are the lessons we’d bring to any AI feature.
1. Keep AI where the person already is
We tested three directions for how the summary should appear. A separate “AI space” took people off the page they were reading. A cracked-glass effect read as something broken. Firefox’s own fire kept the page in view and felt like Firefox. The lesson: AI should feel like part of the product people already use, not a new place they have to go.
2. Pick the quietest signal that still works
People had to learn that shaking does something. We compared a full-screen takeover (hard to miss, but it stops your reading cold), a banner (covers what you came to read), a message in the address bar (reads like the page changed), and a tooltip. We picked the tooltip, because everyone already knows what one is.
3. Write consent in plain words
The opt-in was written with Mozilla’s legal team. It says plainly that the page goes to a third party, and in the EU it names the AI. Clear consent is part of the design, not a legal step after it.
4. Every error gets one way out
AI will fail, so the errors matter as much as the happy path. Working with Mozilla’s copy team, we wrote each error to say what happened and give exactly one way out.
5. Define “good” before you tune the prompt
AI output can’t be judged by looking at a mockup. We wrote down what a good summary meant: short enough to read at a glance, recipes exactly right, useful on any kind of page, and clean formatting. Then we tested against those checks every time the prompt changed. That turned “does this feel better?” into a question with an answer.
What this means for your AI product
- Put AI inside the flow people already use.
- Use the lightest signal that teaches the feature.
- Make consent and errors part of the design from day one.
- Write down what “good” output means, and test against it.
Design for the skeptics
Firefox users were wary of AI and of shake gestures. Every choice above was made for them, not for AI fans. Months after launch, this showed up on r/firefox:
“I actually love the Firefox shake to summarize feature. … I often like to move away from AI features when browsing online. But sometimes I don’t feel like reading the entire article top to bottom and just want the main points.”
That’s the goal for any AI feature: useful enough that even people who avoid AI choose to use it.
Designing an AI agent? Read our principles for agentic UX.