Image Avant/Après
Superposez 2 photos de manière millimétrée.
Idéal pour certifier qu'un client a fondu post-régime.
📷 Modèle (Avant)
✨ Cible (Après)
Aperçu
Utile pour moduler l'axe entre deux états de photo sans effort de montage. Parfait pour vérifier un coup de pinceau, ou vendre le sérieux de son opération à la chirurgie aux clients.
Ajustez l'axe et fusionnez l'ensemble sous Canvas HTML5 pour sceller l'échange en guise de preuve via format PNG.
Comment utiliser
Aligner les Médias
Glissez physiquement le modèle avant, puis cible après.
Manier la Glissière
Prenez contrôle du stick blanc central en maintenant le Clic souris dessu.
Preuve Photographique
Frappez Sauver Image pour encrer le visuel découpé en dure sur le Disque Dur.
Glossaire
- Le Avant / Après
- Présentation visuelle comparative confrontant l'état misérable préalable d'un patient à sa réussite (Post régime/ Post opération). La preuve vivante du labeur.
- Le Glissoire (Slider)
- Le dispositif blanc doté d'une poignée pour forcer le code Canvas à découper à de très hautes fréquences deux calques.
- Moteur Canvas API
- Interface de rendu brut du W3C. La couche 2D permet d'outrepasser le html pour dicter des géométries mathématiques sans serveur.
- API Pointer Events
- Une API Web qui gère uniformément la saisie à la souris, au toucher et au stylet. Utilisée pour implémenter le comportement de glissement du curseur sur tous les appareils.
- Découpage (Clipping)
- Restriction de la zone de dessin à une forme spécifique. Dans les curseurs avant/après, le canevas est divisé à la position du curseur avec chaque image d'un côté.
- Ratio d'aspect
- Le rapport entre la largeur et la hauteur d'une image. Les deux images doivent avoir le même ratio d'aspect pour que la comparaison fonctionne correctement.
- PNG (Portable Network Graphics)
- Un format d'image sans perte, sans dégradation de qualité lors de l'enregistrement. Prend en charge la transparence. Utilisé comme format d'exportation.
- WebP
- Un format d'image moderne par Google offrant des tailles de fichier plus petites que JPEG et PNG avec une qualité comparable. Pris en charge comme format d'entrée.
FAQ
- Q.Que se passe-t-il si les deux images ont des tailles différentes ?
- Les deux images sont automatiquement redimensionnées aux mêmes dimensions pour la comparaison (en conservant le ratio d'aspect).
- Q.Puis-je exporter un PNG à la position actuelle du curseur ?
- Oui. Appuyez sur « Sauvegarder PNG » pour enregistrer l'image exactement telle qu'elle apparaît dans la comparaison.
- Q.Puis-je masquer les étiquettes AVANT/APRÈS ?
- Oui. Décochez l'option « Afficher les étiquettes » pour les masquer.
- Q.Prend-il en charge les images portrait/paysage ?
- Oui. Les deux orientations sont prises en charge, et vous pouvez basculer entre les directions de comparaison horizontale et verticale.
- Q.Les images sont-elles envoyées à un serveur ?
- Non. Tout le traitement utilise l'API Canvas localement dans votre navigateur. Aucune donnée d'image n'est envoyée à l'extérieur.
- Q.Quels formats d'image sont pris en charge ?
- JPEG, PNG, WebP, GIF (statique) et tout autre format pris en charge par votre navigateur.
- Q.Le curseur fonctionne-il sur les smartphones ?
- Oui. Il prend entièrement en charge la saisie tactile — il suffit de glisser votre doigt vers la gauche ou la droite sur la zone de comparaison.
- Q.Puis-je comparer plusieurs paires d'images à la fois ?
- Actuellement, une paire à la fois. Exportez chaque comparaison au format PNG, puis chargez de nouvelles images pour la comparaison suivante.
Cas d'utilisation
Restauration Historique
Imprimez le PNG pour valider le miracle d'une oeuvre abimée puis restaurée avec panache.
Génie Civil
Exposez à la mairie le bienfait d'un rond-point sur la gestion locale des flux.
Diététique Pure
Appuyer concrètement visuellement ce fameux déficit calorique imposé par votre Coach de pôle.
Paysagisme
Confrontez la friche hideuse initiale à la beauté d'un aménagement zen par terre de bruyère.
Envoyer des commentaires
Faites-nous part de vos réflexions pour nous aider à améliorer l'outil.
Les commentaires sont temporairement suspendus
Le serveur est occupé ou la protection anti-spam est active. Veuillez réessayer plus tard.