Creating defining moments in UX/UI design

A scientific experiment & the power of peaks

A group of scientists conducted an experiment where participants were required to immerse their hands in freezing water multiple times for several seconds:

Source: Pexels

• The first round lasted 60 seconds with water at -30°C.
• The second round lasted 90 seconds at the same temperature, but the water was warmed up in the last 30 seconds.

The participants were unaware of the timing difference or the temperature changes. After completing the experiment, they were asked which trial they would repeat. In other words, if they would rather suffer less or more time. Surprisingly, when they answered which experience they preferred, they chose the second option. Why would they pick the longer one?

The best, the worst, and the ending peaks

Research explains that in any experience, we tend to ignore most of what happened, even the length (a phenomenon called “duration neglect”), and instead focus on a few particular moments. We don't average our minute-by-minute sensations; we rate any experience by remembering the “peaks,”; the best, worst, or last moments. This is called the peak-end rule.

Source: Unsplash

So when the participants needed to choose an option, they opted for the one that ended more comfortably, forgetting the differences in timing.

Inverting effort in building peaks and final moments is really important learning for all kinds of businesses. This applies to various industries that aim to deliver exceptional customer service. From restaurants to medical clinics to supermarkets or call centers, educators, and, for the sake of this blog post, designers.

Let’s get deeper into these ideas to show further concepts...

Defining moments

The book "The Power of Moments” by Chip and Dan Heath explores the idea that certain experiences are characterized by defining moments, those that stand out from the routine and can significantly influence our emotions, cognition, and, therefore, our lives.

“(...) a defining moment is a short experience that is both memorable and meaningful. (...) Many moments in our lives define who we are, but they are no more than specific experiences.”

Interestingly, we can intentionally create these moments for our businesses, customer service, product design, or even our daily lives. We can construct peaks, “sparks of positive emotion”, by identifying what characterizes a defining moment.

They should have at least one of the following qualities:

Source: Light-it

By being more conscious about this knowledge, we can use this in our favor and start thinking in moments when building services and products. Creating little but powerful interactions will enhance the overall customer experience, be retained in their memory, and generate more engagement. One should shatter people’s expectations and break the script for this to happen.

The following two  examples will help to explain the concept:

1. The Magic Castle Hotel

The Magic Castle Hotel in LA is one of its three best-rated hotels, on the same level as the Four Seasons Hotel and the Ritz Carlton. But if you look for some online photos, it is definitely not the look of a 5-star hotel like the others mentioned.

Furthermore, the pricing can be compared to the Hilton and the Marriott hotels. What is the secret of achieving such a high rating?

They understand that instead of working in every detail (room decor, luxurious spaces), which customers will likely forget, they can provide excellent service by offering little surprising experiences and construct engagement by generating defining moments in the resident's stay

On a wall near the swimming pool, a red phone is mounted to be picked up, and contact the Popsicle Hotline to place an order. Minutes later, hotel staff will bring a silver tray to deliver your cherry Popscile at the poolside for free.

You also have a snack and board games from which you can order unlimitedly at no cost. In addition, free loads of laundry are offered, and a few days a week, a magician displays some tricks during breakfast.

Photo: Taylor Design

By creating surprising and pleasurable experiences that go above the ordinary and expected, the stay at the hotel turns into a really memorable one. This is a way of applying the secret of providing services by thinking in special moments and creating services based on little but significant instances.

2. Joshie’s vacation

When Chris Hurn returned home with his family from vacation in Amelia Island, Florida, they realized that Joshie, the beloved stuffed giraffe of his little son, was accidentally left behind in the Ritz-Carlton. To avoid a sleepless night of crying and disappointment, Chris explained to his son that Joshie stayed a few more days to keep enjoying the vacation for a little longer.

When a staff member from the resort called to report that the giraffe had been found, Chris asked if they could send a picture of Joshie in a lounge chair at the pool to make his story believable.

For everyone’s amusement, when Joshie arrived, it didn't come with one souvenir photo in the swimming pool, but with a bunch of pictures showing all the different activities that Joshie enjoyed in his extended stay: getting a massage in the spa, driving a golf cart on the beach, helping in the security cameras and making new friends with other stuffed animals.

Of course, the family was delighted, and Hurn wrote a viral blog post.

Source: Chris Hurn

The Ritz-Carlton really took advantage of the situation and built a peak. They generated a moment of elevation where they completely broke the script by surprising the family unexpectedly.

“Peak moments” for UX/UI

How do we translate this into product design? How can we apply this concept in the UX/UI world?

Firstly, we need to identify in which instances we really have our user's attention. This way, we can transform a random journey or step into a more valuable experience.

Micro-moments: moments of truth

A few years ago, customers or users could bond with our products on specific opportunities called the Moment of Truth. These were moments where they would generate an impression about a product and relate to it. But nowadays, we daily interact with various products very briefly, leaving few instances to really connect and generate a bond with users.

This is where Google introduces the new concept of Micro-Moments, when a user interacts with a device in order to accomplish one of four actions:

- Learn something
- Do something
- Watch something
- Buy something

These fleeting opportunities enable us to relate with the person on the other side of the screen to generate memorable moments and, therefore, engagement.

By identifying the important micro-moments, we can create ways to elevate those little interactions and add value to any experience.

We would need to apply resources with which the user will feel some kind of delightful connection that can be memorable after using a product.

Delighting users

Designing delightful instances, even if they are brief, can impact the user journey and, therefore, the perception of the product. We are discussing designing with emotion to make the user feel and experience something while making the journey.

This aspect represents the top of a product´s hierarchy: the Pleasure. It is not essential for basic functionality but, carried out correctly, can make a huge difference in the engagement of users.

Source: Light-it

Kansei products

If we are talking about generating long-term engagement with the user by connecting emotionally and positively through short moments, then here is where the Kansei, concept comes into play.

In Japanese, Kansei is translated as the sensation or emotion an individual perceives through their senses regarding a specific thing, environment, or circumstance.

When it comes to product, it means building interactions that are intentionally linked to physical or psychological responses, causing positive sensations and impressions on the users.

It can be as simple as a nice notification sound, celebrating a user’s milestone, or adding visually appealing elements accompanying a product journey.

Let’s put these new concepts into practice:

So, suppose we already know how to identify micro-moments and understand the benefits of delighting users. We aim to build steps to generate significant moments of insight, pride, elevation, or connection. In that case, we can start visualizing our opportunities to upgrade our apps and UX.

Let’s see some examples that illustrate these ideas:

1- Generating pride with milestones

Fitbit is an activity tracker that designs creative badges to celebrate the user’s accomplishments of user's walking distance. This provides moments of pride and insight to the app's members, generating positive emotions through the product.

Source: Fitbit

2- Applying humor to important decision moments

Mailchimp incorporates humor animation when submitting an email that will reach hundreds of users. This may be a significant decision and, therefore, a relevant micro-moment. Thanks to this design, the product provides empathy and guidance in an instant when the user could be feeling nervous and is paying special attention.  

Source: Mailchimp

Zeplin a collaboration tool for UI and front-end developers, invested some extra creativity at the moment that the users are willing to explore or make a planned purchase by surprising them with metaphorical resources to add humor to the journey.

Source: Zepelin

3- Unexpected interactions with the user

Dribbble and Chrome convert pit moments into peaks when they use the error page to entertain the user and transform a potential frustration into a nice surprise.

Source: Dribble

Source: Chrome

Anna Jóna amazes the users when starting an interaction with the website with a remarkable scrolling animation.

Source: Anna Jóna

4- Surprising animations

RememBear, a password manager product, boosts the micro-interaction with the app by adding an unexpected animation that accompanies the user while typing a password. This resource definitely differs from the rest of all the existing password forms and will be retained in the customer's mind.

Source: RememBear

5. Ending peaks

Zapier an online automation tool, designed an animated success message when the user decides to upgrade a plan. This approach addresses any potential fears or doubts that may arise after a process where users are aware of the increase in the payment. After upgrading, implementing this final warm and fun message leaves users with a more secure and gratifying sensation.

Source: Zapier

Logoipsum, provides SVG pre-designed logos that can be easily copied directly from the website. Since the user journey can be pretty short and agile, with limited interaction to generate engagement, the team tried to elevate the experience in the final step. They incorporated an elaborated animation design activated when the user clicks on the copy option for one of their logos. In these few seconds, they try to ensure that the main user action generates a positive sensation that can be retained in the user’s memory after leaving the site.

Source: Logoipsum

Approaching product design with this new perspective

Considering that an experience's value and success depend on specific moments instead of an entire journey,  we can start investing our creativity in transforming little instances into significant interactions.

An unexpected animation, a friendly message, a quick gaming interaction: these are all tools we can use to upgrade our users' journey and design with emotion.

The resources at our disposal are diverse and relatively easy to implement. We should ensure our users leave our apps and platforms feeling satisfaction, surprise, and pleasure. This, in turn, will reinforce engagement and memorability of the product.

So now, how will you create defining moments in your product? How will you generate instances where the user can encounter special experiences that will be retained in their memory?