Figma é uma ferramenta de design baseada em nuvem semelhante a Esboço em funcionalidade e recursos, mas com grandes diferenças que tornam o Figma melhor para Colaboração em equipe . Para os céticos em relação a tais afirmações, explicaremos como o Figma simplifica o processo de design e é mais eficaz do que outros programas para ajudar designers e equipes a trabalharem juntos de forma eficiente.
Vamos olhar mais de perto.
Figma funciona em qualquer plataforma
Figma funciona em qualquer sistema operacional que execute um navegador da web. Macs, PCs com Windows, máquinas Linux e até mesmo Chromebooks podem ser usados com Figma. É a única ferramenta de design desse tipo que faz isso, e em lojas que usam hardware executando diferentes sistemas operacionais, todos ainda pode compartilhar, abrir e editar arquivos Figma.
Em muitas organizações, designers usam Macs e os desenvolvedores usam PCs com Windows. Figma ajuda a reunir esses grupos. A natureza universal do Figma também evita o aborrecimento do PNG-pong (onde as imagens atualizadas são movidas para frente e para trás entre as disciplinas da equipe de design). No Figma, não há necessidade de um mecanismo de mediação para tornar o trabalho de design disponível para todos.
A colaboração no Figma é simples e familiar
Como o Figma é baseado em navegador, as equipes podem colaborar como fariam em documentos Google . Pessoas visualizando e editando um arquivo são mostradas na parte superior do aplicativo como avatares circulares. Cada pessoa também tem um cursor nomeado, portanto, rastrear quem está fazendo o que é fácil. Clicar no avatar de outra pessoa amplia o que a pessoa está vendo naquele momento.
A colaboração de arquivos em tempo real ajuda a mitigar “desvios de design” - definidos como interpretação incorreta ou desvio de um design acordado. A deriva de design geralmente acontece quando uma ideia é concebida e rapidamente implementada enquanto um projeto está em andamento. Infelizmente, isso muitas vezes leva ao desvio do projeto estabelecido, causando atrito e retrabalho.
Usando o Figma, um líder de design pode verificar o que a equipe está projetando em tempo real simplesmente abrindo um arquivo compartilhado. Se um designer de alguma forma interpretar mal o brief ou a história do usuário, esse recurso permite que o líder do design intervenha, corrija o curso e economize incontáveis horas que de outra forma seriam desperdiçadas. (Em comparação, as equipes que usam o Sketch não têm como saber imediatamente se os designers estão se perdendo.)
Nota lateral: alguns designers não gostam de ser 'espionados' quando estão trabalhando, então cabe ao líder do projeto explicar os benefícios. Em geral, a maioria dos designers vê rapidamente o valor de tal recurso e se adapta facilmente para trabalhar em um ambiente compartilhado.
quais são os 5 princípios da Gestalt?
Figma usa folga para comunicação da equipe
Figma usa Folga como seu canal de comunicação. Quando um Canal Figma é criado no Slack , quaisquer comentários ou edições de design feitos no Figma são “negligenciados” para a equipe. Essa funcionalidade é crucial ao projetar ao vivo porque as alterações em um arquivo Figma irão atualizar todas as outras instâncias onde o arquivo está embutido (uma possível dor de cabeça para os desenvolvedores). Mudanças em uma maquete, garantidas ou não, são examinadas imediatamente, e o canal de feedback está ao vivo.
O compartilhamento Figma é descomplicado e flexível
Figma também permite compartilhamento baseado em permissões de qualquer arquivo, página ou quadro (chamado de prancheta em outras ferramentas de design). Quando um link de compartilhamento é criado para um quadro em uma página, a pessoa que clicar nesse link abrirá uma versão do navegador do Figma e uma visualização ampliada do quadro será carregada.
Esta forma de compartilhamento seletivo, de arquivo para quadro, permite designers , proprietários de produtos e desenvolvedores compartilham exatamente o que é necessário em ferramentas de rastreamento de bugs e software de comunidade, como Confluência ou SharePoint .
Arquivos Figma incorporados fornecem atualização em tempo real
Figma também compartilha trechos de código embutido ao vivo para colar um iFrame em ferramentas de terceiros. Por exemplo, se o Confluence for usado para exibir arquivos de maquete incorporados, esses arquivos não são “atualizados” salvando um arquivo Figma - esses arquivos incorporados SÃO o arquivo Figma.
Se uma alteração for feita no mockup por qualquer pessoa no Figma, essa alteração pode ser vista ao vivo no mockup do Confluence embutido. (Você pode ler mais sobre a integração Figma e Confluence Aqui .)
O efeito desse recurso no processo de UX é ilustrado no diagrama a seguir:
Antes da Figma, várias outras ferramentas foram usadas para facilitar a troca de maquetes e atualizações de design. O ciclo de iteração era uma série de atualizações de arquivos para frente e para trás, para que as equipes pudessem revisar e implementar o design atual.
o que a elasticidade-preço da demanda mede?
Depois de Figma, ferramentas de terceiros não são mais necessárias (mas podem ser usadas se desejado). Uma vez que Figma lida com a funcionalidade do ferramentas de terceiros descrito anteriormente, há apenas uma etapa no processo - mova dos esboços para o Figma e todos os grupos terão os modelos mais recentes. Não há “transferência” no sentido mais estrito da palavra.
Figma é ótimo para feedback de revisão de projeto
Suportes Figma dentro -app comentando nos modos de design e prototipagem, e o tópico de comentários é rastreado no Slack e / ou e-mail. Não há necessidade de publicar arquivos PNG ou realizar atualizações constantes para obter feedback de uma equipe usando uma ferramenta de terceiros como InVision ou Maravilha .
Durante as revisões de design, os designers da equipe podem discutir seu trabalho em uma tela grande, registrar comentários e corrigir problemas - tudo no Figma. Essa forma de feedback ao vivo não é possível com o Sketch, que requer upload para um serviço de nuvem para obter a opinião da equipe.
A transferência do desenvolvedor é facilitada com o Figma
Figma exibe trechos de código em qualquer quadro ou objeto selecionado nos formatos CSS, iOS ou Android para os desenvolvedores usarem ao revisar um arquivo de design. Os componentes do design podem ser inspecionado por qualquer desenvolvedor em qualquer arquivo que eles possam ver. Não há necessidade de usar uma ferramenta de terceiros para obter as informações. Mesmo assim, o Figma possui integração total com Zeplin se as equipes quiserem fazer mais do que simples medição e exibição de CSS.
Os arquivos do projeto Figma residem em um só lugar - online
Como o Figma é um aplicativo online, ele lida com organização de arquivos exibindo projetos e seus arquivos em uma exibição dedicada. Figma também oferece suporte a várias páginas por arquivo, como Sketch, para que as equipes Agile possam organizar seus projetos de forma lógica:
- Crie um projeto para o recurso tema .
- Crie um arquivo para um épico ou grande recurso.
- Crie páginas nesse arquivo para cada usuário história .
Este é apenas um método de organização de arquivos que pode se tornar mais ou menos granular, dependendo das demandas do processo.
APIs Figma fornecem integração de ferramentas de terceiros
Figma agora tem APIs de desenvolvedor para permitir a verdadeira integração com qualquer aplicativo baseado em navegador. As empresas estão usando isso para integrar exibições em tempo real de arquivos de design em seus aplicativos. Por exemplo, o Uber tem telas grandes exibindo arquivos de design “ao vivo no ar” em sua empresa. Os designs são compartilhados e o feedback de todos na empresa é bem-vindo.
o que é uma análise heurística
O software JIRA da Atlassian implementou um Figma add-on portanto, proprietários de produtos, desenvolvedores e engenheiros de qualidade estão sempre visualizando a versão mais recente de qualquer maquete dos designers.
Além disso, a API da Figma promete atender às solicitações dos clientes por plug-ins de terceiros e aprimoramentos de recursos que o Sketch já fornece.
O controle de versão de arquivo é automático ou sob demanda
Qualquer incerteza em torno da atualização do arquivo ao vivo é ainda mais mitigada pelo Figma integrado sistema de controle de versão . A qualquer momento, um designer pode criar uma versão nomeada e uma descrição de um arquivo Figma; isso pode ser feito imediatamente após as mudanças acordadas serem feitas em um projeto.
O arquivo ao vivo no ambiente compartilhado não será afetado até que as alterações sejam deliberadamente confirmadas na versão original. Também é possível restaurar qualquer versão salva automaticamente para criar uma duplicata ou substituir o original.
A prototipagem no Figma é simples e intuitiva
Enquanto Sketch recentemente adicionou prancheta a prancheta prototipagem , Figma foi além ao fornecer transições entre quadros. O recurso de prototipagem simples do Figma elimina a necessidade de outra ferramenta que faça prototipagem no estilo de apresentação de slides, como InVision ou Marvel. Quando tudo o que é necessário é uma apresentação simples com transições, não há necessidade de exportar para ferramentas de revisão.
Protótipos Figma pode ser distribuído da mesma forma que os arquivos de projeto Figma; qualquer pessoa com permissão de link pode visualizar e comentar sobre um protótipo e, novamente, esse feedback é capturado no painel de comentários da ferramenta e registrado no Slack. Os desenvolvedores podem ver o fluxo de trabalho do design, deixar @messages diretas para os designers e obter medidas e atributos CSS de dentro do protótipo.
As bibliotecas da equipe da Figma são ideais para sistemas de design
Sistemas de design tornaram-se uma necessidade para muitas empresas e há uma necessidade de componentes (símbolos no Sketch e no Illustrator) que são reutilizáveis, escalonáveis e “ tokenizado ”Para uso nas bibliotecas de padrões disponíveis para Designers de UX e desenvolvedores front-end.
A frase frequentemente usada 'fonte única da verdade' se encaixa aqui - uma vez que Biblioteca da equipe Figma for criado, qualquer pessoa com acesso a um projeto pode usar instâncias dos componentes em seus designs e ter certeza de que estão trabalhando com as versões mais recentes.
A abordagem de Figma para bibliotecas de componentes é simples e fácil de gerenciar. Os designers podem criar arquivos cheios de componentes ou usar componentes na página para organizar uma biblioteca de padrões. Cada quadro em uma página Figma torna-se a seção organizacional na biblioteca da equipe (não há necessidade de criar hierarquias como esta).
Uma forma de organizar bibliotecas é ter um projeto dedicado exclusivamente a componentes. Os arquivos desse projeto podem ser organizados conforme necessário e as páginas desses arquivos podem ser organizadas de acordo.
Figma foi construída para aprimorar o trabalho em equipe de design
Usar o Figma por qualquer período de tempo demonstrará os benefícios desta ferramenta de colaboração ao vivo. Ele mantém as equipes atentas e incentiva a divulgação completa, essencial ao construir um sistema de design para uma variedade de disciplinas. O Figma é fácil de usar em qualquer plataforma e permite que as equipes compartilhem seu trabalho e bibliotecas rapidamente.
Especialistas em design que usam Figma depois fazendo a mudança do Sketch (Os arquivos de esboço podem ser importados com paridade para o Figma) não estão desapontados:
... transforma completamente a maneira como você pode trabalhar com seus colegas e clientes - Simplifique o design colaborativo com Figma
Figma reuniu o melhor de tudo no mundo das ferramentas de design de IU nos últimos anos - Por que sua equipe de design deve considerar a mudança para o Figma
No ano passado, tenho usado o Figma para o meu processo de design de UI / UX e isso tem me poupado horas de trabalho. Ele realmente transformou meu fluxo de trabalho de design - Como otimizar seu fluxo de trabalho de IU / UX com Figma
c corporação e s corporação
Meu tempo passado no Figma é geralmente a parte mais agradável e produtiva do meu dia - Figma está transformando todo o meu fluxo de trabalho, e é incrível!
• • •
Leitura adicional:
- Domine sua arte com essas ferramentas UX de ponta
- Simplifique o design colaborativo com Figma
- Use Craft by InVision para agilizar a colaboração da equipe
- Morte para o Wireframe. Direto para alta fidelidade!
- Torne-se um designer de classe mundial, tornando o globo seu escritório
Compreender o básico
Qual é o significado das ferramentas de colaboração?
No design, as ferramentas de colaboração ajudam designers de diferentes disciplinas (junto com desenvolvedores) a trabalharem juntos para criar produtos digitais.
O que é uma ferramenta de colaboração online?
Figma, InVision e Marvel são exemplos de ferramentas de colaboração online que designers e desenvolvedores usam para construir produtos digitais. As ferramentas de colaboração online permitem que designers e desenvolvedores editem, comentem e revisem projetos e códigos juntos.
Quais são as etapas do processo de design?
As etapas do processo de design podem variar, mas em geral são: (1) definir o problema, (2) realizar pesquisas, (3) analisar pesquisas e fazer brainstorm de ideias, (4) desenvolver soluções iniciais, (5) observar e registrar feedback e (6) refinar as soluções e repetir as etapas necessárias.
