Colours in Virtual Worlds

In this session, we’re going to learn about colours. This is one of the core concepts for working with virtual worlds, so let’s begin. All objects in a virtual world have a colour associated with them. For example, take a look at this scene. Colour can be used to communicate an intent, an affordance, or an aesthetic for a given object, so Colour becomes very important. The difficulty is representing Colour in a numerical way, which a computer can store and display in a way that humans expect it to look like. For example, what do you think is the Colour of this object? While there are many ways to describe colours, the most common format is the RGB format.

This is based on the additive Colour theory, which assumes that all perceptible colours can be made by combining the wavelengths of the primary colours, red, green, and blue. The contribution of each primary Colour determines how the Colour looks to a human. For computers, this simplifies storage, too. By assigning a byte to each Colour, a computer system can represent a total of 16 million colours using just 3 bytes. Given 1 byte can encode 256 values, we get 256 red values times 256 green values times 256 blue values. This leaves us with a total of 16 million possible colours. The hexadecimal numbering system is a base 16 system which uses 0 to 9 and the letters A to F to represent numbers.

For graphics, the three bytes of Colour are usually represented in hex. AFrame uses a system similar to HTML for specifying colours. HTML supports the definition of RGB triplets that are prefixed by a hashtag. So for example, the Colour white would be hashtag followed by six F’s. It also supports named colours, such as papayawhip, peachpuff and tomato. You can use named colours or hex codes interchangeably. For example, the result of the first block, which uses named colours, is the same as the result of the second block, which uses hex codes. Objects in the real world can be transparent. Similarly, virtual worlds support varying levels of transparency and opacity. In summary, colours communicate and intent, an affordance, or an aesthetic.

Colours can be defined by using hex triplets or named Colours, and transparency and opacity are named attributes that also need to be set.