Générateur de maquette de site avec vues mobile et bureau
Générateur de maquette de site
Générateur de maquette de site gratuit : wireframe + cadres d'appareil | We.Inc
Planifiez une page comme un wireframe avec vues bureau et mobile, ou déposez une capture d'écran dans un cadre navigateur, ordinateur portable ou téléphone. Exportez en PNG ou imprimez en PDF, gratuit, dans votre navigateur.
Deux outils en un. Le mode wireframe planifie une page : choisissez les sections, mettez-les dans l'ordre et comparez les mises en page bureau et mobile. Le mode cadre d'appareil présente un design terminé : importez une capture d'écran et placez-la dans une fenêtre de navigateur ou un cadre de téléphone pour une proposition ou un post social. Les deux exportent un PNG, et les deux s'exécutent dans votre navigateur. Votre capture d'écran n'est jamais importée sur un serveur.
Mode wireframe : cochez les sections dont votre page a besoin, déplacez-les vers le haut et le bas, et basculez entre bureau et mobile. Sur mobile, les colonnes s'empilent comme le font la plupart des sites responsives.
Exportez le wireframe en PNG, ou imprimez-le et choisissez Enregistrer en PDF.
Mode cadre d'appareil : importez une capture d'écran PNG, JPG ou WebP (jusqu'à 15 Mo et 8 000 pixels de côté). Choisissez un cadre navigateur ou téléphone, une couleur de fond et un libellé de barre d'adresse optionnel.
L'image est dessinée sur un canevas dans votre navigateur et exportée en PNG à deux fois la résolution d'écran.
Quand la structure est bonne, envoyez le plan de sections au créateur We.Inc comme briefing de départ.
Commencez par la section principale : dites ce que vous faites et pour qui en une ligne.
Mettez la preuve (avis, logos, exemples) près du premier bouton, là où les gens décident s'ils vous font confiance.
Vérifiez d'abord le wireframe mobile. La plupart des visiteurs d'un site de petite entreprise arrivent sur téléphone.
Pour les cadres d'appareil, prenez la capture d'écran à la largeur attendue par le cadre : environ 1440 pixels pour un navigateur et 390 pour un téléphone.
Étiquetez les maquettes comme maquettes quand vous les partagez, pour que personne ne confonde un plan avec un site en ligne.
Questions fréquentes
Quelle est la différence entre un wireframe et une maquette ?
Un wireframe est un plan en boîtes grises de ce qui va où. Une maquette montre l'apparence finie, souvent dans un cadre d'appareil. Cet outil fait les deux, dans des modes séparés, et étiquette chaque export.
Ma capture d'écran est-elle importée sur un serveur ?
Non. La capture d'écran est lue et dessinée dans votre navigateur. Rien n'est envoyé à We.Inc ni à personne d'autre.
Puis-je capturer une capture d'écran d'un site en ligne ici ?
Non. Capturer un autre site nécessite un serveur exécutant un navigateur, que cet outil gratuit n'a pas. Prenez la capture vous-même (les outils de développement de votre navigateur peuvent capturer une page entière) et importez-la.
Puis-je exporter un PDF ?
Oui. Utilisez Imprimer et choisissez Enregistrer en PDF comme imprimante. L'export PNG vous donne un fichier image.
Le générateur de maquette de site est-il gratuit ?
Oui. Il n'y a pas d'inscription, de filigrane ou de limite.
Planifiez sur mobile, présentez sur bureau
Les mises en page qui paraissent équilibrées sur un grand écran se transforment souvent en long défilement sur téléphone : trois colonnes de fonctionnalités deviennent trois blocs empilés, et le tableau de prix pousse le formulaire de contact loin en bas. Basculer le wireframe en mobile le montre tôt, pendant que déplacer une section n'est encore qu'un clic.
Les cadres d'appareil sont pour l'autre bout du travail : montrer à un client ou une audience sociale à quoi ressemble une page finie. Une simple capture d'écran dans un cadre propre suffit généralement.