top of page

Banderole Olympique 2024

ANIMATION DESIGN | DSFR COMPLIANCE | JO CHARTER | INTERACTIVE ELEMENTS | UX OPTIMIZATION

Banderole JO 2024 1

Contexte :

Dans le cadre de la communication officielle pour les Jeux Olympiques et Paralympiques de Paris 2024, j'ai été chargé de créer une banderole animée à intégrer sur le site info.gouv.fr.

 

L’objectif était de promouvoir cet événement international tout en respectant les directives du DSFR et de la charte des JO 2024. Un aspect clé du projet a été l’ajout d’animations subtiles, en particulier le changement dynamique entre les logos des JO Olympiques et Paralympiques.

Rôle : 

UI designer

Toolkit : 

Figma, Adobe XD, invision, zeplin

Objectifs :

Créer un timer distinct : éviter l’utilisation des éléments spécifiques à Omega tout en conservant un design professionnel et aligné avec l'image des Jeux.

Créer une banderole attrayante et animée : Ajouter un mouvement subtil pour captiver l’attention des utilisateurs tout en conservant une identité visuelle en ligne avec les JO.

Respect des chartes : Concilier les directives du DSFR (Design Système de l'État) et celles des JO 2024, en assurant une parfaite harmonie entre les éléments institutionnels et sportifs.

Défi personnel : Intégrer des animations fluides et légères qui apportent une dimension interactive à la banderole, notamment par le changement du logo des JO et le mouvement des quatre carrés visuels.

Réalisation :

1

Animation des éléments visuels

Changement du logo : J’ai implémenté un effet de transition pour faire alterner le logo entre les Jeux Olympiques et les Jeux Paralympiques, de façon fluide et discrète, tout en respectant la charte visuelle des deux entités.

Mouvement des carrés géométriques : Un autre aspect du projet a été l’animation des quatre carrés colorés situés à droite du timer. Ces éléments se déplacent subtilement, ajoutant du dynamisme à la banderole sans nuire à la lisibilité ni à la navigation.

2

Respect des contraintes techniques et visuelles

Conformité avec le DSFR : J’ai veillé à ce que la banderole s’intègre parfaitement dans l’écosystème des sites gouvernementaux, en respectant les normes d’accessibilité et les guidelines du DSFR.

Mouvement des carrés géométriques : Un autre aspect du projet a été l’animation des quatre carrés colorés situés à droite du timer. Ces éléments se déplacent subtilement, ajoutant du dynamisme à la banderole sans nuire à la lisibilité ni à la navigation.

Bandeau JO 2024 2

3

Défis et solutions

Animation légère et performante : L’un des défis était de maintenir des animations légères et optimisées pour ne pas impacter la performance du site, tout en conservant un effet visuel attractif et moderne.

Coordination des chartes : J’ai réussi à concilier les exigences de l’univers graphique des JO avec celles du DSFR, en apportant des solutions créatives pour assurer une cohérence entre les deux chartes.

ipad

Résultat

Défis et solutions

Banderole animée et engageante : La banderole finale, avec ses animations subtiles, capte l’attention des visiteurs du site tout en respectant les exigences institutionnelles et sportives.

Expérience utilisateur améliorée : Grâce à l’ajout d’éléments interactifs et dynamiques, cette banderole offre une expérience utilisateur fluide et immersive, tout en transmettant efficacement les informations sur les JO.

Liste des projets

image

Gouvernement Français

Vous retrouverez ici quelques un de mes projets inspirant au cours de mon année.

image

Agorasquare

Application mobile conçue pour optimiser la gestion financière des entreprises.

image

Master Coach

Master Coach, développé pour une marketplace de coaching.

image

DoctoVoice

Application mobile conçue pour optimiser les interactions médecin-patient.

image

Wisely

Wisely, conçu pour les jeunes managers, est une solution IA qui simplifie la gestion d'équipe.

image

CoinWave

Coinwave, développé pour Crypto Expert, j'ai conçu une application mobile permettant l'achat...

bottom of page