5 things web designers can learn from games

I was 12 years old when I played an arcade game for the first time. It was the '90s and the game was Capcom Arcade's Final Fight. I remember like it was yesterday the rush I felt when the music started and when the story kicked off.

I barely played for five minutes but when I finished I was so excited I could feel my heart beating in my throat. Final Fight was a hell of an experience.

Side-scrolling Japanese beat-em-up Final Fight was a SNES favourite

Side-scrolling Japanese beat-em-up Final Fight was a SNES favourite

Throughout the years working in the interactive industry, I have felt that same excitement several times; when checking out some of the so called 'interactive experiences', checking regular content sites and lately playing GTAV online.

However as time goes by I realized my expectations in the interactive field are getting lower and lower. Everyday I visit tons of sites that promise me an 'experience' or urge me to 'explore'. They always intend to inspire me and ask me to learn more and share their content but I rarely do. I don't often feel rewarded by any of these sites, they all over promise and fail later on.

Failing to inspire

Could it be due to the fall of Flash? The increasingly tight budgets? The spread of parallax, long scrolling, grids or one pagers promo sites? The current mainstream design trend? Or the fact that Chrome Experiments are just that: experiments?

Many 'interactive music videos' end up being a video with no story where you move your mouse to see a flashy effect. An immersive experience ends up being a video played full screen or a bunch of 3D models and hotspots to 'learn more' and the broad act of 'exploring' ends up meaning scrolling down through a long page while playing a video in slow mo or seeing a grid of pictures.

So now think for a second and try to answer this… When was the last time you felt immersed in an online experience?

The death of Flash

Let me tell you, in a browser that was a long time ago for me. Since the death of Flash the whole industry has taken a step back. We still continue overusing all these meaningless call to actions and vague promises but more and more they are losing their significance and killing my expectations.

I don't want to spend time in your 'immersive experience' and, unless you give me something truly awesome, I won't share your content.

As part of a digital agency I try to fix this as much as I can. Being able to feel a rush when diving into an interactive piece and to provoke that same rush in users is the only reason why I go to work everyday. Here are a few learnings I've found myself discussing during the last five years when approaching a new project...

01. Make it interactive

What's the point of being on the web if you don't take full advantage of its interactivity?

What's the point of being on the web if you don't take full advantage of its interactivity?

The internet is interactive. TV is not - and that's why it is fading out. Users visiting your site are trusting you to amaze them expect more than sitting back and staring at the screen. If you promise them an 'experience' you have to work up to the expectations. Engage them through interactions, make them part of the 'experience', play with their expectations and surprise them after all.

Many of these features were inherited from the world of videogames. However 'game' is a dangerous word to use during a brainstorming session. Most of the people will jump up on their seats: "We can't do a game!"

Surprisingly, whether you call it a game or something else, the reality is that the gamification processes are actually pretty useful when it comes to engaging users.

Creating a sense of achievement through small challenges, comparing users' behaviours or guiding them through a small, step by step walkthrough are only few examples of how gamification processes can improve your work.

02. Never underestimate the power of a good story

Everyone and every brand has a story to tell - so tell it

Everyone and every brand has a story to tell - so tell it

Personally, I have experienced every kind of emotion while reading books or watching movies. I've reread paragraphs in books that made me feel great all of a sudden, full of energy. At other times ,a sad dream will make me feel blue in the mornings. Stories are all around and when transmitted well, they can take you through a rollercoaster of emotions.

We need to make sure we have a story to tell. When given the chance we need to make the user feel something, take something out of our work. Considering we work on an interactive platform it should be even easier to get the user involved in a story. Brilliantly executed 'interactive experiences' that lack a story are a waste of time.

The need for a story doesn't just apply to the big productions - Google Chrome Experiments kind of sites. Even smaller, purely functional sites can tell a story. Startup sites, banks, and even iPhone apps promo sites can tell a story as well.

A pretty design layout with a massive jumbo mambo iPhone is not enough anymore. Ask yourself, what do you want users to feel when checking out your site? And now create a narration around that.

No one's going to look at your website if it just looks like a copy of someone else's

No one's going to look at your website if it just looks like a copy of someone else's

Have you realized how many websites look similar these days? iPhone App promo sites are so similar that you can even download templates to do your own with few assets. From a design perspective many people took the flat trend the wrong way and now you don't know whether you are looking at accounting software, a marketing site, or a weather app. Same thing happened with the trend of using parallax scrolling. Agency websites, police departments and fashion portals adopted this trend blindly.

While trends will keep you up with the mass of sites being produced out there, it will also kill your message and will distract the user from its real purpose. The ideation of your work should come from the message you want to communicate instead of from the current trend in the industry.

If you look at it from an advertising or communication perspective, by adjusting your work to the current trend you are killing what could make your work memorable. You are playing it safe. Your work will be processed by the audience like part of that mainstream trend, and its message will be ignored.

In a few words, be disruptive, trends will make you normal and forgettable.

04. Reward users and reward yourself

If people have taken the time to visit your site, they should be rewarded

If people have taken the time to visit your site, they should be rewarded

Make it count. Make your interactive experience worthy of the user's time. Take the chance to impact users in one way or another.

Thinking about the amount of websites a normal user sees everyday online, we don't really have much of a chance to make a huge impact on those users. With their limited attention span they will probably scan our site and engage only if either its content and or functionality is perceived as useful for them.

If your work is not perceived as engaging because of its content, how this content is treated, or its functionality and how this is displayed, that's a failure.

So think about it like two sides of the same coin. First I'll state the obvious, we all want our work to be successful, to be liked by users. And secondly, being a bit selfish now, how would you feel knowing you spent X weeks working on something that doesn't work? Something that doesn't add value to your career, isn't it a waste of time?

05. Don't waste your time

A happy note to boost your stamina level...

Project schedules are shaped by the amount of constraints around it. Low budgets, limited time, limited resources or client vision can make you give up sooner than later and become a Zombie Designer that only follows orders. However these are the limitations that should push your work even further.

Today's constraints will fade out through time, your work won't.
Constraints are normally misused as an excuse for an average work performance. But in reality the memory of those constraints will fade away quickly while the project will still be around.

Don't ever miss the chance to make a great project, for you and for your users.

Final note

Great sites are are always being done. From time to time something comes up that just feels right. Great sites that 'wow' me recently are Lifesaver: A Revolutionary New Way To Learn CPR by Unit9 and USA Today by F-i.

Take this article as a few of many learnings. The internet has been an amazing place from its beginning. A place where you can potentially experience, explore and be inspired by content from around the world. It's our responsability to keep it that way.

It's time to 'wow' users again.

Words: Claudio Guglieri

Claudio Guglieri is design director at @F_i and some other experiments. He'll be speaking alongside David Navarro at Generate London this September – buy your ticket today!

See Claudio speak at Generate London

Thank you for reading 5 articles this month* Join now for unlimited access

Enjoy your first month for just £1 / $1 / €1

*Read 5 free articles per month without a subscription

Join now for unlimited access

Try first month for just £1 / $1 / €1

The Creative Bloq team is made up of a group of design fans, and has changed and evolved since Creative Bloq began back in 2012. The current website team consists of eight full-time members of staff: Editor Georgia Coggan, Deputy Editor Rosie Hilder, Deals Editor Beren Neale, Senior News Editor Daniel Piper, Digital Arts and Design Editor Ian Dean, Tech Reviews Editor Erlingur Einarsson and Ecommerce Writer Beth Nicholls and Staff Writer Natalie Fear, as well as a roster of freelancers from around the world. The 3D World and ImagineFX magazine teams also pitch in, ensuring that content from 3D World and ImagineFX is represented on Creative Bloq.