Quién puede hacerlo: Todos los usuarios
Cuáles planes: Todos los planes
Cuáles plataformas: Navegador, Escritorio, Móvil
Usa la biblioteca de prototipos para construir diseños de prototipos directamente en el lienzo de Miro. La biblioteca incluye pantallas, componentes de interfaz de usuario e íconos que te ayudan a visualizar flujos y estructurar ideas desde el principio.
Puedes usar la biblioteca de prototipos para crear prototipos estáticos. Funciones como componentes avanzados, líneas de conexión y vista previa interactiva requieren el complemento de Miro Prototypes.
La biblioteca de Prototipos tiene todo lo que necesitas para crear manualmente flujos de una o varias pantallas en Miro
Abre la biblioteca de Prototipos
- En el lienzo, desde la barra de creación haz clic en Herramientas, Medios e Integraciones (
).
- Busca y encuentra Prototipos, luego haz clic en Biblioteca de prototipos.
- Se abre el panel de la Biblioteca de prototipos.
¿Qué contiene la biblioteca de prototipos?
La Biblioteca de prototipos está organizada en pestañas. Todos los usuarios pueden utilizar la biblioteca para ensamblar diseños de prototipos estáticos usando pantallas, componentes de interfaz de usuario e iconos.
💡 Para prototipos generados por IA y flujos interactivos, utiliza la biblioteca de Prototipos junto con Miro Prototypes.
Pantallas
Pantallas son marcos prediseñados para flujos de prototipado. Puedes agregar pantallas de Móvil, Tableta o Escritorio a tu lienzo y construir diseños arrastrando elementos de interfaz de usuario sobre ellos.
Trabajar con pantallas
- Mostrar u ocultar el marco de la pantalla (para que parezca un marco de dispositivo o un simple marco)
- Rotar una pantalla
- Redimensionar una pantalla arrastrando para extender su altura (solo verticalmente)
Componentes de IU
Los componentes de IU son elementos comunes de interfaz que puedes arrastrar a las pantallas, tales como botones, campos de entrada, barras de navegación y elementos de formularios.
Puedes:
- Arrastrar componentes a una pantalla
- Redimensionar y reposicionar componentes
- Editar texto y estilo básico desde el menú contextual
✏️ Las opciones del menú contextual varían dependiendo del elemento que selecciones.
Cuando se habilita el Miro Prototypes add-on, algunos componentes de la UI se vuelven interactivos en modo de vista previa. Por ejemplo, botones, deslizadores, campos de entrada y menús desplegables responden a las acciones del usuario según las líneas de conexión que hayas definido.
Algunos conjuntos de componentes, como los componentes avanzados, están disponibles solo con el Miro Prototypes add-on. Si el complemento no está habilitado, estos componentes pueden aparecer en la biblioteca con un indicador.
Íconos
La pestaña de Íconos incluye una biblioteca de íconos que puedes buscar y usar en tus prototipos.
Agregar o reemplazar un ícono
- Arrastra un ícono desde la biblioteca al lienzo.
- Selecciona el ícono para actualizar su color desde el menú contextual.
- Elige Reemplazar ícono para intercambiarlo por otro sin cambiar su posición ni tamaño.
Esquemas de página (legado)
La pestaña de Esquemas de página contiene elementos de esquemas de página heredados. Estos elementos siguen disponibles y editables para los tableros existentes, pero los prototipos nuevos deben usar pantallas y componentes de interfaz de usuario de la biblioteca de prototipos.
Líneas de conector e interactividad (complemento de Miro Prototypes)
Las líneas de conexión te permiten definir la navegación entre pantallas en un prototipo. Cuando el Miro Prototypes add-on está habilitado, puedes crear líneas de conexión entre elementos y pantallas para construir flujos de múltiples pasos.
Las líneas de conexión también habilitan la vista previa interactiva. En el modo de vista previa, las pantallas conectadas se comportan como un flujo clicleable, y las pantallas se desplazan verticalmente si se extienden más allá del viewport. Sin el add-on, las líneas de conexión y el comportamiento interactivo no están disponibles.
💡 Algunos elementos de la interfaz de usuario muestran un ícono de rayo cuando se añaden a una pantalla. En flujos de varias pantallas, arrastra el ícono de rayo para crear una línea de conexión entre pantallas.