Tutorial: User Interface Design Overview

This tutorial provides an overview of Quorum's user interface design

User Interface Design

In the following set of tutorials, we will be discussing one of the more complex areas in computer science: how to create Graphical User Interfaces (GUIs). The topic of user interfaces is complex, not just because it takes practice to learn how to program them, but also because user interfaces are used by human beings, who may or may not understand the intent of the programmer. During this overview, we will provide some context for user interfaces. Once this overview is complete, the next tutorials will go into the details for how we program them.

Perhaps one of the more critical pieces of context to understand when building user interfaces is that they are designed not for a programmer, but for a human user. A button is made to be clicked, a tree is made to be navigated, and a textbox is made for typing. Each component has a different set of conventions that have been established by the computer science community over time. These conventions are evaluated within the academic field of Human Computer Interaction.

Prerequisites for User Interface Programming

Programming a user interface requires some previous programming knowledge to understand, as it is an advanced topic. For this reason, we highly recommend that the reader practices and understands several other tutorials before starting these. Notably, it's especially critical to understand concepts like conditionals, loops, actions, and especially classes. The user interface tutorials coming up all use these concepts freely, and have to, because user interfaces need these features to function correctly.

In addition to tutorials on programming, Quorum's user interface library is built on top of the game programming libraries. You do not need to be very familiar with games, but we recommend at least reading over the following tutorials before moving on: Getting Started with Games, Drawing in 2D, Animation in 2D, and Events.

Next Tutorial

In the next tutorial, we will discuss Behaviors, which describes how to use Behaviors for GUIs.

Next Tutorial