Point - Curseur de comparaison d'images

Introduction

Présentation du Curseur d’Images Interactif – une fonctionnalité puissante qui permet aux utilisateurs de comparer deux images côte à côte grâce à un séparateur glissant et fluide. Que ce soit pour montrer des visuels avant-après, des variantes de design ou des comparaisons de produits, cet outil offre une expérience engageante et intuitive.

Personnalisez la poignée du curseur, la bordure, les couleurs et la position pour l’adapter à votre mise en page. Cette fonctionnalité permet une comparaison d’images fluide sur tous les appareils, y compris les écrans tactiles.

Compatible avec les formats PNG et JPG, le Curseur d’Images Interactif offre un moyen flexible et visuellement impactant de présenter des comparaisons en toute simplicité.

Prérequis

• Vous devez disposer à la fois de Point et Place dans votre licence pour accéder à cette fonctionnalité
• Votre utilisateur doit avoir des droits d’accès suffisants pour éditer des pages dans Point 

Comment activer

Pour ajouter la fonctionnalité du curseur, suivez ces étapes :

1. Dans Point, passez en mode édition sur la page où vous souhaitez ajouter le curseur d’images
2. Cliquez sur Curseur de comparaison comme montré ci-dessous pour ajouter le curseur d’images
   • 
3. Cliquez sur le symbole du curseur pour accéder aux paramètres du curseur d’images – comme montré ci-dessous
   • 
4. Dès que vous avez ajusté les paramètres, n’oubliez pas de cliquer sur enregistrer.

Comment utiliser

Pour utiliser le curseur d’images, il suffit de cliquer-glisser le bouton du curseur au milieu du cadre pour faire glisser entre les deux images comparées côte à côte. 

Exemples d’utilisation 

• Comparaisons Avant-Après
  • Exemple : Mettre en avant des mises à jour de branding comme des redesigns de logo ou des changements de palette de couleurs.
• Utilisation correcte vs. incorrecte
  • Exemple : Montrer des placements corrects et incorrects de logos ou des règles de contraste.
• Applications de couleur
  • Exemple : Comparer des schémas de couleurs primaires vs secondaires ou des designs accessibles vs non-accessibles.
• Ajustements typographiques
  • Exemple : Illustrer un crénage, une police ou une taille de fonte appropriés.
• Visuels haute qualité vs basse qualité
  • Exemple : Contraster des images haute résolution avec des images pixelisées ou de faible qualité.