Capture avant-après
Comment fonctionnent les paires de captures avant-après, où elles sont utilisées et comment réaliser des comparaisons efficaces.
Une capture avant-après est une paire d'images du même sujet, l'une prise avant une modification et l'autre après. La paire s'affiche côte à côte, empilée, ou en superposition avec un curseur, pour que la différence soit visible d'un coup d'œil.
Une comparaison équitable ne fait varier que la modification. Les deux images doivent avoir la même zone de capture, la même taille de fenêtre d'affichage, la même densité de pixels, la même position de défilement et le même état de l'application, avec par exemple le même compte connecté et les mêmes données de test. Si la seconde image est décalée de quelques pixels, le contenu inchangé apparaît aussi comme différent dans une comparaison pixel par pixel.
Pourquoi le avant-après compte
Une capture unique montre un état. Une paire montre un changement, ce que les relecteurs, les clients et les responsables doivent généralement évaluer. Elle conserve aussi l'aspect de l'écran avant la modification, ce qui est difficile à recréer plus tard.
Où les captures avant-après sont utilisées
- Notes de version et journaux des modifications qui montrent un écran repensé.
- Rapports de bogue et confirmations de correction.
- Revues de design et d'accessibilité, par exemple une correction de contraste.
- Rapports clients sur les mises à jour d'un site.
Réaliser des paires avant-après efficaces
- Capturer l'image « avant » en premier, avant la livraison de la modification.
- Noter les réglages : taille de la fenêtre, zone, niveau de zoom, thème et données de test.
- Capturer l'image « après » avec les mêmes réglages.
- Exporter les deux images dans le même format et les présenter avec des légendes identiques.
Pour les pages web, lancez deux fois Website Capture avec la même URL et les mêmes réglages de Device et Area. Pour les applications de bureau, utilisez la source Custom Area dans Auto Capture. Le sélecteur se rouvre sur la zone enregistrée, si bien que la seconde capture utilise le même rectangle.
Erreurs courantes
- Comparer une capture Retina avec une capture 1x. Chaque pixel a une taille différente.
- Modifier le zoom du navigateur, le thème ou la taille de la fenêtre entre deux captures.
- Oublier de capturer l'état « avant » jusqu'à ce que la modification soit en production.
- Recadrer les deux images de manière différente.
Vous refaites les mêmes captures encore et encore ?
Conservez une liste d'URL enregistrée dans l'automatisation des captures de sites web et relancez-la avant et après chaque version.
Questions fréquentes
Faut-il utiliser le JPG ou le PNG pour les paires de comparaison ?
Le PNG. La compression avec perte ajoute de petites différences qui apparaissent dans une comparaison pixel par pixel.
Comment repérer de petites différences ?
Chargez les deux fichiers dans Compare Images pour mettre en évidence les pixels modifiés.
Sources
Ressources associées
- Options de Website Capture : réglages d'appareil, de zone et d'attente.
- Sources de capture : réutiliser une Custom Area enregistrée.
- Stitch Screenshots : assembler deux images en un seul fichier.
Vous prenez toujours les mêmes captures d'écran ?
Temposhot capture un écran, une fenêtre ou une zone à intervalles programmés et exporte l'ensemble en PDF, en images, en ZIP ou en MP4. Les outils gratuits du navigateur ne permettent de traiter qu'une image à la fois.
Ressources associées
Termes associés
- Comparaison de captures d'écranCe qu'est la comparaison de captures d'écran, le fonctionnement de la comparaison visuelle et les usages en assurance qualité.
- Test de régression visuelleCe qu'est le test de régression visuelle, comment la comparaison de captures détecte les bogues d'interface et les pièges courants.
- Superposition d'imageUne superposition est tout élément placé au-dessus d'une image : texte, flèches, logo ou cadre d'appareil. Découvrez les principaux types, le fonctionnement de la transparence et les erreurs courantes.
- Preuve par capture d'écranCe qu'est une preuve par capture d'écran, où elle est utilisée dans les contextes juridiques et d'assurance qualité, et comment la réaliser correctement.
- Flux de travail de capture d'écranCe qu'est un flux de travail de capture d'écran et comment construire un processus reproductible, de la capture à la livraison.
- Surveillance de site webCe que signifie la surveillance de site web par captures d'écran, comment les captures planifiées suivent les changements visuels et les erreurs courantes.