office_translator/.impeccable/critique/2026-08-31T18-46-44Z__frontend.md

target, total_score, max_score, na_heuristics, p0_count, p1_count, timestamp, slug

target	total_score	max_score	na_heuristics	p0_count	p1_count	timestamp	slug
frontend (UI complète Wordly.art)	30	40		0	2	2026-08-31T18-46-44Z	frontend

Évaluation de design et d'ergonomie — Wordly.art (frontend) — Analyse complète

Méthode : contexte unique (⚠️ DEGRADED: single-context - pas d'environnement de sous-agents parallèles isolés)

Score de santé ergonomique (10 règles de Nielsen, 0 à 4 chacune)

#	Règle ergonomique	Note	Constat principal
1	Visibilité de l'état du système	3/4	La zone de dépôt réagit désormais parfaitement au survol ; le suivi de traitement avec découpage des phases est exemplaire. En revanche, l'action « Tout approuver » dans la relecture enchaîne les requêtes sans compteur ni barre de progression en temps réel.
2	Correspondance système / monde réel	3/4	Vocabulaire du métier de la traduction bien adapté (XLIFF, segments, préservation de mise en page). Quelques identifiants techniques bruts subsistent (identifiants tronqués dans la gestion d'équipe).
3	Contrôle et liberté de l'utilisateur	3/4	Annulation réelle côté serveur lors du traitement et confirmation d'approbation en deux temps. Cependant, la suppression d'un membre d'équipe est immédiate sans modal de confirmation.
4	Cohérence et standards	3/4	Grande harmonie visuelle avec la charte éditoriale (Playfair Display, or encre #8B6F47, cartes épurées). Quelques dissonances : la page Glossaires utilise des codes hexadécimaux bruts hors système, et la page Paramètres fait doublon avec l'onglet Préférences du profil.
5	Prévention des erreurs	3/4	Excellents contrôles de format et de taille de fichier. Cependant, si la langue source est identique à la langue cible, le bouton Traduire est désactivé sans message explicatif sous le bouton.
6	Reconnaissance plutôt que rappel	3/4	Récapitulatif clair de la configuration avant envoi, historique récent des travaux avec accès direct à la relecture, sélecteurs de langues avec recherche intégrée.
7	Flexibilité et efficacité d'utilisation	3/4	Bonne accessibilité clavier de la zone de dépôt ; mais absence de raccourci clavier (ex. Ctrl+Entrée) et de filtre par statut (« en attente ») dans la table de relecture.
8	Esthétique et design épuré	3/4	Direction artistique très réussie et distinctive. Le sélecteur de glossaire dans le flux de traduction reste toutefois dense en intégrant l'ajout rapide de termes.
9	Aide à la reconnaissance et récupération des erreurs	3/4	Messages d'erreurs traduits et orientés vers l'action avec possibilité de réessai sans recharger le document.
10	Aide et documentation	3/4	Aides contextuelles claires sous les sélecteurs et infobulles descriptives ; pas de centre d'aide ou FAQ navigable globale.
Total		30/40	Palier « Bonne interface » (28-35)

Verdict de spécificité du design

Évaluation du design : Wordly.art se démarque nettement des modèles SaaS génériques grâce à son identité éditoriale soignée. L'animation bureautique interactive de la page d'accueil (hero-visual.tsx) qui reproduit fidèlement Word, Excel, PowerPoint et PDF avec une onde de numérisation dorée ancre le produit au cœur de sa proposition de valeur : la fidélité absolue de la mise en page. L'équilibre entre le style classique (Playfair Display) et la sobriété moderne fonctionne remarquablement bien.

Scan automatique : 3 avertissements identifiés par le vérificateur automatique :

• 2 alertes d'usage de la police Inter (globals.css:145,151) — choix assumé pour la lisibilité des textes d'interface.
• 1 bordure d'accent sur élément arrondi (globals.css:222) correspondant à l'indicateur de chargement circulaire.

Ce qui fonctionne particulièrement bien

1. L'animation bureautique immersive de l'accueil : Le document vivant qui bascule du français vers l'anglais et l'espagnol avec règles et rubans d'époque démontre la qualité du produit bien plus efficacement qu'une capture d'écran statique.
2. Le parcours de traitement et d'attente : L'affichage des étapes (extraction, traduction contextuelle, reconstruction) avec estimation du temps, survie au rafraîchissement et possibilité d'interruption propre.
3. Le confort de lecture révisé : L'ajustement des teintes dorées vers un or encre (#8B6F47) garantit un excellent contraste sur fond clair tout en préservant le caractère haut de gamme du produit.

Problèmes prioritaires

1. [P1] Bouton de traduction désactivé sans message explicatif si source = cible

   • Pourquoi c'est important : Lorsque l'utilisateur sélectionne la même langue en source et en cible (ou que l'auto-détection correspond à la cible choisie), le bouton principal reste grisé sans message explicite, ce qui peut faire croire à un blocage de l'interface.
   • Solution : Afficher un court message d'avertissement sous le bouton (translate/page.tsx) indiquant que la langue cible doit être différente de la langue source.
   • Commande suggérée : /impeccable clarify

2. [P1] Table de relecture sans filtre par statut ni progression en lot

   • Pourquoi c'est important : Sur un document volumineux comptant plusieurs centaines de segments, il est fastidieux de retrouver les segments non validés. De plus, « Tout approuver » lance les requêtes en boucle sans retour visuel d'avancement.
   • Solution : Ajouter des onglets de filtrage (« Tous », « À relire », « Approuvés », « Modifiés ») et un compteur interactif sur le bouton d'approbation groupée (reviews/[jobId]/page.tsx).
   • Commande suggérée : /impeccable layout

3. [P2] Redondance entre la page Paramètres et l'onglet Préférences du Profil

   • Pourquoi c'est important : La page /dashboard/settings ne propose que le vidage de cache et une liste statique de formats, tandis que les vrais réglages (thème, langue de l'interface, langue cible par défaut) se trouvent dans /dashboard/profile?tab=preferences.
   • Solution : Fusionner ou rediriger proprement la navigation pour regrouper tous les réglages utilisateur en un point unique.
   • Commande suggérée : /impeccable distill

4. [P2] Sélecteur de glossaire trop chargé dans le volet de traduction

   • Pourquoi c'est important : L'intégration d'un formulaire complet d'ajout rapide de termes dans le panneau latéral de traduction alourdit la prise de décision avant lancement.
   • Solution : Concentrer le sélecteur sur le choix du glossaire et les alertes de compatibilité linguistique, en plaçant la gestion détaillée des termes dans la page dédiée aux glossaires (GlossarySelector.tsx).
   • Commande suggérée : /impeccable distill

5. [P2] Identifiants techniques bruts et suppression immédiate dans l'espace Équipe

   • Pourquoi c'est important : Les membres sont listés avec un extrait d'identifiant technique (m.user_id.slice(0, 8)) et le bouton corbeille supprime l'accès instantanément sans demander de confirmation.
   • Solution : Afficher l'adresse électronique du membre et ajouter une fenêtre de confirmation avant toute suppression (teams/page.tsx).
   • Commande suggérée : /impeccable harden

Drapeaux rouges par profil d'utilisateur

• Alex (Utilisateur intensif / Gestionnaire de localisation) : Absence de raccourcis clavier rapides pour valider et passer au segment suivant dans l'outil de relecture ; pas de champ de recherche textuelle rapide dans les segments traduits.
• Jordan (Premier usage) : Sur la page d'accueil, le lien du plan Starter construit l'adresse avec le nom traduit au lieu de l'identifiant technique ; risque d'incompréhension si le bouton Traduire est grisé sans explication (source = cible).
• Sam (Accessibilité et navigation au clavier) : Double barre de défilement imbriquée dans le menu déroulant de sélection des langues (LanguageSelector.tsx) ; présence d'émojis décoratifs bruts dans les messages d'avertissement de glossaire.

Observations complémentaires

• Dans landing-page.tsx, l'adresse du lien vers la tarification utilise le nom traduit du plan plutôt que son identifiant fixe (p.id).
• Dans glossaries/page.tsx, plusieurs classes utilisent des codes de couleurs bruts (comme #555555 ou #1A1A1A) au lieu des variables de thème de l'application.
• Dans LanguageSelector.tsx, le conteneur et la liste possèdent tous deux une hauteur maximale avec défilement automatique.

Questions stimulantes à considérer

1. La page « Paramètres » doit-elle être intégrée directement comme sous-section du profil ou enrichie de vrais paramètres par défaut pour les traductions (ex. moteur favori, préservation des images) ?
2. Dans l'espace de relecture, un mode d'édition en continu avec validation au clavier (Entrée / Tab) ne rendrait-il pas la validation des longs documents 5 fois plus rapide ?
3. Le formulaire d'ajout rapide de termes dans le sélecteur de traduction est-il souvent utilisé à cet endroit, ou mériterait-il d'être allégé au profit de la page Glossaires ?