Ce guide explique le comportement du customizer sur un téléphone ou une tablette, et ce que les marchands doivent vérifier sur un petit écran.
La mise en page sur téléphone
Sur un écran étroit, l’aperçu se place au-dessus des contrôles de personnalisation. Quand le client fait défiler le formulaire, l’aperçu peut se réduire en bandeau ; en remontant vers le haut, il se déploie de nouveau. Vérifiez la création et les champs obligatoires avant de continuer.
Le formulaire utilise de grands contrôles tactiles, avec notamment des boutons moins et plus distincts pour les nombres. Testez les libellés longs, les menus ouverts et le clavier à l’écran sur les appareils que vos clients utilisent.
La barre Ajouter au panier reste fixée en bas de l’écran. Quand le client fait défiler un long formulaire, la barre d’action ne disparaît pas. Il peut terminer sa création et l’ajouter au panier depuis n’importe quel endroit du formulaire.
Si vous voulez voir comment fonctionnent en général les champs du formulaire et l’aperçu, lisez comment un client personnalise un produit et l’aperçu en direct.
Appareil photo et recadrage tactile
Le téléversement de photos est pensé pour les téléphones. Quand un client touche la zone de téléversement sur un téléphone, l’appareil peut ouvrir l’appareil photo pour qu’il prenne une photo sur place. C’est activé par défaut. Vous pouvez désactiver l’appareil photo champ par champ si vous préférez n’accepter que les fichiers de la photothèque.
Une fois la photo reçue, un champ image en mode recadrage ouvre une fenêtre de recadrage. Elle réagit au toucher. Le client fait glisser du doigt les poignées d’angle pour cadrer la photo, puis applique le recadrage. Un bouton Changer la photo lui permet de recommencer avec une autre image.
Pour lire l’aperçu de plus près, le client peut pincer et zoomer avec son navigateur. L’aperçu mesure l’espace dont il dispose et adapte la création à l’écran. Quand le téléphone passe du mode portrait au mode paysage, l’aperçu se redimensionne à la nouvelle forme.
Les champs numériques méritent une précision. Les sélecteurs natifs des téléphones sont minuscules et faciles à rater. À la place, les champs numériques affichent un bouton moins et un bouton plus de chaque côté de la valeur. Chaque bouton est une grande zone de toucher : le client change une quantité d’un geste net, sans chercher une petite flèche.
Pour en savoir plus sur le téléversement, notamment les types de fichiers et les contrôles de haute résolution, consultez téléverser une photo.
Le customizer fonctionne-t-il aussi sur tablette ?
Oui. La mise en page responsive s'adapte à la largeur de l'écran : les tablettes ont des contrôles à taille tactile et le même comportement d'aperçu que les téléphones.
Un client peut-il prendre une photo avec l'appareil photo au lieu de téléverser un fichier ?
Oui, sur téléphone ou tablette. Toucher la zone de téléversement peut ouvrir l'appareil photo. C'est activé par défaut, et vous pouvez le désactiver champ par champ.
Pourquoi les champs numériques affichent-ils des boutons plus et moins ?
Les boutons offrent une grande zone de toucher fiable sur écran tactile, plus facile à utiliser que le petit sélecteur numérique natif.
Que devient la création quand le téléphone pivote ?
L'aperçu mesure de nouveau son conteneur et redimensionne la création à la nouvelle forme de l'écran, pour qu'elle reste entièrement visible.
Suite
Découvrez ce que voient les clients de bout en bout dans comment un client personnalise un produit.