May 23, 2016

Tile Viewer - Project, and Analysis on Controls

So, I was contacted by someone in South Africa who works at a tile shop about making a tile viewer capable of previewing their tiles. I made this setup which uses Blueprints to allow users to dynamically change the presets. The names are pulled automatically from the material preset names, and the texture preview in the HUD also gets pulled from the same preset. The only manual work that needs to be done to enter new materials in this system is to add them to the array of parameters. Everything else is precomputed.

Codewise, this is probably the third heaviest code project I undertook (first is 2115, the game for Mote Marine, second is the Perfect Tile System shader itself), and it is definitely the most ambitious Blueprint projects I've ever made. With this project I learned how much code goes into that extra polish phase. For instance, the resolution menu used to allow people to choose resolutions far beyond the top resolution of their monitor. I had to write code in to get the supported resolutions and disable the resolutions that don't fit. The ID system would continue scrolling to infinity unless you clamp it down to a maximum value, so I used the length of the parameter array to get that max value. Changing the grout color as you hover over them with the mouse feels very smooth and nice, but when I had this easy change feature everywhere, it turned the menu into a landmine! Now the quick hover change only works for the grout color, and clicking a grout color will lock in the color for a second so you don't accidentally select a color you don't want.

I'd like to take this time to talk a little bit about controls and the user experience because they are SO important. Even for a project as simple as this, the user experience needs to be fluid and smooth. The biggest challenge was maintaining what I like to call "natural rest" over the most used buttons. In all my project controls, I don't want players to keep letting go of keys and changing positions in order to control the game. In this case, everything from pulling up menus and making selections while changing the floor ID and scaling should all be completed without the player's hands ever leaving the natural rest state (WASD, Shift, Mouse). Aside from quitting the game (Escape) and toggling the help menu (H), no possible action would require leaving this state, and if the state must leave (for instance, to switch from the left mouse button to the middle one), the change corresponds to a shift in the mode of the user experience (scrolling through IDs/opening the menu VS selecting items in the menu). This psychological separation and organization of the controls makes the user experience feel natural, fluid, and inherently clear.

At the moment, there is a 3D-printed contraption that allows players to use all their fingers to access buttons on the controller they wouldn't normally be able to reach without their fingers leaving other buttons. This is how players identify bad controls: when a device like this is viewed as favorable, or necessary in order to play a game well. Maybe a particular move is more difficult to reach than the inventory menu, but the move is used more often. Maybe the design of the controller has a lot of buttons with important functions outside the natural rest state. It all has an effect on the player, teaching them which moves should be used most often, which moves can be used together, and how different modes switch.

Using the scroll wheel, it is very easy to scroll through all of the parameters and select the right one. Holding shift lets you scroll 5 times as fast (or faster/slower, the variable can be changed). If there were 500 presets in this viewer, it would be possible to quickly scroll through any of the 500 presets with only the shift button and the mouse wheel in 2-3 seconds, without ever needing to take your fingers off the main controls. And since both buttons are on opposite hands, it actually helps players focus on the action. It's also possible to enter an ID and go to the preset you have in mind, and it will automatically prevent you from entering a letter or an ID beyond what exists in the system.

I love UE4's UMG. It is so easy to design a beautiful user interface with programmable buttons and popup menus that it makes everything a breeze. How do I know the user experience is good? My mom likes it, and is able to use it. My mom has trouble using e-mail.


No comments:

Post a Comment