Vista de enfoque del Dev Mode

Es habitual que quieras inspeccionar ciertos diseños en detalle cuando exploras las secciones, los marcos y los componentes disponibles en la vista Listo para su desarrollo en el Dev Mode. La vista de enfoque de este modo te permite apreciar estos detalles y ofrece las siguientes funciones:

• Todas las herramientas que tienes normalmente disponibles en la barra de herramientas del Dev Mode.
• Las pestañas Inspección y Complementos, a las que accedes en la experiencia completa del Dev Mode.
• Un historial de versiones con descripciones específicas para el diseño que estás visualizando, de tal forma que puedas comparar las distintas versiones y los cambios que se han ido sucediendo a lo largo del tiempo.
• Una forma sencilla de expandir y explorar las capas de los diseños que estén listos para su desarrollo.
• La posibilidad de marcar trabajos como completados para un diseño concreto.

Para acceder a la vista de enfoque:

1. Abre un archivo de Figma Design.

2. Haz clic en Listo para su desarrollo en la barra lateral izquierda.

   Al abrirse la vista Listo para su desarrollo, se muestra una lista con todos los diseños marcados con el estado de desarrollo.

3. Haz clic en el diseño en el que deseas centrarte.

También puedes hacerlo de la siguiente manera:

1. Abre un archivo de Figma Design.

2. Cuando estés en el lienzo del diseño seleccionado, haz clic en el estado de desarrollo y selecciona Mostrar en vista de enfoque.

   

3. Si lo deseas, puedes hacer clic en Copiar enlace a vista de enfoque para compartir el diseño.

La vista de enfoque se abre y muestra lo siguiente:

• El diseño que querías inspeccionar aparece en el centro de la vista de enfoque. Puedes utilizar las herramientas del Dev Mode para realizar acciones como medir, hacer anotaciones o añadir comentarios en el diseño.
• Las pestañas Inspección y Complementos, en las que puedes realizar acciones como generar código, ver las propiedades del diseño, realizar exportaciones y descargas, y ejecutar complementos del Dev Mode.
• El botón Marcar como completado, que se utiliza para confirmar que el trabajo de desarrollo del diseño ya se ha realizado.

Aprender a utilizarlo

En la vista de enfoque, Figma te permite acceder a otras áreas del Dev Mode de varias formas.

Para acceder a la vista Listo para su desarrollo, haz clic en Listo para su desarrollo, en la esquina superior izquierda de la vista de enfoque.

Para ver el diseño sobre el lienzo, haz clic en , en la esquina superior derecha, y después selecciona Mostrar en página.

Para volver al área de la interfaz de Figma que estabas utilizando antes de entrar en la vista de enfoque, haz clic en , en la esquina superior derecha de la vista de enfoque. Si accediste a la vista de enfoque desde el lienzo, se te redirigirá a la posición del lienzo en que te encontraras. Si accediste a través de un enlace o desde la vista Listo para su desarrollo, se te devolverá a esta vista.

Explorar capas

La vista de enfoque permite explorar las capas de un diseño de forma sencilla e individualizada. El panel de capas de la vista de enfoque aparece al seleccionar una o varias partes de un diseño.

Paneles Inspección y Complementos

Los paneles Inspección y Complementos son los mismos que tienes a tu disposición en el Dev Mode, pero limitados a las características del diseño que estás visualizando. Para aprender a usar estos paneles, consulta la Guía del Dev Mode →

Historial de versiones

La vista de enfoque incluye un historial de versiones anotado para realizar un seguimiento de los cambios del diseño, similar al historial de versiones de los archivos.

Generalmente, el historial de versiones del archivo completo muestra todas sus variantes. Sin embargo, en ocasiones se realizan muchos cambios y es posible que tan solo te interesen los de un marco o una sección que estás revisando e implementando. Aunque el historial en la vista de enfoque te muestra las versiones y los trabajos de la misma forma que el historial del archivo completo, este se centra únicamente en las que afectan al diseño que hayas abierto en la vista de enfoque.

A medida que los equipos de diseño y desarrollo van trabajando en el diseño, actualizan el estado y agregan notas para describir los cambios. Cada vez que se actualiza el estado, se añade una entrada en el historial de versiones. Puedes comparar varias para ver los cambios que se han realizado en cada cambio de fase.

Puedes inspeccionar versiones antiguas, copiar un enlace para acceder a la que desees o compararla con la última versión de tu archivo. Obtén más información sobre cómo hacer comparados en el Dev Mode →

Marcar como completado

Para mostrar que el trabajo de desarrollo de un diseño ya se ha terminado, utiliza el botón Marcar como completado en la parte superior de la vista de enfoque.

Cuando un diseño se marca como completado, se añade una nueva entrada al historial de versiones y el diseño sigue disponible en la vista Listo para su desarrollo para las siguientes iteraciones.