Como exportar um logo do Figma para um cliente

1. Prepare uma cópia de entrega da arte aprovada

Crie uma área de entrega claramente nomeada no seu arquivo Figma. Coloque cada variação aprovada do logo em seu próprio quadro ou grupo: por exemplo, Principal, Símbolo e Branco. Mantenha conceitos rejeitados e versões exploratórias em outro lugar. Isso reduz bastante os erros ao selecionar a exportação certa.

Inspecione os limites ao redor de cada logo. Um quadro largo e vazio pode deixar uma marca minúscula dentro de uma imagem grande; um limite muito justo pode cortar algo que fica fora dele. Decida se a margem deve estar no arquivo exportado ou será adicionada pelo layout que o utiliza. Confira a seleção conforme essa decisão.

Mantenha o original editável intacto. Uma cópia de entrega permite resolver problemas de exportação sem perder o texto editável, a estrutura de componentes ou outras informações necessárias para uma revisão futura.

• Dê um nome útil a cada exportação selecionada antes de baixá-la.
• Remova fundos de apresentação das versões que devem ser transparentes.
• Confira se o logo selecionado inclui todas as partes da composição aprovada.
• Confirme se textos pequenos, máscaras e efeitos são preservados na saída pretendida.

2. Exporte um SVG e abra-o novamente

Com o logo selecionado, clique em + ao lado de Export no painel de propriedades, escolha SVG e exporte a seleção. O Figma também oferece saídas nativas PNG, JPG e PDF; usar outra ferramenta é opcional. Seus controles de exportação incluem larguras e alturas raster personalizadas.

O Figma converte texto SVG em contornos por padrão. Isso preserva as formas das letras sem manter texto editável na exportação. Guarde o arquivo de trabalho para futuras edições de texto. Revise as configurações de exportação se o projeto exigir especificamente texto editável.

Abra o SVG baixado em um navegador e, quando útil, em outro editor vetorial. Compare o logotipo letra por letra com a versão aprovada. Confira espessuras dos traços, vazios das formas, limites externos e detalhes em camadas. Um download bem-sucedido confirma apenas que um arquivo foi criado.

Leitura complementar: Figma: exportar do Figma · Figma: formatos e configurações de exportação

3. Crie arquivos para tela conforme os destinos reais

Pergunte ao cliente quais serão os próximos lugares em que o logo aparecerá. Um cabeçalho de site, uma apresentação e uma imagem de perfil têm restrições diferentes. Anote as dimensões exigidas, o fundo e os formatos aceitos antes de criar um grande conjunto de exportações.

Por exemplo, suponha que um desenvolvedor peça um logo raster transparente exibido com 180 pixels de largura. Uma exportação de 360 pixels de largura oferece uma imagem 2× para essa aplicação; uma de 540 pixels oferece 3×. Esses tamanhos são específicos deste exemplo. Confirme a necessidade real com o desenvolvedor em vez de tratar qualquer um desses valores como padrão universal. Para criar a versão de 360 pixels no Figma, adicione uma exportação PNG e insira 360w no campo Scale; use 540w para o exemplo 3×.

Use SVG onde o destino o aceitar e PNG quando precisar de transparência em um arquivo raster. Forneça JPG apenas quando uma imagem de fundo sólido for adequada ou exigida. Escolha o perfil de cor digital esperado; o Figma oferece controles de exportação sRGB e Display P3. Teste o arquivo resultante no destino real.

Acme_Primary_Web.svg
Acme_Primary_Transparent_360px.png
Acme_White_Transparent_360px.png
Acme_Primary_WhiteBackground_1200px.jpg

Estas são entregas de exemplo, não tamanhos obrigatórios.

Continue com: Escolha formatos por caso de uso

4. Trate a impressão como uma decisão de produção separada

Se uma gráfica pedir EPS CMYK ou uma especificação PDF particular, registre exatamente a solicitação. Um PDF baixado do Figma, por si só, não estabelece que as exigências de cor, perfil e produção da gráfica tenham sido atendidas.

Pergunte se o fornecedor espera CMYK de processo, cores especiais, um perfil de saída nomeado ou uma norma PDF específica. Confira o arquivo realmente exportado em um fluxo de inspeção adequado e peça uma prova quando a precisão de cor for importante. Forneça o logo como um arquivo de arte; adicione sangria ou marcas de corte apenas quando também estiver preparando o layout finalizado que as exige.

Para arte SVG vetorial sólida compatível, o logopack.app pode criar arquivos de logo EPS CMYK e, com Pro, PDF CMYK usando os valores CMYK do projeto. Artes complexas podem precisar de preparação em um editor vetorial. Essas exportações ainda precisam ser conferidas conforme o briefing do fornecedor.

Leitura complementar: Adobe: opções de saída de PDF

5. Escolha como montar o pacote

Para uma entrega pequena, exportações nativas do Figma e pastas bem nomeadas podem bastar. Mantenha o processo que consegue verificar facilmente. Se você costuma precisar de muitas variações aprovadas e tipos de arquivo, um fluxo de preparação de pacotes pode reduzir a organização manual.

Uma opção é enviar o SVG verificado ao logopack.app, identificar o logo principal e as versões adicionais, revisar as variações de cor e inspecionar a prévia das pastas. As exportações padrão incluem SVG, PNG, JPG, WebP e EPS CMYK. Pro acrescenta configurações personalizadas de exportação, saída de logo PDF CMYK para arte compatível e um Guia do Logo em PDF. Uma conta gratuita pode visualizar sua arte e exportar a demonstração fornecida sem alterações. Exportar sua própria arte exige Pro.

Se preferir continuar no Figma, o TinyImage tem um fluxo documentado de Logo Packager. Compare as saídas necessárias e as condições atuais do plano antes de escolher. A pergunta útil é se o pacote final atende às necessidades do cliente e poupa o trabalho que você faria manualmente.

Continue com: Compare fluxos de preparação de pacotes de logos

Leitura complementar: TinyImage: preparar um pacote de logos no Figma

6. Confira o que o cliente receberá

Extraia a entrega real em uma pasta nova. Abra arquivos representativos de todos os formatos e variações de logo. Teste um logo branco transparente sobre fundo escuro para que não seja confundido com um arquivo vazio.

Inclua instruções curtas que identifiquem o logo padrão e expliquem quais arquivos usar em aplicações comuns. Se o acesso editável ao Figma fizer parte do acordo, entregue-o separadamente com as permissões adequadas. Uma pasta de exportações não substitui a entrega combinada dos arquivos de origem.

• ✓Compare letras e formas com a arte aprovada.
• ✓Confira as dimensões raster em pixels, as margens e a nitidez no tamanho de uso.
• ✓Inspecione os arquivos transparentes em fundos claros e escuros.
• ✓Confirme as configurações de cor e saída de impressão conforme a solicitação do fornecedor.
• ✓Remova versões duplicadas, rejeitadas e obsoletas.
• ✓Leia os nomes de arquivo e as instruções como alguém novo no projeto.

Perguntas comuns sobre exportação de logos no Figma