Skip to content

Escenas infinitas y fotogramas

Una escena es un lienzo infinito y desplazable que contiene muchas mesas de trabajo, llamadas fotogramas. Es el tipo de parte al que recurrir cuando quieres ver una campaña completa, un conjunto de variantes de tamaño o un pequeño sistema de diseño en una sola superficie, en lugar de alternar entre páginas separadas.

Un fotograma aquí es una mesa de trabajo, no la máscara de recorte que obtienes de las herramientas de selección o las herramientas de lápiz. Ambas características comparten la palabra "fotograma", pero no están relacionadas: un fotograma de escena contiene un diseño, un fotograma de selección enmascara parte de una imagen.

Resumen rápido

  1. Añade una parte infinita desde las pestañas de página, o cambia la parte actual entre simple e infinita desde la barra de comandos.
  2. Dibuja un fotograma con la herramienta Fotograma, o añádelo desde una plantilla o un diseño guardado.
  3. Desplázate y haz zoom para organizar los fotogramas; selecciona múltiples fotogramas para alinearlos, distribuirlos o agruparlos.
  4. Convierte un elemento compartido en un componente vinculado para que todos los fotogramas se mantengan sincronizados.
  5. Descarga un fotograma como PNG, o selecciona varios para descargar un PNG cada uno.

Referencia detallada

Crear una escena

Una escena puede iniciarse de dos maneras: añade una parte Infinita desde el menú de añadir parte ("+") en las pestañas de página, o activa el interruptor Simple / Infinita en el panel de plantillas de la barra de comandos. El interruptor solo establece el modo; la página de escena real se crea de forma perezosa la primera vez que añades un fotograma o sueltas una plantilla mientras estás en modo Infinito, por lo que alternarlo nunca genera una página vacía por sí sola. Una escena nueva comienza con un fotograma marcador de posición, que se reemplaza automáticamente la primera vez que añades contenido real, de modo que tu primera plantilla aterrice como el único fotograma en lugar de estar al lado de uno vacío.

Preajustes de fotogramas

Tanto la herramienta Fotograma como el generador de variantes responsivas (abajo) utilizan los mismos cinco tamaños:

PreajusteTamaño (px)
Cuadrado1080 x 1080
Retrato1080 x 1350
Historia1080 x 1920
Paisaje1920 x 1080
A4595 x 842

Añadir y editar fotogramas

AcciónCómo
Dibujar un fotogramaSelecciona la herramienta Fotograma y arrastra; un arrastre corto coloca un fotograma cuadrado predeterminado
Usar un tamaño preajustadoAbre el menú desplegable de la herramienta Fotograma para los cinco tamaños anteriores
Añadir desde una plantillaSuelta un diseño de plantilla; aterriza como un nuevo fotograma al lado de los demás
Añadir un diseño guardadoColoca uno de tus diseños guardados como fotograma de la misma manera
RedimensionarSelecciona el fotograma e ingresa un ancho y alto exactos (20 a 20,000 px), o elige un chip de proporción: 1:1, 16:9, 9:16, 4:3 o 3:4
DuplicarColoca una copia justo a la derecha del original, alineándose en la primera columna libre, con un sufijo de copia en su nombre
Cambiar colorElige un color de fondo de la fila de muestras, elige un color personalizado o hazlo transparente
RenombrarHaz clic en la etiqueta de nombre del fotograma y escribe uno nuevo
EtiquetarAbre el selector de etiquetas desde la barra de contexto del fotograma para añadir o eliminar etiquetas de proyecto
EliminarSelecciona el fotograma y elimínalo, como cualquier objeto

Redimensionar un fotograma mantiene fija su esquina superior izquierda y no redimensiona el contenido que ya está dentro.

Editar dentro de un fotograma

Un fotograma normalmente se comporta como un objeto: un solo clic selecciona toda la mesa de trabajo, y arrastrar la mueve (y todo lo que contiene) como una unidad. Para editar el contenido, haz doble clic en el fotograma para entrar en él. Sus objetos se vuelven seleccionables individualmente, su fondo se convierte en un fondo bloqueado, y los otros fotogramas se atenúan para que puedas concentrarte. Presiona Esc, o haz doble clic en el fondo o en el espacio vacío, para salir; los objetos se reagrupan en el fotograma y la escena se guarda. El texto, las imágenes y las formas nuevas que añadas caen en el fotograma que esté activo, como se describe en Barra de herramientas y navegación a continuación.

Trabajar con varios fotogramas a la vez

Selecciona con marco o Mayús + clic para seleccionar varios fotogramas; la selección se reduce automáticamente solo a fotogramas. Una barra de selección múltiple te da color de fondo, tamaño exacto, agrupar o desagrupar, alinear y descargar por fotograma. Alinear funciona en seis bordes (izquierda, centro, derecha, arriba, medio, abajo), y distribuir espacia los fotogramas de manera uniforme a lo largo de una fila o columna manteniendo al menos un pequeño espacio entre ellos. Los fotogramas agrupados se mueven juntos, y seleccionar cualquier miembro de un grupo selecciona todo el grupo.

Rendimiento y fotogramas en reposo

Una escena contiene hasta 200 fotogramas por defecto; añadir más muestra un aviso de límite. Para mantener suave el desplazamiento y zoom de un par de cientos de fotogramas, aquellos que se desplazan fuera de la ventana visible se colapsan en una miniatura ligera en caché (con un límite de aproximadamente 400 px en su lado más largo) y se reactivan como objetos completamente editables en el momento en que te desplazas cerca de ellos nuevamente. La reactivación utiliza un pequeño halo alrededor de la ventana gráfica, por lo que un fotograma suele estar activo justo antes de que aparezca al desplazarse, y la comprobación se ejecuta una fracción de segundo después de que se asienta un desplazamiento o zoom, no en cada fotograma del gesto. El reposo y la reactivación nunca añaden pasos de deshacer.

Filtrar fotogramas por etiqueta

Una vez que tu proyecto tiene etiquetas, una barra de filtro te permite alternar chips de etiqueta para limitar qué fotogramas se resaltan, cambiar entre coincidir con todas las etiquetas o cualquier etiqueta, invertir la coincidencia y limpiar el filtro con un clic. Una acción de agrupación agrupa los fotogramas coincidentes en bloques ordenados, y puedes guardar un filtro como una vista nombrada para volver a ella más tarde.

Componentes vinculados

Convierte un elemento seleccionado en un componente vinculado, y se clona en todos los demás fotogramas en la misma posición relativa. Editar el relleno, trazo, tamaño, texto, fuente o sombra de una instancia actualiza instantáneamente todas las demás instancias, mientras que cada instancia mantiene su propia posición, por lo que un encabezado o botón compartido se mantiene visualmente consistente pero aún puede colocarse correctamente en un fotograma de forma diferente. Vincular de nuevo después de añadir nuevos fotogramas extiende la sincronización a ellos también.

Variantes responsivas

Genera un conjunto completo de copias con tamaño de plataforma a partir de un fotograma en un solo paso, utilizando los mismos cinco tamaños listados arriba. Cada variante se coloca debajo del fotograma de origen con su contenido clonado y escalado proporcionalmente, listo para ajustes específicos de plataforma, por lo que un diseño se convierte en un conjunto combinado de fotogramas con el tamaño correcto.

Aplicar una marca

Con un kit de marca activo, aplica sus colores y fuente a un solo fotograma o a todos los fotogramas de la escena a la vez, incluidos los que están en reposo. Los fondos de los fotogramas toman el color de cuerpo de la marca, el texto cambia a la fuente y color de texto de la marca, y otras formas toman el color primario de la marca. Consulta Resumen de marca.

Exportar fotogramas

La acción Descargar en la barra de fotogramas renderiza el fotograma seleccionado (fondo más contenido) como PNG y lo descarga. Con varios fotogramas seleccionados, descarga un PNG por fotograma en lugar de un solo archivo. Para obtener muchos fotogramas como un solo ZIP, selecciónalos en el navegador Works y usa su exportación masiva sensible a partes. Consulta Exportar una página para opciones de exportación generales.

Barra de herramientas y navegación

La barra de herramientas flotante contiene Seleccionar/Mover, una herramienta Mano para desplazarse, Fotograma, Imagen, Texto, las herramientas de lápiz, Formas y un menú "más" para notas adhesivas, añadir una plantilla, un alternador de cuadrícula y un alternador de ajuste inteligente. Al pasar el cursor sobre Seleccionar, Fotograma o el botón de lápiz se abre un pequeño menú desplegable de variantes y tamaños; Formas y "más" se abren al hacer clic. Desplázate para hacer zoom hacia el puntero entre el 5% y el 800%, mantén presionada la barra espaciadora o arrastra con el botón central del ratón para desplazarte, y presiona Esc para salir de la herramienta actual, cerrar un menú desplegable o limpiar la selección. Dibujar un fotograma te devuelve a Seleccionar después; mantén presionado Alt mientras terminas el arrastre para mantener la herramienta Fotograma activa y dibujar varios seguidos.

Un objeto nuevo (una forma, una imagen, texto, un icono, un código QR, etc.) se une al fotograma activo automáticamente y se centra en él. El fotograma activo es el que tienes seleccionado, el fotograma dentro del cual estás editando, o, cuando no hay nada seleccionado, el fotograma más cercano al centro de tu vista. Las notas adhesivas del menú "más" son la excepción: siempre flotan libremente a nivel de escena y nunca se absorben en un fotograma.

Paso a paso

Diseñar una escena como un moodboard o un flujo multipantalla

  1. Añade una parte Infinita desde el menú "+" en las pestañas de página, o cambia el interruptor Simple/Infinita de la barra de comandos a Infinita.
  2. Presiona F para la herramienta Fotograma. Arrastra cada mesa de trabajo, o pasa el cursor sobre el botón Fotograma y elige un tamaño preajustado (Cuadrado, Retrato, Historia, Paisaje o A4). Un clic rápido sin arrastrar coloca un fotograma predeterminado de 1080 por 1080.
  3. Llena cada fotograma: con un fotograma seleccionado (o después de hacer doble clic para entrar en él), añade texto con T, imágenes con I y formas con R. Cada objeto nuevo se centra en el fotograma activo.
  4. Presiona V para volver a Seleccionar, selecciona varios fotogramas con el marco, y usa la barra multifotograma para alinearlos en filas o columnas ordenadas y distribuir el espaciado de manera uniforme.

Dibujar un nuevo fotograma y darle un nombre

  1. Presiona F, luego arrastra sobre el lienzo vacío para crear la mesa de trabajo con la banda elástica del tamaño que desees; una vista previa discontinua sigue a tu cursor.
  2. Suelta para crear el fotograma. La herramienta vuelve a Seleccionar para que puedas reposicionarlo de inmediato (mantén presionado Alt al soltar si quieres seguir dibujando más fotogramas).
  3. Cada fotograma lleva una etiqueta de nombre justo encima. Haz clic en la etiqueta en la barra de contexto del fotograma, escribe un nuevo nombre y presiona Enter. La etiqueta en el lienzo se actualiza para coincidir.

Desplazarse y hacer zoom en una escena grande sin perder la ubicación

  1. Desplázate para hacer zoom hacia el puntero (5% a 800%). Mantén presionada la barra espaciadora y arrastra, cambia a la herramienta Mano con H, o arrastra con el botón central del ratón para desplazarte desde cualquier lugar.
  2. Las etiquetas de nombre de los fotogramas se mueven junto a cada mesa de trabajo mientras te desplazas, y se truncan al ancho del fotograma cuando te alejas, para que siempre puedas leer dónde estás.
  3. Para reagrupar una escena extensa, etiqueta los fotogramas, abre la barra de filtro de etiquetas y usa su acción de Agrupación para ajustar los fotogramas en bloques ordenados agrupados por su primera etiqueta.

Usar un fotograma por sí solo

  1. Haz clic una vez en un fotograma para seleccionar toda la mesa de trabajo; no hagas doble clic, ya que eso te llevaría al interior.
  2. En la barra de contexto del fotograma, elige Descargar para renderizar solo ese fotograma como PNG.
  3. Para reutilizar el diseño del fotograma en otro lugar, guarda un elemento dentro de él en Mis formas, o genera copias con tamaño de plataforma con variantes responsivas. Para un lote de fotogramas como un solo ZIP, selecciónalos en el navegador Works y usa su exportación masiva.

Tareas comunes

  • Un diseño, todos los tamaños de plataforma: selecciona un fotograma terminado y genera variantes responsivas. Obtendrás una copia en cada uno de los otros tamaños preajustados, colocada debajo del origen con su contenido escalado para ajustarse, lista para ajustes específicos de plataforma.
  • Mantener un encabezado o botón compartido sincronizado: selecciona el elemento y vincúlalo como componente. Se coloca una copia vinculada en cada uno de los otros fotogramas en la misma posición relativa, y editar el relleno, texto, fuente, tamaño o sombra de cualquier instancia actualiza todas ellas mientras cada una mantiene su propia posición.
  • Aplicar una marca de un solo movimiento: con un kit de marca activo, recolorea un solo fotograma o toda la escena a la vez, incluidos los fotogramas en reposo. Consulta Resumen de marca.
  • Agrupar fotogramas que van juntos: selecciona múltiples y elige Agrupar. Los fotogramas agrupados se mueven juntos, y hacer clic en cualquiera selecciona todo el grupo; elige Desagrupar para liberarlos.
  • Cambiar el color de fondo de un fotograma: abre las muestras de Fondo en la barra de fotogramas, elige un preajuste o un color personalizado, o hazlo transparente para que el fondo de puntos se vea a través.

Solución de problemas

Los fotogramas se ven suaves o de baja resolución al alejarse

Los fotogramas que se desplazan fuera de la pantalla se intercambian por una miniatura en caché (alrededor de 400 px en el lado largo) para mantener el desplazamiento rápido, y ese proxy puede verse ligeramente suave. Desplázate de vuelta hacia el fotograma y se activa en la versión de resolución completa y editable. Las exportaciones siempre se renderizan a resolución completa independientemente del estado de reposo del fotograma.

Un objeto nuevo aterrizó en el fotograma equivocado. Los objetos nuevos van al fotograma activo: el fotograma seleccionado, el fotograma dentro del cual estás editando, o el más cercano al centro de la vista. Selecciona primero el fotograma de destino, luego añade el objeto, o arrastra un objeto libre sobre un fotograma y suéltalo para absorberlo en él.

No puedes hacer clic en un elemento dentro de un fotograma. Un solo clic selecciona todo el fotograma como una unidad. Haz doble clic en el fotograma para entrar, luego haz clic en el elemento, y presiona Esc para salir.

Redimensionar un fotograma no redimensionó su contenido. Esto es intencional: redimensionar mantiene la esquina superior izquierda fija y deja el contenido donde está. Para escalar un diseño a una forma diferente, usa variantes responsivas en lugar de redimensionar.

Una nota adhesiva no se adhiere a un fotograma. Las notas adhesivas siempre viven libres a nivel de escena por diseño, por lo que nunca distorsionan un fotograma. Usa texto (la herramienta T) para texto que deba pertenecer a un fotograma.

Alinear pareció ocultar fotogramas. No lo hace: alinear un borde que haría que los fotogramas se superpongan los recoloca en una fila o columna con un pequeño espacio, por lo que todos los fotogramas permanecen visibles.

Atajos de teclado

AtajoAcción
VSeleccionar / Mover
HMano (desplazar)
FFotograma
IImagen
TTexto
PLápiz Bézier
Shift + PLápiz de forma libre
LHerramienta Línea
RFormas
EscSalir de la herramienta actual, cerrar un menú desplegable o limpiar la selección

Consejos

Un clic selecciona, doble clic edita

Haz clic una vez en un fotograma para mover o redimensionar toda la mesa de trabajo como una unidad. Haz doble clic para entrar y editar su contenido; los otros fotogramas se atenúan para que puedas concentrarte. Esc sale.

No confundas los dos "fotogramas"

Los fotogramas de una escena son mesas de trabajo donde diseñas. El fotograma que obtienes de las herramientas de selección o lápiz es una máscara de recorte alrededor de parte de una imagen. Consulta Herramientas de selección.

Relacionados