Domine seu ofício com essas principais ferramentas de UX

Publicados: 2022-03-11

Ter as ferramentas de UX certas à mão pode ser a diferença crucial entre ter um fluxo de trabalho de design colaborativo, contínuo e altamente eficaz e um fluxo de trabalho lento, improdutivo e irresponsável.

É importante manter-se atualizado com as ferramentas e tecnologias mais recentes e aprender sobre as maneiras interessantes pelas quais os designers podem usá-las para criar e colaborar com mais eficiência. Algumas ferramentas são mais eficazes que outras, dependendo do tamanho da equipe, do estágio do processo de design e de quaisquer outras ferramentas que já façam parte do fluxo de trabalho.

Vamos dar uma olhada nas principais ferramentas de UX, desde wireframing e prototipagem até pesquisa e análise de UX, que estão ajudando as equipes a fazer coisas incríveis em 2018.

Ferramentas de Design + Prototipagem + Design Handoff

InVision/Estúdio InVision

Plataforma: web (integra-se com Sketch e Photoshop) e macOS
Preço: a partir de $ 13/mês para indivíduos, ou $ 89/mês para equipes de cinco

Observação: o preço se aplica ao aplicativo principal da Web InVision, não ao InVision Studio, que é gratuito.

Uma das melhores ferramentas de UX: InVision
O aplicativo da Web InVision exibindo o status de várias telas do aplicativo.

InVision é sem dúvida a ferramenta UX mais poderosa até agora. Ele permite que os designers do Sketch e do Photoshop importem suas telas estáticas e as transformem em protótipos dinâmicos, e as partes interessadas ofereçam feedback construtivo que pode ser convertido em tarefas acionáveis ​​e gerenciáveis. Combine isso com o teste do usuário e a tecnologia de quadro branco colaborativo, e o aplicativo da Web InVision se tornará uma ferramenta inestimável e realmente impressionante.

Em 2017, a InVision lançou novos recursos de entrega de design e, agora, em 2018, a InVision tornou-se uma solução completa e completa ao apresentar sua própria ferramenta de design UX, Studio, que é gratuita e inclui recursos avançados de animação e prototipagem.

Para equipes que desejam uma caixa de ferramentas totalmente abastecida em uma assinatura, a InVision está aqui.

InVision Studio, uma ferramenta de design de interface do usuário gratuita e um ótimo complemento para o processo de design
Studio, a nova ferramenta de design UX da InVision.

Emoldurador

Plataforma: macOS
Preço: US$ 12/mês para usuários individuais ou a partir de US$ 250/mês para equipes de três

Uma das melhores ferramentas de UX: Framer Studio, uma ferramenta de prototipagem de UX

Em termos de oferta, o Framer é a ferramenta que mais se assemelha ao InVision, pois ambos combinam uma interface web madura com uma nova ferramenta de design UX. Tudo se resume à preferência pessoal com esses dois, mas onde o Framer é um pouco mais barato para os indivíduos, o InVision é claramente o irmão maior quando se trata de colaboração de design.

Figma

Plataforma: web, macOS e Windows
Preço: grátis para equipes iniciantes ou US$ 12/mês

Outra ótima ferramenta de prototipagem: Figma

O Figma se destacou no início de seu desenvolvimento como a ferramenta líder para design multiplayer, permitindo que vários designers trabalhassem no mesmo arquivo de design de uma só vez. Com a capacidade de criar designs responsivos e recursos de transferência adicionais, é impressionante como eles ofereceram esses recursos nas versões da Web, macOS e Windows do produto.

Se você gosta de um fluxo de trabalho de design dinâmico e colaborativo, o Figma é para você.

Adobe XD

Plataforma: Windows e macOS
Preço: grátis para 1 protótipo ou $ 20,99/mês para protótipos ilimitados

Uma das melhores ferramentas de UX: Adobe XD

Quando o Sketch se tornou a ferramenta nº 1 para wireframing e design de interface, a Adobe quase não teve escolha a não ser admitir que o Photoshop nunca poderia ser a ferramenta de design de interface do usuário que os designers precisavam. A Adobe decidiu disponibilizar o Adobe XD para usuários do Windows onde o Sketch não o fez, e também incorporou a capacidade de prototipar fluxos de usuários e inspecionar designs, ajudando designers veteranos familiarizados com o ecossistema da Adobe a manter um fluxo de trabalho familiar.

PIN UX

Plataforma: web
Preço: a partir de US$ 8,10/mês para um usuário, com outras opções para equipes

Uma ótima ferramenta UX para wireframing e colaboração: UXPin

O UXPin é uma plataforma completa de design de produtos que oferece tudo, desde design, wireframing, prototipagem, colaboração, teste de usuário e entrega, tudo em um único aplicativo da web. A desvantagem é que o UXPin é uma das ferramentas mais difíceis de usar devido ao número de recursos, interface desordenada e (às vezes) atraso de desempenho que geralmente assombra aplicativos da web volumosos. No entanto, as equipes corporativas que precisam de recursos impressionantes, como sistemas de design e a capacidade de tirar proveito de estruturas e tecnologias da Web, como Bootstrap e Google Fonts, não devem ignorá-lo muito rapidamente.

Ferramentas de design + prototipagem

Esboço

Plataforma: macOS
Preço: $ 99/ano

Uma das melhores ferramentas de UX de design, wireframing e prototipagem: Sketch

O Photoshop deu a coroa ao Sketch quando se tornou a principal ferramenta de design para wireframing e design de interface em 2015 e, a partir de 2017, eles ainda lideram o processo. A abordagem inovadora do Sketch para o design de tela introduziu recursos inestimáveis, como pranchetas, símbolos e exportações, que inspirariam uma onda de novas ferramentas de design, como Adobe XD, Framer Studio e InVision Studio. Essa ferramenta vetorial incrivelmente intuitiva (e leve) ajuda os designers de interface do usuário a iterar muito mais rápido do que nunca.

No entanto, aqui está o “mas” (e é um grande mas): o Sketch não está disponível para Windows, e sua decisão de implementar ferramentas para designers de prototipagem tão tarde no jogo significa que seus concorrentes rapidamente dominaram esse mercado, com o InVision sendo sem dúvida a ferramenta de prototipagem mais dinâmica disponível hoje. Embora a funcionalidade do Sketch possa ser adaptada com um catálogo impressionante de plugins (incluindo integrações com Flinto, Zeplin, Marvel, Principle e até mesmo InVision), alguns designers podem favorecer uma experiência mais nativa com esses recursos prontamente disponíveis fora do caixa.

Em suma, o Sketch é excelente para ideação e wireframing, ou para aqueles que não se importam em aumentar sua caixa de ferramentas para adicionar melhores ferramentas de prototipagem e colaboração.

Webflow

Plataforma: web
Preço: uma variedade de opções destinadas a indivíduos de um único site, vários sites e equipes

Webflow é usado para criar sites responsivos online

O Webflow é um editor WYSIWYG para o designer moderno que deseja criar sites responsivos sem código e até hospedá-los, tudo com uma única assinatura. O Webflow gera um código semântico e limpo para que você não precise e oferece recursos robustos que permitem que os web designers criem qualquer coisa, desde sites estáticos a lojas de comércio eletrônico, onde até mesmo o conteúdo e o inventário são gerenciados no mesmo painel.

Princípio

Plataforma: macOS
Preço: $ 129/ano

Principle é uma das melhores ferramentas de prototipagem de aplicativos

Embora seja mais uma ferramenta de prototipagem do que uma ferramenta de design, o aplicativo Principle altamente avaliado é para designers que se concentram em protótipos de alta fidelidade e usa animação de linha do tempo para ajudar a projetar microinterações avançadas onde Sketch e Adobe XD não. Se os recursos de design não forem sofisticados o suficiente para suas necessidades, o Principle se integra ao Sketch.

Ferramentas de prototipagem (somente)

Flinto

Plataforma: macOS
Preço: $ 99/ano

Flinto, uma das ferramentas de prototipagem mais baratas para macOS

O Flinto leva as transições e micro-interações para o próximo nível com ferramentas de animação avançadas, incluindo molas e atenuações, rotação 3D, efeitos de rolagem e até permite que designers modernos exportem animações como vídeos, GIFs e fotos de Dribbble.

Enquanto Flinto está focado apenas em interações de prototipagem, ele faz isso bem. Emparelhe com o Sketch para obter melhores resultados.

Origami

Plataforma: macOS
Preço: gratuito/código aberto

Origami, uma ferramenta de prototipagem de aplicativos feita pelo Facebook

Origami é uma ferramenta de prototipagem de aplicativos desenvolvida pela equipe de design do Facebook. Embora seja semelhante ao Flinto (menos o preço), não é mantido com tanta frequência quanto as ferramentas semelhantes, e sua abordagem baseada em lógica para projetar interações resulta em uma curva de aprendizado mais acentuada.

Para designers com orçamento limitado, vale a pena dar uma olhada no Origami.

Ferramentas de Prototipagem + Design Handoff

Maravilha

Plataforma: web
Preço: US$ 0-12/mês para indivíduos ou US$ 42-84/mês para equipes

As equipes corporativas que exigem recursos de SSO e handoff devem perguntar diretamente.

Marvel, uma ferramenta de prototipagem online fácil de usar

Marvel é uma ferramenta de prototipagem online conhecida por ser uma das mais fáceis de dominar, porém, a desvantagem é que não é tão sofisticada quanto a InVision quando se trata de recursos de prototipagem dinâmica, e requer integração com Sketch para se tornar uma solução completa de design + prototipagem . Dito isto, ele se integra ao Lookback, trazendo o teste do usuário para a mesa e inclui recursos de transferência de design.

A Marvel também permite que equipes (mesmo não designers) escolham uma prancheta e ilustrem uma ideia de baixa fidelidade usando formas e texto, tornando-a ideal para sprints de design (especialmente porque também permite que os usuários convertam protótipos de papel em protótipos Marvel de baixa fidelidade).

Ferramentas de transferência de design (somente)

Zeplin

Plataforma: web
Preço: grátis para um projeto, $ 17/mês e $ 26/mês para três e 12 projetos respeitosamente

Para grandes organizações, sua opção de US$ 7,65/usuário/mês oferece permissões de usuário mais avançadas e a capacidade de copiar estilos de cor e texto entre projetos.

O Zeplin permite transferências de design perfeitas para usuários do Sketch, ajudando no processo de design.

A Zeplin superou consistentemente os concorrentes Sympli e Avocode, onde recentemente adicionou integrações Adobe XD e Figma juntamente com suas já existentes integrações Sketch e Photoshop CC. Embora muitas ferramentas multifuncionais tenham adicionado design handoff à sua lista de recursos, o Zeplin preenche o vazio para as ferramentas que não o fizeram (Sketch, Photoshop) e aquelas que ainda experimentam recursos handoff (Adobe XD, Figma).

Ferramentas de wireframe + prototipagem

Axure

Plataforma: Windows e macOS
Preço: $ 29/49/99/usuário/mês para usuários Pro/Team/Enterprise respectivamente

Compras únicas de Axure RP 8 também estão disponíveis a partir de US$ 495.

Axure é uma das melhores ferramentas de wireframing e prototipagem.

O Axure foi desenvolvido especificamente para o design de wireframes e protótipos brutos e vem com recursos que tornam a criação de maquetes orientadas por dados, dinâmicas e adaptáveis ​​tão fácil que você esquecerá que é uma ferramenta sem recursos de prototipagem UX de alta fidelidade. Para designers que se concentram apenas em wireframes e prototipagem, o Axure é a melhor escolha, usado por 87% das empresas da Fortune 100.

Justinmind

Plataforma: Windows e macOS
Preço: US$ 19/usuário/mês ou US$ 39/usuário/mês para equipes corporativas

Justinmind, uma das melhores ferramentas de prototipagem para wireframing

Justinmind não recebe amor suficiente pelo que oferece, que é prototipagem avançada de UX, colaboração, algumas ferramentas básicas de design e também mais de 500 widgets da Web e móveis para wireframes. Wireframing não é algo em que muitos aplicativos de prototipagem concorrentes se concentraram, tornando o Justinmind uma das poucas ferramentas de UX que o faz.

Ferramentas de wireframe (somente)

OmniGraffle

Plataforma: macOS
Preço: $ 100, ou $ 200 para uma licença Pro

Omnigraffle é uma ferramenta de maquete para criar wireframes e diagramas para o processo de design UX.

OmniGraffle é uma ferramenta de wireframing com recursos de diagramação, útil para aplicativos e sites onde o fluxo do usuário ou a arquitetura de informações podem precisar de mais atenção. Como um aplicativo nativo do macOS, a interface é muito amigável, tornando-se uma ferramenta de UX fácil de dominar.

OmniGraffle tem um recurso muito útil: “stencils”, que são componentes de design reutilizáveis ​​de arrastar e soltar prontos para usar em uma “biblioteca de estêncil” que os designers podem usar para construir wireframes, maquetes ou até designs visuais finais. Os usuários podem criar sua própria biblioteca, e também existem milhares de bibliotecas de estêncil disponíveis na web para download, muitas delas gratuitas, economizando tempo e esforço.

Graffletopia é um dos maiores repositórios de estêncil na web contendo uma mistura de bibliotecas gratuitas e pagas. Com mais de 1.100 estênceis, o Graffletopia tem estênceis para todos os usos - projetando aplicativos móveis, sites, diagramas de rede, fluxogramas e muito mais.

Balsâmico

Plataforma: web, macOS e Windows
Preço: a partir de US$ 90/usuário/ano para acesso à nuvem ou US$ 89 para aplicativos de desktop

Balsamiq é uma das melhores ferramentas de UX para criar wireframes de baixa fidelidade.

Balsamiq é o oposto de Justinmind, focando mais em wireframing do que prototipagem. Seus elementos de interface do usuário integrados usam uma estética visual esboçada para incentivar o brainstorming e são voltados exclusivamente para gerentes e desenvolvedores de produtos, bem como designers de wireframes, permitindo que equipes inteiras façam parte do processo de design desde o início.

Ferramentas de pesquisa e teste de UX

Olhe para trás

Plataforma: web
Preço: $ 49/usuário/mês ou $ 99/usuário/mês dependendo dos recursos

Lookback, uma das ferramentas de teste de usuário mais fáceis de dominar

O Lookback introduz testes de usuário moderados ao vivo no processo de design de UX, permitindo que os designers gravem o rosto, a tela e a voz de qualquer pessoa no mundo. Para equipes que usam a Marvel como ferramenta de prototipagem, o Lookback se integra perfeitamente.

Teste de usuário

Plataforma: web
Preço: US$ 49/teste (mínimo de 15 testes), com opções empresariais disponíveis

UserTesting, sem dúvida a melhor ferramenta de teste de usuário

UserTesting é semelhante ao Lookback em termos de recursos. Embora seja uma excelente ferramenta de teste de usuário autônoma com um enorme repertório de testadores de usuários experientes (com a Marvel, você mesmo precisará encontrar testadores de usuários), o UserTesting também se integra perfeitamente ao InVision.

Eyequant

Plataforma: web
Preço: $ 499/mês para indivíduos, $ 999/mês para equipes de 10 (+ opções empresariais)

Eyequant usa aprendizado de máquina para melhorar o CRO.

A Eyequant usa aprendizado de máquina para ajudar as equipes a tomar melhores decisões de design e melhorar seus esforços de CRO. Seu alto preço pode desencorajar alguns clientes, mas aqueles que investem recebem treinamento sobre como simular usuários, analisar métricas, aproveitar ao máximo seus testes A/B e muito mais.

Hotjar

Plataforma: web
Preço: preço variável dependendo do número de visualizações de página diárias

Hotjar é a ferramenta líder para mapas de calor que ajuda no processo de design.

O Hotjar torna mais fácil para as equipes otimizar as experiências do usuário, combinando o feedback do usuário com análises, mapas de calor, mapas de cliques, mapas de rolagem e gravações de visitantes. Onde os mapas de calor e os mapas de cliques ilustram onde os usuários estão movendo e clicando com o mouse, respectivamente, os mapas de rolagem indicam em que ponto os usuários podem estar perdendo o interesse.

Ovo Maluco

Plataforma: web
Preço: a partir de US$ 29/mês para 20.000 visualizações de página

Crazy Egg combina testes e análises A/B para o melhor processo de design de UX.

Semelhante ao Hotjar, o Crazy Egg é usado para otimizar as experiências do usuário e as taxas de conversão analisando o comportamento do usuário com mapas de calor e gravações de visitantes, embora também inclua ferramentas de teste A/B fáceis de usar para ajudar a decifrar o que está e o que não está funcionando.

Oficina ideal

Plataforma: web
Preço: $ 166/usuário/mês, com opções gratuitas e empresariais disponíveis

O Optimal Workflow é uma das melhores ferramentas de pesquisa de usuários.

O Optimal Workshop é um kit de ferramentas de pesquisa de usuários com foco em classificação de cartões, pesquisas, testes de árvore, teste de primeiro clique e descoberta de dados qualitativos.

Ferramentas de análise

Google Analytics

Plataforma: web
Preço: grátis

O Google Analytics é a ferramenta de análise de sites nº 1.

Embora o Google Analytics não tenha a interface mais inspiradora ou mais útil, ele fornece uma quantidade razoável de dados para uma ferramenta gratuita, tornando-o um ponto de partida adequado para pesquisas de usuários e aquisição de insights que você pode explorar mais em outra ferramenta .

Painel de mixagem

Plataforma: web
Preço: a partir de US$ 99 por 1 milhão de pontos de dados, com opções gratuitas e corporativas disponíveis

Mixpanel, uma ferramenta popular de análise de sites para pesquisa de usuários e processo de design de UX

O Mixpanel permite que qualquer pessoa, de executivos a simples colaboradores, use dados para tomar decisões mais estratégicas. Com uma interface mais amigável em comparação com o Google Analytics, os designers podem achar mais fácil analisar as jornadas do usuário, aprender como os usuários se envolvem com o produto e decifrar análises comportamentais complexas com o Mixpanel.

Pendo

Plataforma: web
Preço: o preço é determinado com base no número de usuários e recursos necessários

A ferramenta de análise de sites, Pendo, ajuda no processo de design de UX.

O Pendo, com uma interface muito mais simples em comparação com a maioria das outras ferramentas de análise, permite que os designers rastreiem o NPS (net promoter score), segmentem usuários, otimizem funis e jornadas de usuários e qualquer outra coisa que você esperaria de uma ferramenta de análise de sites top. Além disso, os designers podem fornecer anúncios direcionados, ajuda contextual e experiências personalizadas com base nos dados rastreados.

Conclusão

Escolher as ferramentas de UX certas requer uma consideração cuidadosa. Precisamos levar em consideração os custos, o nível necessário de colaboração com outros designers e partes interessadas, a plataforma e quaisquer outras ferramentas com as quais possamos precisar integrar para manter um fluxo de trabalho contínuo. Depois de restringir suas opções, inscreva-se para os testes gratuitos e considere executar um sprint de design de cinco dias para testar as águas.