During the 2025, I led the design of a cross-platform Celebration System that unifies how celebratory feedback works across the Pinterest. The goal wasn’t just “make it delightful”, but make it scalable and consistent: define clear tiers, when to use each, and how they behave across iOS, Android, tablet and web layouts. A key part of the work was turning celebration into a functional cue – especially in saving flows, where the animation helps users understand where their content was saved.
Problem
Celebratory feedback lacked a consistent system. Effects varied in style, intensity, and behavior depending on the surface, and there were no shared rules for when (or how) to use them. That led to:
- Incoherent experience: celebration effects didn’t feel like they belonged to the same product, and often clashed with the UI and illustration style.
- High cost: every new celebratory moment became a one-off design + engineering effort, hard to reuse and easy to get wrong across platforms.
- Uneven functional behavior: in saving flows, the directional confetti cue existed, but it wasn’t standardized across layouts and platforms — making it harder to maintain, scale, and ensure consistent behavior as UI variants evolved.
Product context
In 2024, Pinterest went through a major visual refresh that systematized the UI through tokens and shared foundations (including motion). That refresh improved consistency at the component level, but we still saw fragmentation at the feature level: teams shipped experiences that looked and felt wildly different — from highly custom, character-like icon treatments to raw, collage-style elements and one-off interactions.
As part of Design Innovations — the team responsible for shaping the product’s overall visual direction — my work focused on turning that vision into reusable patterns. The Celebration System was a key piece of that effort: a cross-platform, brand-aligned celebration pattern that replaces one-off effects with a consistent system, alongside broader work across illustration, iconography, shape and color language.
before
My role
Product / Motion Design (system-level):
- Defined the system structure, interaction intent, and guardrails
- Built prototypes and prepared spec-ready documentation for implementation
- Partnered with Bonnie Kate Wolf on visuals (shape + color)
- Collaborated closely with engineering (incl. debugging platform issues on Mweb)
- Produced a living doc to support adoption + future iterations
Solution
I created a tiered Celebration System with a clear purpose for each level:
- Big Confetti — milestones
Full-screen celebration for rare, high-impact “firsts” and achievements. Used sparingly to preserve emotional impact.
- Small Confetti — Save destination cue
Mid-scale confetti used only for saving Pins/Boards. It originates from the Profile icon in the navigation bar to visually indicate where content was saved, reinforcing users’ mental model.
- Mini Confetti — subtle emphasis
Lightweight, flexible feedback for low-stakes moments when we want to acknowledge success without adding intensity.
3-tier strip (Mini / Small / Big)
Just enough process
- Defined principles and guardrails: based the Celebration System on the motion and animation principles I had previously distilled while working on the Motion System. This ensured confetti followed the same “rules of motion” as the rest of the product – prioritizing clarity of feedback, calibrated intensity, and seamless integration across platforms.
- Mapped use cases to tiers: identified which actions deserve a milestone moment vs repeatable feedback vs subtle emphasis.
- Designed + documented specs: created “anatomy + flow” documentation for each tier, including platform considerations and integration notes.
- Collaborated with engineering: iterated on real implementation constraints (layout variance, clipping, scaling), and partnered closely with engineers on debugging the mweb version – rebuilding the animation from scratch and gradually reintroducing complexity until it matched the intended look while remaining performant and stable.
Animation principles
Flow — Trigger, positioning & rendering rules
Anatomy — Burst Origin & particle trajectory
What was hard
The hard part wasn’t the animation craft – it was making the system robust and governable across real product variance.
Small Confetti initially assumed a stable bottom navigation and a straightforward full-screen Lottie overlay. Once navigation variants started shipping (different icon counts shifting the Profile icon, floating nav), the approach became fragile: alignment could drift and particles could clip depending on layout/container behavior. To keep shipping while we refined the final approach, I introduced a phone-safe fallback asset where particles fade out before reaching screen edges, reducing clipping risk during rollout.
On top of that, Mweb required extra attention – I partnered with engineers to debug and ultimately rebuilt the animation from scratch, gradually reintroducing complexity until it matched the intended look while staying stable and performant.
Another real challenge was demand: once teams saw the effect, everyone wanted confetti everywhere. That’s why the specs include strict use cases and frequency guardrails, and part of my role was actively enforcing those rules so celebration stays meaningful instead of turning into noise.
*Tooling note: this system was built using Lottie. If I were starting today, I’d likely choose Rive for this class of interaction — it’s better suited for responsive, stateful animations that adapt to layout changes, which can reduce the need for multiple asset variants and platform-specific workarounds.
Results
Small confetti in production
- A unified, reusable system: shipped a three-tier Celebration System (Big / Small / Mini) with clear intent and usage rules, enabling teams to apply consistent celebratory feedback without reinventing patterns each time.
- Brand-aligned craft: the confetti visuals (shape language + palette) were developed with illustrator Bonnie Kate Wolf, keeping the effect consistent with the broader UI component and illustration style.
- Validated functional clarity: UXR showed the updated Small Confetti was perceived as more purposeful (+37% vs baseline) – supporting the goal of making celebration feel like clear feedback, not decoration.
- Implementation-ready specs: delivered “anatomy + flow” documentation and platform considerations, and actively supported engineering through edge cases (including mweb) to ensure stable behavior across layouts.
- On the path to systemization: we’re now turning this into a design-system component that adapts to platform and scenario to further reduce implementation overhead and prevent inconsistent variants.
UXR: Small Confetti perception vs baseline – “Purposeful” increased by +37% (significant) after the update.
other projects
Text 02 Video Effect
→
See Project
→
connect
+48 572 177 013
1629270@gmail.com
During the 2025, I led the design of a cross-platform Celebration System that unifies how celebratory feedback works across the Pinterest. The goal wasn’t just “make it delightful”, but make it scalable and consistent: define clear tiers, when to use each, and how they behave across iOS, Android, tablet and web layouts. A key part of the work was turning celebration into a functional cue – especially in saving flows, where the animation helps users understand where their content was saved.
Product context
In 2024, Pinterest went through a major visual refresh that systematized the UI through tokens and shared foundations (including motion). That refresh improved consistency at the component level, but we still saw fragmentation at the feature level: teams shipped experiences that looked and felt wildly different — from highly custom, character-like icon treatments to raw, collage-style elements and one-off interactions.
As part of Design Innovations — the team responsible for shaping the product’s overall visual direction — my work focused on turning that vision into reusable patterns. The Celebration System was a key piece of that effort: a cross-platform, brand-aligned celebration pattern that replaces one-off effects with a consistent system, alongside broader work across illustration, iconography, shape and color language.
Problem
Celebratory feedback lacked a consistent system. Effects varied in style, intensity, and behavior depending on the surface, and there were no shared rules for when (or how) to use them. That led to:
- Incoherent experience: celebration effects didn’t feel like they belonged to the same product, and often clashed with the UI and illustration style.
- High cost: every new celebratory moment became a one-off design + engineering effort, hard to reuse and easy to get wrong across platforms.
- Uneven functional behavior: in saving flows, the directional confetti cue existed, but it wasn’t standardized across layouts and platforms — making it harder to maintain, scale, and ensure consistent behavior as UI variants evolved.
before
Solution
I created a tiered Celebration System with a clear purpose for each level:
- Big Confetti – milestones
Full-screen celebration for rare, high-impact “firsts” and achievements. Used sparingly to preserve emotional impact.
- Small Confetti – Save destination cue
Mid-scale confetti used only for saving Pins/Boards. It originates from the Profile icon in the navigation bar to visually indicate where content was saved, reinforcing users’ mental model.
- Mini Confetti – subtle emphasis
Lightweight, flexible feedback for low-stakes moments when we want to acknowledge success without adding intensity.
My role
Product / Motion Design (system-level):
- Defined the system structure, interaction intent, and guardrails
- Built prototypes and prepared spec-ready documentation for implementation
- Partnered with Bonnie Kate Wolf on visuals (shape + color)
- Collaborated closely with engineering (incl. debugging platform issues on Mweb)
- Produced a living doc to support adoption + future iterations
3-tier strip (Mini / Small / Big)
Just enough process
- Defined principles and guardrails: based the Celebration System on the motion and animation principles I had previously distilled while working on the Motion System. This ensured confetti followed the same “rules of motion” as the rest of the product – prioritizing clarity of feedback, calibrated intensity, and seamless integration across platforms.
- Mapped use cases to tiers: identified which actions deserve a milestone moment vs repeatable feedback vs subtle emphasis.
- Designed + documented specs: created “anatomy + flow” documentation for each tier, including platform considerations and integration notes.
- Collaborated with engineering: iterated on real implementation constraints (layout variance, clipping, scaling), and partnered closely with engineers on debugging the mweb version – rebuilding the animation from scratch and gradually reintroducing complexity until it matched the intended look while remaining performant and stable.
Animation principles
Anatomy — Burst Origin & particle trajectory
Flow — Trigger, positioning & rendering rules
What was hard
The hard part wasn’t the animation craft – it was making the system robust and governable across real product variance.
Small Confetti initially assumed a stable bottom navigation and a straightforward full-screen Lottie overlay. Once navigation variants started shipping (different icon counts shifting the Profile icon, floating nav), the approach became fragile: alignment could drift and particles could clip depending on layout/container behavior. To keep shipping while we refined the final approach, I introduced a phone-safe fallback asset where particles fade out before reaching screen edges, reducing clipping risk during rollout.
On top of that, Mweb required extra attention – I partnered with engineers to debug and ultimately rebuilt the animation from scratch, gradually reintroducing complexity until it matched the intended look while staying stable and performant.
Another real challenge was demand: once teams saw the effect, everyone wanted confetti everywhere. That’s why the specs include strict use cases and frequency guardrails, and part of my role was actively enforcing those rules so celebration stays meaningful instead of turning into noise.
*Tooling note: this system was built using Lottie. If I were starting today, I’d likely choose Rive for this class of interaction – it’s better suited for responsive, stateful animations that adapt to layout changes, which can reduce the need for multiple asset variants and platform-specific workarounds.
Results
Small confetti in production
- A unified, reusable system: shipped a three-tier Celebration System (Big / Small / Mini) with clear intent and usage rules, enabling teams to apply consistent celebratory feedback without reinventing patterns each time.
- Brand-aligned craft: the confetti visuals (shape language + palette) were developed with illustrator Bonnie Kate Wolf, keeping the effect consistent with the broader UI component and illustration style.
- Validated functional clarity: UXR showed the updated Small Confetti was perceived as more purposeful (+37% vs baseline) – supporting the goal of making celebration feel like clear feedback, not decoration.
- Implementation-ready specs: delivered “anatomy + flow” documentation and platform considerations, and actively supported engineering through edge cases (including mweb) to ensure stable behavior across layouts.
- On the path to systemization: we’re now turning this into a design-system component that adapts to platform and scenario to further reduce implementation overhead and prevent inconsistent variants.
UXR: Small Confetti perception vs baseline – “Purposeful” increased by +37% (significant) after the update.
other projects
Text 02 Video Effect
→
See Project
→
connect
+48 572 177 013
1629270@gmail.com
During 2025, I led the design of a cross-platform Celebration System that unifies how celebratory feedback works across the Pinterest. The goal wasn’t just “make it delightful”, but make it scalable and consistent: define clear tiers, when to use each, and how they behave across iOS, Android, tablet and web layouts. A key part of the work was turning celebration into a functional cue – especially in saving flows, where the animation helps users understand where their content was saved.
Product context
In 2024, Pinterest went through a major visual refresh that systematized the UI through tokens and shared foundations (including motion). That refresh improved consistency at the component level, but we still saw fragmentation at the feature level: teams shipped experiences that looked and felt wildly different — from highly custom, character-like icon treatments to raw, collage-style elements and one-off interactions.
As part of Design Innovations — the team responsible for shaping the product’s overall visual direction — my work focused on turning that vision into reusable patterns. The Celebration System was a key piece of that effort: a cross-platform, brand-aligned celebration pattern that replaces one-off effects with a consistent system, alongside broader work across illustration, iconography, shape and color language.
Problem
Celebratory feedback lacked a consistent system. Effects varied in style, intensity, and behavior depending on the surface, and there were no shared rules for when (or how) to use them. That led to:
- Incoherent experience: celebration effects didn’t feel like they belonged to the same product, and often clashed with the UI and illustration style.
- High cost: every new celebratory moment became a one-off design + engineering effort, hard to reuse and easy to get wrong across platforms.
- Uneven functional behavior: in saving flows, the directional confetti cue existed, but it wasn’t standardized across layouts and platforms — making it harder to maintain, scale, and ensure consistent behavior as UI variants evolved.
before
My role
Product / Motion Design (system-level):
- Defined the system structure, interaction intent, and guardrails
- Built prototypes and prepared spec-ready documentation for implementation
- Partnered with Bonnie Kate Wolf on visuals (shape + color)
- Collaborated closely with engineering (incl. debugging platform issues on Mweb)
- Produced a living doc to support adoption + future iterations
Solution
I created a tiered Celebration System with a clear purpose for each level:
- Big Confetti — milestones
Full-screen celebration for rare, high-impact “firsts” and achievements. Used sparingly to preserve emotional impact.
- Small Confetti — Save destination cue
Mid-scale confetti used only for saving Pins/Boards. It originates from the Profile icon in the navigation bar to visually indicate where content was saved, reinforcing users’ mental model.
- Mini Confetti — subtle emphasis
Lightweight, flexible feedback for low-stakes moments when we want to acknowledge success without adding intensity.
3-tier strip (Mini / Small / Big)
Just enough process
- Defined principles and guardrails: based the Celebration System on the motion and animation principles I had previously distilled while working on the Motion System. This ensured confetti followed the same “rules of motion” as the rest of the product – prioritizing clarity of feedback, calibrated intensity, and seamless integration across platforms.
- Mapped use cases to tiers: identified which actions deserve a milestone moment vs repeatable feedback vs subtle emphasis.
- Designed + documented specs: created “anatomy + flow” documentation for each tier, including platform considerations and integration notes.
- Collaborated with engineering: iterated on real implementation constraints (layout variance, clipping, scaling), and partnered closely with engineers on debugging the mweb version – rebuilding the animation from scratch and gradually reintroducing complexity until it matched the intended look while remaining performant and stable.
Animation principles
Flow — Trigger, positioning & rendering rules
Anatomy — Burst Origin & particle trajectory
What was hard
The hard part wasn’t the animation craft – it was making the system robust and governable across real product variance.
Small Confetti initially assumed a stable bottom navigation and a straightforward full-screen Lottie overlay. Once navigation variants started shipping (different icon counts shifting the Profile icon, floating nav), the approach became fragile: alignment could drift and particles could clip depending on layout/container behavior. To keep shipping while we refined the final approach, I introduced a phone-safe fallback asset where particles fade out before reaching screen edges, reducing clipping risk during rollout.
On top of that, Mweb required extra attention – I partnered with engineers to debug and ultimately rebuilt the animation from scratch, gradually reintroducing complexity until it matched the intended look while staying stable and performant.
Another real challenge was demand: once teams saw the effect, everyone wanted confetti everywhere. That’s why the specs include strict use cases and frequency guardrails, and part of my role was actively enforcing those rules so celebration stays meaningful instead of turning into noise.
*Tooling note: this system was built using Lottie. If I were starting today, I’d likely choose Rive for this class of interaction – it’s better suited for responsive, stateful animations that adapt to layout changes, which can reduce the need for multiple asset variants and platform-specific workarounds.
Results
Small confetti in production
- A unified, reusable system: shipped a three-tier Celebration System (Big / Small / Mini) with clear intent and usage rules, enabling teams to apply consistent celebratory feedback without reinventing patterns each time.
- Brand-aligned craft: the confetti visuals (shape language + palette) were developed with illustrator Bonnie Kate Wolf, keeping the effect consistent with the broader UI component and illustration style.
- Validated functional clarity: UXR showed the updated Small Confetti was perceived as more purposeful (+37% vs baseline) – supporting the goal of making celebration feel like clear feedback, not decoration.
- Implementation-ready specs: delivered “anatomy + flow” documentation and platform considerations, and actively supported engineering through edge cases (including mweb) to ensure stable behavior across layouts.
- On the path to systemization: we’re now turning this into a design-system component that adapts to platform and scenario to further reduce implementation overhead and prevent inconsistent variants.
UXR: Small Confetti perception vs baseline – “Purposeful” increased by +37% (significant) after the update.
other projects
Text 02 Video Effect
→
See Project
→
connect
+48 572 177 013
1629270@gmail.com