Comprimir as exportações de imagens do Figma

Como escolher as configurações de exportação e comprimir as exportações de imagens do Figma com o TinyImage.

O TinyImage detecta as configurações e os formatos de exportação definidos em qualquer camada da sua página do Figma e permite exportá-las como imagens comprimidas pelo plugin TinyImage.

As verificações automáticas da página ignoram camadas dentro de contêineres ocultos. As camadas selecionadas explicitamente no Figma continuam sendo verificadas de acordo com a própria visibilidade e as próprias configurações de exportação. Você não precisa alterar as configurações de exportação salvas.

Para um guia completo sobre os detalhes das configurações de exportação do Figma e como elas funcionam, consulte o guia oficial de exportações do Figma na central de ajuda do Figma.

Toda camada que você quer comprimir precisa de pelo menos uma configuração de exportação. Se uma camada não tiver nenhuma configuração de exportação, o TinyImage não vai saber que você quer comprimi-la e exportá-la, e ela não vai aparecer na lista de imagens exportáveis do plugin.

Adicionar e atualizar as configurações de exportação ​

Para começar a exportar imagens comprimidas do Figma, primeiro confira se você definiu configurações de exportação de imagem nas camadas que quer comprimir.

Adicionar configurações de exportação às camadas do Figma ​

Para adicionar configurações de exportação a uma ou mais camadas, selecione as camadas no Figma e, no painel de propriedades do Figma, clique no ícone + ao lado de Export. Clique no + quantas vezes quiser para adicionar mais configurações de exportação à camada. Assim, você pode exportar uma única camada em vários formatos e tamanhos de uma vez (por exemplo, SVG, JPG @1x, JPG @2x, PDF etc.).

Atualizar as camadas do Figma depois de alterar as configurações de exportação ​

Se você já adicionou configurações de exportação a uma camada, mas quer adicionar ou remover algumas com o plugin TinyImage já em execução, faça isso como no passo anterior. Quando as novas configurações de exportação da camada estiverem como você quer, clique no ícone Refresh na barra de ferramentas do TinyImage para atualizar as camadas do Figma e mostrar as opções de exportação atualizadas na lista de imagens exportáveis do TinyImage.

Definir a porcentagem de qualidade ou o tamanho alvo da compressão ​

O TinyImage permite definir a porcentagem de qualidade da compressão de 1%-100% ou um tamanho máximo de arquivo alvo (em kilobytes) para as exportações de imagens. Um número menor gera arquivos menores, mas com qualidade de imagem mais baixa. Um número maior gera arquivos maiores, mas com qualidade de imagem mais alta.

  • 0%-50% qualidade baixa (72dpi para PDFs)
  • 50%-75% qualidade boa (150dpi para PDFs)
  • 75%-100% melhor qualidade (300dpi para PDFs)

Ajustar a porcentagem de qualidade da compressão ​

Defina o nível de qualidade de todas as exportações de imagens de 1%-100% com o controle deslizante de compressão na barra de ferramentas do TinyImage. Clique no controle e arraste-o para definir o nível de qualidade desejado. Essa configuração vale para todas as suas exportações do TinyImage.

Definir um tamanho máximo de arquivo (kb) como alvo da compressão ​

Você também pode definir um limite máximo de tamanho de arquivo (em kilobytes): ative a opção Size Target e insira um valor em kilobytes no campo de tamanho. Assim, o TinyImage tenta deixar cada imagem abaixo desse tamanho máximo.

Observação: isso costuma ser mais lento do que usar o controle deslizante de porcentagem de qualidade, porque cada imagem precisa ser comprimida aos poucos até atingir o limite desejado.

Prefere definir o tamanho máximo do TinyImage pelo Figma em vez da interface do plugin? Use o sufixo das configurações de exportação do Figma em qualquer camada exportável. Adicione um sublinhado seguido de um número terminado em kb (por exemplo, _250kb), e o TinyImage usa esse valor como tamanho máximo daquela camada. Exemplos de sufixos válidos: _250kb, @2x_500kb, @1x_300kb

Os tamanhos alvo não valem para exportações em PDF ou GIF. A opção de compressão por tamanho de arquivo alvo não tem efeito nas exportações em PDF ou GIF do TinyImage; ela vale apenas para imagens JPG, PNG, SVG, AVIF e WebP.

Substituir os níveis de qualidade/tamanho da compressão por exportação ​

Além de definir o nível de qualidade com o controle deslizante, o TinyImage permite definir níveis de qualidade/tamanho diferentes para cada formato de imagem, substituindo o valor global definido pelo controle deslizante de qualidade ou pelo campo de tamanho alvo no cabeçalho do plugin.

Para definir a qualidade de um formato de imagem, clique no campo numérico de qualidade ao lado da imagem que você quer alterar. Insira qualquer número entre 1%-100%; esse número passa a ser a configuração de qualidade usada na exportação da imagem.

Se você estiver usando um tamanho máximo de arquivo como alvo, defina uma substituição clicando no campo numérico de KB ao lado da imagem cujo tamanho alvo você quer alterar. Insira qualquer número entre 1-9999 (KB); esse número passa a ser o tamanho de arquivo alvo usado na exportação da imagem.

Selecionar as imagens para comprimir ​

Depois de adicionar configurações de exportação às camadas que você quer comprimir, elas aparecem na lista de imagens exportáveis do TinyImage. Mas você não precisa exportar todas as imagens da página do Figma de uma vez (se não quiser). O TinyImage permite marcar (e desmarcar) as imagens exportáveis que você quer comprimir usando caixas de seleção.

Marcar e desmarcar imagens exportáveis ​

Para marcar (ou desmarcar) uma imagem para exportação, clique na caixa de seleção ao lado da miniatura da imagem na lista de imagens exportáveis do TinyImage. Desmarcar uma imagem a exclui da compressão e da exportação; marcá-la a inclui na exportação.

Marcar/desmarcar todas as camadas rapidamente. Para marcar ou desmarcar todas as imagens da lista de uma vez, clique na caixa de seleção na barra de ferramentas do TinyImage, acima da lista de imagens exportáveis.

Carregar só as camadas selecionadas ao abrir o TinyImage ​

Para evitar a verificação de uma página grande quando o TinyImage abre, destaque no Figma as camadas exportáveis de que você precisa antes de abrir o plugin. No início, o TinyImage carrega apenas as camadas selecionadas que já têm configurações de exportação.

Mudar a seleção do Figma com o TinyImage já aberto pode filtrar as camadas já carregadas, mas não inicia outra verificação nem carrega novas camadas em segundo plano. Se a nova seleção tiver camadas fora do conjunto carregado inicialmente, o TinyImage pede que você clique em Refresh All Exportable Layers. Isso verifica a página atual em busca de camadas exportáveis, incluindo camadas e configurações de exportação recém-adicionadas, e ignora as camadas dentro de contêineres ocultos.

Se a seleção atual continuar sem nenhuma correspondência exportável depois dessa atualização, o TinyImage mantém visível a lista completa da página para você continuar trabalhando. Mudar a seleção ou trocar de página restaura o filtro normal pela seleção.

Atualizar as configurações de exportação para a seleção de imagens ​

Se uma ou mais camadas selecionadas ainda não tiverem configurações de exportação, clique no ícone + ao lado de Export no painel de propriedades do Figma e adicione as configurações necessárias.

Quando as novas configurações de exportação estiverem como você quer, clique no ícone Refresh na barra de ferramentas do TinyImage. O TinyImage verifica a página atual de novo e mostra as opções de exportação atualizadas na lista de imagens exportáveis.

Exportar as imagens comprimidas ​

Depois de selecionar as imagens exportáveis que você quer comprimir, clique em Export na barra de ferramentas do TinyImage para começar a comprimir as imagens selecionadas, uma por uma. Um indicador de progresso mostra qual imagem está sendo comprimida no momento e a economia de tamanho de arquivo ao fim de cada compressão. Aguarde até que todas as imagens terminem de ser comprimidas; quanto mais imagens você tiver e quanto maiores elas forem, mais tempo vai levar.

Velocidade da compressão de PNG/PDF. A compressão de exportações PNG e PDF pode levar mais tempo do que a de exportações JPG e SVG, principalmente se forem muito detalhadas ou tiverem dimensões grandes. O TinyImage avisa se uma imagem for grande demais para ser comprimida.

Salvar o arquivo zip exportado ​

Depois que todas as imagens forem processadas, aparece uma notificação confirmando que elas foram comprimidas, e o download do arquivo .zip começa automaticamente.

Exportação de uma única imagem Se você estiver exportando só uma imagem comprimida, o TinyImage não a coloca em um arquivo .zip; você salva o arquivo de imagem no seu computador do jeito que ele é.

Salvar arquivos baixados do Figma. Se você usa o app desktop do Figma, vai aparecer uma janela para baixar o arquivo. Já se você usa o Figma em um navegador, por padrão o arquivo é baixado automaticamente para o seu computador (normalmente para a pasta Downloads).

Abrir o arquivo zip exportado ​

Depois que o arquivo .zip for salvo do Figma no seu computador, abra o gerenciador de arquivos na pasta em que ele foi salvo. Clique duas vezes no arquivo .zip exportado para descompactar o conteúdo e usar todas as imagens comprimidas.