EDITOR DE MAQUETAS
NinjaMock incluye todos los stenciles típicos para maquetas web y móviles.
Nuestros stenciles se ven esbozadas, como si estuvieran dibujadas a mano. Esto se debe a que ayuda a las personas a concentrarse en la interacción y el contenido de su estructura de diseño en lugar de los colores, el estilo, el diseño detallado y otros aspectos de alta fidelidad.
Los stenciles se organizan en una caja de herramientas en el panel izquierdo de la aplicación y se agrupan según su tipo y uso. Actualmente ofrecemos varios tipos de proyectos (por ejemplo, iOS, Android, Windows Phone, etc.) y para cada tipo de proyecto, la caja de herramientas contiene los stenciles necesarios.
(Android, iPhone, iPad, Windows Phone, Microsoft Surface, sitios web and mano alzada)
Iconos e imágenes
Las maquetas no están completas sin incluir iconos e imágenes. En NinjaMock tienes muchas opciones disponibles para diseñar una interfaz que incluya estos elementos visuales.
Iconos incorporados
Nuestros iconos incorporados utilizan el mismo estilo dibujado a mano que el resto de los elementos del stencil para que todo tu diseño de maqueta tenga un aspecto y una sensación uniformes.
Los iconos incorporados difieren según el tipo de proyecto. Por ejemplo, en los proyectos de maqueta de Android y iPhone, se parecen a los iconos reales de la plataforma dada, pero aún tienen un aspecto esquemático dibujado a mano.
Los iconos incorporados son vectores. Puede cambiar su tamaño e incluso cambiar los rellenos y trazos sin perder calidad.
IconFinder
Si no encuentras lo que necesitas entre nuestros iconos incorporados, también tenemos una integración directa con IconFinder. Simplemente busca iconos en la pestaña Buscador de iconos dentro del editor de maquetas (wireframes/mockups) de NinjaMock, sin tener que salir.
Ten en cuenta que a los iconos de IconFinder no se les puede cambiar sus rellenos o trazos.
Tus imagenes propias
¿Tienea iconos o imágenes en tu computadora que te gustaría usar en tu proyecto? Simplemente carga tus assets visuales en tu almacenamiento personal en nuestros servidores y podrás usarlos en cualquier proyecto. Actualmente proporcionamos a cada usuario 500 MB de espacio libre.
Puede arrastrar y soltar archivos de imagen directamente desde tu escritorio en el editor de maquetas de NinjaMock. Estos archivos se cargarán automáticamente en tu espacio de almacenamiento personal.
Imágenes de la internet
¿Encontraste el icono o la imagen perfecta que necesitas para tu proyecto en la internet? No hay problema, solo copia y pega el enlace al archivo y podrás usarlo sin cargarlo en nuestros servidores.
Solo asegúrate de que esta imagen no se elimine de donde se encuentra.
Puedes arrastrar y soltar una imagen directamente desde un navegador abierto en el lienzo de diseño de NinjaMock. Agregaremos automáticamente la imagen haciendo referencia a la URL de la imagen.
Manually drawn icons
A veces es más conveniente crear tu propio icono cuando no puedes encontrar nada que se ajuste a tus necesidades. Al usar las poderosas herramientas de edición de vectores de NinjaMock puedes crear rápidamente un icono a tu manera.
Sigue estos 3 sencillos pasos para crear tu propio icono:
1. Usa cualquier herramienta de edición de vectores para dibujar lo que necesites.
2. Seleccione los elementos recién dibujados.
3. Click derecho y escoje Exportar selección a -> Mis imágenes....
Tu dibujo vectorial ahora se guardará como una imagen reutilizable en tu espacio personal en nuestros servidores. A partir de ahora, puedes utilizar esta imagen como fuente para cualquier icono. En el siguiente ejemplo, puedes ver un icono dibujado que se usa dentro del elemento de la barra de pestañas (tabs) del iPhone:
Soporte de Video
Ninjamock te permite usar videos externos en tus proyectos simplemente agregando la URL donde se encuentra el video. Ninjamock admite videos de YouTube, Vimeo, Dailymotion y Rumble. También admite archivos de video en formatos como MP4, WEBM y OGG.
Soporte de Emojis
En Ninjamock puedes utilizar emojis estándar en tus proyectos, los cuales se pueden redimensionar y colocar en cualquier lugar de tus proyectos.
Custom stencils
Si no puedes encontrar el stencil que necesitas, puedes hacerlo por tu cuenta directamente en el editor de maquetas (mockup) de NinjaMock. Puedes crear tus propios elementos reutilizables a partir de cualquier selección de objetos que crees en el lienzo de diseño.
Actualmente, los stenciles personalizados solo están disponibles en el proyecto en el que se crean.
Here is how to create your own reusable stencil:
1. Crea lo que necesites utilizando stenciles existentes y/o dibujando elementos únicos (por cierto, tenemos poderosos herramientas de edición de vectores).
2. Selecciona todos los elementos que quieras incluir en tu stencil personalizado.
3. Click derecho, escoje Assets -> Convertir a asset.
El stencil recién creado se agregará al grupo "Mis assets" en la parte inferior de la caja de herramientas, y ahora puedes usarla en cualquier página del proyecto actual.
Puedes modificar el stencil en cualquier momento (clic derecho, escoje Assets -> Editar asset) y tus cambios se aplicarán a todas las instancias del stencil a lo largo de tu proyecto.
Vector graphics
El editor de maquetas de NinjaMock cuenta con potentes herramientas de edición de vectores. Además de elementos simples como líneas, círculos y rectángulos, nuestro editor también incluye un lápiz a mano alzada y una herramienta de lápiz (con soporte de curva Bezier) para crear formas de cualquier tipo.
Las herramientas de edición de vectores se encuentran en la caja de herramientas, al lado izquierdo del lienzo de dibujo.
How drawing tools work?
Las herramientas de dibujo (línea, rectángulo, elipse, pluma y lápiz) funcionan de forma un poco diferente al resto de elementos. Para comenzar a dibujar, elije un punto de partida, manten presionado el botón izquierdo del ratón y mueve el ratón al punto final deseado. Suelta el botón izquierdo del ratón cuando tu figura esté lista. La forma de dibujar es muy parecida al de otras aplicaciones de dibujo profesional que ya conoces.
Si tu dibujo resulta ser del tamaño incorrecto, no te preocupes, siempre puedes cambiarlo después, puedes cambiar su tamaño con el ratón o utilizar el panel de propiedades para realizar ajustes.
Comencemos con las herramientas de dibujo simples:
Line tool
Con la herramienta línea ... ta-da! – dibujar una línea.
Abreviado de teclado: Tecla L.
TPara dibujar una línea recta, manten presionada la tecla "cambio de tecla" (Shift) mientras dibujas. A continuación, la herramienta se ajustará a incrementos de 15 grados para ayudarte.
La herramienta línea produce líneas esbozadas. La aplicación dibuja un camino complejo detrás de escena lo que hace que la línea se vea dibujada a mano. Si necesitas una línea que no sea boceto (completamente recta), puedes utilizar nuestra herramienta pluma o convierte tu línea en un trazado.
Rectangle tool
Con la herramienta rectágulo puedes ... tu-rum – dibujar un rectángulo.
Abreviado de teclado: Tecla R.
Para bloquear la relación de aspecto de la forma, manten pulsada la tecla shift mientras dibujas.
La herramienta rectángulo también produce formas esbozadas al igual que la herramienta línea. Si necesitas un rectángulo no esbozado, puede utilizar nuestra herramienta rectangulo o convierte to rectángulo en un trazado.
Elipse
Con la herramienta de elipse, puedas agregar elipses de gran apariencia a tus proyectos.
Abreviado de teclado: Tecla C.
Para bloquear la relación de aspecto de la forma, manten pulsada la tecla shift mientras dibujas.
Echemos un vistazo a nuestras herramientas vectoriales más avanzadas:
Pen tool
Con la herramienta pluma puedes crear cualquier tipo de polilíneas y polígonos.
Abreviado de teclado: Tecla P.
El lápiz es útil para hacer un boceto rápido de una figura (agregar puntos de control) antes de aplicar Curvas de Bézier con la herramienta de edición de trazado. También puedes agregar curvas de Bézier al agregar tu punto de control simplemente arrastrando mientras agregas un punto.
Consejos sobre el uso de la herramienta pluma:
Para agregar un punto a cualquier trazado existente, seleccione la herramienta pluma y haz clic en cualquier lugar del trazado que desees agregar otro punto.
Para eliminar un punto de un trazado, selecciona la herramienta pluma y haz clic en un punto existente que desees eliminar.
Para cerrar un polígono, simplemente agrega tu último punto directamente encima del primer punto. El cursor del ratón cambiará para indicar que el polígono ahora estará cerrado.
Path edit tool
Con la herramienta de edición de trazado, puede modificar cualquier trazo existente, sin importar cómo se haya creado – ya sea por pluma, lápiz o cualquier otra herramienta de edición de vectores.
Abreviado de teclado: Tecla A.
La herramienta de edición de trazados es útil para realizar ajustes en los trazados, como puntos en movimiento y edición Curvas de Bézier.
Cómo crear una curva usando la herramienta de edición de ruta:
1. Pasa el ratón sobre el punto de ruta que deseas transformar en un punto de control para una curva.
2. Manten presionada la tecla Alt (tecla Opción en Mac) y "jala" el cursor del ratón hacia cualquier lado, lejos del
punto mientras haces clic hacia abajo.
3. Aparecerán las manijas de ajuste de la curva (puntos azules conectados con una línea delgada en la ilustración).
Utiliza estos controladores para ajustar la curva según sea necesario.
4. También puedes volver a convertir una curva en una esquina en forma de ángulo presionando la tecla Alt y haciendo clic en el punto de control.
Pencil tool
Con la herramienta Lápiz puedes crear cualquier dibujo a mano alzada.
Abreviado de teclado: Tecla Y.
Solo asegúrate de tener buenas habilidades para dibujar a mano:-) Una pizarra Wacom u otra tableta de dibujo puede ser útil cuando se usa la herramienta Lápiz.
Hand tool
Puedes utilizar la herramienta Mano para desplazarte por la superficie de diseño. Es conveniente cuando tienes un alto nivel de zoom aplicado y necesitas hacer delicados ajustes de desplazamiento para que las cosas se vean claras.
Abreviado de teclado: Tecla H. Alternativamente, puedes mantener presionada la tecla Espacio y usar el botón izquierdo del ratón para activar temporalmente la herramienta manual. Esto es útil cuando estás utilizando otra herramienta (pluma, por ejemplo) y necesitas desplazarte sin desactivar el lápiz. Simplemente suelta la tecla Espacio y la pluma volverá a ser la herramienta activa una vez más.
Generic shapes
En nuestra caja de herramientas encontrarás muchas figuras vectoriales de uso común.
Estas figuras aparecen en todos los tipos de proyectos (los otros stencils en la caja de herramientas son específicas para un Tipo de proyecto).
Common properties of vector objects
Todos nuestros objetos vectoriales son compatibles con un conjunto de propiedades: pincel de trazo, ancho de trazo y pincel de relleno (cuando corresponda).
Esto te brinda la flexibilidad de dibujar rápidamente una figura en un estilo que coincida con el resto de tu diseño.
Enlaces de página (links)
A veces, puedes optar por agregar solo unos pocos enlaces activos a sus maquetas. En tales casos, puede ser difícil para los espectadores saber en qué elementos de su diseño se puede hacer clic. Por esta razón, hemos incluido la capacidad de activar y desactivar algunos indicadores sutiles de enlace de página al ver un proyecto en los modos de compartir o vista previa. Estas señales proporcionan una indicación visual de los elementos en los que se puede hacer clic que están presentes en cada página de tu diseño.
Si has asignado un enlace de página a cualquier elemento en el modo de diseño, se mostrará el indicador de enlace de página (link) correspondiente en ese elemento cuado se vea el projecto en modo compartido o vista previa.
Los indicadores de enlace de página están activados de forma predeterminada cuando se encuentran en modo de vista previa o de uso compartido, pero se pueden desactivar fácilmente haciendo clic en la botón de enlace (link) en la esquina superior derecha de la página.
Copiado y pegado
Puedes copiar y pegar elementos fácilmente entre páginas o proyectos. Puedes copiar y pegar dentro del mismo proyecto de maqueta, o copiar de un proyecto y pegarlo en otro proyecto que esté abierto en una pestaña, ventana o incluso en un navegador diferente.
Simplemente selecciona los elementos de tu diseño que deseas copiar y usa la tecla Ctrl+C (Cmd+C en Mac) combinación en el teclado para copiar al portapapeles.
Para pegar los elementos que ahora están en el portapapeles, simplemente navega a la página en el proyecto en el que deseas copiarlos y presiona los botones Ctrl+V (Cmd+V en Mac) en tu teclado. ¡Eso es! Los elementos pegados ahora se copian en la nueva ubicación.
Por razones de seguridad, la copia entre pestañas del navegador solo funciona cuando se utilizan métodos abreviados de teclado. No funcionará desde el menú contextual activado con el clic derecho.
Pegar gráficos
NinjaMock es compatible con tu flujo de trabajo incluso cuando trabajas con diseños de alta fidelidad en otras aplicaciones gráficas como Adobe Photoshop. A pesar de que podrías haber terminado con lo conceptual y fases de maquetado (wireframing) de su trabajo de diseño, aún puedes usar NinjaMock fácilmente para continuar tu flujo de trabajo pegando tus diseños de píxeles en NinjaMock. Esto hace que sea fácil para usted distribuir tus diseños visuales pulidos para tus compañeros de trabajo, partes interesadas y clientes para obtener comentarios y aprobación. No ¡no más hilos de correo electrónico pesados o archivos compartidos desordenados para manejar sus revisiones de diseño!
Cuando hayas terminado con tu trabajo de diseño de maquetas en la aplicación gráfica de tu elección, todo lo que necesitas es usar el comando Copiar de la aplicación para copiar los diseños que tienes ahí, regresa a NinjaMock y luego pega tus gráficos en NinjaMock con la combinación de teclas Ctrl+V (Cmd+V en Mac). Ya no tienes que preocuparse por guardar o exportar tu trabajo de diseño como archivos de imagen desde la aplicación degráficos! También puedes utilizar la funcionalidad del portapapeles de tu sistema operativo para copiar los gráficos que tú quieras. Por ejemplo, en un Mac, puedes usar la combinación de teclas Cmd+Ctrl+Shift+4 (en Apple) para abrir el en la selection de copiado en la marquesina del portapapeles, arrastra la selección para que se ajuste a lo que deseas copiar y, a continuación, pégala en NinjaMock.
No se admite la transparencia. Áreas transparentes de los elementos visuales que se copian de otros las aplicaciones se representarán con un fondo blanco.
Debido a ciertas restricciones, este tipo de pegado actualmente no es compatible con el navegador Firefox.
Colaboración
La idea fundamental detrás del maquetado es comunicar tus ideas. Comparte tu trabajo con tus amigos equipo o clientes para obtener comentarios instantáneos y garantizar que todos estén al día con el progreso del proyecto.
Compartir
Con un solo clic, puedes compartir tu proyecto de estructura metálica con cualquier persona. NinjaMock genera automáticamente un enlace secreto especial (p. ej., "ninjamock.com/s/some-code") que luego se puede usar para abrir y ver tu proyecto.
Las personas con las que compartes este enlace no necesitan una cuenta NinjaMock. Esto es particularmente útil para enviar tu trabajo a tus clientes que no utilizan herramientas de maquetado. Aunque tus clientes no tengan una cuenta NinjaMock, aún pueden ver los diseños y comentarios, e incluso agregar sus propios comentarios a su proyecto.
Si alguien que no tiene una cuenta de NinjaMock deja un comentario en su diseño de estructura metálica o maqueta, el autor del comentario se mostrará como "Shadow Ninja #some-number". Esta es una cuenta temporal especial que creamos sobre la marcha específicamente para los no clientes cuando agregan comentarios.
Cómo empezar a compartir tu proyecto:
1. En la barra de navegación superior, haz clic en el botón Compartir.
2. Haga clic en el botón "Comenzar a compartir".
3. Envía el enlace generado automáticamente a quien desees.
Para dejar de compartir tu proyecto, simplemente haga clic en el botón "dejar de compartir" en el mismo cuadro de diálogo. Tu enlace secreto ya no funcionará hasta que comiences a compartir de nuevo.
Partial sharing
Es común que desees compartir con tus clientes solo una parte específica de tu proyecto de maquetado sin que tengan acceso a las secciones que están sin terminar. Es posible que desees seguir trabajando en la siguiente parte del proyecto mientras esperas a que revisen las cosas que están listas. Al usar nuestros estados de página, puede controlar fácilmente qué páginas se comparten y cuáles no.
En la ilustración anterior, solo se comparten las páginas con el estado "Diseño completado" o "Aprobado". Cualquier persona que use el enlace secreto (incluido usted mismo si desea probarlo) no verá ninguna página de estructura metálica que esté marcada como "En progreso".
Startup page
Para probar varios flujos dentro de tu maqueta (mockup), a menudo es útil elegir una página específica en la que te gustaría que tus revisores comenzaran a ver tus diseños. En NinjaMock, puedes configurar la página de inicio directamente en el cuadro de diálogo Compartir.
La página de inicio se guarda dentro del propio proyecto. Esto significa que puedes cambiar la página de inicio en cualquier momento sin enviar toneladas de enlaces secretos diferentes a tus clientes. Cualquier persona que acceda a tu proyecto a través del enlace comenzará en la nueva página de inicio.
Apertura en dispositivos móviless
Los proyectos de NinjaMock también se pueden abrir en tabletas y teléfonos inteligentes, lo que hace que sea muy conveniente ver cómo aparecen tus diseños de maquetas y maquetas en dispositivos específicos.
Trabajar en equipo
Poder compartir un proyecto para revisarlo y recibir comentarios a veces no es suficiente. El editor de maquetas de NinjaMock te permite compartir tu espacio de trabajo y colaborar en tiempo real con tu equipo. Invita a tus socios comerciales y colegas a unirse a tu proyecto y asígnales privilegios para que puedan contribuir directamente.
Se puede invitar a todos a trabajar en el espacio de trabajo compartido. Simplemente envía invitaciones y, si tus invitados aún no tienen una cuenta, simplemente crean su propia cuenta en segundos. ¡Otra gran cosa es que no agotan sus propios proyectos disponibles, si se unen al tuyo! - y no te preocupes - tú eres el jefe o la jefa, y tú decides qué privilegios tendrán tus colaboradores para cada uno de tus proyectos.
Roles de acceso
Los permisos de acceso al espacio de trabajo se definen con el rol asignado al usuario. Hay cuatro roles en NinjaMock: propietario, administrador, diseñador y revisor.
¿Quién puede hacer qué?
Propietario - es el usuario que crea carpetas y proyectos. El propietario tiene control total sobre el proyecto. El propietario invita a los colaboradores y les asigna roles. Cada proyecto creado cuenta para el número de proyectos disponibles del propietario.
Administrador - tiene el control total sobre carpetas y proyectos y puede invitar a otros colaboradores. Los proyectos no cuentan para el número de proyectos de maquetas disponibles para la propia cuenta del administrador.
Diseñador - como cabría esperar, los diseñadores trabajan en el proyecto. Sin embargo, este usuario no podrá administrar a otros usuarios y sus roles. El proyecto tampoco cuenta para el número de proyectos disponibles para la cuenta del diseñador.
Revisor - el rol con menos permisos es el revisor. Como su nombre lo explica, pueden ver el proyecto y comentarlo, pero no podrán diseñar en el proyecto ni cambiar las maquetas. Además, los revisores no pueden administrar a otros usuarios y sus roles. El proyecto no cuenta para el número de proyectos disponibles para la cuenta del revisor.
Compartir el espacio de trabajo
Compartir el espacio de trabajo del proyecto nunca ha sido tan fácil: simplemente haz clic en la opción Equipo dentro del editor del proyecto.
También puedes comenzar a compartir el espacio de trabajo desde tu lista de proyectos de maquetas en la página MIS PROYECTOS mediante la opción Administrar Equipo en el nivel del proyecto, carpeta o cuenta.
Cuando envías invitaciones para compartir tu espacio de trabajo, puedes agregar usuarios de NinjaMock existentes o invitar a nuevos usuarios a crear su propia cuenta de NinjaMock y unirse a tu proyecto.
Puedes añadir tantos colaboradores como quieras.
Gestionar equipo
Como propietario de un proyecto, tienes el control total de tus proyectos de maquetas
El editor de maquetas de NinjaMock te permite establecer privilegios de usuario a nivel de proyecto, carpeta y cuenta. Asigna a tus colaboradores mucho o poco poder sobre el proyecto como desees: conviértelos en administradores, diseñadores o revisores.
La gestión de equipos funciona en tres niveles diferentes: cuenta, carpeta o proyecto. Agrega los permisos y ten una personalización completa de los derechos de acceso y permisos. Los permisos establecidos en el nivel más bajo siempre tendrán prioridad.
Acceso al espacio de trabajo compartido
Si alguien comparte su espacio de trabajo de proyecto contigo, recibirás un correo electrónico con un enlace para acceder al proyecto. Si aún no tienes una cuenta NinjaMock, se te pedirá que creed una. ¡Esto solo toma segundos!
Junto con el acceso al proyecto, se te otorgarán ciertos permisos: administrador, diseñador o revisor. El propietario de la cuenta te otorga estos permisos.
Accede al espacio de trabajo de todos los proyectos (tuyos o compartidos contigo) desde un solo lugar: Mis proyectos. Cambia de cuenta para acceder a sus proyectos.
Además del acceso al proyecto, es posible que se te conceda acceso a carpetas o niveles de cuentas. De esta forma, tendrás los mismos derechos para todos los proyectos de la carpeta o para toda la cuenta.
Los proyectos que se han compartido contigo no afectarán el recuento de proyectos de tu propio plan.
Trabajando juntos
La colaboración en un proyecto significa que todos los usuarios pueden acceder al espacio de trabajo del proyecto y contribuir al proyecto en función de sus privilegios.
Todos los cambios y movimientos se muestran al resto del equipo en tiempo real y se guardan en el servidor.
Estado de la página
Es posible que desees realizar un seguimiento del progreso de tu trabajo para comprender qué tan cerca está de completarse el proyecto. En el editor de maquetas de NinjaMock, tú y sus revisores pueden controlar el estado de las páginas individuales.
Cada página puede tener uno de los siguientes estados "En curso" (estado predeterminado), "Diseño completado" y "Aprobado".
Todos los cambios en el estado de una página se producen manualmente. No hemos implementado ningún flujo de trabajo complejo que dicte quién puede cambiar un estado o en qué momento. En su lugar, hemos decidido mantenerlo simple y flexible; cualquier usuario que tenga acceso a su proyecto puede cambiar cualquier estado en cualquier momento.
El estado de la página se sincroniza en tiempo real, por lo que no es necesario actualizar el navegador para ver el estado más reciente de una página.
Descripción general del proyecto
Para ver el estado de un proyecto de maqueta o wireframe completa en lugar de una página específica, puedes utilizar la página web Descripción general del proyecto. Puedes acceder a él haciendo clic en "Descripción general".
La página Descripción general contiene detalles de todas las páginas del proyecto, como el estado de la página y el número de comentarios sin resolver.
Exportar a PDF/PNG
Exportar PDF e imprimir en papel sigue siendo una parte esencial del maquetado. Muchos creadores de ideas imprimen sus wireframes y los colocan en las paredes de la oficina; algunos los usan como inspiración, otros discuten los diseños en grupo y agregan comentarios directamente en la pared.
En el editor de maquetas de NinjaMock, te brindamos la oportunidad de exportar tus maquetas con enlaces de página y comentarios de página. De esta manera, puedes navegar por la interacción de tu diseño incluso cuando está en papel.
Cuando exportas y elige incluir comentarios, agregamos todos los comentarios al lado de la página.
Los comentarios tienen los mismos números de comentario únicos que tienen en la superficie de diseño de NinjaMock.
Exportar a HTML
También puedes exportar tus proyectos HTML. La exportación como HTML le permite descargar los archivos a su computadora o agregarlos a su propio servidor web para un acceso y almacenamiento convenientes. Esto puede ser útil para compartir sus proyectos con sus socios y clientes.
Los prototipos HTML ofrecen una experiencia más interactiva al previsualizar el trabajo, por ejemplo, permitiéndote escribir texto y marcar casillas check (checkboxes).
Gestion de proyectos
Nos gusta mantener las cosas organizadas dentro del editor de maquetas de NinjaMock. Proporcionamos formas convenientes de agrupar páginas dentro de tus proyectos y también te permitimos organizar tus proyectos dentro de carpetas, tal como los archivos de tu computadora.
Grupos de páginas
Cuando tu proyecto crece y se vuelve más difícil de navegar, es bueno organizar sus páginas en grupos. Por ejemplo, puedes agruparlos por sus respectivas áreas en el diseño de su aplicación; por ejemplo, páginas de inicio de sesión, páginas de configuración, etc., o de cualquier otra forma que desees.
Un grupo de páginas es simplemente un conjunto de páginas con nombre (una página solo puede estar en un grupo a la vez). Puedes crear tantos grupos como necesites, mover páginas entre grupos u ordenarlas dentro de un grupo.
Para crear grupos de páginas, expande el panel Páginas haciendo clic en el icono correspondiente en la esquina superior derecha del panel.
Carpetas de proyectos
Piensa en los archivos de tu computadora por un momento. Cuando tienes demasiados archivos y te resulta difícil encontrar lo que quieres, simplemente creas carpetas y mueves los archivos dentro, ¿verdad?
Hemos reproducido la misma experiencia en NinjaMock; puedes crear carpetas de proyectos, colocar diferentes proyectos de maquetas y wireframes en carpetas, mover carpetas a otras carpetas, etc. Esta es una forma conveniente y familiar de organizar tu trabajo.
Para mover un proyecto (o una carpeta) a una carpeta:
1. Desplaza el cursor sobre el elemento en la lista proyectos.
2. Haz clic en el botón "Mover..." enlace de texto.
3. Selecciona la carpeta de destino y termina haciendo clic en el botón Mover.
Para expandir o contraer la carpeta en la ventana emergente, haz clic en el icono gris de la carpeta.
Guía Rápida - Editor de Maquetas
Comentarios
El editor de maquetas de NinjaMock presenta una forma intuitiva y familiar de dejar comentarios en cada página y realizar un seguimiento de su estado.
Los comentarios son específicos a la página en la que se dejan. Si se elimina una página, sus comentarios correspondientes ya no serán visibles.
Nuestros comentarios se sincronizan en tiempo real, por lo que no es necesario volver a abrir o actualizar el proyecto para obtener los últimos comentarios.
Añadir comentarios
Se pueden agregar nuevos comentarios desde el panel de comentarios en el lado derecho de la superficie de diseño, o simplemente haciendo clic con el botón derecho del ratón en cualquier parte de la maqueta y eligiendo "Agregar comentario" en el menú emergente.
No tenemos restricciones en cuanto a quién puede dejar o editar comentarios. Cualquier persona que abra tu proyecto puede añadir, editar o incluso eliminar cualquier comentario.
Burbuja de comentario
Cada comentario está representado por un icono azul de "burbuja de diálogo" en la superficie de diseño. Dentro de la burbuja de diálogo, se muestra un número de comentario único.
Puedes mover libremente la burbuja a cualquier lugar de la superficie de diseño para ayudar al espectador a comprender a qué elemento de la maqueta se refiere el comentario.
Haz doble clic en el icono del burbuja de diálogo para ver o editar el comentario.
Seguimiento del estado de los comentarios
Cuando se resuelve un comentario, el icono de la burbuja de diálogo aparece atenuado y el comentario se mueve a la parte inferior de la lista en el panel Comentarios. Esto te ayudará a concentrarte en los comentarios activos (sin resolver) que se muestran en la parte superior de la lista de comentarios.
Para comprobar si hay algún comentario sin resolver en todo el proyecto, utiliza el modificador TODO en la parte superior del panel de comentarios. De esta manera, verás comentarios de todas las páginas en lugar de comentarios solo para la página actual.
Haz clic en el icono de burbuja de diálogo de un comentario y te dirigirá directamente a la página en la que se dejó ese comentario. La posición de desplazamiento (scroll) también se ajustará de modo que este icono de burbuja de diálogo se coloque en el centro de la pantalla.
Notificaciones por correo electrónico
El editor de maquetas de NinjaMock también cuenta con notificaciones automáticas por correo electrónico cuando se agregan nuevos comentarios o respuestas.
Como propietario del proyecto, recibirás notificaciones sobre los comentarios de todos los revisores.
Sin embargo, los revisores solo recibirán notificaciones de los hilos de comentarios en los que participan si son usuarios registrados de NinjaMock. Los usuarios que no tengan cuenta en NinjaMock que accedan al proyecto a través del enlace secreto y dejen comentarios no serán notificados.