Astuces
Un pitch deck que les investisseurs ouvrent vraiment
Un investisseur ferme votre PDF après trois slides et vous écrivez la relance à l'aveugle. Un lien vous montre où il a arrêté de lire.
3 min de lecture
Vos captures pleine page défilent dans un laptop 3D, vos écrans d'app se touchent sur un téléphone 3D. Un seul lien, ouvert partout, sans rien installer.
Par Franco Cirulli
Vous envoyez le lien du fichier et le client tombe sur un canevas de quarante frames. Impossible pour lui de savoir laquelle est la page d'accueil. Il clique quelque part, le curseur d'un collègue passe à l'écran, il ferme l'onglet. Il arrive à la réunion sans avoir rien vu, et les dix premières minutes servent à expliquer l'outil au lieu du design.
Le fichier de design est l'endroit où l'on travaille, pas celui où l'on regarde. Quelqu'un qui ne l'ouvre pas tous les jours a besoin d'une page qui se comporte comme une page. C'est exactement ce qu'est un mockup de site web dans i3Dify : vos captures posées sur l'écran d'un laptop 3D, derrière une seule URL, sans rien à installer.
Un rendu à plat recadre. Une landing page de 6000 pixels collée dans un cadre d'appareil est soit coupée à la ligne de flottaison, soit réduite jusqu'à rendre le texte illisible. Ici, l'image est ajustée à la largeur de l'écran et défile verticalement, comme la page dans un navigateur : tout le design se lit de haut en bas, en pleine largeur.
Les commandes sont séparées exprès. Faites glisser l'écran ou utilisez la molette, et la page défile. Faites glisser le fond, et le laptop pivote. Les flèches du clavier et le dock passent d'un écran à l'autre, et le compteur au-dessus du dock affiche le titre donné à chacun : Accueil, Tarifs et Paiement sont là où le client les attend quand vous menez la visite en direct pendant un appel.
Un mockup d'écrans d'application reprend la même idée sur un téléphone 3D, et c'est là que les hotspots servent le plus. Un hotspot est une zone cliquable de l'écran qui ouvre un lien. Vous cliquez sur un point, le bouton de paiement par exemple, et vous y associez l'écran suivant, la version en ligne, les specs ou un parcours enregistré. Le hotspot est ancré à l'image : il reste collé à son pixel quand le visiteur fait défiler, au lieu de rester figé sur un calque au-dessus.
Ouverts sur un vrai téléphone, là où un lien transféré se lit le plus souvent, ces hotspots se touchent du doigt. Un dossier d'exports en vrac devient un parcours que l'on suit avec son propre pouce. Deux limites méritent d'être dites. Il n'y a ni champ de formulaire ni état : c'est une visite guidée, pas un prototype. Et le défilement s'arrête en bas de l'écran en cours : on passe au suivant par le dock ou les flèches, jamais par accident au milieu d'un fil.
Importez une image par écran, placez-les dans l'ordre de la visite, donnez un titre à chacune, publiez. C'est tout le montage. Là où l'on se trompe, c'est à l'export : le viewer a besoin de la hauteur complète de la page, pas de ce qui tenait dans la fenêtre au moment de la capture.
Dans Chrome, l'option se trouve dans le menu de commandes des DevTools, sous Capture full size screenshot. Dans Figma, exportez la frame à sa hauteur réelle. Un PDF fonctionne aussi, chaque page devient un écran, mais sur le téléphone une page ajustée à la largeur ne remplit plus la hauteur : elle reste centrée avec des bandes au-dessus et en dessous au lieu de défiler.
Capturez en 1x, pas en 2x. Le viewer réduit l'image avant de la peindre sur l'écran 3D, donc les pixels en trop n'apportent rien et font seulement patienter la personne qui ouvre le lien. Ils grignotent aussi les 50 Mo de l'offre gratuite, et une série de longs écrans de dashboard y arrive plus vite qu'on ne le croit.
Remplacez les écrans dans l'éditeur après une revue, et le lien ne change pas. Celui qui dort dans la boîte mail du client et celui collé dans un doc il y a trois semaines fonctionnent toujours et montrent la version actuelle : personne ne revient avec des remarques sur un design déjà abandonné. Pendant la revue, le projet peut rester non répertorié ou protégé par un mot de passe, sur toutes les offres, y compris la gratuite.
Votre fichier de design, c'est pour travailler. Le lien, c'est pour la réunion, pour le transfert, et pour la décision prise trois jours plus tard sans vous dans la pièce.
Mettez votre prochaine série d'écrans sur un laptop et un téléphone.
Desktop Mockup affiche un laptop 3D et prend des captures en largeur desktop. Mobile Mockup affiche un téléphone 3D et prend des captures en largeur mobile. L'ordre des écrans, les titres, le défilement et les hotspots fonctionnent de la même façon dans les deux : choisissez selon vos captures. Il n'y a pas de tablette.
Des captures suffisent. Une image haute par écran, en PNG ou JPG, exportée à la hauteur complète de la page plutôt que recadrée sur la zone visible. Un PDF fonctionne aussi, une page par écran. Il n'y a pas d'import Figma.
Non. Le lien s'ouvre dans n'importe quel navigateur, sur ordinateur comme sur téléphone, sans compte et sans rien installer. Le même projet peut aussi s'intégrer en iframe dans un portfolio ou une page d'étude de cas.
En partie. Un hotspot peut mener à un autre écran, ouvrir un lien ou afficher une note, et il reste cliquable quand le lien est ouvert sur un téléphone. Il n'y a ni champ de formulaire ni état : considérez-le comme une visite guidée.
Oui. Un projet peut rester non répertorié, donc accessible par lien seulement et absent des moteurs de recherche, ou être protégé par un mot de passe. Les deux options existent sur toutes les offres, y compris la gratuite.
L'offre gratuite couvre 3 projets et 50 Mo, avec une petite pastille i3Dify dans un coin du viewer. Pro coûte 3 $ par mois, ou 24 $ par an : la pastille disparaît, et vous gagnez un domaine personnalisé et des statistiques.
Importez un PDF ou quelques images, choisissez un type de projet et partagez le lien. L'offre gratuite suffit pour essayer.
Créer un Desktop Mockup