# UX - Améliorer l'Éxpérience Utilisateur
## 1 Introduction à l'UX
---
### Qu'est-ce que l'UX ?
- **Optimiser l'expérience utilisateur** : Adapter le site pour répondre aux besoins et attentes des utilisateurs.
- **Analyser** le comportement des visiteurs, **définir** leurs attentes, et **satisfaire** ces besoins pour une meilleure conversion.
- **Objectifs UX** : Pertinente, intuitive, simple, assistée.
---
### UI vs UX
| UI (User Interface) | UX (User Experience) |
| ---------------------- | ------------------------- |
| Interface visuelle | Parcours utilisateur |
| Design et interactions | Ergonomie et satisfaction |
| Conception graphique | Analyse du comportement |
- **Différence clé** : L'UI est ce que l'utilisateur voit, l'UX est ce qu'il ressent.
---
## 2 Recherche et Analyse
---
### Comment mettre en place l'UX ?
- **Processus itératif** : Tester, analyser, corriger, recommencer.
- **Étapes clés** :
- **Avant le développement** : Analyse des objectifs et compréhension des utilisateurs.
- **Pendant le développement** : Ajustements basés sur les retours utilisateurs.
- **Après le développement** : Tests finaux pour valider l'efficacité UX.
---
### Organiser et tester le contenu
- **Hiérarchisation** : Définir, catégoriser, tester.
- **Méthode** : Tri de cartes pour valider la structure avec les utilisateurs réels.
- **Outils** : [Optimal Workshop](https://www.optimalworkshop.com/) , [Octopus.do](https://octopus.do/)

---
## 3 Définition et Architecture de l'Information
---
### La taxonomie du site
- **Arborescence horizontale** : Limiter les sous-catégories.
- **Plan de site dynamique** : Utile pour les utilisateurs et le SEO.
- **Exemples** : Arborescence pour e-commerce et blog.
```mermaid
graph TD
Accueil --> Produit
Accueil --> About(A propos)
Accueil --> SAV
Accueil --> FAQ
Accueil --> Contact
Produit --> Catégorie1
Produit --> Catégorie2
Produit --> Catégorie3
Catégorie1 --> Produit1
Catégorie1 --> Produit2
Catégorie2 --> Produit3
Catégorie2 --> Produit4
Catégorie3 --> Produit5
Catégorie3 --> Produit6
```
---
### Organiser le contenu par catégorie
- **Définir le contenu** : Produits, services, articles de blog, témoignages.
- **Catégoriser** : Groupes logiques adaptés à l'audience.
- **Hiérarchiser** : Prioriser les informations essentielles.
---
## 4 Design et Prototypage
---
### Créer des prototypes
- **Modéliser la structure** : Tri de cartes, arborescences, wireframes.
- **Définir le graphisme** : Respect de la charte graphique, maquettes graphiques.
- **Valider les parcours** : Tester interactions, identifier points de friction.
- **Guider le développement** : Spécifications claires, choix technologiques.
---
### Eye Tracking (Oculométrie)
- **Optimisation visuelle** : Positionner les éléments selon les zones les plus regardées.
- **Prendre en compte la ligne de flottaison** : Les éléments importants doivent apparaître au-dessus de cette ligne.
- **Bonnes pratiques** :
- Navigation cohérente
- Repérage évident
- Sobriété visuelle
- Structure monocolonne
- Images avec `alt` et légendes
- Interactions facilitant le contact et le partage


---
## 5 Développement et Implémentation
---
### Les outils de recherche
- **Positionnement stratégique** : Barre de recherche près du menu principal.
- **Recherche prédictive** : Suggestions automatiques.
- **Filtres de résultats** : Affiner la recherche par catégories, dates, prix.
---
### Le menu de navigation
- **Termes clairs et non-ambigus**
- **Menus mobiles** : Menu hamburger avec étiquette "Menu".
- **Ergonomie mobile** : Accessibilité avec une seule main.
- **Zone de confort mobile** : Placement ergonomique pour interaction au pouce.

---
### Les liens hypertextes
- **Prédictifs et identifiables** : Texte clair, infobulles.
- **Boutons distincts** : Couleurs contrastées, texte explicite.
- **Boutons interrupteurs** : Codes de couleur (rouge/désactivé, vert/activé).

---
### Plan de site
- **Sitemap** : Utile pour SEO et utilisateurs.
- **Outils recommandés** : [visualsitemaps.com](https://www.visualsitemaps.com/)
---
## 6 Interaction et Engagement
---
### Aide en ligne
- **Aide contextuelle** : FAQ, chatbots, contact direct pour résoudre les problèmes rapidement.
- **Moteur de recherche interne** : Facilite la recherche d'informations dans la FAQ.
---
### Les formulaires
- **Simplicité et concision** : Phrases courtes, labels clairs.
- **Formulaire dynamique pas à pas** : Étapes claires.
- **Gestion des erreurs** : Validation en temps réel, messages proches des champs.




---
## 7 Optimisation et Monétisation
---
### La boutique
- **Création de compte en fin de processus** : Faciliter l'achat.
- **Réduction des abandons de panier** : Processus simplifié, rappels par email.
---
### Les annonces publicitaires
- **Deux modèles économiques** : Vente de produits/services ou annonces publicitaires.
- **Mix publicitaire** :
- **Contenu unique** : Acceptation des publicités.
- **Contenu de valeur** : Caution du support pour la publicité.
- **Contenu régulièrement mis à jour** : Incitation à revenir.
- **Bonnes pratiques** :
- Publicités honnêtes : Non intrusives, non déguisées.
- Publicités pertinentes : Ciblage adapté, remarketing.

---
### La Landing Page
- **Conversion** : Transformer un clic en action.
- **Éviter le rebond** :
- Limiter distractions visuelles
- Peu de texte et de couleurs
- Options limitées
- **Optimiser le taux de conversion** :
- Crédibilité : Témoignages, labels
- Proposition claire
- Garanties
- Formulaires courts


---
## 8 Rédaction et Contenu
---
### L'édition
- **Processus de lecture** :
- Lecture non linéaire – balayage
- Recherche de points d'entrée
- Abandon sur les lignes trop longues
- **Règles d'or** :
- Écriture concise : Phrases et mots simples, paragraphes courts.
- Écriture structurée : Plan clair, titres hiérarchisés, listes.
- Écriture objective : Contenu factuel, neutralité.
- **Écrire pour informer** :
- Simplifier la structure
- Limiter les niveaux de titres (3 max)
---
## 9 Conclusion
---
- **Synthèse des bonnes pratiques** : Navigation claire, contenus optimisés, accessibilité, interactions facilitées.
- **Importance de l'UX** : Amélioration continue pour fidéliser et convertir les utilisateurs.
- **Encouragement à l'itération** : Tester régulièrement et adapter en fonction des retours utilisateurs.
---