Action Angles

Action Angles are a primary brand element of Hudl. They are intended to represent the motion and intensity of sport.

Action Angles are loud, bold and confident. They contrast the quiet, subtle and understated parts of our product and brand. Action Angles should be used sparingly and with great intent to maintain value.


Functions of Angles

Beyond being a recognizable brand element, these angles create visual interest and support layouts in practical ways.

Imply Motion

These simple flat shapes imply motion by flowing through content and continue beyond the edge of the layout.

Amplify Content

The lines created by angles guide eye flow through a layout and create meaningful divisions. Angles should amplify content, not distract from it.

Create Layers of Depth

Angles can separate communication elements from a busy background, pull forward an individual from scene or flow behind an isolated product to help ground the image.


Types of Angles

“Action Angles” are the layered semitransparent varying angles. There are two types of “Action Angles”: Full Expression and Supporting. Simple angles can also be used to continue angular brand look without relying on the intensity of Action Angles.

Action Angle Examples


Full Expression

Unlike Supporting Action Angles, Full Expression Action Angles are not bound to edges of the layout. Full Expression expresses the Hudl brand in the most intense way. A lot of care should be put into each execution.


Supporting

Supporting Action Angles step back to allow content to take center stage yet act as a strong and recognizable Hudl brand element. Supporting angles should be bound to edges of the layout.


Simple Angles

Simple angles can be used as a less overt way to support the Hudl brand when the Action Angles may be too repetitive, overwhelming or simply not necessary.


Simple Angled Transition

Simple angles can be used to transition from one content plane to another, such as an image to a solid color.

Simple Angle Transition Examples


Simple Angled Scrim

Transparent simple angles can be used as a scrim to separate content from a busy background. Angle scrims are preferred over darkening of an entire image to not obstruct focal point.

Simple Angle Scrims Examples


Dos and Don’ts

To maintain brand quality and coherency, it is important keeping the intended integrity of Action Angles. Action Angles can be a powerful tool, but do take practice to get right. Below are some dos and don’ts to help you get started.


Irregular / Not Chaotic


Intentional / Not Calculated


Flow Through / Not Obstructed


Monochromatic / Not Multicolored


Continuous / Not Floating


Fluid / Not Sharp


Flow Behind / Avoid Tangental


Beware of Unintended Pattens