Exportar

Una de las fortalezas de Moqups es que todos los interesados pueden colaborar en línea, en tiempo real, desde donde estén y desde cualquier dispositivo. Pero todavía hay muchos escenarios en los que tiene sentido usar métodos tradicionales y exportar parte, o incluso la totalidad, de tus proyectos de Moqups.

La exportación te permite compartir tu trabajo con personas que pueden estar trabajando en un entorno sin conexión, que no tienen acceso completo a un proyecto en particular o que no tienen una cuenta de Moqups.

Y en proyectos complejos, exportar solo una parte de ese proyecto a veces puede ayudar a centrar la discusión o simplificar la navegación.

¿Quién puede usar esta función?

Puedes exportar proyectos de Moqups como…

Una serie de imágenes en formato PNG o PDF

o

Una versión HTML sin conexión del propio Visor

Moqups también te permite exportar objetos individuales o grupos de objetos.

El siguiente artículo te muestra cómo acceder a la función de Exportación. También explica cada formato de exportación, así como las opciones de exportación disponibles para cada tipo.

Acceder a la exportación

Puedes acceder a la función de Exportación desde…

• La Barra de Herramientas Superior
• El Menú Principal de Moqups
• El Panel de Páginas (usando el Menú Contextual con clic derecho)

Cada uno de estos métodos de acceso abre el Diálogo de Exportar Proyecto, muestra las páginas/carpetas que has seleccionado, te permite elegir tu Formato y Opciones de exportación y te pide que elijas un Destino para tus archivos exportados.

Exportar a PNG, PDF y Visor HTML

En la parte superior del Diálogo de Exportar Proyecto, puedes elegir exportar en formato PNG, PDF o como Visor HTML. Cada uno de estos tipos de exportación tiene ventajas y opciones de exportación específicas.

Exportar como PNG

• Exporta una serie de archivos de imagen PNG individuales.
• Es una buena solución si quieres incrustar esas imágenes en páginas web o editarlas en otro software gráfico.
• Se exporta como mi_nombre_de_proyecto.zip.

Exportar como PNG ofrece cinco Opciones de exportación en el Diálogo de Exportar Proyecto:

• Todas las Páginas o Páginas Seleccionadas:

  Si quieres exportar páginas y/o carpetas seleccionadas, debes seleccionarlas antes de acceder a la función de Exportación.

• Incluir páginas ocultas:

  Seleccionar esta opción incluye las páginas que están configuradas como invisibles en el Árbol de Páginas del Panel de Páginas.

• Recortar a los límites del contenido:

  Habilitar esta opción redimensiona y reposiciona automáticamente tus imágenes exportadas para que se ajusten al contenido visible exacto de tus páginas. Este ahorro de tiempo hace posible incrustar imágenes exportadas en páginas web o wikis, o abrirlas en otras aplicaciones, sin tener que recortar cada una manualmente.

• Fondo transparente:

  Marcar esta opción crea páginas de exportación con fondos transparentes, lo que permite que las imágenes resultantes se integren perfectamente en otros diseños y obras de arte.

• Escala:

  Elige 1x para imágenes de resolución estándar con un tamaño de archivo menor; 2x para imágenes de alta resolución lo suficientemente nítidas para imprimir y que se vean bien en la mayoría de las pantallas; 3x para compatibilidad con las pantallas de los dispositivos más nuevos.

Exportar como PDF

• Es ideal para compartir o imprimir proyectos con múltiples páginas.
• Conserva los enlaces y las zonas activas en el propio PDF, convirtiendo el archivo PDF en un prototipo interactivo que se puede enviar por correo electrónico.
• Incluye una Tabla de Contenidos jerárquica que proporciona una visión clara de la estructura de tu página y facilita la navegación.
• Permite proteger tu archivo con contraseña
• Se exporta como 'mi_nombre_de_proyecto.pdf'.

Exportar como PDF ofrece tres Opciones de exportación en el Diálogo de Exportar Proyecto:

• Todas las Páginas o Páginas Seleccionadas:

  Si quieres exportar páginas y/o carpetas seleccionadas, debes seleccionarlas antes de acceder a la función de Exportación.

• Incluir páginas ocultas:

  Seleccionar esta opción incluye las páginas que están configuradas como invisibles en el Árbol de Páginas del Panel de Páginas.

• Protegido con contraseña:

  Seleccionar esta opción te permite añadir una capa adicional de seguridad estableciendo una contraseña para tu PDF exportado. Moqups no registra ni almacena la contraseña que eliges.

Exportar como Visor HTML

• Descarga un prototipo completamente interactivo que se puede ver sin conexión.
• Incluye todas las Interacciones y Comentarios de tu proyecto, y muestra la Barra de Herramientas Superior del proyecto, así como los Paneles de Páginas y Comentarios.
• Los archivos del Visor HTML exportados pueden alojarse en entornos restrictivos como servidores de intranet detrás de un cortafuegos, o distribuirse a través de soluciones corporativas de gestión de documentos como Microsoft SharePoint.
• Se exporta como mi_nombre_de_proyecto.zip.
• El archivo zip contiene todos los archivos dependientes. Para ver, extrae el archivo y haz clic en el archivo del Visor HTML para abrirlo en tu navegador.

Seleccionar páginas para exportar

Exportar a PNG y PDF permiten exportar todo el proyecto o seleccionar páginas específicas. Si quieres exportar páginas y/o carpetas seleccionadas, debes seleccionarlas antes de acceder a la función de Exportación:

• Para seleccionar una página o carpeta individual, haz clic en ese elemento en el Árbol de Páginas.

o

• Para seleccionar una serie consecutiva de páginas o carpetas para exportar, haz clic en el primer elemento de la lista. Luego, mantén presionada la tecla Shift mientras haces clic simultáneamente en el último elemento que deseas como parte de esa serie secuencial.

o

• Para seleccionar múltiples páginas o carpetas no consecutivas, mantén presionada la tecla Ctrl/Cmd y haz tu selección elemento por elemento.

Seleccionar destino de exportación

En el Diálogo de Exportación, elige un destino para tu proyecto exportado:

• Descargar:

  Exporta a la carpeta de Descargas en tu ordenador.

• Google Drive:

  Exporta directamente a la carpeta Mi Unidad en tu Google Drive. (La primera vez que uses esta función, Moqups te pedirá que autorices y conectes con Google Drive). Obtén más información sobre nuestra integración con Google Drive.

• Dropbox:

  Exporta tu proyecto directamente a la carpeta Aplicaciones → Moqups de tu cuenta de Dropbox. (La primera vez que uses esta función, Moqups te pedirá que autorices y conectes con Dropbox). Obtén más información sobre nuestra integración con Dropbox.

• Box:

  Exporta tu proyecto directamente a la carpeta Todos los Archivos de tu cuenta de Box. (La primera vez que uses esta función, Moqups te pedirá que otorgues acceso y conectes con Box). Obtén más información sobre nuestra integración con Box.

Enlace de exportación

Si quieres compartir un enlace directo a la página o proyecto exportado, en lugar de enviar el archivo exportado como adjunto, simplemente haz clic derecho en el enlace de descarga y copia la URL. El enlace seguro S3 expirará después de 4 horas.

Exportar un Objeto o Selección de Objetos

Puedes exportar objetos individuales o múltiples en formato PNG. Esta función es extremadamente útil si quieres exportar solo una parte de tu página, por ejemplo, descargar los diferentes estados de un botón de una vez.

Y, si estás construyendo un sitio web o una aplicación, esto significa que los recursos que creas dentro de Moqups pueden incluirse en tu producto final, extendiendo su utilidad mucho después de que hayas terminado con los prototipos temporales.

Para exportar un objeto o grupo de objetos:

1. Selecciona el/los objeto(s) que deseas exportar.

2. Haz clic derecho en tu selección y elige Exportar selección del Menú Contextual.

3. Selecciona la escala de tu exportación:

• PNG@1x (imágenes de resolución estándar con un tamaño de archivo menor)
• PNG@2x (imágenes de alta resolución listas para imprimir)
• PNG@3x (compatibles con las pantallas de los dispositivos más nuevos)

4. Ten en cuenta que Exportar Selección combina las capas de un grupo de objetos y exporta el grupo como un único archivo, en lugar de como múltiples archivos.

Entrega de propiedades de objetos y código CSS/JSX

El Panel de Entrega al Desarrollador te permite obtener las Propiedades y el código CSS o JSX de uno o más objetos en la página.

Esto es útil cuando estás trabajando en una prueba de concepto con diseñadores gráficos y desarrolladores. Estas especificaciones pueden ayudar a acelerar el desarrollo y dar una idea de cómo se verán los elementos de la página una vez implementados.

La sección de Propiedades muestra las especificaciones (coordenadas, tamaño, altura de línea, fuentes y colores) de un único objeto cuando lo seleccionas, o del grupo completo cuando seleccionas múltiples objetos.

La sección de Código muestra el CSS o JSX de objetos individuales o múltiples cuando los seleccionas, e incluye una clase de grupo si los objetos han sido formalmente agrupados.

Usa el botón de Configuración en la parte superior derecha del panel para elegir tu:

• Formato de color (RGB o Hex)
• Unidad de longitud (píxeles o rem)
• Formato de código (CSS o JSX)

Para copiar el código CSS o JSX:

1. Selecciona uno o más objetos en la página
2. Haz clic en el botón Entrega en el Menú Superior para abrir o cerrar el panel
3. Usa el menú de Configuración para elegir entre el código CSS y JSX
4. Haz clic en el botón Copiar al portapapeles para obtener el código

También puedes copiar el CSS de uno o más objetos seleccionándolos y usando la opción Copiar CSS del Menú Contextual con clic derecho, y luego pégalo donde necesites el código.

Preguntas y respuestas

¿La Exportación incluye objetos fuera de la página, en el lienzo?

Para los formatos PNG y PDF, la Exportación recorta cualquier contenido fuera del margen de la página. Por otro lado, Exportar como Visor HTML funciona igual que el Visor de la aplicación; mostrará objetos fuera de los márgenes de la página a menos que hayas seleccionado Ocultar contenido fuera de las páginas en las opciones de Configuración de Página del Espacio de Trabajo.

¿Qué interacciones funcionan en un PDF exportado?

Todas las Interacciones de Página funcionan con normalidad, con la excepción de Volver Atrás, que depende del historial de tu navegador para la dirección. Las Interacciones de Objeto no funcionan en PDFs.

Si quieres proporcionar a los interesados un prototipo completamente funcional, invítalos como invitados del proyecto o comparte un enlace del proyecto. Aprende a hacer ambas cosas en Compartir. Para exportar todas las interacciones, usa Exportar como Visor HTML.

¿Hay alguna forma de incluir comentarios de página durante la exportación?

Exportar como Visor HTML incluye los Comentarios y el Panel de Comentarios. No hay forma de exportar comentarios en formato PDF o PNG, pero si quieres incluir un comentario esencial en estos formatos, siempre puedes añadir una nota o un stencil de llamada a la página antes de exportar.