User Interface S01 – Subject to Interactivity

Now, this blog is a little bit out of the norm, but it’ll do. This time I will cover up some of the more detailed but generalized explanation on styles and principles for user interface. What does each specific thing do in my opinion and see if we can assess how their interaction flows into what amounts to a good user interface design. And this is the 100th blog. Who would’ve thought?

Keep in mind that this may or may not be correct, you can afford to make your own conclusions on the subject as you wish. Be reasonable though.

Now, you may have an idea as to what interface design is all about, but if you don’t then the basic idea is that user interface is an interaction between the user and the medium it is interacting with and how to bridge those two together into something that can assist you in bringing you to achieve a specific feedback or a function. Like if you’re going to heat a pan, you need to turn the dial on your cooking stove. If you want more details on what User Interface helps out to a system in the gaming media, this video explains more knowledge than what I can churn out with words alone. So I highly recommend checking it out.

The gist of what makes a good user interface is that interactivity to players who play the game are integral. Know your target market, who it’s for and make it easily accessible to them. Though what’s most important is to understand how to make the system feel interactive to the player without having to bog down to a lot of tutorials and texts explaining the details.

I’ve mentioned the Principles of UI design back in the old blogs but it bears repeating because it acts as a core fundamental for designing User Interface in just about any field.

I’ll be breaking each principle down to its core sections from this website and cover some of the aspects of it on my perspective in order to get a clear view of how to ensure that user interface works within the media you create, whether it’d be for practical or for procedural/work/other purposes.

  1. Clarity – What makes a good interface is that it’s clear. Its visible to the player and it allows you to visualize what makes a good user interface. It gets its job done by having the player direct to where they need without the system guiding your hand via tutorials/help, but having that section as a part wouldn’t hurt to those lost with the controls. Though it should not be the core integral part of the system when designing UI.
  2. Interface exists for you to interact – It helps that certain level of interface design allows you to bridge the gap between the medium we interact in and the player who interacts with that medium. It helps to ensure that players/consumers understand what makes an interface the way it is and how it can be presented to the player/consumer such that it would assist them in getting the point across.
  3. Keep the user invested – If they lose interest after the first five minutes, then you’d lost your edge on that design. Like a storytelling medium, if you don’t engage your audience with a story early on, it’ll feel like it drags on and it would reduce your attention. Though some people tend to be more patient, a lot of people can be really annoyed if they’re not entertained the first time around as early as between 5-15 minutes. So keeping user’s attention is a tricky business, especially in the modern age where we are almost always losing our attention early on. Even I’m guilty of that.
  4. Keep the Control – Ensure the player do not go out of bounds in controls and ensure that they keep all controls flexible within their reach. Without controls, they can do whatever they want with controls and that could be incredibly straining if it strays too much from their intended purpose.
  5. Keep it Direct and Straight – Ensure that the function provides its purpose and ensure that it directly gives feedback. Ensure that slowdown controls aren’t necessary
  6. One thing at a time – Make sure to not have too many actions coming up at once when you want to interact with something (exceptions may vary depending on what you’re making)
  7. Keep the Other Stuff, Other Stuff – Ensure all primary actions take priority over the secondary ones. Because the primary functions are what holds the medium you’re trying to create in User Interface design.
  8. Naturally direct the player step by step – Ensure that they are directed one by one. Ensure the player/consumer understands one particular move first before moving on to the next. Tutorials can be a heavy handed example template for this.
  9. Ensure they act the way they look – People will come up and look at a button and its text, and they will say: “Oh. So that’s what it does. I’ll press it.” Aesthetically, it is useful to direct the player to controls via any form of direction, from style to its type and how it works. It’s useful to ensure that you see what you wanna interact with and make it visually appealing to the target market.
  10. Consistency – Make sure it looks the way it is based on the medium its trying to convey. Don’t overdo it with so many “pretty new glimmers” or “shiny new details”. Polish is one thing, keeping it fitting with the context is another thing entirely.
  11. Keep the one that’s viewed the strongest – This one’s important. You wanna keep attention to the player. Take priorities and ensure that the main thing goes above other things. Stuff like menu which reveals options should consider the following hierarchy. This hierarchy can be adjusted based on the context of the medium you intend to create, but it is also very important to keep in mind what is the hierarchy in a specific element and what lead to such things be made the way it is: – Menu -> Status -> Options -> Others. It helps to ensure the design is layout much stronger than it is.
  12. Be Organized – Ensure that how one particular system or element is arranged allows you to ensure the user understands the system they are trying to provide. Giving them direction and more flow. I mean, the more organized a system is, the easier it is for us to look for it, right?
  13. Highlight specific elements with color – We tend to see things from visual standpoint. Often times, we see what we define ourselves because that is what we perceive as. So ensuring a specific form of visual aid allows us to see what specific function serves on what, based on the context at hand. Take color theory as a base and study up on the elements that makes up that color and see if it fits within the system you want to make.
  14. Show only what’s necessary. This is pretty self explanatory in the general sense but the idea is to not over-complicate things with other element ideas which could be bogged down due to a lot of other factors.
  15. Add the Help Function only at certain points. Users don’t want to feel completely directed at every point. Some know the basics of pressing stuff, selecting stuff and all that jazz. What’s important is to have a help file specifically at points where you don’t know what it means and it doesn’t follow the normal structure. Specific stuff like what options do these systems do based on the context provided.
  16. Design from the ground up from zero. Don’t start from building complex systems. Start from nothing. Begin by layout things based on circumstances and let your design speak for itself, how it layouts and how it works.
  17. Great design is invisible – Quoted from the site, you can visualize the design, put that into reality. Once you can see how it looks like without projection, if you have the idea and it works, put it into application. You’ll be surprised yourself.
  18. Design Principles – Understand the fundamentals of design is key to understanding what makes a good interface. Elements of what makes a principle work is to understand what designing actually is and some of the foundations required to understand them. Typography, Graphic Design, Programming, Illustration, Visualization, Information Architecture and even Copywriting. There are a plethora of key knowledge of understanding you need to know to proceed making a good user interface. Like you need to know recipes and actually practice cooking before you get good, you need to study up on these key aspects in order to ensure you get a full eye’s view of designing something. Some may know more than others, so don’t be discouraged by the idea that your design knowledge isn’t good enough. Try and study hard to the best you can and it may reward you handsomely.
  19. Make sure it is used – There’s no free space for interfaces. They need to be used at specific points for specific purposes. If you do have free space for it, make sure it can be applicable somewhere else. Everything needs to at least serve a purpose, otherwise it would be kind of meaningless otherwise.


So these are the breakdown principles of User Interface and how it works in my own perspective. Hopefully I’ll get around to explaining and breaking down user interface in different practices/examples in order to get a better viewpoint of user interface design and see if they served its purpose well or not.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s