Designing for human connection.

Most interfaces are built to be correct. The button submits, the form validates, the table sorts. Correct is necessary, but it is not why people come back to a product or recommend it. People return to products that make them feel competent, understood and in control.

That feeling is not an accident of good taste. It is designed, and it lives mostly in the small moments: the half-second after a click, the wording of an error, the way a panel slides in instead of appearing out of nowhere.

Emotional design is not decoration

The phrase “emotional design” often gets reduced to confetti and mascots. Its original meaning is much more practical. In Emotional Design (2004), Don Norman described three levels at which people respond to products:

Most teams over-invest in the visceral level and under-invest in the behavioral one. Yet the behavioral level is where trust is earned, one interaction at a time. For more on the visceral side, see our piece on the science behind color perception.

Micro-interactions: where products feel alive

A micro-interaction is a small, contained moment built around a single task. In Microinteractions (2013), Dan Saffer proposed a simple anatomy that is still the best way to design them:

1. Trigger: what starts it, a click, a swipe, or a system event like a new message.
2. Rules: what happens, and what can’t happen.
3. Feedback: how the user knows it worked, visually, through sound or through haptics.
4. Loops and modes: what changes over time or on repeated use.

Where to invest first

Not every interaction deserves attention. Start with the moments that carry the most anxiety or the most repetition:

• Saving and submitting: show progress, then confirm clearly. “Saved” beats a silent page.
• Destructive actions: a short delay, an undo, or a clear confirmation reduces fear.
• Empty states: the first screen a new user sees should explain what to do next, not just say “No data”.
• Errors: say what happened, why, and what to do, in plain words, next to the field that needs fixing.
• Repeated daily actions: in tools used eight hours a day, shaving friction from one frequent action matters more than any hero animation.

Animation with a job to do

Motion is the most powerful and most abused tool in emotional design. Good animation always has a job:

• Orientation: showing where something came from and where it went, like a panel sliding from the button that opened it.
• Feedback: confirming that an action registered, like a button pressing down.
• Continuity: connecting two states so the user doesn’t lose their place, for example with the View Transitions API.
• Attention: drawing the eye to something that changed, once, not on a loop.

Practical motion rules

• Keep most UI transitions roughly between 100 and 400 milliseconds. Small elements move faster; large surfaces move a little slower.
• Use easing: ease-out for things entering, ease-in for things leaving. Linear motion feels mechanical.
• Never make the user wait for an animation to finish before they can act.
• Respect prefers-reduced-motion. Replace movement with a simple fade or an instant change for users who ask for less motion.
• Avoid flashing content; WCAG 2.2 sets limits on flashes for good reason.

A little psychology goes a long way

A few well-established principles explain why small design decisions have outsized emotional effects:

• Perceived control. People tolerate waiting far better when they can see progress and cancel. A progress indicator turns frustration into patience.
• The peak-end rule. Daniel Kahneman’s research suggests people judge an experience largely by its most intense moment and by how it ends. A clear, warm confirmation screen is worth designing well.
• Recognition over recall. Showing options instead of making people remember them reduces cognitive load and the anxiety that comes with it.
• Social proof and reciprocity can be used honestly. Fake scarcity timers and guilt-trip copy (“No thanks, I don’t like saving money”) damage trust at the reflective level, even if they lift a short-term metric.

Measuring connection without inventing numbers

Emotional design is hard to measure directly, but its effects are visible. Useful signals include:

• Task completion rates and time on task in usability testing
• Support tickets that mention confusion around specific flows
• Qualitative feedback: the words users choose to describe the product
• Repeat use of features that used to be avoided

Test with real users, compare before and after, and be wary of any blanket claim that a single animation “increases retention” by a fixed percentage.

How we apply this at RAIN

At RAIN Design Studio in Casablanca, every product interface we design goes through a pass dedicated to these moments: empty states, errors, confirmations, loading and motion. In dense tools such as our in-house RIVER ERP, that work is mostly invisible; it shows up as staff who stop asking “did that save?”.

If you want your product to feel as good as it works, our UI/UX design team can help. Book a free 15-minute call to talk it through.