Durante el desarrollo de productos digitales usamos diferentes herramientas que nos ayudan a agilizar diferentes fases del proceso. Si usas Figma, por ejemplo, puedes encontrar muchas herramientas de este tipo a través de sus plugins, pero también podemos encontrar otras herramientas muy útiles en la red. A continuación quiero compartir una selección, las cuales considero muy prácticas tanto para diseñadores UI como para desarrolladores frontend.
Herramientas para diseñadores UI y desarrolladores frontend

Hihayk
Crea diferentes tonos de color a partir de un color primario o secundario para utilizar en los elementos UI de un producto digital. Con esta herramienta podrás crear diferentes paletas de color, para cada color principal y asignarlo a diferentes estados de los componentes que forman el sistema de diseño.
Configura los parámetros según la cantidad de colores, su saturación o la oscuridad que necesites y expórtalos para usar en tu proyecto.

Type Scale
Esta herramienta te permite crear la escala tipográfica en función de diferentes reglas matemáticas, estableciendo un tamaño base a partir del cual realizar las operaciones. Puedes previsualizar una muestra real usando la escala seleccionada en títulos y párrafos.
Con una cantidad inicial de 9 estilos de texto diferentes, puedes añadir los que necesites y exportarlos en formato .css

UX Check
Maravillosa extensión de chrome para documentar análisis de UX. Puedes marcar y documentar las mejoras además de categorizarlas según las 10 hipótesis de Nielsen. Al final te permite descargar automáticamente en Word todas las notas y referencias.
¡Súper útil para auditorías web!.

Face generator
Genera rostros aleatorios para tus proyectos estableciendo una serie de parámetros, como el sexo, tonos de pelo y piel, edad e incluso estado emocional.

Up scaler
Mejora la resolución de tus imágenes sin perder calidad gracias a la inteligencia artificial. Aumenta el tamaño hasta 4 veces con un máximo de 3 imágenes. Para mejorar más es necesario realizar un micropago.

Removal
Elimina cualquier imagen de fondo para poder usarlo como .png en tan solo unos sencillos pasos y gracias a la inteligencia artificial.

Gofullpage
Esta extensión para Chorme te permitirá realizar una captura completa de la página que este visualizando. Ya no tendrás que hacer scroll e ir tomando capturas una a una para luego hacer un montaje, con Gofullpage podrás hacerlo con un solo click.
Categoría/s: Diseño gráfico Diseño y desarrollo web Recursos Recursos
Deja una respuesta