Tem muita lista de plugins de Figma por aí. Se você usa Instagram deve ter visto dezenas de listas mencionando centenas de plugins diferentes. O que essa lista aqui tem de diferente? Ela é real.
Eu realmente uso esses plugins praticamente todo dia, coloquei-os em ordem de maior utilização. Claro que tem plugins maravilhosos por aí como os de mapa ou para puxar dados de planilha, mas essa lista tem plugins de uso diário.
E se você usa um todo dia e não está nessa lista, nos marque no Linkedin contando um pouco sobre o problema que ele resolve.
Photos
Sabe quando você está em busca de uma imagem para ilustrar um post ou fazer uma arte-conceito? Aí você abre provavelmente sites como o Pixabay ou o Unsplash, e vai caçando a foto perfeita.
Imagina fazer uma única busca e conseguir procurar em três serviços diferentes, pois é isso que o Photos nos permite.
Iconify
Google > icone salvar. FlatIcon > icon search. TheNounProject > icon course.
Essa era a minha vida antes de descobrir o Iconify. Plugin que busca em uma base de 50mil (!) ícones entre bibliotecas como FontAwesome e Material Design. Claro que não substitui um NucleoApp ou IconFinder, mas as vezes você quer algo rápido para um wireframe.
Contrast
Depois de testar alguns plugins focados em acessibilidade para o Figma, esse aqui foi o que mais gostei pela sua simplicidade. Não resolve todos os problemas de acessibilidade que nós projetamos mas é aquele tijolinho a mais que conta no final.
Basicamente o Contrast confere se um elemento está dando contraste suficiente de leitura de acordo com o fundo em que ele está. Não só um “acho que ficou bom”, mas calculando e dando resultados com base nas diretrizes de acessibilidade na web.
Design Lint
O Design Lint é ótimo para duas coisas: padronizar o layout com base nos padrões do projeto e evitar o dev team te xingar. 🙂
Imagine que a cor do seu logotipo é o roxo #4D0099, e sem querer você acaba escolhendo um tom de roxo bem próximo, mas diferente para uma aplicação que deveria ir exatamente a cor da marca.
Esse plugin detecta que você usou algo fora do seu guia de estilos do Figma e sugere a correção.
Padrão mantido!
Figma <-> HTML
O Figma <-> HTML (antigo HTML to Figma) quebra um galho danado quando você:
- não tem acesso fácil aos arquivos de design de um projeto para pegar cores e componentes
- não encontra o .sketch/.xd ou mesmo o arquivo do Figma de uma página que já está no ar
Para usar, só digitar a URL do site (como na imagem acima) que você quer “puxar” e ele transforma tudo em Figma. Testando com o site da Musicdot, coloquei do lado esquerdo e do direito é o layout já “puxado” para o Figma direto do plugin. Repare que apesar de não ser perfeito, tudo editável!
Se quer ver em mais detalhes sobre o plugin sugiro dar uma lida neste post de como converter um site para layout dentro do Figma.
E repetindo o pedido ali do começo do post: faça um post no Linkedin comentando de algum plugin que você usa também quase que todo dia. Não esqueça de marcar o Dicas UX por lá.