1.6 ¿Qué herramientas de UX necesito para crear mi portafolio y cómo las aprendo?

“¿Qué herramientas de UX debería aprender para poder construir mi cartera?” “¿Cómo aprendo las herramientas UX?” Recibimos muchas preguntas aquí en Interaction Design Foundation. Si está comenzando en UX, es posible que también tenga estas preguntas candentes. Entonces, aquí, repasaremos todo lo que necesita saber sobre las herramientas UX y cómo aprenderlas.

Abróchate el cinturón, ¡será un viaje divertido!

¿Qué herramientas de UX necesita para su portafolio?

Bueno, depende . Lo sentimos, pero no hay una respuesta única para todos. Las herramientas que necesitará dependerán de la función que solicite con su cartera.

Por ejemplo, si desea ser un investigador de usuarios, debe concentrarse en realizar pruebas de usuario, entrevistar a los usuarios y presentar sus hallazgos. Puede realizar estas tareas de manera eficaz sin ninguna “herramienta UX”, aunque puede haber algunas herramientas que lo ayudarán. Por otro lado, si desea ser un diseñador de UX generalista, es posible que deba hacer wireframing y crear prototipos de alta fidelidad, y es probable que necesite herramientas de creación de prototipos especializadas.

De hecho, si está pensando en qué herramientas de UX necesita para su cartera, está haciendo la pregunta incorrecta . Es posible que haya recibido una pista de esto en función de la forma en que respondimos a la pregunta. Verá, la herramienta UX que “necesita” utilizar depende de lo que necesite hacer en primer lugar.

En otras palabras, debes preguntarte qué actividades de UX necesitas hacer en lugar de qué herramientas de UX necesitas. Las herramientas son simplemente, bueno, herramientas que te ayudan a lograr lo que quieres producir. Preguntar primero por las herramientas es poner el carro delante del caballo; te enamorarás del bombo de las últimas herramientas y perderás de vista lo que se supone que debes hacer como diseñador de UX en primer lugar.

Entonces, ¿qué herramientas debería utilizar?

Si ya ha considerado detenidamente lo que quiere lograr, aquí hay algunas herramientas (o más como recursos) que recomendamos para diferentes tareas de UX.

Para ayudarlo, hemos clasificado las herramientas en tareas principales de UX y estructuramos cada herramienta para mostrarle su precio, características e inconvenientes.

No ganamos ni un centavo con nuestras recomendaciones y tratamos de ser lo más objetivos humanamente posible. Sin embargo, hay demasiadas herramientas para cubrir a continuación. Debe realizar una investigación adicional para encontrar si existen otras herramientas que se adapten a sus necesidades específicas. Algunas herramientas también ofrecen descuentos para estudiantes, por lo que debe obtener más información en sus sitios web.

Herramientas de cuestionario

Cuando desee realizar una investigación cuantitativa de los usuarios, obtener comentarios de los clientes o implementar un evaluador para seleccionar a los participantes de la entrevista, necesitará algún tipo de herramienta de cuestionario. Nosotros recomendamos:

Formularios de Google

Los formularios de Google son gratuitos pero lo suficientemente potentes para la mayoría de los propósitos de investigación de usuarios.

Sitio web: https://www.google.com/forms/about/

Precio

• ¡Gratis!

Características

• Acceda a una amplia gama de tipos de preguntas, desde preguntas de opción múltiple, preguntas de respuesta corta hasta párrafos y escalas lineales.
• Lógica avanzada: puede dividir y ramificar su encuesta en páginas y saltar a preguntas basadas en las respuestas.
• Analice sus resultados en Formularios o expórtelos a Hojas de cálculo para un análisis más detallado.
• Colaborativo: puede invitar a los miembros del equipo a editar y ver los resultados.

Inconvenientes

• ¡No mucho, considerando que es gratis!
• Se ve decente, pero no hermoso.

Tipo de formulario

Typeform, relativamente nuevo en la industria de las encuestas, ha hecho olas con un diseño increíblemente hermoso que mejora la experiencia del usuario al completar un cuestionario.

Sitio web: https://www.typeform.com/surveys/

Precio

• Gratis: 3 formularios, 10 preguntas por formulario, 100 respuestas por mes.
• 35–70 USD / mes: versiones profesionales con funciones avanzadas.

Funciones (versión gratuita)

• Cree formularios bellamente diseñados, que pueden ayudar a aumentar la tasa de finalización.
• Acceda a una amplia gama de tipos de preguntas.
• Obtenga métricas y análisis de las respuestas de su encuesta.
• Exporta tus respuestas a Hojas de cálculo de Google.

Inconvenientes

• Con el nivel gratuito, no puede utilizar la lógica en su encuesta (p. Ej., Saltar preguntas según las respuestas), lo cual es un gran inconveniente porque le resultará difícil hacer preguntas de seguimiento basadas en las respuestas.
• No hay funciones de colaboración en el nivel gratuito.

Mono encuesta

SurveyMonkey es una de las herramientas de encuestas más populares y por una buena razón.

Sitio web: https://www.surveymonkey.com/

Precio

• Gratis: 10 preguntas y 100 respuestas por formulario.
• 37-99 USD / mes: preguntas y respuestas ilimitadas, y otras funciones avanzadas.

Funciones (versión gratuita)

• Cree formularios fáciles de usar y bien diseñados.
• Obtenga métricas y análisis de sus respuestas.
• Acceda a una amplia gama de tipos de preguntas.
• Plantillas de encuesta: 40 plantillas de encuesta breves que puede utilizar para configurar rápidamente su encuesta.

Inconvenientes

• No puede exportar respuestas en la versión gratuita, lo cual es un gran inconveniente.
• No hay lógica (saltos de preguntas en función de las respuestas) en la versión gratuita, otro gran inconveniente.
• No hay funciones de colaboración en el nivel gratuito.

Herramientas de diagrama de flujo

Cuando esté clasificando ideas o datos, trazando flujos de usuarios o generando mapas del sitio, es posible que necesite herramientas de diagrama de flujo para acelerar su flujo de trabajo. A continuación, se muestran algunas herramientas excelentes que puede utilizar:

LucidChart

LucidChart es una aplicación de diagrama de flujo popular, en parte porque la versión gratuita tiene muchas funciones y es ideal para autónomos o diseñadores jóvenes.

Sitio web: https://www.lucidchart.com/

Precio

• Gratis: para uso personal, hasta 60 objetos en un documento.
• 4,95-20 USD / mes: con objetos ilimitados y funciones avanzadas.

Funciones (versión gratuita)

• Cree diagramas de flujo con una interfaz de arrastrar y soltar que es fácil de usar.
• Basado en web, por lo que puede usarlo en cualquier sistema operativo.
• Colaboración en tiempo real.

Inconvenientes

• La versión gratuita le limita a crear y ver gráficos con hasta 60 objetos.
• Basado en la web, por lo que necesita acceso a Internet para usarlo.

Microsoft Visio

La herramienta de diagrama de flujo de Microsoft es rica en funciones y tiene una interfaz de usuario familiar si ha utilizado el conjunto de herramientas de Office Online.

Sitio web: https://products.office.com/en-us/visio/flowchart-software

Precio

• 5 USD / mes (plan anual) para la versión básica en línea.
• 15 USD / mes (plan anual) para la aplicación de escritorio y Office 365.
• 250 USD para la aplicación de escritorio Visio Standard 2019.
• 480 USD para la aplicación de escritorio Visio Professional 2019.

Características

• Cree diagramas de flujo con una interfaz de arrastrar y soltar que es fácil de usar.
• Interfaz de usuario similar a Microsoft Office, por lo que es posible que no tenga ninguna curva de aprendizaje.
• Comparta sus gráficos en línea a través de un enlace, como archivo adjunto, imagen o PDF.

Inconvenientes

• Caro y difícil de justificar solo por crear diagramas de flujo.
• Funciona solo en Windows.
• El nivel más barato no tiene colaboración en tiempo real y Office 365.

OmniGraffle

Si bien se usa con frecuencia como una herramienta de estructura de alambre, la aplicación de macOS OmniGraffle también tiene algunas funciones poderosas de diagrama de flujo que puede usar.

Sitio web: https://www.omnigroup.com/omnigraffle/

Precio

• 99,99 USD para la aplicación estándar.
• 199,99 USD para la aplicación Pro.

Características

• Cree diagramas de flujo con una interfaz de arrastrar y soltar que es fácil de usar.
• Exporte diagramas de flujo a múltiples formatos como PDF y SVG.
• También puede usarlo para crear wireframes e incluso prototipos de alta fidelidad.
• Aplicación de escritorio, para que pueda usarla sin conexión.

Inconvenientes

• Caro si lo usa solo para diagramas de flujo.
• Sin funciones de colaboración.
• Funciona solo en macOS.

Herramientas de creación de prototipos / wireframing de baja fidelidad

En las primeras etapas de su proceso de diseño, querrá crear prototipos rápidos y sucios para probarlos con los usuarios. Si bien puede hacerlo perfectamente con lápiz y papel, estas herramientas pueden ayudarlo a trabajar más rápido. Además, puede deshacer y realizar cambios rápidos fácilmente.

Maravilla

Si bien Marvel se puede utilizar para crear prototipos de píxeles perfectos de alta fidelidad, brilla como una herramienta rápida de estructuración de cables con soporte para interactividad y animaciones.

Sitio web: https://marvelapp.com/

Precio

• Gratis: 1 usuario, 2 proyectos.
• 12–84 USD / mes: proyectos ilimitados y funciones avanzadas.

Características

• Cree wireframes con una sencilla interfaz de arrastrar y soltar y utilice plantillas de interfaz de usuario para diferentes dispositivos y sistemas operativos.
• Basado en web, por lo que puede usarlo en cualquier sistema operativo.
• Agregue interacciones y animaciones a sus wireframes para realizar pruebas de usuario más realistas.
• Los miembros de su equipo y / o clientes pueden agregar comentarios a los diseños.
• También puede utilizarlo para crear prototipos de alta fidelidad.

Inconvenientes

• Basado en la web, por lo que necesita acceso a Internet para usarlo.

Balsamiq

Balsamiq es una de las primeras herramientas de creación rápida de prototipos y se ha mantenido relevante hoy en día debido a su enfoque nítido en la creación rápida de wireframes.

Sitio web: https://balsamiq.com/

Precio

• 9 USD / mes: aplicación web, con 2 proyectos.
• 49–199 USD / mes: aplicación web, 20 proyectos y más.
• 89 USD / usuario: aplicación de escritorio.

Características

• Cree wireframes con una sencilla interfaz de arrastrar y soltar y utilice plantillas de interfaz de usuario para diferentes dispositivos y sistemas operativos.
• El aspecto “bosquejado a mano” es perfecto para la exploración y las pruebas en las primeras etapas.
• Diseñado para crear prototipos de baja fidelidad para que se centre en las pinceladas amplias en lugar de los detalles.

Inconvenientes

• No puede crear prototipos de alta fidelidad con Balsamiq.
• Ligeramente costoso ya que solo se usa para wireframing.

OmniGraffle

Como mencionamos anteriormente, también puede usar OmniGraffle para crear wireframes.

Precio

• 99,99 USD para la aplicación estándar.
• 199,99 USD para la aplicación Pro.

Características

• Cree wireframes con una sencilla interfaz de arrastrar y soltar y utilice plantillas de interfaz de usuario para diferentes dispositivos y sistemas operativos.
• Control mejorado sobre formas vectoriales y textos en sus wireframes.
• También puede utilizarlo para crear diagramas de flujo.

Inconvenientes

• Funciona solo en macOS.
• Caro en comparación con otras opciones de estructura de alambre anteriores.

Herramientas de creación de prototipos de alta fidelidad / píxeles perfectos

Si está pensando en herramientas UX, probablemente esté pensando en herramientas que crean prototipos de píxeles perfectos. Estas herramientas obtienen la mayor parte del protagonismo en las carteras, principalmente porque puede crear resultados finales visualmente agradables con ellas. ¡Solo recuerde que su portafolio también debe mostrar su proceso de diseño además de sus resultados! No se concentre estrechamente en lo que se ve bien y descuide las otras partes esenciales de su proceso de diseño.

Estas son las herramientas de creación de prototipos de alta fidelidad que recomendamos:

Bosquejo

Sketch se lanzó en 2010 y revolucionó la industria de la creación de prototipos. La mayoría de las aplicaciones de creación de prototipos que encuentra ahora están modeladas a partir de Sketch, una fuerte señal de lo bueno que es.

Sitio web: https://www.sketchapp.com/

Precio

• 99 USD / año: aplicación de escritorio con acceso de por vida y 1 año de actualizaciones.

Características

• Creado para crear prototipos de píxeles perfectos.
• Interfaz de usuario intuitiva y hermosa con controles avanzados sobre vectores, texto y capas.
• Puede crear bibliotecas y diseñar sistemas utilizando la función “Símbolos”.
• Agregue interacciones y animaciones simples a sus diseños y obtenga una vista previa de sus diseños móviles en su teléfono para probarlos.
• Enormes 3 ^rd medios de soporte de extensión -partido que pueden encontrar un plugin para añadir características que usted necesita o mano de diseños para los desarrolladores.
• Las actualizaciones constantes garantizan que la aplicación siga siendo relevante: Sketch emite alrededor de 20 actualizaciones al año.
• También puede usarlo para crear prototipos y wireframes de baja fidelidad.

Inconvenientes

• Funciona solo en macOS.
• Bastante caro: si bien está totalmente justificado, podría estar fuera de su presupuesto si es un profesional independiente o está comenzando en UX.

Adobe XD

Adobe XD es la respuesta del gigante de la suite creativa a Sketch, que ha destronado a sus aplicaciones Photoshop e Illustrator como la aplicación de creación de prototipos predeterminada. Lanzado 6 años después de Sketch, se inspira mucho en él. A diferencia de Sketch, XD tiene una versión gratuita.

Sitio web: https://www.adobe.com/products/xd.html

Precio

• Gratis: 1 prototipo compartido activo y especificaciones de diseño.
• 9,99 USD / mes: aplicación completa de Adobe XD con especificaciones de diseño y prototipos compartidos activos ilimitados.
• 52,99 USD / mes: conjunto completo de aplicaciones Adobe Creative Cloud, que incluye XD, Photoshop e Illustrator.

Características

• Casi presenta paridad con Sketch, con diferencias demasiado pequeñas y detalladas para describirlas aquí.
• Funciona tanto en Windows como en macOS.
• Integración con el conjunto de aplicaciones Adobe CC (si paga por el nivel más caro) y la plataforma de cartera Behance.
• El nivel gratuito es muy atractivo si recién está comenzando en UX.

Inconvenientes

• Si el nivel gratuito es demasiado limitado para usted, la versión de pago de Adobe XD es un poco más cara que Sketch, mientras que la suite Creative Cloud completa es mucho más cara.
• Algo menos soporte para 3 ^rd -partido plugins de bosquejo.

Figma

Un recién llegado relativo al espacio de creación de prototipos de alta fidelidad, Figma es una aplicación basada en la web con una versión refrescante de la creación de prototipos.

Sitio web: https://www.figma.com/

Precio

• Gratis: 3 proyectos, 2 editores y control de versiones de 30 días.
• 12 USD por editor / mes: proyectos y versiones ilimitados, con soporte de biblioteca de componentes de equipo.

Características

• Casi presenta paridad con Sketch y XD, con diferencias demasiado pequeñas y detalladas para describirlas aquí.
• Basado en web, por lo que puede usarlo en cualquier sistema operativo.
• La función de edición colaborativa le permite diseñar junto con los miembros del equipo.
• Admite la importación de archivos Sketch.

Inconvenientes

• No 3 ^rd -party plug-in de apoyo, ya que es una aplicación basada en la web.
• El rendimiento basado en web puede ser lento para proyectos grandes con muchas mesas de trabajo; también necesita acceso a Internet para usarlo.
• La edición colaborativa puede ser un arma de doble filo: los miembros del equipo pueden interrumpirlo o interrumpirlo.

¿Cómo se puede aprender a usar las herramientas UX?

Ahora que sabe qué herramientas utilizar, ¿cómo puede aprender a utilizarlas?

Bueno, al menos una cosa buena surgió de la explosión de las herramientas UX: la mayoría de las herramientas son increíblemente fáciles de usar. Debido a la inmensa competencia, las empresas que fabrican las herramientas tienen que hacerlas fáciles de dominar si quieren que las uses.

Aquí hay 3 formas en las que puede aprender a usar las herramientas UX.

Aprenda del fabricante de herramientas

La mayoría de las herramientas de UX tienen tutoriales extensos, fáciles de digerir y gratuitos que le enseñan cómo usar la herramienta. Después de todo, lo mejor para la empresa es enseñarle rápido. Aprenda de estos tutoriales antes de probar otros métodos de aprendizaje.

Por ejemplo, Sketch tiene recursos útiles y minicursos en su documentación. A través de esto, puede aprender a usar todas y cada una de las funciones de la aplicación. Además de eso, Sketch tiene una publicación mediana donde encontrará un suministro interminable de mejores prácticas y consejos.

Adobe XD también tiene recursos similares. También tiene minicursos que puede realizar para dominar la herramienta de creación de prototipos. El blog de Adobe también tiene una sección específica para la aplicación XD, donde puede leer sobre las mejores prácticas y piezas de pensamiento.

Entonces, comience con la herramienta en sí. Lo más probable es que la herramienta que usa tenga extensos tutoriales para guiarlo en cada paso del camino. Esto significa que ahorrará dinero porque no tendrá que tomar cursos adicionales sobre cómo usar una herramienta.

Aprender haciendo

La mejor forma de aprender una herramienta es utilizándola. Esto suena obvio, pero vale la pena repetirlo. Una vez que tenga los conceptos básicos de los tutoriales, comience a usar la herramienta.

Por supuesto, debe hacerlo con intención. Por ejemplo, si desea aprender una herramienta de encuesta, debe crear una encuesta para recopilar comentarios sobre una aplicación, en lugar de crear una encuesta ficticia con preguntas aleatorias. Del mismo modo, cuando desee descubrir una herramienta de creación de prototipos, debe intentar crear una página de registro realista en lugar de una página sin propósito.

Esto asegura que está utilizando la herramienta en un entorno realista, por lo que descubrirá los aspectos de la herramienta que realmente utilizará. ¡También refuerza el punto clave de que primero debes pensar en lo que estás haciendo antes de pensar en cómo hacerlo!

Aprenda de los recursos externos

Por último, los recursos externos pueden ser una opción para ti. Puede encontrar muchos videos tutoriales en YouTube sobre las herramientas que utiliza.

También puede encontrar cursos pagos que le enseñarán cómo usar las herramientas. No ofrecemos cursos basados ​​en herramientas aquí en Interaction Design Foundation, ya que nos enfocamos en el conocimiento y las habilidades de diseño atemporales, pero un rápido Google le indicará las plataformas que sí lo hacen.

Sin embargo, debe tener cuidado al realizar cursos pagos sobre herramientas. Debido a que las herramientas cambian constantemente, primero debe asegurarse de tomar un curso que cubra la versión correcta de la herramienta. También debe asegurarse de que el curso no solo cubra lo que puede aprender de los recursos gratuitos de la herramienta. Como mencionamos anteriormente, creemos que los cursos pagos son innecesarios aquí porque la mayoría de las herramientas tienen increíbles tutoriales gratuitos hechos por las propias empresas.