What can video games teach you about UX and UI?

  • Published on
    14-Apr-2017

  • View
    488

  • Download
    0

Transcript

http://fenix.agency/blog/ What can video games teach you about UX and UI? by Marko Paar http://fenix.agency/blog/ http://fenix.agency/blog/ Table of contents 1. Introduction 2. Humans are lazy 3. Know your place 4. The power of the click 5. Fitting the theme 6. Bonus content 7. About Fenix http://fenix.agency/blog/ Note This presentation is a collection of main takeaways from a blogpost I wrote on the topic. If you want to learn more, make sure to read the full post or visit our blog if you're interested in more articles. http://fenix.agency/blog/what-can-video-games-teach-you-about-ux-and-ui/http://fenix.agency/blog/http://fenix.agency/blog/ http://fenix.agency/blog/ Introduction Modern video games are characterized by immersive, dynamic worlds, and it has a lot to with the advance of User Experience and User Interfaces Similarly to video games, having both a usably and visually attractive website or app is a must Many, function-wise, great apps have failed, simply due to bad UI and/or UX Web development has influenced the gaming industry and vice versa http://fenix.agency/blog/ Humans are lazy Humans are lazy and design should take advantage of it Our brains are hardwired to do the least amount of work possible to get a certain task done Interation design technique, known as progressive disclosure, is centered around maintainint focus by removing clutter for the sake of experience This is similar to the inverted pyramid model used in journalism https://en.wikipedia.org/wiki/Progressive_disclosurehttps://en.wikipedia.org/wiki/Inverted_pyramid http://fenix.agency/blog/ http://fenix.agency/blog/ Web experience should be tailored to give the most information with least amount of effort required We're also very visual which makes games so appealing One of the strongest point of games is the preference towards symbolism The ability to transform meaning into symbols was a huge step towards visual decluttering Health bar is a good example as it takes less space and uses symbols to represent meaning http://fenix.agency/blog/ Image source https://electromagneticproject.wordpress.com/tag/the-legend-of-zelda/ http://fenix.agency/blog/ What can we learn from that? Using symbols is often superior to text They are easy to understand, simple to produce and take less space The trend towards minimalism and symbolism is well documented and continues Tinder, for example, is a great example of an app that uses symbol and elegant mechanics In the future, UX will become even more context-based http://fenix.agency/blog/ An interesting example of a game that experimented with minimalism was Trespasser This is how you were supposed to check your remaining health It was a failure, but it did influence later games when it comes to UI http://fenix.agency/blog/ Know your place The Binding of Isaac is a game that gets (mostly) everything right It requires you to learn and repeat in order to master giving you vague and basic information Although it might seem counterintuitive, it knows its audience and the genre It's not afraid of trying, knowing that its players are not afraid of trying over and over again http://fenix.agency/blog/ http://fenix.agency/blog/ What can we learn from that? The Binding of Isaac is extremely user-centric It goes against the grain of modern UI because its players like to go against the mainstream gameplay It recognizes the needs of the target audience It's UI and UX are tailored to meet the needs of its target niche and target audience http://fenix.agency/blog/ The power of the click Morrowind, at the time of its release, had a great UI Extremely simple to use, with everything being just a click away, the UI was as simple as it gets With an item count and world as large as Morrowind's, lowering the amount of clicks and interactions was a necessity Morrowind implemented the one click mechanics to the fullest http://fenix.agency/blog/ http://fenix.agency/blog/ What can we learn from that? Conceptually, the three click rule makes a lot of sense although you shouldn't blindly follow it Potential customers will leave your site if they can't find what they're looking for in a short amount of time Modern webs and apps should be as intuitive as possible and pay a lot of attention to quality of information architecture That's especially prevalent in e-commerce where lowering the bounce rate is of great importance https://en.wikipedia.org/wiki/Three-click_rule http://fenix.agency/blog/ Fitting the theme A couple of decades ago, video games relied heavily of completely on text-driven experience The lack of graphics required designers to think outside the box and be very creative Video game designers became masters of storytelling Fallout 2 is a great example of a game thats known for its attention to detail http://fenix.agency/blog/ http://fenix.agency/blog/ What sets Fallout 2 apart is the love for contextual details Almost everything is designed to fit the theme of the post-apocalyptic world Even the boring elements, such as the text-HUD, are designed in the similar fashion The game doesnt let technical limitations get in the way of its UI and UX It does everything to create compelling experience http://fenix.agency/blog/ http://fenix.agency/blog/ What can we learn from that? Great User Experience comes from the holistic approach Just like in Fallout 2, all elements should create a compelling experience Best UI is the one that not only provides utility, but also tells a story Elements should be well thought out and serve as a building block of a larger system http://fenix.agency/blog/ Bonus content How can Solitaire help you explain how UI works Sonic the hedgehog and the Green hill zone How gamification works To view bonus content and learn more, make sure to read the full article here http://fenix.agency/blog/what-can-video-games-teach-you-about-ux-and-ui/ http://fenix.agency/blog/ About Fenix Fenix is a custom development agency focusing on mobile and web development. We provide custom-made solutions to a large variety of clients. Our clients thus far include Disney, Microsoft, Discovery Channel, TLC, Kinder Sport etc. To learn more about us, contact us at info@fenix.agency or take a look at our company profile. mailto:info@fenix.agencyhttp://fenix.agency/profile.pdf