What you can learn from UI design in games
Hello and good evening!
It's a celery loli!
There is less than one month left this year! What will you do during the year-end and New Year holidays?
I'm going to play the game that I haven't finished this year.
By the way, there are four titles I want to digest: "Hogwarts Legacy", "The Legend of Zelda: Tears of the Kingdom", "Lies of P", and "Resident Evil RE:4 Ada Arc".
(There may have been others, but this is all I came up with...)
Now I am playing "Super Mario Bros. Wonder", "Asobi Daizen 51" and "Watermelon Game".
Recently, in my work, I was reminded of the importance of website UI/UX.
Therefore, I am writing this article because I think there is something I can learn from UI design in the game industry, which is more advanced in UI/UX than in the web industry.
A game that I personally think will be helpful for UI design
.Persona 5
"Persona 5" is a game software released on September 15, 2016 by Atlas, which is familiar from the "Megami Tensei series" and "Persona series".
Personally, I think it is one of the representatives of the Osare game.
Although it is an RPG game, it is bold and stylish.
The UI looks like it's cluttered, but I think it's neatly put together.
It may be helpful for headline and menu design.
THE DIVISION2 - The Division 2
Quoted from "THE DIVISION2 - The Division 2"
Watch THE DIVISION2 - The Division 2
"THE DIVISION2 - The Division 2" is a game software released by Ubisoft on March 1, 2019.
This game was praised for its excellent UI design in many places.
It has a simple flat design and is designed to be fashionable and maximized.
It uses a digital font that matches the world view. Since it is a screen like a HUD (first image), I thought it would be very immersive when playing the game.
However, since it is stylishly shaken, the text is small and I feel that it is a little difficult to see...
Uma Musume Pretty Derby
Quoted from "Uma Musume Pretty Derby"
Watch "Uma Musume Pretty Derby"
Uma Musume Pretty Derby is a game app released on February 24, 2021 by Cygames.
While smartphones were often played in landscape orientation, Uma Musume considered the user experience (UX) and changed to a specification that was played in portrait orientation during development.
As a result, it led to explosive popularity.
There are restrictions on the width that can be used for UI layout because it is designed to be played vertically, but it seems that the UI is put together by making good use of the vertical width.
Buttons that users use frequently, important buttons, items, etc. are displayed in large formats, and they are prominent with effects, eliminating the time lag when users perform the desired action.
"Splatoon"
Splatoon is a game software released by Nintendo on May 7, 2015, and Splatoon 2 was released on July 21, 2017, and Splatoon 3 was released on September 9, 2022.
Itseems that the goal of the UI of "Splatoon" was to be "easy to understand as a UI and fresh as art!"
The "Squid Font", which impresses "Splatoon", did not have a font that matched the game's world view, so the designer made it himself. (He said that he created all the necessary characters other than kanji.) )
In order to give a vivid impression, you can see the attention to detail everywhere, such as thinking about colors that are shifted from hue (orange for yellow shadows and purple for pink shadows).
As a result of realizing "easy to understand as a UI and fresh as art!", we succeeded in gaining a certain level of recognition as a new title.
I personally think it's a good game that can be enjoyed not only as a game but also as art.
Some of the content and images are quoted from "Nintendo's UI/UX Designers Talk about Design Philosophy" by Goodpatch Blog.
Finally
When I looked at the UI of the game, I felt that the UI of the game pursued how to excite the user and was full of entertainment.
In addition, just because it is full of entertainment does not mean that the UI is not difficult to see, and I felt that it was well balanced.
Many of the game's UI designs are unique to match the game's worldview, but I would like to refer to those that can be used in web production.
