Guía del diseñador UX para Figma
Si eres diseñador de UX o UI (o estás interesado en convertirte en uno), probablemente hayas oído hablar del diseño UX con Figma, una plataforma de diseño de interfaz basada en navegador.
Entonces, ¿qué es Figma y qué puede hacer por ti?
En este artículo, analizaremos a fondo todo lo que ofrece esta herramienta de diseño de interfaces. Explicaremos para qué se utiliza Figma, sus características principales, su precio y más.
¿Qué es Figma?
Figma es una herramienta de diseño vectorial basada en la nube que permite a los diseñadores de UX y UI crear, colaborar y compartir sus diseños.
Los diseñadores que usan Figma pueden crear prototipos de alta fidelidad y diseños de interfaz de usuario para aplicaciones web, móviles y de escritorio. Figma también es popular entre gerentes de producto y desarrolladores, ya que ofrece una forma sencilla de compartir diseños y recopilar comentarios.
¿Para qué se utiliza Figma?
Figma se puede utilizar para una variedad de proyectos de diseño, incluidos:
- Creación de wireframes y prototipos
- Diseño de interfaces de usuario
- Realización de pruebas de usabilidad
- Colaborando con compañeros de equipo
- Compartir diseños con las partes interesadas
¿Cuánto cuesta Figma?
Figma ofrece un plan gratuito y un plan profesional pago.
El plan gratuito incluye proyectos ilimitados, hasta tres editores por proyecto y un historial de versiones básico.
El plan Profesional cuesta $12 por editor por mes e incluye características adicionales como historial de versiones avanzado, compatibilidad con complementos y colaboración en tiempo real.
Características principales de Figma
Algunas de las características clave que hacen que Figma sea tan popular entre los diseñadores son:
1. Características de diseño y disposición
A diferencia de las herramientas de diseño UX de escritorio , el diseño y la creación de prototipos en Figma se pueden realizar en el mismo archivo. Esto ahorra mucho tiempo y molestias a los diseñadores, ya que no tienen que cambiar constantemente entre diferentes programas.
Figma también ofrece potentes funciones de diseño que facilitan la creación de diseños adaptables. Con el diseño automático , puedes ajustar rápidamente el espaciado y la posición de los elementos en tu lienzo sin tener que ajustar manualmente cada objeto.
Y con su función de instancias de componentes , puede crear múltiples variaciones de un componente (por ejemplo, botones con diferentes estados) mientras que solo tiene que diseñar un componente maestro.
2. Características de creación de prototipos
Figma también ofrece potentes funciones de prototipado que te permiten crear rápidamente prototipos de alta fidelidad. Con Figma, puedes añadir transiciones, activadores y animaciones a tus diseños con solo unos clics. También puedes previsualizar tus prototipos en dispositivos móviles con la app Figma Mirror.
3. Funciones de interacción y animación
Figma también ofrece potentes funciones de interacción y animación. Con el panel Interacciones, puedes añadir acciones a cualquier objeto del lienzo. Por ejemplo, puedes hacer que un botón cambie de color al pasar el cursor sobre él o que un campo de texto se expanda al hacer clic.
También puedes añadir animaciones a tus prototipos con la línea de tiempo integrada de Figma. Con ella, puedes crear animaciones sofisticadas sin necesidad de usar una herramienta externa como After Effects. Simplemente selecciona los objetos que quieres animar y añade fotogramas clave para crear tu animación. ¡Así de fácil!
Para un mayor control de la animación, Figma también ofrece la función Smart Animate. Con Smart Animate, puedes generar animaciones automáticamente entre dos estados cualesquiera. Por ejemplo, puedes crear una animación que expanda un botón al hacer clic. Simplemente selecciona los estados inicial y final, ¡y Figma se encargará del resto! Mira el videotutorial gratuito a continuación.
BY designlab