Phase 2 — Architecture de l'information
Principe clé
« Les utilisateurs n'ont pas la même logique que vous. »
L'architecture de l'information est l'organisation des contenus et de la navigation du site. La méthode du card sorting (tri par cartes) présentée ci-dessous permet de structurer cette information selon la logique de vos utilisateurs, pas selon la vôtre.
Le principe
Chaque page ou fonctionnalité du site est écrite sur un post-it. Vous demandez à quelqu'un de les regrouper comme il le sent. C'est aussi simple que ça.
Les 3 types
| Type | Principe | Quand l'utiliser |
|---|---|---|
| 🟢 Ouvert | L'utilisateur crée ses propres catégories | Début de projet — découvrir |
| 🔵 Fermé | Catégories prédéfinies | Validation d'une architecture existante |
| 🟣 Hybride | Catégories de base + libres | Affinage |
Pour un projet scolaire, le tri ouvert est recommandé : il révèle la vraie logique des utilisateurs sans les influencer.
Méthode en 4 étapes
Étape 1 — Préparer les cartes
- 10 à 20 cartes pour un projet scolaire (30-60 en pro)
- Un concept par carte
- Termes compréhensibles par tous (pas de jargon technique)
Exemple — 15 cartes pour Pizza Mario
| Carte | Ce que ça représente |
|---|---|
| Page d'accueil | Première impression, résumé |
| Menu des pizzas | Liste avec prix et photos |
| Menu des boissons | Accompagnements |
| Commander en ligne | Formulaire de commande take-away |
| Mon panier | Résumé avant validation |
| Nos ingrédients | Origine et qualité |
| Allergènes | Liste par pizza |
| Horaires | Quand la pizzeria est ouverte |
| Nous trouver | Adresse + plan |
| Notre histoire | Comment Mario a créé sa pizzeria |
| Contact | Téléphone + formulaire |
| Avis clients | Témoignages |
| Pizza du mois | Spécialité temporaire |
| Offres / Promos | Réductions en cours |
| FAQ | Questions fréquentes |
Exemple — 7 cartes pour un portfolio développeur
| Carte | Ce que ça représente |
|---|---|
| Page d'accueil | Présentation courte, photo |
| Mes projets | Galerie des réalisations |
| Détail projet | Description, captures, lien GitHub |
| Compétences | Technologies maîtrisées |
| Formation | Parcours scolaire |
| Contact | Formulaire + GitHub/LinkedIn |
| CV téléchargeable |
Exemple — 9 cartes pour une boutique artisanale
| Carte | Ce que ça représente |
|---|---|
| Page d'accueil | Mise en avant des nouveautés |
| Catalogue | Tous les produits par catégorie |
| Fiche produit | Photos, prix, matériaux, taille |
| Panier | Résumé de la commande |
| Paiement | Finaliser l'achat |
| Notre démarche | Histoire de l'artisan, valeurs |
| Livraison et retours | Délais, frais, politique |
| Contact | Formulaire + réseaux |
| CGV | Conditions générales |
Étape 2 — Recruter 5 participants
Minimum 5 personnes avec des profils variés :
- 🎯 Cible principale — vos futurs utilisateurs (prioritaire)
- 👥 Camarades ou proches — perspectives différentes (âges, niveaux techniques)
Étape 3 — Animer la session
Comptez 15-30 minutes par participant.
| Action | Durée |
|---|---|
| Lecture des cartes | 2-3 min |
| Tri et regroupement | 10-15 min |
| Discussion (« pourquoi ce regroupement ? ») | 5-10 min |
| Photo + notes | 2 min |
Instructions à donner
« Voici des cartes représentant les parties d'un site web. Regroupez celles qui vont ensemble selon vous, donnez un nom à chaque groupe. Pensez à haute voix. Il n'y a pas de mauvaise réponse. »
N'influencez pas
Donnez les cartes mélangées et ne donnez aucune indication sur la structure que vous aviez en tête. La tentation est forte de dire « celle-là va plutôt là... » — résistez !
Étape 4 — Analyser
Identifiez les patterns sur l'ensemble des sessions :
- Cartes toujours regroupées → elles vont dans le même menu
- Cartes qui posent problème (placées différemment) → à clarifier
- Noms de catégories récurrents → utilisez-les dans la navigation
Avant / après — Pizza Mario
Avant — la structure imaginée par le développeur
├── 🏠 Accueil
├── 📄 Pages
│ ├── Menu, Histoire, Ingrédients
├── 🛒 E-commerce
│ ├── Commander, Panier
├── 📋 Informations
│ ├── Horaires, Allergènes, FAQ, Contact
└── 📍 LocalisationAprès — la structure validée par les utilisateurs
├── 🏠 Accueil (+ pizza du mois + promos)
├── 🍕 Menu (pizzas + boissons + allergènes)
├── 🛒 Commander (+ panier + suivi)
├── 📍 Nous trouver (horaires + adresse + contact)
└── ℹ️ À propos (histoire + ingrédients + avis)Ce qui a changé :
- « Allergènes » rejoint le « Menu » — logique : on vérifie en choisissant sa pizza
- « Horaires » et « Contact » fusionnent dans « Nous trouver » — logique : « je veux y aller »
- 5 catégories avec sous-menus → 5 pages claires : la logique des utilisateurs simplifie toujours
Exercice pratique
Exercice — Réalisez un tri par cartes avec votre projet.
Remplir ma fiche Card SortingMatériel : post-it, stylo, table. Pour un projet scolaire, les cartes papier suffisent — meilleure interaction qu'un outil en ligne.
Outils en ligne (alternative)
| Outil | Prix | URL |
|---|---|---|
| OptimalSort | Payant (essai gratuit) | optimalworkshop.com |
| Maze | Freemium | maze.co |
| UXtweak | Freemium | uxtweak.com |
| Miro / FigJam | Freemium | miro.com · figma.com |
Checklist de la Phase 2
- Cartes préparées (une carte = un contenu/fonctionnalité)
- Termes compréhensibles (pas de jargon)
- Au moins 5 personnes ont participé
- Profils variés (cible + camarades + proches)
- Regroupements récurrents identifiés
- Architecture de navigation documentée
Prochaine étape
L'architecture est définie. Passez à la Phase 3 — Design et identité visuelle.