Essai couleurs
Cette page sert uniquement à voir des idées avant une vraie mise en page ou un fichier d'impression définitif. Explorez tranquillement : rien n'est enregistré automatiquement — notez simplement ou capturez ce qui vous plaît pour nous le faire valider ensuite.
Comment utiliser cette page, étape par étape
Prépa visuelle sur le fichier image (PNG)
D'abord, choisissez un fond de page : ainsi vous voyez tout de suite si le logo tient sur un site clair, un fond sombre ou une ambiance bois / métal. Le logo affiché ci‑dessous est celui utilisé tel quel en communication (fichier bitmap). Les boutons Jaune, Rouge, Rouge doré donnent trois réglages d'ensemble en un clic ; en dessous, les curseurs permettent d'affiner comme sur un léger filtre photo sur l'image entière ( « Logo d'origine » remet tout à zéro).
Voir le fichier vectoriel (SVG) avec les bonnes touches de couleur
Un peu plus bas sur cette même page vous trouvez le bloc « illustration vectorielle ». Sur ce dessin technique, le texte SERVICES, les éléments de maison et surtout l' accent RÉNOVATION / toit peuvent prendre une teinte d' inspirations choisie sur la planche de vignettes tout en bas : lorsque vous cliquez une miniature, ce sont ces couleurs‑là qui se répercutent ici aussi (filtres inclus). Les fines zones en gris ou en image bitmap dans le fichier ne changent pas toutes avec un simple clic — c'est normal.
Parcourir la planche d'inspirations (dégradés, métaux, bois)
La grande grille de vignettes noir est votre catalogue d'idées. Les pastilles en haut ( Dégradés, Textures or/ argent, Bois…) réduisent la liste aux familles qui vous intéressent. Une vignette entourée de couleur vive est celle sélectionnée momentanément ; utilisez‑la aussi pour le bloc « bicolore » un peu au‑dessus de la grille, si vous envisagez un logo à moitié clair ( partie gauche) et moitié colorée ou métallique (partie droite). Le curseur sur la ligne de découpe sert uniquement à repositionner cette limite gauche / droite dans l'aperçu — ce n'est pas encore la découpe print finale ; avec un fichier propre Illustrator on ira plus précis.
Ce dont nous avons besoin de votre côté
Quand un rendu vous convient (fond, vignette accent, ambiance sur le PNG), indiquez‑nous le nom de la vignette, ou envoyez‑nous une capture d' écran — nous retrouverons les mêmes paramètres côté production. Pour un résultat d' imprimeur tout à fait figé (contours blancs exacts séparément des couches couleur), il pourra encore falloir nous confier ou valider un export maquette depuis Illustrator ; cette page vous aide surtout à trancher l'humeur des couleurs avant cette étape.
Commencez ici : même fond et mêmes réglages que pour le bloc SVG plus bas lorsque vous ajustez les curseurs.
Fond de page
Accords rapides
Réglages fins
Affinez le rendu du PNG (et du SVG un peu plus bas) : chaque mouvement est instantané ; prenez le temps d'observer sur le fond que vous venez de choisir.
Illustration vectorielle (SVG source)
Résumé tout près du visuel : le fichier illustration-sp-renovation.svg est le dessin qui servira ensuite à exporter en haute précision. SERVICES, maison et cheminée suivent leur propre logique ; le mot RÉNOVATION et le toit prennent aujourd'hui la teinte de la vignette sélectionnée dans la planche plus bas ( même réglages de filtre que le PNG ci‑dessus). Détail : le contour du P et quelques aplats restent encore en niveaux de gris ou en petites images — d' où l'intérêt de combiner cet aperçu avec vos retours précis après coup.
Planche variantes
Voici où vous faites vos choix d'humeur. Chaque petite image représente une façon de « remplir » graphiquement la silhouette du logo (même silhouette que votre PNG officiel) : dégradés très vifs, tons terre, effets métal ou texture bois — comme une planche maquette noir qu'on feuillette avec une graphiste ou un imprimeur pour se mettre d' accord sur la direction créative.
- À savoir avant de comparer deux idées bien différentes : pour un résultat final ultra précis sur des contours blancs nets détachés du texte orange et du « P » uniquement à la bonne nuance (exactement comme sur certaines présentations de marque très figées), nous utilisons en production des masques préparés dans Illustrator ou équivalent professionnel ; ce que vous voyez ci‑dessous reste un aperçu web très utile mais pas encore le fichier destiné à la presse finale.
- Bloc bicolore — si vous envisagez un logo à moitié clair métal et moitié couleur forte, passez aussi par le (repère visuel : découpage gauche / droite réglable au curseur).
À faire vous‑même ici : cliquez simplement une miniature — elle se surligne. Celle‑là pilote aussi l' accent coloré dans le bloc bicolore et sur le fichier SVG présenté plus haut sur cette page ; en ce moment : Jaune vif SP. Faites défiler vers le haut de la page si vous voulez revoir cette même ambiance sur un autre fond avant de choisir une autre vignette.
Aperçu bicolore (approximatif)
Utilisez ce bandeau si vous projetez : à gauche un rendu très clair (type structure blanche ou métal léger) ; à droite la couleur ou la texture forte choisie sur la planche ; la ligne entre les deux peut être déplacée à la souris / au doigt tant que vous réglez les pourcentages. Rien n' impose encore la position exacte des fonds perdus lors d'un futur fichier d' imprimeur — c'est un outil de discussion.
47 variantes listées ci‑dessus. Export SVG génératif : npm run generate:illustration-variants.