Como foi (e está sendo) o nosso processo de migração do Adobe XD para Figma
Desde o surgimento dos smartphones e com eles toda essa revolução no desenvolvimento de produtos digitais, todo ano surgem diversas ferramentas de prototipação no mercado. Como designers, entendemos que uma parte considerável do nosso tempo é focada na prototipação, porém é importante lembrar que esta é apenas uma etapa do nosso trabalho e que anterior a isso passamos por vários outros processos até chegar no desenho da solução que idealizamos.
Mas por que essa introdução?
Se sabemos que nada adianta uma interface perfeita para nós, mas que para nossos usuários não faça sentido, então entendemos que quanto mais tempo sobrar para uma pesquisa e ideação bem embasadas, mais chances teremos em construir um produto com melhor usabilidade. E é aqui que entra o debate sobre nosso processo de prototipação.
Os problemas no dia a dia
Durante muito tempo o Adobe XD nos serviu bem, porém com o tempo, com a entrada de novos projetos e principalmente com o aumento do nosso time (que continua crescendo), alguns problemas começaram a ficar mais evidentes: a limitação do link do protótipo vinculado apenas ao designer que o publicou ou problemas com componentes de uma biblioteca compartilhada e até as várias atualizações com bugs, inconstâncias e erros em geral.
Tudo isso toma tempo e um tempo que, como dito anteriormente, poderíamos estar focados em processos mais importantes.
A tomada de decisão
Após entramos em consenso a nos abrir a estudar outras ferramentas, a primeira iniciativa foi fazermos uma análise de GAP com as ferramentas mais relevantes atualmente, e as escolhidas foram: Figma, Invision Studio e Sketch em comparação ao Adobe XD. Levantamos os prós e contras de cada uma, desde as principais features, os planos e valores de assinatura, a relevância diante do mercado nacional e global e ao final montamos um comparativo com tudo isso e apresentamos ao time. Após uma troca de ideia a nossa decisão foi aderir ao Figma. Alguns dos recursos que nos levaram a essa decisão foram:
- Web-base Platform
Por ser construído para rodar em navegadores, o Figma nos entrega uma ferramenta leve, rápida e estável, com isso também pode ser utilizada tanto em Mac, Windows ou até Linux. - Collaboration
Prototipação com colaboração em tempo real entre os editores e visualizadores do projeto. - Figma Organization
Série de recursos pensados para grandes empresas que vão além da configuração da equipe. Em vez de um único espaço de trabalho para uma equipe contamos com um “espaço de organização” dedicado. - Design System Analytics
Ferramenta que permite a análise de tendências de uso e comparação de uma biblioteca de componentes. - Integrations
Diversas possibilidades de integrações com ferramentas como Maze, Zeroheight, Confluence, Slack e muitas outras. - Vector Networks
Uma pen tool construída do zero que permite desenhar em qualquer direção com redes vetoriais. - Auto Layout
Recurso onde pode-se predefinir paddings, espaçamentos, ordens e direções para projetar telas e componentes, tornando a prototipação responsiva mais ágil e integrada. - Variants
Uma leque de novas possibilidades para criação de componentes e sistemas de design escaláveis.
E por fim: o Figma hoje tem se mostrado uma ferramenta sólida, estável e sempre antenada em trazer novidades e com uma ótima aceitação no mercado.
Como está sendo
Migrar todo um workflow estabelecido com projetos rodando e designers, clientes e desenvolvedores habituados não é uma tarefa simples, então para isso tomamos algumas iniciativas:
- Montamos um workshop semanal onde designers do time que já possuem experiência com a ferramenta trazem um exercício e o executam ao vivo para todos os membros, com sessões de tirada de dúvidas ao final.
- Criamos um modelo de organização para os nossos projetos, times/squads e arquivos.
- Reorganizamos toda a estrutura de arquivos do nosso drive, para que de agora em diante concentrarmos nossos protótipos todos na nuvem do Figma.
- Migramos 90% do Orbit, nosso design system, agora estruturado por design tokens, desenhando todos os componentes do zero e com isso aproveitando os novos recursos como auto layout e variants.
- Estamos produzindo um documento guia com nossas boas práticas de prototipação no Figma para incluir no onboarding dos novos membros que entrarem.
Os próximos passos
- Definir uma estrutura visual com padrões de capas (thumbnails) para os projetos.
- Definir e documentar como será o nosso novo processo de handoff e ux documentation, agora utilizando o Figma.
- Criar uma documentação para auxiliar os desenvolvedores que utilizarão o Figma no handoff. Exemplo: como inspecionar elementos, compartilhar links, fazer comentários, etc.
- Oficializar a ferramenta para toda a Objective.
A única certeza é a mudança
O intuito desse post não criticar ou exaltar ferramenta A ou B, até por isso não entramos em detalhes aqui sobre uma ferramenta ter isso e a outra não ou o preço de uma ser X e a outra Y, até porque com uma rápida pesquisa no site de cada uma já é possível ter essa visão atual. A ideia aqui foi relatar porque optamos em migrar, quais estão sendo nossos passos e afirmar que:
Como designers não devemos nos prender a uma ferramenta ou metodologia, ao contrário, acreditamos que testar, fazer, refazer e mudar tudo quando é necessário são algumas das bases do que é ser designer de fato e se no futuro notarmos que devemos mudar novamente, assim faremos.
Hoje podemos dizer que estamos bastante felizes e logo faremos um outro post compartilhando aqui como tem sido a nossa experiência trabalhando com o Figma em todos os nossos projetos.
Até mais!
