Create a nice, functional and fun design!

Kids don’t like hospitals. Hospitals are places that are sad, boring and where children come forced by their “evil” parents. And you can’t really blame them, because it’s true that they’re not fun places. Waiting rooms become a challenge for the imagination, as there is little they can interact with. And if you add to this the fear of what the doctor will do to them, the fact of going to the hospital becomes a bad experience.

They knew this at Juegaterapia, a foundation that was born to help hospitalized children. That is why they proposed to change the way in which the children perceive the hospital and carried out an ambitious project at the Hospital Niño Jesús in Madrid.

The idea was simple, but not easy to implement: Bring a park of trees, nature and fun inside the hospital.

The result was spectacular. Through the front door, children enter a magical world: corridors decorated with wooden trees, full-color illustrations with animals, plants and flowers, shelves full of children’s stories and, above all, entertainment. You can find games like a maze in a waiting room, a basket in a stairwell or even a word search on the door of a consultation.

Some corners of the Hospital Niño Jesús (Madrid)

After all, these are small details that make them lose their fear, and that attending a consultation or a diagnostic test is as pleasant an experience as possible, within the circumstances that have led them there. The pathologies of the little ones are the same, but the environment has improved so much that it helps them to be a little happier. It’s funny, because when asked, boys and girls remember the positive things more than the negative ones.

Digital product design

What if we take this idea to the design of our digital products?

If we extrapolate this example to the UI design, we could speak of “boring” applications, with abundant and repetitive actions, so much that it is difficult to maintain the interest of the user. Adults, like children, cannot endure boredom for long. They need some fun, and that’s where UI designers come in.

For this we have many techniques, but in this article, we will see the main ones: gamification, illustration, humor and animation.

Gamification system design

It is the technique of inserting game mechanisms into applications or products that were not initially designed for it. Can be used in various areas: management, health, banks …

For example, we can “reward” the user for certain actions, such as completing a form field that is not required, answering a question quickly or giving us information about their interests, social networks, etc.

This is very common in sports applications, where the user can check the times and performance when performing his favorite sport, compare it with his friends and try to improve each time he practices it.

Sports Strava app screens

Every award or achievement we get makes our brain generate dopamine, which in a nutshell “produces happiness”. When these neurotransmitters are turned on a pleasant sensation is triggered.

An example of this would be the application Duolingo. Learning a language can be quite boring, especially if you focus on the grammar part. Through this application the concept changes a lot, as you advance levels according to your knowledge, with short and fun lessons, badges and other common elements in gamification.

Some screens of the Duolingo application

As you can see, in Duolingo they use many illustrations… Why? That’s the next point we’ll talk about.

Ilustration

Making your application more interesting and fun does not necessarily have to go through the concept of gamification. Many times, it is enough to nourish it with illustrations that support the concepts you want to show.

Illustration is very useful when you want to manifest abstract concepts, something that could hardly give you a photograph. In addition, it can be used in conjunction with the brand of your website or product and give it a meaning. The visual impact is greater and the sensation that remains to the user is pleasant… Dopamine, friends!

Designed by Ghulam Rasool

Designed by Outcrowd

Designed by Tubik Studio

In the latter example, the illustration makes the page visually more striking, but it also causes a smile. Humor can help our design be remembered and once again the user has a good impression when using our website or app. This good impression is so nice that it again generates more dopamine in your brain.

Humor in product design

What makes our design memorable? In the book “Emotional Design: Why we love (or hate) Everyday Things”, Don Norman extracts this fundamental idea: Attractive products work better. This not only implies the beauty of our design, but its personality. And how do we achieve more personality? There are several ways to achieve this, but humor is one of the most effective.

Obviously, you can’t use humor on every screen you design. Think of grids, forms or very technical applications. In most cases you won’t find a place to fit an illustration or a joke. However, there is always room to bring out a smile to the user. For example, on error pages. On the internet you can find thousands of examples, but here we will see a few:

Error page 404 Plain Concepts

Error Page Pixar

Error page The New Yorker

Another form of humor would be the personification, or in other words, with the use of a pet. A nice character that makes the experience more fun.

This pet could be used, for example, in alert messages, notifications or even on pages where there is still no content. Think of an email manager where you haven’t created a message yet, or a task manager that tells you you’re up to speed on all of them.

Manu ilustrations

Readme login page

In the latter example, the pet covers its eyes when the user writes the password. A small animation that brings fun and makes it memorable. And with this we move on to the last point I want to talk about, but not for that reason the least important.

Animation

A little animation can be a big help in improving the user experience, as small interactions help users to better understand where they are and what actions they are taking.

The small animations also activate the dopamine. When we click on a heart to make a “Like” something, when we mark a task as finished or when we load a file can be supported with animation, and this will make the experience more enriching.

Oğuz Yağız Kara Animation

As you have read, I have insisted on expressions such as “a little animation”, “small animations”, “small interactions”. Animations should be used in a moderate way, first because if we put too much animation, we risk misleading the user and second, because the performance of our website or application can be significantly reduced.

Before finishing, a tip: if you are starting with the use of animation in your designs, the best thing is that before you get into it you know the 12 principles of animation in UX, an article by Issara Willenskomer. It will be very useful for your next designs.

Conclusion

Designing a “serious” or “boring” product doesn’t have to result in something serious or boring. Designers have the necessary tools to make the use of a web or app a pleasant, fun and rewarding experience. You will enjoy creating this experience more, and this feeling will be transferred to the end user. If you do it right, it is very likely that users will only remember the positive things and forget the negative ones, just as it happens to children who go to the Hospital Niño Jesús in Madrid.

You can make a donation to Juegaterapia with this link. You’ll get a nice handful of dopamine as a reward. ?