Skip to content

Webapp mobile & desktop

Direct Assurance

Projet en cours…

Direct Assurance est la marque commerciale d’une compagnie d’assurances créée en 1992 la société, Avanssur filiale à 100 % du groupe AXA. Spécialisée dans l’assurance auto, elle propose également des assurances habitation et moto.

DÉTAILS DU PROJET

Projet : refonte de l’espace personnel

Livrable : Desktop & Mobile

Année : 2019 – 2020

connexion_nouveau_espace_personnel_Adrien_astierperet connexion_espace_personnel_Adrien_astierperet

La page connexion est la passerelle entre le site et l’espace personnel. Elle est donc la charnière entre le design de la page qui la précède et l’évolution graphique que propose ce nouvel espace personnel.

Des micro-interactions ont été intégrées pour offrir une expérience utilisateur approfondie. Des animations ont aussi été introduites pour être en lien avec la suite de la navigation.

afficher_mot_de_passe_connexion_espace_personnel_Adrien_astierperet

L’espace personnel accompagne le client dans ses démarches, lui permet de modifier son contrat, le guide dans ses recherches et interrogations, …

Bonsoir David,

Il a été repensé tant sur le plan UX, marketing que sur l’UI. Les parcours d’utilisation ont été raccourcis, simplifiés et la navigation au scroll, presque éradiquée ! L’interface est entièrement dynamique en fonction du moment de la journée, des contrats, des statuts des contrats, …

connexion_nouveaNouveau_espace_personnel_Adrien_astierperet connexion_nouveaancien_espace_personnel_Adrien_astierperet

Switcher d’un contrat à un autre est maintenant possible depuis la barre de navigation, qui suit l’utilisateur tout au long de son parcours. Une transition fait glisser les contrats de gauche à droite et inversement.

De base, il y a deux boutons sur la droite pour “déclarer ou suivre un sinistre” et “gérer son contrat”. Lorsqu’une action est requise, un bouton supplémentaire et une notification font leur apparition. Ceux-ci disparaissent dès que la demande a été traitée afin d’alléger l’interface.

Accessible depuis un bouton en bas à droite de l’écran,

l’aide apparaît dans une bulle d’aide qui reprend les codes de la personnalisation individuelle. Pensé dans un premier temps comme une “FAQ”, celle-ci deviendra à terme un chatbot où des conseillers pourront aussi interagir avec les assurés.

La charte graphique

L’espace personnel évoluant dans l’univers de Direct assurance, celui-ci en a respecté les préceptes déjà établis:
– Le rouge identitaire Direct Assurance, le rouge étant souvent associé au blanc;
– 2 nuances de gris : un gris foncé utilisé pour les textes courants des différentes applications de la marque et un gris clair, principalement utilisé en aplat;
– Une gamme de couleurs secondaires destinées à diversifier les prises de parole de la marque.
Le rose étant réservé aux prises de parole dédiées à la souscription, le bleu à la gestion du contrat et le pourpre au sinistre. Le jaune et le vert sont applicables sans association à une thématique propre.

La typographie utilisée est le Bariol

La version mobile n’est pas en reste!
Développée en Webapp, celle-ci est pensée comme une application, avec une meilleure ergonomie et une facilité d’utilisation à une main (pouce ). La navigation dans vos contrats est ainsi simplifiée.

Le menu est réorganisé pour s’adapter aux besoins du mobile.

Par exemple: vous venez de tomber en panne…
(pas de chance 😅 )
Grâce à l’application, le bouton “dépannage” vous géolocalise et appelle un dépanneur qui arrivera ainsi au plus vite!

A terme, cette version responsive va remplacer l’application  déjà disponible sur les stores Apple et Android.