Celebrations are moments that recognize customers’ achievements, from first steps to major milestones. They connect customers to big-picture benefits so they feel the payoff from the start—and more and more over time.

Resources

Principles

 

Design

Encouraging
We want to be approachable and provide guidance for our customers. They should easily know how to use this product and have confidence that the product meets their needs.

Content

Delight when it’s right
We may not be the flashiest person at the party, but we know how to make our customers smile at the right moment. When it feels natural, we sprinkle in a bit of charm or use a metaphor to simplify a complex idea.

 
Delightful
We want to create an emotional connection between the customers and the product. Make inspiring and dazzling experiences that users want to engage with. The customer didn’t know they needed it, but they did!

 
And figure out when it isn’t
True celebrations are rare experiences and should be marked by appropriate words and phrases. Not everything is awesome. Sometimes it’s OK to be neutral.

How do I know when to celebrate?

 

Add celebrations skillfully
Celebrations can increase understanding and enjoyment, but overusing them can make an experience feel disorienting and inconsistent. Always consider the customer journey across the entire product experience.
 


Add celebrations judiciously
Don’t use a celebration when a simple notification will suffice. Excessive or gratuitous celebrations can make people feel disconnected or distracted.

Celebration

Potential tax deduction
(show actual $ amount)

Payment received
(show actual $ amount)

Loan approved through QuickBooks Capital

Completed a goal by Reaching 100%

Not a celebration

Turned on mileage tracking

Sent an invoice

Submitted loan request

Categorized a trip that is not a deduction

Increased, but did not complete a goal

Completed a step-flow

How do we celebrate?

We use various-sized celebrations along the customer journey.

Level 1
Level 1 celebrations are small moments that recognize the work the user did or what QuickBooks did for them. These moments can occur frequently. The celebration motivates customers and encourages them to turn good behavior into a habit.

Level 2
Level 2 celebrations are medium moments, when a user finds value in a key habit. These are moments when a user hits certain milestones, and the celebration encourages good behavior that’s on the right track.

Level 3
Level 3 celebrations are large and occur when a user reaches the maximum value of the product. They can occur at an earlier point in the journey (for example, a QB Live match) or toward the end of a journey (such as an export for tax time). We dial up the visuals and motion to communicate these rare and unique moments.

Visual elements

As a part of the celebration framework, we took into consideration the colors, shapes, illustrations, and motion, and developed visual assets that complement our brand. Our “living, breathing” assets enhance a celebration moment. When they are thoughtfully orchestrated, each of these pieces creates a delightful experience celebrating our customers.

Sparks

We use animated geometric shapes to form temporal elements to evoke a positive emotion and sprinkle in a bit of charm when it feels natural.

Reveal and focus

We use a circular mask (based on the circle of the QuickBooks ball) as a transitional element in storytelling. We can focus on a specific object or reveal a larger scene or environment.

Progress bar

We use a gradient progress bar to let customers know they successfully reached a goal and completed a significant task.

Rolling numbers

We use rolling numbers to communicate about customers’ income growth and how they’re reaching financial goals.

Parallax

We use parallax backgrounds and environments to provide a subtle element of depth that create a delightful and memorable moment.

Resources

 

Guidelines and documentation
For additional info on how to determine a celebration moment, usage guidelines, and visual examples, see the celebrations framework presentation.

Motion gallery
To see how we use animation in celebrations, refer to the motion gallery.

  • Was this Helpful?
  •