Herramientas para diseñadores UI y desarrolladores frontend

calendar
icon view 1409
icon comment 0
icon time 2 min.

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.

diseñadores ui

Herramientas para diseñadores UI y desarrolladores frontend

Hihayk

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.

Ir a web


Type scale

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

Ir a web


UX Check

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!.

Ir a web


generated photos

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.

Ir a web


Up scaler

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.

Ir a web


removal

Removal

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

Ir a web


Go full page

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.

Ir a extensión

Buscar artículos por: , ,

Categoría/s: Diseño gráfico Diseño y desarrollo web Recursos Recursos


Entradas relacionadas