instagram-icon
bandeau afer

Afer

User Experience Design

  • Contexte

    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. Malabar design intervient pour la refonte du site web de l’association avec une méthodologie centrée utilisateur.

    Voir en ligne

  • Expertises

    • UX design
    • Ateliers utilisateurs
    • Tests sur wireframes
    • Direction artistique
    • Responsive web design
    • Motion Design
    • CMS WordPress
  • Chiffres clés

    • 720 000 adhérents
    • 6 ateliers utilisateurs
    • + 35% de trafic
    • + 85% de connexion depuis mobile

L'UX design au coeur du processus de création

afer image une
01

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.

afer image une
02

Méthodologie

Le design d’expérience utilisateur a été placé au cœur du processus de création. L’objectif est de 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

  • – 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.
  • – L’ atelier “tri de cartes”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.
tests utilisateur afer
afer responsive design
03

CMS et développement

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.

afer responsive design
afer bandeau

Toujours n° 1

Découvrez en 1er les billets qui font l'internet de demain !

M'inscrire

Merci pour ton inscription