Proximus Media Guides

Loading screen

Visual displayed at the opening of the app while it's loading.

last modified: 01/01/1601 01:00:00

Overview

The loading screen appears for a few seconds when you open the app. It is displayed while the app is loading to be ready to use.


Anatomy

Here is a quick overview of what the loading screen contains to better understand this documentation:

  1. Background visual
  2. Proximus logo
    Centered in the screen.
  3. Copy
    Centered in the screen, it lets the user know that the app is loading.

Compositions

You have to produce visuals for iOS and Android. Depending on the resolution of the user's screen, you also have to foresee visuals for multiple resolutions for both OS. You will find all these visuals in the photoshop template.

iOS
Android

Accessibility

In this component, HTML elements are added on top of the image. This content is in positive or negative mode and this affects the creation of the image. Image colors should be carefully considered, with legibility and accessibility as paramount concerns.

Accessibility - Contrast is the most important consideration

Our websites and applications have to be accessible, meaning perceptible, operable, understandable and robust for users with disabilities. Discover here our accessibility guidance.

The visual presentation of text has a contrast ratio of at least 4.5:1. Success criterion 1.4.3 Contrast

Negative mode

This loading screen only exists in negative.

last modified: 01/01/1601 01:00:00

How to

Please use the template and respect the following guidances:

  1. Produce visuals for each OS and all resolutions (from 1x to 4x)
  2. Respect the safe areas in the template
  3. Try to place your main subject in the center. Avoid putting any important information too close to the borders so it won't get cut off.
  4. Make sure your visuals are not too heavy and compress if needed.
Template download

You're part of Proximus organization? Go to the template - If not, request it


Technical specifications

Please respect the following specifications when you export the images:

iOS
Breakpoints Size Max weight Format
1x 414x896px 200KB .png
2x 828x1792px 600KB .png
3x 1242x2688px 1.2MB .png
Android
Breakpoints Size Max weight Format
1x 609x896px 260KB .png
1.5x 913x1344px 500KB .png
2x 1217x1792px 840KB .png
3x 1826x2688px 1.6MB .png
4x 2434x3584px 2.5MB .png
How to compress images

To ensure good UI quality and website performances, it's very important to respect the maximum weight indicated while keeping a correct image quality.
Discover here our images compression recommendations.


Naming convention

Please respect the following naming convention:

  1. Name
    Short explanation of the visual, campaign,...
  2. Date
    yymm = year month (2108 = August 2021)
  3. OS
    If it's a visual for iOS or Android
  4. Resolutions
    From 1X to 4X