Skip Navigation
News & Ideas

Why ‘design with delight’ doesn’t happen as often as it should


As I discussed in the previous blog post “Enhance micro interactions with a dash of delight”, delight is something users want and it can lead to greater engagement, loyalty, sales and profits. So why aren’t more brands incorporating it into their micro interactions? In the world of design and development one of the big reasons why is because functionality takes precedence.

Even though designers may have created ways to add special touches to micro interactions, often developers will claim they’re under the gun with reams of things to do and aggressive deadlines to meet. Executing the functional requirements of a project’s build take priority, which means adding delight to micro interactions steadily descends to the bottom of the to-do list or off it completely.


How to ensure your micro interactions are designed to delight

Clearly if adding that little something is going to be part of some of your micro interactions it will only come about if intention becomes part of your design and development process.

At TWG, that intention started by setting the bar for the organization. As a group we decided that if we wanted delight to be a consistent element of what our company delivered, then we had to clearly define for our design and development teams how much the organization valued it and the balance we wished to strike between delight, function and speed.

The pressure that design and development teams are under to do more, faster, is never going to disappear. It’s a reality of the business that won’t change.

So how can you ensure enchanting the user is part of the equation?

By being proactive and incorporating delight into the project workflow from the beginning. Allocate a specific amount of time and resources to designing and developing project initiatives that charm and be protective of that allocation.

To assist in managing that ‘delight’ design and development time efficiently, develop micro interactions separately from the main elements of the build.


Here at TWG there are a few ways our design and development team does this:

Often we simply create a good old sprite, i.e. a two-dimensional bitmap. Sprites work across the board and are easy to implement from the dev side. We also recommend learning CSS and basic JavaScript so you can gain full control of the outcome you are aiming for.

Of course there are tools you can employ as well. The two that we’ve been playing with lately and show, in our opinion, the most promise are Spirit Studio and Haiku.

Image showing the individual frames of an animated logo

Spirit Studio is easy to use because it requires very little coding knowledge. It also lets you edit your animation in the browser and see your changes in real time.

Image showing the interface for the Spirit animation app

Haiku’s timeline feature allows you to choreograph animations in your designs visually or, if you prefer, you can animate directly from code. Once you’re done creating your animation, Haiku makes it a breeze to export your design to a multitude of code bases, including: Vanilla JS, HTML + CDN, React, Vue, Angular, iOS, Android, React Native, .mov and .gif.


Interface for Haiku's animation tool

One last point…

Remember, not every micro interaction is a candidate for delight. Devote time during the project planning stage to cherry pick the micro interactions that will reward the user the most if delight is added to them. By determining ahead of time which micro interactions will require added attention, the design and development teams will be committed to their creation from the onset.

Want to add delight to your micro interactions?

Connect with a member of our TWG design team, like Martin, to deliver rich customer experiences.