PerfectVector
Por Irene Kim

Filtros PicSVG: compare Edge, Internal e Clean

Compare três filtros PicSVG em uma imagem, salve cada SVG separadamente e verifique quais regiões, aberturas e tratamento de fundo se adequam ao design pretendido.

9 min de leitura
Nesta página

Escolha os filtros PicSVG comparando os resultados salvos da mesma imagem. Mantenha os Details fixos, altere um filtro nomeado por vez e verifique as regiões e vagas necessárias. Em nosso controle geométrico, Edge 2 enfatizou os limites, Internal 1 manteve duas formas preenchidas, mas omitiu um triângulo, e Clean 1 alterou o tratamento de fundo. A lista de caminhos mais curtos não era automaticamente a versão mais útil.

Se nenhum dos efeitos mantiver as formas que seu projeto precisa, comece gratuitamente com PerfectVector na página alternativa do PicSVG e compare as silhuetas, aberturas e regiões de cores da visualização com sua fonte. Você deve desbloquear o resultado antes de poder editá-lo ou exportá-lo. O fluxo de trabalho do filtro abaixo é completo no próprio PicSVG; não realizamos uma comparação da qualidade dos resultados entre os serviços.

Experimente com a sua própria imagem
Abrir a ferramenta completa
Teste grátis. Solte uma imagem e veja a prévia do seu vetor, sem precisar criar conta.

Comece com uma fonte e uma configuração fixa de Details

Este guia usa o site PicSVG, cuja página testada se identificou como Beta V3.4. Seu conversor comum oferece upload, efeitos selecionáveis ​​e download SVG. O site nomeia entradas JPG, GIF e PNG de até 4 MB. Use uma imagem que você tenha permissão para converter e preservar o original.

Nossa fonte enviada foi um 320 × 240 RGBA PNG original: uma moldura retangular azul-marinho com um centro transparente, um triângulo dourado e um bloco verde-azulado em um fundo transparente. A visualização ORIGINAL RESIZED do site exibia essas áreas transparentes em branco. Nossa comparação aborda a seleção de filtros. Não testamos a preservação da transparência nem inspecionamos um arquivo intermediário que explicasse o manuseio alfa do site. Isso facilita a separação de várias questões: um filtro retém cada forma, mantém a abertura do quadro, preserva a cor ou adiciona geometria de fundo?

  1. Use UPLOAD A PICTURE para carregar a fonte.
  2. Mantenha Details: Strong ao comparar os filtros.
  3. Selecione um filtro nomeado usando o menu suspenso Filtros visível e confirme o rótulo exibido.
  4. Aguarde a atualização da visualização, inspecione-a e use DOWNLOAD SVG.
  5. Salve um nome de arquivo local distinto antes de escolher o próximo filtro.

Testamos Edge 2, Internal 1 e Clean 1, todos com Strong. Strong foi o ajuste mantido constante neste experimento. Não o comparamos com outros valores de Details nem verificamos se ele preserva cada pequeno detalhe. A conversão normal foi concluída sem Supermode.

Estado real do PicSVG
Controles PicSVG reais definidos como Details Strong e Internal 1, com as formas coloridas originais ao lado da moldura preta e do resultado do bloco
A visualização do Internal 1 mantém o quadro e o bloco enquanto o triângulo dourado da fonte está ausente.

Compare o que Edge 2, Internal 1 e Clean 1 retêm

Os três SVGs baixados produziram tratamentos diferentes da mesma fonte. Inspecionamos sua marcação e renderizamos os arquivos retidos localmente. Estas são observações sobre esta referência de teste, em vez de definições que preveem cada imagem.

Filtrar, com Details StrongResultado visível nesta fonteDecisão a tomar
Edge 2Faixas finas pretas ao redor da moldura, triângulo e bloco; os grandes interiores são transparentesSe você deseja arte em formato de limite em vez das regiões preenchidas originais
Internal 1Uma moldura preta preenchida com centro aberto e um bloco preto; o triângulo dourado está ausenteSe a região omitida de cor clara é aceitável
Clean 1Fundo preto e regiões internas separadas por estreitas faixas de limite transparentes, incluindo o limite do triânguloSe esse tratamento de fundo pertence ao design pretendido

Para uma versão preenchida que deve manter todas as três formas, nenhum desses resultados específicos é um guardião automático. Internal 1 preserva a abertura do quadro, mas perde o triângulo. Edge 2 mantém seu limite enquanto altera a aparência preenchida. Clean 1 inclui geometria preta onde o PNG carregado tem um fundo transparente e um centro de quadro. Escolha de acordo com os requisitos do desenho, não um nome de filtro que pareça mais sofisticado.

Amplie alguns locais decisivos em vez de julgar apenas a miniatura da página inteira. Nesta fonte, o triângulo e o centro do quadro revelam muito mais do que o grande bloco preto. Se uma abertura for preenchida inesperadamente, o guia de furos SVG ajuda a distinguir regras de preenchimento e formas sobrepostas. Para verificações de antecedentes, use o guia SVG transparente.

Salve cada variante antes de alterar o filtro

Use nomes de arquivos que preservem as configurações reais, como edge2-strong.svg, internal1-strong.svg e clean1-strong.svg. Mantenha-os ao lado da fonte intocada. A página do PicSVG também descreve uma área local de imagens salvas para comparação de resultados; usamos arquivos SVG retidos separadamente para este teste, em vez de tratar essa área como armazenamento durável.

Durante nossa execução, o endereço de download foi reutilizado enquanto o filtro selecionado era alterado. Cada arquivo foi, portanto, recuperado imediatamente sob seu estado de filtro visível. Um endereço reutilizado não é um registro confiável do resultado que você manteve; o nome do arquivo local, a nota de configuração e o conteúdo real do arquivo são registros úteis.

Todos os três arquivos continham caminhos e nenhum elemento de imagem. Suas contagens foram sete para Edge 2, duas para Internal 1 e cinco para Clean 1. Essas contagens mostram diferenças estruturais entre os arquivos salvos. Eles não classificam a qualidade dos resultados. O resultado de dois caminhos ainda omitiu uma forma obrigatória em nossa referência de teste.

Todos os três usaram um grupo pai com preenchimento preto e stroke="none". Os limites de aparência fina da Edge 2 são, portanto, geometria preenchida nesses arquivos, e não evidência de traços de linha central. A especificação de pintura SVG distingue pintar o interior de uma forma de traçar seu contorno. O guia de traçado de arte linear explica como essa distinção afeta as escolhas de arte.

Verifique os limites salvos antes da próxima aplicação

Os arquivos também diferiam em suas declarações de tamanho de raiz:

Variante salvaLargura e altura da raizcaixa de visualização
Edge 2 / Strong320 pt × 240 pt0 0 320 240
Internal 1 / Strong320 pt × 240 pt0 0 320 240
Clean 1 / Strong960 pt × 720 pt0 0 960 720

Estes são campos salvos reais, incluindo suas unidades pt. Não são um relatório do tamanho físico importado. Uma viewBox define o retângulo de coordenadas internas mapeado na viewport SVG, como explica a especificação de coordenadas SVG. Renderizamos as variantes com o mesmo tamanho de revisão para inspecionar seu tratamento; isso não torna suas declarações de tamanho idênticas.

Antes de manter um arquivo, abra aquele SVG específico e verifique as formas, aberturas, plano de fundo e limites declarados necessários. Em seguida, teste-o em seu aplicativo de recebimento no tamanho que você precisa. Não realizamos essa importação, edição manual, impressão ou corte.

Falha na verificaçãoPróxima ação
Uma região clara desapareceCompare outro filtro com aquela região exata na origem
Uma visualização fina está sendo tratada como uma linha centralInspecione o preenchimento/traço e a geometria real antes de escolher o próximo fluxo de trabalho
O resultado adiciona regiões de fundo indesejadasCompare outro efeito e inspecione o arquivo salvo em um fundo contrastante
Vários arquivos salvos parecem idênticos inesperadamenteVerifique novamente o rótulo do filtro visível e salve cada resultado atualizado com um nome de arquivo distinto
O arquivo entra em outro aplicativo com um tamanho inesperadoInspecione unidades e limites e, em seguida, defina e verifique o tamanho pretendido nessa aplicação

Mantenha o resultado do PicSVG quando seu efeito atender ao trabalho. Se as regiões necessárias ainda não sobreviverem, comece gratuitamente com PerfectVector na página alternativa do PicSVG e compare as formas, aberturas e cores da visualização com o mesmo original antes de decidir qual fluxo de trabalho manter.

Perguntas frequentes

Qual ​​filtro PicSVG é melhor?

Escolha o efeito que retém as regiões e aberturas que sua imagem precisa. Em nossa referência de teste, Edge 2 enfatizou os limites, Internal 1 omitiu o triângulo dourado e Clean 1 alterou o tratamento de fundo. Nenhum resultado atendeu a todos os usos possíveis.

O Details Strong preserva todos os pequenos recursos?

Isso não foi provado. Mantivemos Strong fixo ao alterar três filtros nomeados. Mesmo com essa configuração, Internal 1 omitiu um triângulo obrigatório em nossa referência de teste. Inspecione suas regiões críticas em vez de confiar no nome da configuração.

Menos caminhos SVG significam um resultado mais limpo?

Não. As variantes salvas tinham sete, dois e cinco caminhos. O arquivo de dois caminhos ainda perdeu a forma que queríamos. Compare o trabalho artístico e a geometria retidos em vez de escolher apenas a menor contagem de caminhos.

As bordas finas do PicSVG significam que o SVG contém traços de linha central?

Não. Nossos três arquivos salvos usaram geometria preenchida em preto com traço definido como nenhum. Um resultado de aparência fina ainda pode ser uma faixa preenchida ao redor de uma região. Inspecione o preenchimento, o traçado e os caminhos reais do fluxo de trabalho que você precisa.

Fontes

  1. Conversor oficial PicSVG — orientação de entrada no site, efeitos selecionáveis ​​e fluxo de trabalho para salvar SVG.
  2. Especificação de pintura SVG do W3C — a diferença entre preenchimento e traçado.
  3. Sistemas de coordenadas W3C SVG — viewBox, mapeamento de viewport e unidades.

Mais do blog

PerfectVector

Transforme sua imagem em
caminhos vetoriais limpos e editáveis

Vetorize e confira a visualização grátis, sem limite diário.