Patches

Types

Patches

Patches are used in the context of a promotion, a launch, or to convey a notable fact about a product or service. You can use on their own, on an image or in combination with a text description/price.

Different types of patches are available for different types of information:

1. Promo patch
   Used mention a discount, a promotion, a marketing technique that is used to entice customers to purchase a product.
2. Info patch
   Used as point of attention to communicate informational messages to the customers.
3. Eco patch
   Used to communicate ecology-related information, such as when one delivery choice is more environmentally friendly than another.
4. Recommended patch
   Used in the context of Proximus'recommendation on a product or a service.
5. Multi-mobile advantage patch
   Used for the "extra mobile advantage" of the Flex pack.
6. Belfius advantage patch
   Used to highlight an advantage related to Belfius.

There is also a Black friday patch that can only be used during the Black Friday period for all promotions related to this event.

Clickable patch

When an explanation of the patch label must be given to the customer, the promo patch can be made clickable. An "information" icon is then added to the patch and when clicked an overlayer opens with all the explanations of the promotion.

States

1. Default state
   State visible by default.
2. Hover/Focused state
   State visible when the cursor hovers the clickable patch and triggered by keyboard navigation or click. Cursor becomes a pointer.
   
3. Disabled state
   State visible when the element is not yet accessible due to pre-requisite actions.

Anatomy

Patches

1. Container
   A container is displayed around the text label/icon with a solid color.
2. Label
   Label is the key message element and follows these rules.
3. Description
   A short explicit text and/or price can be displayed next to the patch.
4. Information icon (only for the clickable patch)
   Information icon informs the user that an overlayer will open to give more information.
5. Icon/Logo (only for the Advantages and Belfius patches)
   Icon or logo illustrates the advantage patch.

Patch specifications

Patch with description

The most common composition is the description to the right of the patch, but it's also allowed to put the description below the patch.

Do

Don't

Shape

The shape of the promo, info and eco patches is inspired by our symbol and is composed with 3 rounded corners and a square corner. The square corner should be oriented in the general direction of the main object in the lay out.

Label

Best practices

• Use a capital letter at the beginning of the copy in the patch as for the sentence.
• The copy of the patch cannot written in uppercase.
• Try to be as concise as possible. No sentence, only keywords to keep the label in one single line.
• Label text has to be in one line on mobile and desktop

Do
Keep the label on one single line.

Don't
Don't wrap the label in multiple lines.

Specific labels

To ensure the consistency of the message accross all Proximus plateforms, some label texts are predefined for the promotional patches:

Recommended patch

The recommended patch can be placed differently depending of the breakpoints.

Desktop

1. Top left default
2. Top left + overlap

Mobile

1. Top left default
2. Top left + overlap
3. Fullwidth

Branded Component

Business and Enterprise Business Unit

As the secondary colors usage is defined by segment to follow brand identity, the recommended patch is diffent for SE/EBU segments.