Customize Text

Dans cet article, nous allons explorer toutes les options pour créer et ajouter du texte dans l'application OptiSigns Designer.

• Ajouter du texte
• Modifier le texte
• Options d'élément supplémentaires
  • Polices
  • Couleurs
  • Style de texte
  • Lien
  • Paramètres
  • Effets
  • Animer
  • Position
  • Verrouiller et copier le style

Ajouter des éléments de texte à un design est simple, mais avec Designer, il existe de nombreuses options pour faire vraiment ressortir vos mots.

Pour en savoir plus sur les éléments de base de Designer, consultez notre guide Premiers pas avec Designer.

Ajouter du texte

L'option Texte vous permet d'insérer du texte dans le design.

Choisir Texte dans le menu supérieur reflétera votre choix dans le menu latéral et l'ouvrira pour plus d'options :

Cliquer sur Ajouter une zone de texte ou l'une des options de texte prédéfinies ajoutera une zone de texte à la vue Designer :

Modifier le texte

Double-cliquer ou sélectionner le texte vous permet de saisir du texte directement.

Enfin, cliquer une fois sur la zone d'élément du texte, puis maintenir le bouton de la souris enfoncé et faire glisser permet de repositionner le texte.

Lorsqu'il est sélectionné, le texte lui-même dispose d'un ensemble complet d'options :

• Dupliquer - Crée une copie exacte du texte sélectionné
• Supprimer - Supprime le texte sélectionné du design
• Plus
  • Copier - Copie le texte sélectionné pour être collé plus tard
  • Copier le style -
  • Coller - Colle l'élément du presse-papiers dans le texte
  • Dupliquer - Crée une copie exacte du texte sélectionné
  • Ajouter un composant -
  • Supprimer - Supprime le texte sélectionné du design
  • Calque - Options pour changer le calque du texte sélectionné
    • Avancer - Fait monter le texte sélectionné d'un calque
    • Mettre au premier plan - Amène le texte sélectionné au calque supérieur
    • Reculer - Fait descendre le texte sélectionné d'un calque
    • Mettre à l'arrière-plan - Amène le texte sélectionné au calque inférieur
  • Aligner les éléments - Options pour changer l'alignement du texte sélectionné
    • Gauche
    • Centre
    • Droite
    • Haut
    • Milieu
    • Bas
  • Lien - Ajouter une URL au texte sélectionné.
  • Animer - Ajouter une animation au texte sélectionné.

Options d'élément supplémentaires

Cliquer sur le texte modifie le menu supérieur :

Le menu supérieur a des options supplémentaires :

Polices

Cliquer sur l'option Police (par défaut, cela affichera la police comme Roboto) ouvrira la section Polices dans le menu latéral.

Designer dispose de centaines d'options de police, avec Google Fonts offrant des poids de police sélectionnables. Cliquer sur l'une d'elles la sélectionnera et fournira des options pour son affichage :

La taille de police peut être modifiée en cliquant sur les options '-' ou '+', ou en cliquant sur le numéro de taille de police.

Cliquer sur le numéro de taille de police vous permet de choisir parmi plusieurs tailles de police prédéfinies, ou d'entrer une taille personnalisée.

Nous proposons également des polices personnalisées via le kit de marque.

Couleurs

Sélectionner l'option Couleurs ouvre la section Couleurs dans le menu latéral.

Ici, choisissez entre les couleurs prédéfinies, les couleurs déjà utilisées dans ce design, ou via l'option Sélecteur de couleurs :

Sélecteur de couleurs

1. Sélecteur de couleur
2. Couleur actuellement sélectionnée / Outil pipette
3. Curseur de couleur
4. Curseur d'opacité/transparence
5. Entrée de code couleur
6. Commutateur de code - Basculer entre les codes couleur hexadécimaux, RGB et HSLA
7. Couleurs précédemment utilisées

L'outil pipette vous permet de choisir n'importe quelle couleur facilement.

Style de texte

Sélectionner Gras, Italique, Souligné ou Barré appliquera ces qualités au texte sélectionné. Ces effets peuvent être superposés et utilisés dans n'importe quelle combinaison.

Casse du texte

Sélectionner Casse du texte ouvrira un sous-menu :

Ici, vous pouvez choisir entre différentes casses de lettres pour l'affichage :

• MAJUSCULES - Permet de taper exclusivement en majuscules.
• minuscules - Permet de taper exclusivement en minuscules.
• Casse de phrase - Formate automatiquement le texte en casse de phrase.
• Casse de titre - Formate automatiquement le texte en casse de titre.

Alignement

Sélectionner l'option Alignement ouvrira un autre sous-menu :

Ici, choisissez entre l'alignement Gauche, Centre, Droite ou Justifié.

Espacement

Sélectionner l'option Espacement ouvrira encore un autre sous-menu :

Ici, vous pouvez personnaliser l'espacement entre vos lettres et vos lignes.

Lien

Sélectionner l'option Lien vous permet de transformer le texte en un élément interactif, principalement utilisé pour les kiosques. Cela ouvrira la section Options de lien dans le menu latéral :

Cliquer sur Ajouter un lien vous invitera à entrer une URL ou sélectionner un élément :

Une fois qu'un lien ou un élément a été choisi, plus d'options apparaîtront dans la section Options de lien :

Développer la section Échelle fournira cette option pour votre élément :

Ici, choisissez comment l'image sera mise à l'échelle. Il y a trois options :

• Ajuster (par défaut) - Ajuste l'image à l'écran.
• Étirer - Étire l'image pour remplir tout l'écran.
• Zoom - Effectue un zoom sur l'image pour remplir tout l'écran. Non recommandé pour les petites images sur de grands écrans, car cela créera du flou.

Développer la section Paramètres fournira ces options pour votre lien :

• Durée (secondes) - Lorsque le lien est cliqué ou touché, combien de temps le lien ou l'élément s'affichera avant de revenir au design principal. Cela commence à partir du dernier toucher sur l'écran ou du moment où le lien a été cliqué.
• Précharger - Lorsque cette case est cochée, le site web se chargera en même temps que le design. Cela réduit le temps nécessaire pour que le site web apparaisse lorsque le lien est cliqué. Cependant, avoir de nombreux liens à charger peut causer des ralentissements.

Développer la section Style de fermeture et barre de navigation fournira ces options pour votre lien :

Cette section fait référence au bouton qui apparaîtra sur vos écrans lorsqu'il sera poussé vers eux. Cliquer ou toucher ce bouton vous ramènera au design original.

• Position de l'icône - Indique où cette icône apparaîtra. Par défaut au centre bas, mais peut être placée n'importe où en haut ou en bas, ou complètement désactivée.
• Style d'icône - Vous permet de définir le style de l'icône. Choisissez entre Étiquette, Solide, Rond ou Par défaut (voir ci-dessus)
• Taille de l'icône - Vous permet de modifier la taille de l'icône. Choisissez entre Petit, Moyen, Grand ou Par défaut (voir ci-dessus)
• Couleur de l'icône - Changez la couleur HTML hexadécimale de l'icône pour mieux s'adapter à votre design.
• Couleur d'arrière-plan - Changez la couleur HTML hexadécimale de l'arrière-plan de l'icône pour mieux s'adapter à votre design.
• Opacité - Le curseur vous permet de modifier l'opacité ou la transparence de l'arrière-plan de l'icône.
• Afficher la barre de navigation - Lorsque cette case est cochée, ajoute de petites flèches de navigation à l'icône. Vous permet de naviguer rapidement à travers plusieurs liens. Ressemble à ceci :

Paramètres

Sélectionner le bouton Paramètres ouvrira la section Mappage de données dans le menu latéral :

Cliquer sur Créer un mappage de données vous permet de rendre le texte sélectionné dynamique, mappé à l'une de vos sources de données existantes. Consultez notre article sur les sources de données dynamiques avec OptiSync pour plus d'informations.

Effets

Sélectionner l'option Effets vous permet de modifier plusieurs aspects différents de votre texte. Cela ouvrira la section Effets dans le menu latéral :

Ici, vous avez de nombreuses options. Nous allons les passer en revue une par une.

Développer la section Couleur vous permet d'ajouter de la couleur au texte.

C'est fonctionnellement la même chose que l'option Couleurs dans le menu supérieur du texte. Sélectionnez parmi les couleurs prédéfinies, les couleurs utilisées dans ce design, ou via le sélecteur de couleurs.

Développer la section Arrière-plan vous permet de définir une couleur d'arrière-plan spécifique sur laquelle le texte reposera.

Cela peut être sélectionné parmi les couleurs prédéfinies, les couleurs déjà assignées au design, ou créé via le sélecteur de couleurs :

Développer la section Opacité vous permet de faire varier l'opacité de la zone sélectionnée - arrière-plan et texte ensemble.

Cela peut être ajusté via un curseur. Ci-dessous est montré une demi-opacité :

Développer la section Contour vous permet d'ajouter un contour au texte.

Vous pouvez sélectionner une couleur dans un menu déroulant ou utiliser un HTML hexadécimal, et utiliser le curseur pour modifier son épaisseur :

Développer la section Ombre vous permet de créer une ombre sur votre zone de texte. Par défaut, tous les curseurs seront blancs.

Appliquer une couleur créera une ombre :

Modifier les curseurs vous permet de changer le flou et de décaler l'ombre le long de l'axe X ou Y.

Sans arrière-plan, l'ombre s'applique uniquement au texte lui-même :

Développer la section Dégradé présentera plusieurs options de dégradé pour votre texte. Cliquer sur l'une de ces options de dégradé l'appliquera à votre texte.

Développer la section Texture présentera plusieurs options de texture pour votre texte. Cliquer sur l'une de ces options de texture les appliquera à votre texte.

Animer

Cliquer sur le bouton Animer ouvrira la section Animer du menu latéral :

Pour plus d'informations sur les capacités d'animation de Designer, consultez notre article sur l'animation.

Position

Sélectionner le bouton Position ouvrira la section Position du menu latéral.

• Mettre au premier plan - Amène le texte sélectionné au calque supérieur
• Avancer - Fait monter le texte sélectionné d'un calque
• Mettre à l'arrière-plan - Amène le texte sélectionné au calque inférieur
• Reculer - Fait descendre le texte sélectionné d'un calque
• Aligner à la page - Options pour changer l'alignement du texte sélectionné
  • Gauche
  • Centre
  • Droite
  • Haut
  • Milieu
  • Bas
• Espacer uniformément - Aligne le texte dans la zone de texte plus grande
  • Verticalement
  • Horizontalement
• Retourner - Retourne le texte sélectionné
  • Horizontal
  • Vertical
• Position - Permet le placement spécifique de l'élément de texte dans le design
• Redimensionner - Permet un redimensionnement précis de l'élément de texte sélectionné

Verrouiller et copier le style

Cliquer sur le bouton Verrouiller verrouillera l'élément de texte sélectionné en place, empêchant toute modification d'y être apportée.

Ceci est utile lorsque vous travaillez avec de nombreux éléments après avoir placé le texte exactement où vous le souhaitez.

Le bouton Copier le style vous permet d'appliquer rapidement le style de l'élément de texte sélectionné à un autre.

Ceci est utile pour formater rapidement de nombreux éléments de texte.

C'est tout !

OptiSigns est le leader des logiciels d'affichage dynamique. Si vous avez des questions supplémentaires, des préoccupations ou des commentaires sur OptiSigns, n'hésitez pas à contacter notre équipe de support à support@optisigns.com.