UiChemy

¿Te cuesta convertir tus bonitos diseños de Figma en un sitio web de WordPress que funcione?

Lo entendemos: dar vida a tus diseños Figma puede ser un verdadero quebradero de cabeza. De hecho, nuestros lectores nos piden consejo a menudo sobre cómo superar este obstáculo (hasta el punto de que recientemente hemos lanzado nuestros propios servicios de diseño para WordPress).

Por eso estamos tan emocionados de echar un vistazo a UiChemy. Este plugin promete convertir tus diseños de Figma en disposiciones de WordPress. A continuación, puede editar estas disposiciones y publicarlas, al igual que cualquier página normal creada en el editor de bloques de WordPress.

¿Prefieres utilizar un maquetador de páginas? UiChemy también puede convertir tus diseños de Figma en plantillas de Elementor o Bricks Builder, con sólo unos clics.

¿Podría ser UiChemy la herramienta que has estado buscando para ahorrar tiempo? Averigüémoslo en esta detallada reseña / valoración de UiChemy.

Reseña / valoración de UiChemy: ¿Por qué usarlo en WordPress?

UiChemy promete ahorrarle tiempo y agilizar el proceso de diseño web, convirtiendo sus diseños Figma en sitios web WordPress en vivo.

A diferencia de otros plugins de Figma, este no es un conversor de código Figma a HTML, por lo que no añade código HTML a tus diseños.

En su lugar, se integra directamente con Figma, el editor de bloques o tu maquetador de páginas preferido. Una vez hecho esto, puedes enviar el archivo Figma directamente a tu sitio web de WordPress. Por último, puedes ajustar el diseño con Elementor, Bricks Builder o el editor de bloques integrado de WordPress.

Como puedes ver, UiChemy funciona a la perfección con todas estas plataformas, por lo que no necesitas escribir ningún código ni contratar a un desarrollador de WordPress para convertir tus diseños.

Si estás empezando o tienes un presupuesto limitado, puedes exportar hasta 10 diseños Figma al mes utilizando el plugin gratuito UiChemy.

Este plugin también viene con 10 plantillas de inicio Figma que están diseñadas para funcionar perfectamente con WordPress. También viene con algunas herramientas esenciales para ayudarte a crear sitios web adaptables a dispositivos móviles, incluida una versión lite del Responsive Manager de UiChemy.

Si quieres exportar más de 10 diseños al mes, tendrás que hacer una actualización. Los planes premium de UiChemy también incluyen plantillas adicionales, etiquetado avanzado y una versión más avanzada del Responsive Manager.

UiChemy reseña / valoración: ¿El convertidor de Figma a WordPress adecuado para usted?

Imagina esto: has pasado incontables horas creando un diseño impresionante en Figma. Estás contento con cada detalle, pero ahora es el momento de traducir esa visión en un blog de WordPress que funcione.

UiChemy pretende salvar esta distancia entre diseño y desarrollo. Promete guardarle o ahorrarle tiempo, al tiempo que se asegura de que el sitio web terminado refleje perfectamente su diseño original.

¿Cumple UiChemy estas afirmaciones? Averigüémoslo.

1. Facilidad de uso

UiChemy se ha diseñado pensando en la facilidad de uso. Para empezar, puedes instalarlo y activarlo como cualquier otro plugin de WordPress y, a continuación, seguir las instrucciones que aparecen en pantalla para conectar WordPress a tu cuenta de Figma.

Una vez hecho esto, UiChemy actúa como un conector que obtiene tus diseños de Figma. De hecho, usted puede empujar sus diseños Figma directamente en WordPress utilizando el plugin UiChemy.

Como alternativa, UiChemy puede exportar manualmente tus plantillas como un archivo JSON, listo para que lo importes a WordPress más adelante. Si has creado varias disposiciones, UiChemy también puede descargarlas todas juntas en un archivo ZIP para organizarlas fácilmente.

2. Convertir los nombramientos con una precisión del 95

Recrear manualmente diseños en WordPress puede ser todo un reto. Con demasiada frecuencia, hay diferencias entre el diseño original y el producto acabado.

En cambio, UiChemy promete convertir tus diseños con una precisión del 90%-95%. Eso sí, ten en cuenta que tendrás que seguir algunas buenas prácticas de diseño para obtener los mejores resultados, como crear un diseño flexible y apto para dispositivos móviles.

3. Ajustes flexibles de importación y visualización

Puedes controlar exactamente cómo UiChemy importa los diseños a tu sitio web.

Dependiendo de los plugins y extensiones de WordPress que haya instalado, puede importar su diseño como una nueva página de WordPress, una nueva plantilla de Elementor o una nueva plantilla de NexterWP.

También puede sustituir o actualizar una plantilla o página existente con el diseño importado. Por último, puede añadir el diseño Figma a cualquier página o plantilla existente.

De este modo, puede controlar exactamente cómo se utiliza el diseño en su sitio web, blog o tienda en línea.

4. Se integra con Elementor

UiChemy se integra tanto con la versión gratuita como con la versión profesional de Elementor. Sin embargo, si tu diseño utiliza widgets pro de Elementor como el formulario de contacto, entonces tendrás que comprar un plan premium de UiChemy.

Como ya se ha mencionado, UiChemy no es un conversor de código Figma a HTML. En lugar de añadir código HTML, convierte tus diseños Figma utilizando el widget establecido de Elementor.

UiChemy es compatible con más de 30 widgets de Elementor, además de otros 30 widgets proporcionados por Plus Addons para Elementor. Dicho esto, no deberías tener problemas para convertir tu diseño Figma en una plantilla compatible con Elementor.

5. Etiquetado de widgets Elementor

Cuando exportes un diseño a Elementor, UiChemy convertirá esos elementos de diseño en widgets comunes como encabezados, imágenes e iconos.

Sin embargo, UiChemy es compatible con una gama más amplia de widgets de Elementor que puede que quieras utilizar en su lugar. Teniendo esto en cuenta, puedes asignar manualmente un elemento de diseño específico de Figma a un widget específico de Elementor. Este proceso se conoce como etiquetado manual.

De este modo, puedes controlar exactamente cómo convierte UiChemy tus diseños en widgets y plantillas de Elementor.

6. Diseños adaptados a dispositivos móviles

Cuando se trata de crear un sitio web adaptable en Figma, es importante utilizar la disposición automática en lugar de la posición absoluta.

Para ayudarte, UiChemy dispone de una herramienta de optimización de marcos que detecta los marcos que no utilizan la disposición automática. A continuación, puede aplicar Auto Layout con sólo unos pocos clics.

7. Gestor y calculadora adaptables

Al exportar tus diseños, el Responsive Manager de UiChemy puede optimizar tu disposición para dispositivos móviles. Aquí puedes introducir los valores que quieres utilizar en tablets y smartphones.

Para obtener los mejores resultados tendrás que proporcionar cada valor móvil como un porcentaje del valor total de escritorio. Esto puede resultar confuso, así que te alegrará saber que UiChemy también ofrece una calculadora adaptable.

Sólo tienes que introducir el valor que deseas utilizar en los dispositivos móviles, por ejemplo 10 píxeles. UiChemy lo calculará como porcentaje.

Una vez hecho esto, sólo tienes que añadir el porcentaje en el Gestor de diseño adaptable. De este modo, puedes estar seguro de que tu estructura / disposición / diseño / plantilla se mostrará correctamente en smartphones y tablets, sin que tengas que hacer tú mismo los cálculos.

8. Es compatible con / dar soporte a la estructura / disposición / diseño / plantilla absoluta

Aunque UiChemy recomienda utilizar la disposición automática, también es compatible con la disposición absoluta.

Cuando exportes una disposición que contenga objetos absolutos, UiChemy utilizará la posición absoluta CSS para garantizar que esos objetos permanezcan exactamente en la misma posición dentro de la disposición importada.

9. Importación en directo

Puede exportar sus diseños Figma como una vista previa en vivo. Esto puede ahorrarle mucho tiempo y esfuerzo en comparación con la descarga y subida manual de sus archivos de diseño. Esto es especialmente cierto si quieres probar un montón de diseños diferentes.

Incluso puedes añadir varias disposiciones al mismo archivo, como disposiciones para diferentes páginas de tu sitio web de WordPress. Una vez hecho esto, UiChemy puede crear una única vista previa con todas estas características y puedes cambiar entre ellas con un solo clic.

10. Compañero de optimización

UiChemy incorpora un compañero de optimización que puede ayudarle a mejorar la precisión y la calidad del diseño importado.

Esta herramienta detectará automáticamente cualquier problema con su diseño.

A continuación, agrupará estos problemas en 4 pestañas: Optimización de medios, Fase de optimización del marco, Optimización del texto y Optimización del marco principal. Por ejemplo, si has creado una imagen vectorial utilizando varios elementos, UiChemy lo marcará como un problema potencial y te sugerirá que bloquees el grupo para que se exporte como una sola imagen.

A menudo, puedes resolver estas direcciones simplemente al hacer clic en los botones “Corregir” o “Corregir todo” de UiChemy. UiChemy resolverá el problema por ti.

11. Optimización del bastidor principal

UiChemy puede explorar el marco principal de tu diseño en busca de propiedades que normalmente se ignoran en la plantilla exportada. Esto incluye espacio, relleno horizontal, relleno vertical y alineación.

Aunque estas propiedades se suelen ignorar, incluirlas en el archivo exportado a veces puede dar resultados impredecibles. Dicho esto, la herramienta Main Frame Optimization de UiChemy puede identificar y eliminar estas propiedades con sólo unos clics.

12. Detectar y combinar SVG automáticamente

Por defecto, Figma divide las imágenes SVG y los iconos en secciones separadas. Sin embargo, esto puede causar problemas a la hora de importar ese diseño a WordPress.

Para resolver este problema, UiChemy puede detectar automáticamente los SVG y sus elementos, y luego exportarlos como un único archivo SVG.

También puedes etiquetar el elemento en un widget o utilizar la característica de bloqueo de UiChemy para combinar varios elementos en una sola imagen. Esto te da más control sobre cómo UiChemy gestiona los archivos SVG de tu diseño.

13. Bloqueo de objetos

Por defecto, UiChemy exportará cada elemento de diseño como un elemento individual. Sin embargo, a veces puedes crear un único objeto utilizando varios elementos. Por ejemplo, puedes crear una cabecera utilizando una imagen de banner, un botón de llamada a la acción y texto.

En ese caso, UiChemy puede bloquear estos elementos juntos y exportarlos como una sola imagen. A menudo, esto reduce el tamaño del archivo exportado, ya que se exportan menos elementos individuales. De este modo, su sitio web, blog o mercado en línea será más fácil de mantener.

14. Acelerar las importaciones

Por defecto, UiChemy importa las imágenes directamente desde tu diseño Figma. Esto puede ralentizar la importación si tu diseño tiene muchas imágenes, o si no has optimizado esos gráficos. Dicho esto, es importante optimizar tus imágenes antes de añadirlas a Figma.

En su defecto, UiChemy puede importar tu disposición / diseño / plantilla de Figma sin ninguna imagen. Esta puede ser una buena opción si el diseñador original no siguió las mejores prácticas. También es una buena opción si tu diseño Figma tiene características de marcadores de posición que planeas reemplazar de todos modos.

Otra opción es exportar el diseño con imágenes a escala. Simplemente escriba el valor de escala que desea utilizar, y UiChemy exportará la disposición con gráficos redimensionados.

15. Biblioteca de plantillas incorporada

Para ayudarle a crear hermosas disposiciones, rápido, UiChemcy viene con una colección prediseñada de plantillas Figma.

Todas estas plantillas están optimizadas para WordPress, por lo que puedes importar fácilmente el diseño terminado al editor de bloques, Elementor o Bricks Builder. Por ejemplo, todos los componentes de las plantillas de UiChemy están preetiquetados con los widgets correspondientes, por lo que no es necesario etiquetarlos manualmente.

UiChemy viene con 3 tipos de plantillas: Página, Sección y Componente. Para empezar, las plantillas de Página crean una nueva página de nivel superior que sigue todas las directrices de diseño de UiChemy.

También hay plantillas de Sección, que puedes utilizar dentro de cualquier plantilla de Página. Por último, las plantillas Componente de UiChemy proporcionan elementos individuales, por lo que son perfectas para añadir a la capa de edición actual.

16. Apoyo comunitario y profesional

UiChemy promete guardarte una tonelada de tiempo y esfuerzo, convirtiendo automáticamente tus diseños Figma en vistas previas, páginas y sitios web de WordPress en vivo. Sin embargo, por el camino puedes necesitar ayuda extra para crear páginas de alta conversión y sitios web increíbles.

Para empezar, UiChemy cuenta con documentación en línea a la que puedes acceder las 24 horas del día, los 7 días de la semana. Aquí encontrarás guías paso a paso sobre cómo establecer y utilizar el plugin, además de una útil guía para diagnosticar problemas.

Además, el equipo de UiChemy ha creado tutoriales en vídeo, seminarios web y un archivo de la comunidad educativa que puedes importar a tu cuenta de Figma. Este archivo contiene directrices de diseño, plantillas y ejemplos de cómo utilizar el nombramiento manual en tus diseños de Figma.

¿Prefieres soporte personalizado? Entonces puedes actualizar al plan Premium y obtener ayuda a través del chat en directo o del servicio de asistencia. Según el sitio web de UiChemy, normalmente puedes esperar una respuesta en 24 horas, excepto los fines de semana.

Si utilizas el plugin gratuito, puedes enviar entradas al foro de UiChemy en WordPress.org y obtener respuestas a preguntas básicas.

Al publicar en foros de soporte públicos, siempre es una buena idea incluir tanta información como sea posible, para que los expertos puedan entender su problema completamente y dar una respuesta útil. Para más información sobre este debate, consulta nuestra guía sobre cómo solicitar soporte de WordPress correctamente.

Reseña / valoración de UiChemy: Precios y Planes

Si estás empezando o tienes un presupuesto limitado, puedes descargar la versión lite de UiChemy desde WordPress.org.

Con este plugin gratuito, puede exportar 10 diseños Figma al mes. Ten en cuenta que cada página cuenta para esa cuota. El plan gratuito también viene con 10 plantillas de inicio y soporte básico.

Para exportar más de 10 páginas al mes o utilizar características avanzadas, necesitarás una actualización.

Hay 2 planes para elegir:

• Pro. Por 19 $ al mes, podrás exportar hasta 100 diseños. También obtendrás más de 50 plantillas profesionales para usar en tus diseños.
• Acceso total. Tras invertir en el plan All Access (cuyo precio es de 49 $), podrás exportar hasta 500 diseños al mes. También puedes compartir UiChemy con hasta otros 5 usuarios de Figma. Dicho esto, este plan es perfecto para equipos o agencias de desarrollo de WordPress que necesiten crear muchos diseños y acceder a características más avanzadas.

Independientemente del plan que compres, tus diseños exportados permanecerán intactos aunque caduque tu licencia de UiChemy.

UiChemy reseña / valoración: ¿El convertidor de Figma a WordPress adecuado para usted?

Para resumir esta reseña / valoración de UiChemy, estamos seguros de que es un gran plugin para agilizar tu flujo de trabajo Figma-to-WordPress.

UiChemy es una solución fácil para los diseñadores o propietarios de sitios web que quieren traducir sus diseños en diseños de WordPress que funcionan. Es compatible con el editor de bloques, pero también se integra perfectamente con Elementor y Bricks Builder. Esto significa que puedes editar y gestionar los diseños importados utilizando tu maquetador de páginas de WordPress preferido.

Si solo desea exportar un pequeño número de diseños Figma, el plan gratuito es un buen punto de partida. Sin embargo, normalmente necesitarás el plan premium si quieres diseñar un sitio web entero o gestionar varios sitios diferentes.

Esperamos que esta reseña / valoración de UiChemy te haya ayudado a decidir si es el conversor Figma-to-WordPress adecuado para ti. A continuación, puede que desee ver nuestra guía sobre cómo aumentar la velocidad y el rendimiento de WordPress, o comprobar nuestra selección de expertos de los mejores plugins de formulario de contacto.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.