Visual Language

Our previous language was built off of patterns inspired by anime and manga fight sequences. We wanted to build a grander system, one that can grow and evolve and take inspiration from all manner of games and genres.

Our new visual language is build from many things. Graphic cut-outs inspired by the multitude of worlds, shapes, pathways and patterns that exist in gaming, alongside bold new colours, gradients and typography. The system is super flexible and eclectic, emcompassing a feeling of community, variation, excitement and mastery.

We also wanted to create a visual language that was better informed by our brand foundations, ‘the glory is in the journey’.

Shapes From Games

Our new visual language is a rich and varied take on the world of gaming, using shapes and forms that occur througout the gaming universe, shapes that connote movement, energy and action.

Pathways

Alongside these varied and eclectic shapes, we also have graphics that abstractly explore the sense of a journey, a pathway, progress and fails! These pathway shapes are directly linked to our brand strategy, celebrating the journey towards mastery.

Creating Shapes

These examples illustrate how these shapes came to be. Inspired by the best environments, characters and emotions in the games we all love.

The gaming world is rich with points of inspiration, so we know this visual language will always be able to grow and evolve. Pathways and inspirational shapes live everywhere in this world.

Hopefully these stills will show you there is always something we can take from any game, any time.

Here are a few simple steps that illustrate how these shapes can be made. Never trace directly, only gain inspiration from the artwork, add your own spin, and of course, our own Metafy colours, gradients and imagery.

1. Select an image

Gather inspiration from games, dynamic shapes that stand out.

2. Start drawing

Make shapes inspired by the curves and details of those shapes.

3. Extract those shapes

Refine the shapes and add solid colours or gradients from our palette.

Combining Shapes with Illustration

One of the largest challenges is utilizing our visual language in a way that doesn’t dominate our illustration style, but rather adds to it.

As you can see here, shapes inspired by games and pathways can sit in the background, creating a dynamic environment for our character illustrations.

Controlled Irregularity

One of the best characteristics of this new visual language is the eclectic nature of its application. With many pieces that can vary, we tread a fine line of immense possibility and chaos.

Here are a few rules which help unify the experience and create a joyful patchwork rather than a visual language that is incoherent and inconsistent.

Round Corners

Use rounded corners for cards within designs.

Use Consistent Typography

Clash as the Heading, supporter by Suisse. Always use black or white type.

Backgrounds as an Empty Canvas

Use the background as an empty canvas, with solid colour, gradients, shapes, or imagery in the background.

Floating Illustrations

Let the illustrations breathe a little, and overlap them on elements.

Break Out of the Frame

Let illustrations and imagery break out of their containing frames to give a sense of dynamicism and energy.

Complementary Color Application

Use the shades and tints of main colors to create soft variance, steering away from harsh contrast.

Application Examples

The following are a collection of examples of how these visual language guidelines can be applied to marketing material.