En este artículo, exploraremos todas las opciones para crear y agregar texto en la aplicación OptiSigns Designer.
Agregar elementos de texto a un diseño es muy sencillo, pero con Designer, hay muchas opciones para hacer que sus palabras realmente destaquen.
Para más información sobre los elementos básicos de Designer, consulte nuestra guía Primeros pasos con Designer.
Agregar texto
La opción Texto le permite insertar texto en el diseño.
Al elegir Texto desde el menú superior se reflejará su elección en el menú lateral y lo abrirá para más opciones:
Al hacer clic en Agregar un cuadro de texto o una de las opciones de texto predefinidas se agregará un cuadro de texto a la vista de Designer:
Editar texto
Al hacer doble clic o seleccionar el texto le permite ingresar texto directamente.
Por último, al hacer clic en el cuadro del elemento de texto y mantener presionado el botón del ratón mientras lo arrastra, le permite reposicionar el texto.
Cuando está seleccionado, el texto tiene un conjunto completo de opciones:
- Duplicar - Crea un duplicado exacto del texto seleccionado
- Eliminar - Elimina el texto seleccionado del diseño
-
Más
- Copiar - Copia el texto seleccionado para pegarlo más tarde
- Copiar estilo -
- Pegar - Pega el elemento del portapapeles en el texto
- Duplicar - Crea un duplicado exacto del texto seleccionado
- Agregar componente -
- Eliminar - Elimina el texto seleccionado del diseño
-
Capa - Opciones para cambiar la capa del texto seleccionado
- Traer al frente - Sube el texto seleccionado una capa
- Traer al primer plano - Lleva el texto seleccionado a la capa superior
- Enviar atrás - Baja el texto seleccionado una capa
- Enviar al fondo - Lleva el texto seleccionado a la capa inferior
-
Alinear elementos - Opciones para cambiar la alineación del texto seleccionado
- Izquierda
- Centro
- Derecha
- Superior
- Medio
- Inferior
- Enlace - Agregar una URL al texto seleccionado.
- Animar - Agregar una animación al texto seleccionado.
Opciones adicionales del elemento
Al hacer clic en el texto se modifica el menú superior:
El menú superior tiene opciones adicionales:
Fuentes
Al hacer clic en la opción Fuente (de forma predeterminada, esto mostrará la fuente como Roboto) se abrirá la sección Fuentes en el menú lateral.
Designer tiene cientos de opciones de fuentes, con Google Fonts que tiene pesos de fuente seleccionables. Al hacer clic en cualquiera la seleccionará y proporcionará opciones sobre cómo debe mostrarse:
El tamaño de fuente se puede cambiar haciendo clic en las opciones '-' o '+', o haciendo clic en el número del tamaño de fuente.
Al hacer clic en el número del tamaño de fuente le permite elegir entre varios tamaños de fuente preestablecidos o ingresar un tamaño personalizado.
También ofrecemos Fuentes personalizadas a través del Kit de marca.
Colores
Al seleccionar la opción Colores se abre la sección Colores en el menú lateral.
Aquí, elija entre colores preestablecidos, colores ya utilizados en este diseño o mediante la opción Selector de color:
Selector de color
- Selector de color
- Color actualmente seleccionado / Herramienta cuentagotas de color
- Control deslizante de color
- Control deslizante de opacidad/transparencia
- Entrada de código de color
- Cambiador de código - Cambiar entre códigos de color hexadecimal, RGB y HSLA
- Colores utilizados anteriormente
| NOTA |
| El Control deslizante de opacidad/transparencia se aplica a cualquier elemento al que se aplique el selector de color, ya sea texto, fondo o cualquiera de las otras áreas donde se puede usar un selector de color. |
La Herramienta cuentagotas de color le permite elegir cualquier color fácilmente.
| NOTA |
| La herramienta cuentagotas de color no está disponible en ciertos navegadores. |
Estilo de texto
Al seleccionar Negrita, Cursiva, Subrayado o Tachado se aplicarán esas cualidades al texto seleccionado. Estos efectos se pueden combinar entre sí y usar en cualquier combinación.
Caso de texto
Al seleccionar Caso de texto se abrirá un submenú:
Aquí puede elegir entre diferentes casos de letras para mostrar:
- MAYÚSCULAS - Permite escribir exclusivamente en mayúsculas.
- minúsculas - Permite escribir exclusivamente en minúsculas.
- Tipo oración - Formatea automáticamente el texto en tipo oración.
- Tipo Título - Formatea automáticamente el texto en tipo título.
Alineación
Al seleccionar la opción Alineación se abrirá otro submenú:
Aquí, elija entre alineación Izquierda, Centro, Derecha o Justificada.
Espaciado
Al seleccionar la opción Espaciado se abrirá otro submenú más:
Aquí puede personalizar la cantidad de espaciado entre sus letras y sus líneas.
Enlace
Al seleccionar la opción Enlace le permite convertir el texto en un elemento interactivo, usado principalmente para quioscos. Abrirá la sección Opciones de enlace en el menú lateral:
Al hacer clic en Agregar enlace se le pedirá que ingrese una URL o seleccione un recurso:
Una vez que se haya elegido un enlace o recurso, aparecerán más opciones en la sección Opciones de enlace:
Al expandir la sección Escala proporcionará esta opción para su recurso:
Aquí, elija cómo se escalará la imagen. Hay tres opciones:
- Ajustar (predeterminado) - Ajusta la imagen a la pantalla.
- Estirar - Estira la imagen para llenar toda la pantalla.
- Zoom - Hace zoom en la imagen para llenar toda la pantalla. No recomendado para imágenes pequeñas en pantallas grandes, ya que esto creará borrosidad.
| NOTA |
| Si se proporciona una URL, la opción Escala no aparecerá. |
Al expandir la sección Configuración proporcionará estas opciones para su enlace:
- Duración (segundos) - Cuando se hace clic o se toca el enlace, cuánto tiempo se mostrará el enlace o recurso antes de volver al diseño principal. Esto comienza desde el último toque en la pantalla o la última vez que se hizo clic en el enlace.
- Precargar - Cuando está marcado, el sitio web se cargará cuando lo haga el diseño. Esto reduce la cantidad de tiempo que tarda en aparecer el sitio web cuando se hace clic en el enlace. Sin embargo, tener numerosos enlaces que necesitan cargarse puede causar retraso.
Al expandir la sección Estilos de cierre y barra de navegación proporcionará estas opciones para su enlace:
Esta sección se refiere al botón que aparecerá en sus pantallas cuando se envíe a ellas. Al hacer clic o tocar este botón, volverá al diseño original.
- Posición del icono - Muestra dónde aparecerá este icono. Por defecto en Centro inferior, pero puede colocarse en cualquier lugar a lo largo de la parte superior o inferior, o desactivarse por completo.
- Estilo del icono - Le permite establecer el estilo del icono. Elija entre Etiqueta, Sólido, Redondo o Predeterminado (ver arriba)
- Tamaño del icono - Le permite cambiar el tamaño del icono. Elija entre Pequeño, Mediano, Grande o Predeterminado (ver arriba)
- Color del icono - Cambie el color HTML hexadecimal del icono para que se ajuste mejor a su diseño.
- Color de fondo - Cambie el color HTML hexadecimal del fondo del icono para que se ajuste mejor a su diseño.
- Opacidad - El control deslizante le permite cambiar qué tan opaco o transparente es el fondo del icono.
- Mostrar barra de navegación - Cuando está marcado, agrega pequeñas flechas de navegación al icono. Le permite navegar rápidamente a través de múltiples enlaces. Se ve así:
Configuración
Al seleccionar el botón Configuración se abrirá la sección Mapeo de datos en el menú lateral:
Al hacer clic en Crear mapeo de datos le permite hacer que el texto seleccionado sea dinámico, asignado a una de sus fuentes de datos existentes. Consulte nuestro artículo sobre Fuentes de datos dinámicas con OptiSync para más información.
Efectos
Al seleccionar la opción Efectos le permite cambiar varios aspectos diferentes de su texto. Abrirá la sección Efectos en el menú lateral:
Aquí, tiene numerosas opciones. Repasaremos cada una de ellas a su vez.
Al expandir la sección Color le permite agregar color al texto.
Esto es funcionalmente lo mismo que la opción Colores en el menú superior de texto. Seleccione entre colores preestablecidos, colores utilizados en este diseño o mediante el selector de color.
Al expandir la sección Fondo le permite establecer un color de fondo específico para el texto.
Esto se puede seleccionar entre colores preestablecidos, colores ya asignados al diseño o creados mediante el selector de color:
Al expandir la sección Opacidad le permite variar la opacidad del área seleccionada: fondo y texto juntos.
Esto se puede ajustar mediante el control deslizante. A continuación se muestra media opacidad:
| NOTA |
| El control deslizante de Opacidad se aplica al elemento completo seleccionado en lugar de solo al texto o al fondo. Para cambiar la opacidad de la forma o el fondo, hágalo a través del selector de color. |
Al expandir la sección Contorno le permite agregar un contorno al texto.
Puede seleccionar un color del menú desplegable o usar HTML hexadecimal, y usar el control deslizante para cambiar su grosor:
Al expandir la sección Sombra le permite crear una sombra en su cuadro de texto. De forma predeterminada, todos los controles deslizantes estarán en blanco.
Al aplicar un color se creará una sombra:
Cambiar los controles deslizantes le permite cambiar el desenfoque y desplazar la sombra a lo largo del eje X o Y.
Sin fondo, la sombra se aplica solo al texto en sí:
Al expandir la sección Degradado se presentarán varias opciones de degradado para su texto. Al hacer clic en cualquiera de estas opciones de degradado se aplicará a su texto.
Al expandir la sección Textura se presentarán varias opciones de textura para su texto. Al hacer clic en cualquiera de estas opciones de textura se aplicarán a su texto.
Animar
Al hacer clic en el botón Animar se abrirá la sección Animar del menú lateral:
Para más información sobre las capacidades de animación de Designer, consulte nuestro artículo sobre animación.
Posición
Al seleccionar el botón Posición se abrirá la sección Posición del menú lateral.
- Traer al frente - Lleva el texto seleccionado a la capa superior
- Traer adelante - Sube el texto seleccionado una capa
- Enviar al fondo - Lleva el texto seleccionado a la capa inferior
- Enviar atrás - Baja el texto seleccionado una capa
-
Alinear a la página - Opciones para cambiar la alineación del texto seleccionado
- Izquierda
- Centro
- Derecha
- Superior
- Medio
- Inferior
-
Espaciar uniformemente - Alinea el texto dentro del cuadro de texto más grande
- Verticalmente
- Horizontalmente
-
Voltear - Voltea el texto seleccionado
- Horizontal
- Vertical
- Posición - Permite la colocación específica del elemento de texto en el diseño
- Redimensionar - Permite redimensionar con precisión el elemento de texto seleccionado
Bloquear y copiar estilo
Al hacer clic en el botón Bloquear bloqueará el elemento de texto seleccionado en su lugar, evitando que se le realicen cambios.
Esto es útil cuando se trabaja con muchos elementos después de obtener el texto exactamente donde lo desea.
El botón Copiar estilo le permite aplicar rápidamente el estilo del elemento de texto seleccionado a otro.
Esto es útil para formatear rápidamente numerosos elementos de texto.
¡Eso es todo!
OptiSigns es el líder en software de señalización digital. Si tiene preguntas adicionales, inquietudes o comentarios sobre OptiSigns, no dude en comunicarse con nuestro equipo de soporte en support@optisigns.com.