 --%3E%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 453 453' style='enable-background:new 0 0 453 453;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cpath class='st0' d='M226.5,0C101.6,0,0,101.6,0,226.5S101.6,453,226.5,453S453,351.4,453,226.5S351.4,0,226.5,0z M32.8,225.9 c0-106.5,86.6-193.1,193.1-193.1S419,119.4,419,225.9S332.4,419,225.9,419C119.4,419,32.8,332.4,32.8,225.9z'/%3E%3Cg%3E%3Cpolygon class='st0' points='289.8,375.6 247.8,272.5 229.6,312.6 255.2,375.6 '/%3E%3Cpolygon class='st0' points='165.4,154.8 211.2,267.6 229.5,227.4 165.2,69.5 26.2,376 65.1,375.9 '/%3E%3Cpolygon class='st0' points='308.4,69.5 290.7,110.6 379.2,342.4 392.2,376 426.8,376 '/%3E%3C/g%3E%3C/svg%3E%0A)
Figma es una herramienta de trabajo colaborativo que sirve para diseñar interfaces de usuario.
La aplicación ofrece la posibilidad de instalar extensiones para agilizar algunas tareas.
Mediante el uso del plugin html.to.design podemos convertir de forma automática una página web a un archivo de diseño de Figma.
¿Cómo utilizar la extensión html to design de Figma?
Archivo de diseño
Creamos un nuevo archivo de diseño de Figma haciendo clic sobre el botón que muestra la siguiente captura.
Panel de Recursos
Desde la barra de herramientas superior hacemos clic sobre la séptima opción que corresponde al icono de Recursos y mediante el cual desplegaremos un submenú desde el que podremos acceder a la búsqueda de plugins.
En éste caso si escribimos en el cuadro de búsqueda html se nos irán listando las diferentes opciones que correspondan al criterio de búsqueda.
Hacemos clic en Run de la extensión a ejecutar.
Importar Sitio Web
El plugin nos ofrece varias opciones de importación pero partiendo del supuesto de que muchas veces no contamos más que con la dirección pública del sitio recurriremos a esta opción.
Introducimos la dirección del sitio web y hacemos clic en Importar.
Diseño Figma Importado
La fidelidad del resultado dependerá de la cantidad de elementos bloqueantes que existan en la página aunque incluso siendo así ahorraremos tiempo de trabajo.
