L’Association Française d’Epargne et de Retraite (AFER) est une association indépendante d’épargnants de premier plan en France. Elle compte aujourd’hui 720 000 adhérents, représentant une épargne de plus de 48 milliards d’euros. Elle intervient en permanence aussi bien auprès des pouvoirs publics que de ses partenaires assureurs, notamment pour défendre le statut fiscal et juridique de l’assurance vie.

Objectifs de consultation

Véritable « tribune digitale », le site afer.asso.fr est un lien fort entre l’association et ses adhérents ainsi que ses autres publics (presse et institutionnels).

Sa refonte a plusieurs objectifs :

• Incarner le positionnement de l’Afer en valorisant sa puissance associative et militante
• Offrir un accès rapide et intuitif aux différents contenus et services
• Elargir l'audience tout en s'adressant au adhérents historiques

Responsive design, mobile first et CMS open source / user friendly sont les maîtres mots de la demande.

Découvrir le site

Méthodologie

Le design d'expérience utilisateur a été placé au cœur du processus de création. L'objectif : répondre aux objectifs du commanditaire tout en favorisant une perception et une expérience positive de l'utilisateur sur le site.

Mise en place opérationnelle : 4 étapes clés

• Choix des utilisateurs : 6 personnes représentatives des futurs utilisateurs sont retenues pour participer aux workshops : 4 adhérents et 2 non adhérents.
• Les interviews qui permettent d'identifier les comportements et les usages des utilisateurs. Des parcours clés sont également déterminés.
• Workshop « tri de cartes ». Cet atelier permet de créer une arborescence intuitive, de générer des solutions quant à la navigation.
• Test des parcours utilisateurs sur prototypes d’interface (mobile puis desk). Plusieurs systèmes de navigation sont proposés. Les parcours clés identifiés en amont sont testés.

Aspects techniques

Un thème sur mesure est spécialement développé sur Wordpress pour le site de l'Afer, en s'appuyant sur le framework Bootstrap. Celui-ci répond aux attentes du commanditaire : mobile first et responsive design. Il permet aussi d'utiliser la technologie LESS, langage permettant d'étendre les possibilités offertes par le CSS, notamment grâce à l'emploi de fonctions et de variables.

Un soin tout particulier a été porté à l'optimisation des temps de chargement : minification des CSS et JS, compression Gzip, optimisation des images et du cache. Le site est entièrement administrable.