Editar la visualización

La visualización no es solo un estilo: define dónde vive el contenido y cómo el aprendiz se mueve. Elegir el modo está en Configurar el proyecto. Armar y rellenar esa estructura se hace sobre todo en el editor.

Esta guía cubre ese trabajo diario: mapa de elementos, campos de cada uno e inserción de componentes.

Dos familias de modos

Familia	Modos	Cómo se arma el contenido
Lienzo lineal	Vista de desplazamiento, vista de navegación (slides)	Los bloques se apilan en el lienzo, en orden. No hay celdas ni páginas que abrir antes.
Por contenedores	My Room, Web Gallery, Web Grid, Barra web, Paginación	Primero existe un mapa (páginas, celdas, pestañas, subenlaces). Los componentes van dentro de un contenedor, no sueltos en un scroll infinito.

Think cubre los lineales. Room / Gallery / Grid piden Build o superior; Barra web y Paginación, Deploy. Detalle de planes y comportamiento publicado: Configurar el proyecto.

Dónde se edita qué

Lugar	Para qué
Configurar proyecto → Navegación	Elegir el modo, opciones globales (sidebar clásica TBD, pantalla ancha, TOC, Incluir contenido de ejemplo) y, en modos web, ajustes generales del cascarón
Menú izquierdo → Estructura de la visualización	Añadir, reordenar, duplicar, eliminar y Editar elementos sin salir del editor
Lienzo	En modos por contenedores: clic en un elemento para abrir su espacio y asignar bloques. En modos lineales: insertar y ordenar en la página

La app lo resume así: en Configurar defines la estructura visual (celdas, imágenes, pestañas); la asignación de componentes se hace en el editor.

Modos lineales (desplazamiento y slides)

Abre el proyecto.
En Componentes, busca o recorre categoría → bloque → variación.
El bloque cae en el lienzo (uno debajo de otro, o un paso por slide).
Reordena con el menú del componente (Mover).

Si activaste la barra de navegación lateral clásica de TBD, el aprendiz salta entre secciones; tú sigues editando un único flujo de bloques, no un árbol de páginas.

Estado vacío: ¡Bienvenido, aún no tienes componentes en esta página! Usa el menú izquierdo para empezar.

Modos por contenedores (trabajo en el editor)

Idea clave: elemento ≠ componente

Un elemento es un hueco del mapa: página, celda, tarjeta, pestaña o subenlace.
Un componente es el bloque pedagógico (párrafo, quiz, vídeo…) que asignas a ese hueco.
Un mismo elemento puede llevar varios componentes (la UI indica N componentes asignados).

Hasta que abres un contenedor, el menú de componentes no está pensado para “soltar bloques en el aire”:

Selecciona un elemento para abrir su contenedor. Los componentes solo están disponibles dentro de cada contenedor.
Al abrir: Contenedor abierto: elige un componente de la lista para añadirlo a este elemento.

Flujo habitual

En el lienzo ves el mapa (galería, grilla, menú, páginas).
Clic en un elemento (Clic para abrir y asignar, o Componente asignado — clic para editar).
Entras a Edición del elemento: cabecera con título/subtítulo del elemento y el área del contenido.
Si está vacío: Este elemento aún no tiene componentes — abre el menú lateral y elige un bloque; o edita título/imagen desde la estructura.
Inserta como siempre (categoría → componente → variación). El bloque queda ligado a ese contenedor.
Volver (flecha superior) regresa al mapa general.

Mientras el contenedor está abierto, el menú izquierdo muestra Componentes. Si no hay contenedor abierto, prioriza Estructura de la visualización.

El árbol «Estructura de la visualización»

Título del panel: Estructura de la visualización. Texto de ayuda: Arrastra para reordenar. Pasa el cursor sobre un elemento para ver sus opciones.

Gesto	Efecto
Arrastrar (asa)	Cambia el orden de páginas, celdas, pestañas o subenlaces
Flecha / chevron	Despliega hijos (subenlaces o, en paginación, los bloques de esa página)
Opciones del elemento	Editar, Duplicar, Eliminar
+ Añadir…	Nueva página, elemento, pestaña o subenlace, según el modo

Editar abre un modal con la ficha de ese elemento (los mismos campos que en Configurar, acotados a esa fila). Eliminar pide confirmación (Sí / cancelar). Suele hacer falta dejar al menos un elemento del mismo tipo (no puedes borrar la última página o el último ítem).

Íconos de menú o página: Buscar ícono. Imágenes de celdas o portada: Buscar imagen.

Lienzo en blanco (sin ítems aún)

Si no hay páginas/celdas/pestañas, el mapa puede mostrar solo título y descripción del panel (cuando el modo los tiene). Crea el primer elemento con + Añadir… en la estructura, o activa Incluir contenido de ejemplo al cambiar de modo en Configurar (plantilla de muestra).

Qué editas en cada modo

Ajustes generales (cascarón)

En Configurar (y, según el modo, en la ficha de ajustes):

Opción	Dónde aplica	Qué hace
Título del panel principal	Room, Barra web (y superficies similares)	Cabecera / hero del sitio
Descripción del panel principal	Igual	Texto de presentación
Imagen de fondo	Room y Barra web	Portada del shell
Limitar ancho del contenido	Web Grid y Barra web	Evita que el layout se estire demasiado en pantallas grandes

Web Grid y Web Gallery (elementos / celdas)

Cada ítem es una tarjeta o celda. + Añadir elemento.

Campo	Grid	Gallery
Título	Sí	Sí
Texto / descripción	Sí	Sí
Imagen	Sí	Sí
Columnas y Filas (1–3)	Sí (ocupa más huecos en la cuadrícula)	No
Color de fondo	Sí	No
Componentes del hueco	Sí (se asignan en el editor)	Sí

En el lienzo, el clic abre el contenedor de esa celda.

Paginación (páginas)

+ Añadir página. La barra lateral del visor suele ir ligada a este modo.

Campo	Uso
Nombre de la página	Título en el mapa y en la navegación
Icono de la página	Pictograma en la barra / estructura
Imagen de la página	Apoyo visual del ítem
Texto del botón	Etiqueta del avance (si no hay, un valor tipo Siguiente)
Color del botón	Acento de ese control
Página obligatoria	Puede bloquear el avance hasta completar lo evaluativo de esa página

En la estructura, cada página se despliega y lista los componentes que ya tiene. En el editor, abres la página y añades bloques al menú como en un contenedor.

También puedes ajustar nombre y “página obligatoria” desde el chip Vista previa de la barra (recorrido de páginas del borrador).

My Room y Barra web (pestañas + subenlaces)

Jerarquía:

Pestaña (módulo) — + Añadir pestaña.
Subenlaces dentro de la pestaña — + Añadir subenlace.
Los componentes se asignan al subenlace (el contenido que el aprendiz ve al entrar a esa entrada), no a la pestaña vacía.

Ficha de pestaña

Campo	Room	Barra web
Título de la pestaña	Sí	Sí
Descripción	Sí	Sí
Icono del menú	—	Sí
Título del módulo	—	Sí

Ficha de subenlace: Etiqueta del subenlace, descripción y la lista de componentes asignados.

En la estructura: arrastra pestañas entre sí y subenlaces dentro de su pestaña. Expande con la flecha.

Insertar, quitar y editar bloques en un contenedor

Abre el contenedor (lienzo o, en paginación, la página).
Elige el componente en el menú. Si hay variaciones, elige una.
Edita el bloque con formulario, menú del componente o texto en el lienzo.
Para quitarlo del hueco sin necesariamente destruir todo el proyecto: en la ficha del elemento (modal Editar) usa Quitar componente en Componentes asignados.
Volver al mapa para abrir otro hueco.

Si el hueco ya tiene bloques, el mapa puede mostrar Componente asignado o el recuento. Sigue pudiendo añadir más.

Cambiar de modo cuando ya hay contenido

Pasar a (o desde) un modo web / paginación puede reorganizar o perder piezas. La app avisa: Al cambiar a o desde un modo de visualización web… es probable que se pierda el contenido creado anteriormente. Confirma solo si aceptas el impacto.

Relación con lo que ve el aprendiz

El mapa que editas es el de la vista publicada: portada, TOC, menús y páginas. Quien consume no ve el árbol de estructura ni el modal de edición; ve el resultado de esos contenedores.

Relacionado

Configurar el proyecto · Menú lateral del editor · Insertar variaciones · Barra del editor · Buscar ícono