Comment créer un mockup à partir d'une capture d'écran (3D et vidéo)

Pour créer un mockup, il faut une capture d'écran et un logiciel qui la place dans un appareil. Photoshop avec un PSD tout prêt fonctionne, un logiciel 3D comme Blender aussi, et il existe des apps faites exprès. Nous utilisons ici Mockup Center, mais les deux premières étapes sont les mêmes quel que soit l'outil.

Mis à jour 2026-11-02 · 3 min de lecture

1. Partir d'une capture propre

C'est la capture qui compte le plus. Une image floue gâche la plus belle scène 3D.

  • Faites-la sur l'appareil ou dans le simulateur, en pleine résolution. Pour un iPhone 17 Pro, c'est 1206 × 2622 pixels.
  • Nettoyez la barre d'état. Le simulateur Xcode affiche 9:41 et une batterie pleine ; le mode démo d'Android fait de même.
  • Mettez du vrai contenu. Le lorem ipsum et les listes vides donnent un air inachevé.

Pour un site, capturez le premier écran plutôt que la page entière : l'appareil n'en montre de toute façon que la partie visible.

2. Décider de ce que vous fabriquez

La même capture peut donner trois choses, et ce choix guide la suite :

  • une image fixe (App Store, site, diapositives) ;
  • une courte vidéo (lancement, Reels, aperçu App Store) ;
  • votre design dans une vraie photo (réseaux, portfolio).

Faire les trois dans trois logiciels prend du temps. Nous avons conçu Mockup Center pour que tout se fasse dans la même app.

3. Choisir l'appareil et la scène

Prenez l'appareil sur lequel votre app tourne vraiment. Une app iOS sur un téléphone Android, c'est une petite erreur, mais on la remarque. Mockup Center propose 65 appareils, dont iPhone, Samsung Galaxy, Google Pixel, iPad, MacBook, iMac et Apple Watch, tous sans logo.

Les modèles arrivent avec la lumière, l'angle de caméra et le mouvement déjà réglés. Pour aller vite, partez de là et changez ce qui ne vous plaît pas.

4. Déposer la capture

Glissez l'image sur l'appareil et elle remplit l'écran. Déposez-en plusieurs à la fois et chacune se place sur le même appareil, dans la même scène. Pour six captures App Store, c'est un vrai gain de temps.

Pour une vidéo, déposez un enregistrement d'écran de la même façon. Il se lit à l'écran pendant que l'appareil bouge.

5. Angle, lumière et fond

De petits réglages changent beaucoup :

  • L'angle : une légère rotation est plus vivante qu'une vue de face. Entre 15 et 25 degrés, ça marche presque toujours.
  • La lumière : tournez la lumière principale et l'ombre tourne avec. Une ombre vers l'arrière et vers le bas paraît la plus naturelle.
  • Le fond : une couleur unie ou un dégradé doux ne concurrence pas l'écran. Une teinte claire de votre couleur de marque fonctionne bien.

6. Ajouter du mouvement (pour la vidéo)

Choisissez des animations dans le menu ; chacune commence où la précédente s'arrête. Pour raccourcir un clip, tirez son bord sur la timeline. Si les modèles ne suffisent pas, posez vos images clés sur l'appareil et la caméra.

Prenez du 9:16 pour Reels et TikTok, du 16:9 pour YouTube et votre site. Les deux sortent du même projet.

7. Exporter

  • App Store et Google Play : PNG ou JPEG avec fond. Les stores refusent les images transparentes.
  • Sites et diapositives : PNG transparent, pour que l'appareil se pose directement sur la page.
  • Vidéo : MP4. Si elle part dans un logiciel de montage, ProRes 4444 ou WebM transparent.

Mockup Center exporte jusqu'en 8K et télécharge plusieurs images d'un coup dans un ZIP.

Des questions ?

Une capture d'écran.
Il n'en faut pas plus.

Gratuit pour Mac. Apple Silicon.

Version web et plugin Figma bientôt.