Customize Text

Neste artigo, exploraremos todas as opções para criar e adicionar Texto no aplicativo OptiSigns Designer.

• Adicionar Texto
• Editar Texto
• Opções Adicionais de Elementos
  • Fontes
  • Cores
  • Estilização de Texto
  • Link
  • Configurações
  • Efeitos
  • Animar
  • Posição
  • Bloquear e Copiar Estilo

Adicionar elementos de texto a um design é simples, mas com o Designer, existem muitas opções para fazer suas palavras realmente se destacarem.

Para mais informações sobre os elementos básicos do Designer, consulte nosso guia Primeiros Passos com o Designer.

Adicionar Texto

A opção Texto permite inserir texto no design.

Escolher Texto no Menu Superior espelhará sua escolha no Menu Lateral e abrirá mais opções:

Clicar em Adicionar uma caixa de texto ou uma das opções de texto predefinidas adicionará uma caixa de texto à Visualização do Designer:

Editar Texto

Clicar duas vezes ou selecionar o texto permite inserir texto diretamente.

Por último, clicar uma vez na caixa de elemento do texto, depois segurar o botão do mouse e arrastar permite reposicionar o texto.

Quando selecionado, o Texto tem um conjunto completo de opções:

• Duplicar - Cria uma duplicata exata do texto selecionado
• Excluir - Remove o texto selecionado do design
• Mais
  • Copiar - Copia o texto selecionado para ser Colado posteriormente
  • Copiar Estilo -
  • Colar - Cola elemento da área de transferência no texto
  • Duplicar - Cria uma duplicata exata do texto selecionado
  • Adicionar Componente -
  • Excluir - Remove o texto selecionado do design
  • Camada - Opções para alterar a camada do texto selecionado
    • Trazer para Frente - Traz o texto selecionado uma camada para cima
    • Trazer para o Topo - Traz o texto selecionado para a camada superior
    • Enviar para Trás - Envia o texto selecionado uma camada para baixo
    • Enviar para o Fundo - Envia o texto selecionado para a camada inferior
  • Alinhar Elementos - Opções para alterar o alinhamento do texto selecionado
    • Esquerda
    • Centro
    • Direita
    • Topo
    • Meio
    • Fundo
  • Link - Adicionar um URL ao texto selecionado.
  • Animar - Adicionar uma animação ao texto selecionado.

Opções Adicionais de Elementos

Clicar no texto altera o Menu Superior:

O Menu Superior tem opções adicionais:

Fontes

Clicar na opção Fonte (por padrão, mostrará a fonte como Roboto) abrirá a seção Fontes no Menu Lateral.

O Designer tem centenas de opções de fontes, com as Google Fonts tendo pesos de fonte selecionáveis. Clicar em qualquer uma selecionará e fornecerá opções de como deve ser exibida:

O Tamanho da fonte pode ser alterado clicando nas opções '-' ou '+', ou clicando no número do tamanho da fonte.

Clicar no número do tamanho da fonte permite escolher entre vários tamanhos de fonte predefinidos ou inserir um tamanho personalizado.

Também oferecemos Fontes Personalizadas através do Kit de Marca.

Cores

Selecionar a opção Cores abre a seção Cores no Menu Lateral.

Aqui, escolha entre cores predefinidas, cores já usadas neste design, ou através da opção Seletor de Cores:

Seletor de Cores

1. Seletor de Cor
2. Cor Atualmente Selecionada / Ferramenta Conta-gotas
3. Controle Deslizante de Cor
4. Controle Deslizante de Opacidade/Transparência
5. Entrada de Código de Cor
6. Alternador de Código - Alternar entre códigos de cor hexadecimal, RGB e HSLA
7. Cores Anteriores Usadas

A Ferramenta Conta-gotas permite escolher qualquer cor facilmente.

Estilização de Texto

Selecionar Negrito, Itálico, Sublinhado ou Tachado aplicará essas qualidades ao texto selecionado. Esses efeitos podem ser combinados entre si e usados em qualquer combinação.

Caixa de Texto

Selecionar Caixa de Texto abrirá um submenu:

Aqui você pode escolher entre diferentes caixas de letra para exibição:

• MAIÚSCULAS - Permite digitar exclusivamente em maiúsculas.
• minúsculas - Permite digitar exclusivamente em minúsculas.
• Caixa de sentença - Formata automaticamente o texto para caixa de sentença.
• Caixa de Título - Formata automaticamente o texto para caixa de título.

Alinhamento

Selecionar a opção Alinhamento abrirá outro submenu:

Aqui, escolha entre alinhamento Esquerda, Centro, Direita ou Justificado.

Espaçamento

Selecionar a opção Espaçamento abrirá mais um submenu:

Aqui você pode personalizar a quantidade de espaçamento entre suas letras e suas linhas.

Link

Selecionar a opção Link permite transformar o texto em um elemento interativo, usado principalmente para quiosques. Abrirá a seção Opções de Link no Menu Lateral:

Clicar em Adicionar Link solicitará que você insira um URL ou selecione um ativo:

Uma vez que um link ou ativo foi escolhido, mais opções aparecerão na seção Opções de Link:

Expandir a seção Escala fornecerá esta opção para seu ativo:

Aqui, escolha como a imagem será dimensionada. Existem três opções:

• Ajustar (padrão) - Ajusta a imagem à tela.
• Esticar - Estica a imagem para preencher toda a tela.
• Zoom - Amplia a imagem para preencher toda a tela. Não recomendado para imagens pequenas em displays grandes, pois criará desfoque.

Expandir a seção Configurações fornecerá estas opções para seu link:

• Duração (segundos) - Quando o link é clicado ou tocado, por quanto tempo o link ou ativo será exibido antes de retornar ao design principal. Isso começa a partir do último toque na tela ou momento em que o link foi clicado.
• Pré-carregar - Quando marcado, o site carregará quando o design for carregado. Isso reduz o tempo necessário para o site aparecer quando o link é clicado. No entanto, ter vários links precisando carregar pode causar atraso.

Expandir a seção Estilizador de Barra de Fechar e Navegação fornecerá estas opções para seu link:

Esta seção refere-se ao botão que aparecerá em suas telas quando for enviado para elas. Clicar ou tocar neste botão retornará ao design original.

• Posição do Ícone - Mostra onde este ícone aparecerá. O padrão é Centro Inferior, mas pode ser colocado em qualquer lugar ao longo do topo ou fundo, ou desativado completamente.
• Estilo do Ícone - Permite definir o estilo do ícone. Escolha entre Rótulo, Sólido, Redondo ou Padrão (veja acima)
• Tamanho do Ícone - Permite alterar o tamanho do ícone. Escolha entre Pequeno, Médio, Grande ou Padrão (veja acima)
• Cor do Ícone - Altere a cor HTML hexadecimal do ícone para melhor se adequar ao seu design.
• Cor de Fundo - Altere a cor HTML hexadecimal do fundo do ícone para melhor se adequar ao seu design.
• Opacidade - O controle deslizante permite alterar o quão opaco ou transparente é o fundo do ícone.
• Mostrar Barra de Navegação - Quando marcado, adiciona pequenas setas de navegação ao ícone. Permite navegar rapidamente por vários links. Parece com isto:

Configurações

Selecionar o botão Configurações abrirá a seção Mapeamento de Dados no Menu Lateral:

Clicar em Fazer Mapeamento de Dados permite tornar o texto selecionado dinâmico, mapeado para uma de suas Fontes de Dados existentes. Veja nosso artigo sobre Fontes de Dados Dinâmicas com OptiSync para mais informações.

Efeitos

Selecionar a opção Efeitos permite alterar vários aspectos diferentes do seu texto. Abrirá a seção Efeitos no Menu Lateral:

Aqui, você tem várias opções. Vamos abordar cada uma delas por vez.

Expandir a seção Cor permite adicionar cor ao texto.

Isso é funcionalmente o mesmo que a opção Cores no Menu Superior de Texto. Selecione entre cores predefinidas, cores usadas neste design, ou através do seletor de cores.

Expandir a seção Fundo permite definir uma cor de fundo específica para o Texto.

Isso pode ser selecionado entre cores predefinidas, cores já atribuídas ao design, ou criado através do seletor de cores:

Expandir a seção Opacidade permite variar a opacidade da área selecionada - fundo e texto juntos.

Isso pode ser ajustado via controle deslizante. Mostrado abaixo está meia opacidade:

Expandir a seção Contorno permite adicionar um contorno ao texto.

Você pode selecionar uma cor de um menu suspenso ou usar HTML hexadecimal, e usar o controle deslizante para alterar sua espessura:

Expandir a seção Sombra permite criar uma sombra na sua caixa de texto. Por padrão, todos os controles deslizantes estarão brancos.

Aplicar uma cor criará uma sombra:

Alterar os controles deslizantes permite alterar o desfoque e deslocar a sombra ao longo do eixo X ou Y.

Sem fundo, a sombra aplica-se apenas ao próprio texto:

Expandir a seção Gradiente apresentará várias opções de gradiente para seu texto. Clicar em qualquer uma dessas opções de Gradiente aplicará ao seu texto.

Expandir a seção Textura apresentará várias opções de textura para seu texto. Clicar em qualquer uma dessas opções de textura as aplicará ao seu texto.

Animar

Clicar no botão Animar abrirá a seção Animar do Menu Lateral:

Para mais informações sobre as capacidades de Animação do Designer, veja nosso artigo sobre Animação.

Posição

Selecionar o botão Posição abrirá a seção Posição do Menu Lateral.

• Trazer para Frente - Traz o texto selecionado para a camada superior
• Trazer Adiante - Traz o texto selecionado uma camada para cima
• Enviar para Trás - Envia o texto selecionado para a camada inferior
• Enviar para Fundo - Envia o texto selecionado uma camada para baixo
• Alinhar à Página - Opções para alterar o alinhamento do texto selecionado
  • Esquerda
  • Centro
  • Direita
  • Topo
  • Meio
  • Fundo
• Espaçar Uniformemente - Alinha o texto dentro da caixa de texto maior
  • Verticalmente
  • Horizontalmente
• Virar - Vira o texto selecionado
  • Horizontal
  • Vertical
• Posição - Permite posicionamento específico do elemento de texto no design
• Redimensionar - Permite redimensionamento preciso do elemento de texto selecionado

Bloquear e Copiar Estilo

Clicar no botão Bloquear bloqueará o elemento de texto selecionado no lugar, impedindo que alterações sejam feitas nele.

Isso é útil ao lidar com muitos elementos depois de colocar o texto exatamente onde você deseja.

O botão Copiar Estilo permite aplicar rapidamente o estilo do elemento de texto selecionado a outro.

Isso é útil para formatar rapidamente vários elementos de texto.

É isso aí!

A OptiSigns é líder em software de sinalização digital. Se você tiver dúvidas adicionais, preocupações ou qualquer feedback sobre a OptiSigns, sinta-se à vontade para entrar em contato com nossa equipe de suporte em support@optisigns.com.