CodeKitHubEn quoi consiste cet outil ?
Le Générateur de Story Facebook recrée l'apparence verticale et plein écran d'une véritable Story Facebook — anneau de profil, en-tête avec nom et horodatage, une photo de fond ou un dégradé, un texte superposé en gras, et la bande de barre de réponse en bas.
Il ne doit jamais servir à fabriquer de fausses preuves frauduleuses, à harceler ou diffamer quelqu'un, ni à usurper les publications ou Stories réelles d'une personne réelle — cela peut être illégal selon votre juridiction.
Tout est généré localement dans votre navigateur à l'aide de l'API Canvas HTML ; rien n'est jamais envoyé à un serveur.
Pourquoi l'utiliser ?
- Vous enregistrez un cours sur le marketing des réseaux sociaux et avez besoin d'une Story exemple réaliste pour expliquer le fonctionnement du texte superposé et de la barre de réponse, sans dépendre d'une vraie capture d'écran de l'appli.
- Vous concevez la maquette d'une fonctionnalité Story pour votre propre appli et avez besoin d'un aperçu vertical crédible à montrer à l'équipe avant de la coder réellement.
- Vous voulez faire une blague visuelle entre amis en simulant une Story absurde, avec un texte qui n'est drôle que s'il ressemble à une vraie Story Facebook.
- Vous préparez une diapositive pour une conférence sur le design d'interface mobile et avez besoin d'un exemple de format vertical 9:16 avec anneau de profil et horodatage, sans utiliser une vraie capture d'écran soumise au droit d'auteur.
- Vous montez une étude de cas de portfolio sur la refonte des Stories et générez une version « avant » fictive à comparer avec votre proposition, sans exposer le contenu réel d'un quelconque utilisateur.
- Tout se passe via Canvas dans votre navigateur, vous pouvez donc téléverser une image de fond de test sans qu'elle soit stockée sur un serveur.
Mode d'emploi
- Définissez le nom, l'horodatage et la couleur de l'avatar (ou téléversez une photo).
- Choisissez un dégradé d'arrière-plan ou téléversez votre propre image.
- Saisissez le texte superposé qui apparaît près du bas de la Story.
- Observez l'aperçu vertical se mettre à jour en direct, puis cliquez sur « Download PNG » pour enregistrer l'image.
Exemple
Entrée
Nom : « Sam Whitfield » · Heure : « 4h » · Arrière-plan : dégradé bleu à rose · Texte : « Café du dimanche matin ☕ »Résultat
Une image PNG de 360×640 au style d'une véritable Story Facebook : avatar à anneau de profil, nom et horodatage, arrière-plan dégradé plein cadre, texte superposé centré en gras, et une bande de barre de réponse avec une icône cœur en bas.L'image se génère instantanément dans le canevas d'aperçu en direct et se télécharge en un clic — aucune attente, aucun aller-retour serveur.
Ce que vous pouvez personnaliser
- Nom du profil, horodatage, et couleur ou photo de l'avatar.
- L'arrière-plan : un dégradé à deux couleurs ou une image téléversée.
- Le texte superposé en gras affiché près du bas de la Story.
- Les détails de mise en page correspondant au style visuel réel des Stories Facebook.
Utilisation responsable
Ce générateur existe pour faciliter la création d'images de maquette clairement fictives à des fins d'humour, de narration et de design. Si vous partagez une image créée avec cet outil, envisagez d'ajouter un contexte pour que les spectateurs comprennent qu'il ne s'agit pas d'une véritable Story.
Champs disponibles dans la Story
Le canevas vertical 360×640 reproduit chaque élément visuel d'une vraie Story Facebook, de haut en bas.
| Champ | Ce qu'il contrôle | Exemple |
|---|---|---|
| Nom du profil | Le texte à côté de l'anneau d'avatar, en haut | Sam Whitfield |
| Horodatage | Le petit texte à côté du nom | 4h |
| Avatar | Le cercle avec anneau de profil — couleur d'initiales ou photo téléversée | Initiales « SW » |
| Arrière-plan | L'image ou dégradé plein cadre derrière le texte | Dégradé bleu à rose |
| Texte superposé | Le grand texte en gras centré près du bas | Café du dimanche matin ☕ |
Foire aux questions
Est-ce légal ou éthique d'utiliser cet outil ?
L'outil lui-même est légal pour le divertissement, les maquettes, les présentations et le travail de design. Ce qui n'est ni légal ni éthique, c'est d'utiliser l'image générée pour tromper quelqu'un. Merci de n'utiliser cet outil qu'à des fins clairement fictives ou illustratives.
L'outil envoie-t-il mon contenu quelque part ?
Non. Tout ce que vous saisissez ou téléversez reste dans la mémoire de votre navigateur et est dessiné directement sur un élément canevas avec JavaScript. Le PNG est généré et téléchargé sur votre appareil — rien n'est jamais envoyé à un serveur.
Puis-je téléverser ma propre photo comme arrière-plan de Story ?
Oui — cliquez sur le lien de téléversement sous « Video background » pour utiliser votre propre image comme arrière-plan plein cadre de la Story à la place du dégradé.
Quelle taille d'image est exportée ?
Le PNG exporté fait 360×640, correspondant au format vertical 9:16 utilisé par les véritables Stories Facebook.
Dois-je utiliser cet outil ou un autre générateur de maquette Facebook ?
Si vous maquettez une Story verticale plein écran, utilisez ce générateur de Story. Si vous avez besoin d'un fil de commentaires, utilisez le Générateur de commentaires Facebook ; si vous avez besoin d'une page de profil complète avec photo de couverture et bio, utilisez le Générateur de profil Facebook.
Pourquoi l'image exportée est-elle en 360×640 et non une résolution plus élevée comme 1080×1920 ?
360×640 conserve le même format vertical 9:16 qu'utilise Facebook, mais à une résolution plus légère pensée pour un aperçu rapide et un téléchargement léger. Si vous avez besoin d'un fichier plus grand pour l'impression ou l'affichage plein écran, vous pouvez agrandir le PNG avec n'importe quel éditeur d'image sans distorsion, puisque le rapport d'aspect est conservé.
Puis-je mettre le texte superposé sur deux lignes ?
Oui, si vous saisissez un saut de ligne dans le champ de texte, l'outil le respecte et répartit le texte centré sur plusieurs lignes, comme pour un texte long dans une vraie Story.
L'icône cœur dans la barre de réponse est-elle interactive ?
Non, elle est purement décorative : elle fait partie de la maquette visuelle pour ressembler à une vraie Story, mais ce n'est pas un bouton fonctionnel et elle ne recueille aucune interaction.
Puis-je utiliser ma propre image verticale en fond sans qu'elle soit recadrée bizarrement ?
L'outil ajuste l'image téléversée au canevas 360×640 en plein cadre ; pour de meilleurs résultats, utilisez une photo déjà au format vertical ou proche de 9:16, afin que le recadrage automatique affecte le moins possible la composition d'origine.