Présenter des captures d’écran dans des maquettes de navigateur et d’appareil

Préparez la capture d’écran

Commencez par la capture la plus propre dont vous disposez. Supprimez les alertes temporaires, les données personnelles et les détails d’état accidentels avant de la placer. Gardez l’interface importante près du centre, car un cadre ou un effet de perspective peut réduire la zone lisible. Si vous présentez un parcours, choisissez un écran décisif ou composez une petite série avec la même logique de recadrage.

Utilisez un style navigateur lorsque le contenu est une page web ou une vue de type ordinateur. Utilisez un style téléphone ou tablette lorsque la disposition tactile et la lecture verticale sont centrales. Ces cadres sont décoratifs : ils n’ouvrent pas de navigateur, ne chargent pas d’URL et ne modifient pas la capture elle-même. Cette distinction vous aide à poser des attentes honnêtes pour l’image finale.

1. Choisissez une capture au sujet clair et retirez le contenu sensible.
2. Décidez si un cadre de navigateur, d’iPhone ou d’iPad explique le mieux le contexte.
3. Vérifiez que le texte et les commandes importants resteront visibles dans le cadre.

Placez le cadre et choisissez la scène

Choisissez un arrière-plan qui soutient la capture. Une couleur unie et calme convient à la documentation ; une photo douce ou une scène naturelle peut réchauffer une présentation produit. Placez la maquette avec assez d’espace autour d’elle pour voir le bord du cadre. Pour une fenêtre de navigateur, laissez la barre reconnaissable sans permettre aux commandes décoratives de rivaliser avec la page.

Gardez une perspective crédible. Une légère inclinaison peut ajouter de l’énergie, mais une rotation forte rend les petits textes difficiles à lire. Alignez la maquette sur la direction visuelle de l’arrière-plan. Un cadre incliné vers un espace libre paraît intentionnel ; un cadre dirigé vers un objet chargé semble à l’étroit.

À lire ensuite : comment ajouter un cadre d’iPhone à une capture d’écran

1. Choisissez un arrière-plan uni ou votre propre image, avec suffisamment de contraste.
2. Positionnez le cadre décoratif en laissant une marge autour de son bord extérieur.
3. Commencez par une version droite, puis comparez toute inclinaison à la taille finale de partage.

Vérifiez la lisibilité et la crédibilité

Faites un zoom arrière et demandez-vous ce que le spectateur remarque en premier. La capture doit rester le sujet, tandis que le cadre indique le type d’écran. Si l’arrière-plan domine, simplifiez-le ou réduisez son contraste. Si la capture disparaît, agrandissez la maquette ou choisissez une scène plus calme.

Inspectez les coins, le texte et les bords. Recadrer un cadre trop serré peut sembler accidentel ; laisser une bande étroite et irrégulière d’arrière-plan peut être plus gênant qu’un recadrage assumé. Conservez autant que possible les proportions originales des captures et évitez d’étirer une icône ronde ou une personne sur une photo.

Les styles de cadres et les conditions Pro peuvent changer selon les versions de l’app : vérifiez donc le panneau Mockups actuel dans l’app avant de préparer une série.

1. Vérifiez d’abord la hiérarchie, puis le texte et les bords du cadre.
2. Comparez le résultat en grand et à la taille utilisée dans une publication ou un article.
3. Ajoutez une courte légende à l’extérieur de la capture si le spectateur a besoin de contexte.

Corrigez les problèmes courants des maquettes

Si la capture paraît étirée, remplacez-la par la source au bon ratio et ajustez-la à nouveau. Si le texte est trop petit, recadrez la zone utile ou utilisez un cadre plus grand. Si le cadre et l’arrière-plan ont des couleurs proches, créez une séparation avec un autre arrière-plan ou un traitement de cadre plus sobre. Si l’image semble inclinée sans raison, revenez à un alignement droit.

Si l’arrière-plan personnalisé est chargé, ne masquez pas la capture sous une décoration abondante. Déplacez la maquette vers une zone plus calme, réduisez la concurrence visuelle ou choisissez une couleur plus simple. Exportez un test et inspectez le résultat réellement enregistré avant de l’envoyer à un client ou de le publier.

1. Corrigez le ratio avant de modifier l’échelle.
2. Améliorez la lisibilité par le recadrage et la hiérarchie avant d’ajouter de la décoration.
3. Prévisualisez une fois l’image enregistrée à sa taille réelle de destination.