Camadas do Photoshop em caminhos SVG

7

Eu tenho um conjunto de arquivos do Photoshop que consistem em uma imagem base com uma série de camadas com sobreposições coloridas. As sobreposições são rotuladas usando os nomes das camadas.

Minha tarefa é obter essas sobreposições como SVGcaminhos, preservando de alguma forma os rótulos. (Se eu puder preservar as cores de preenchimento também, isso seria legal, mas podemos definir cores de preenchimento arbitrárias, se necessário.)

Até o momento, tentamos exportar as camadas como caminhos do Illustrator e depois exportá-las para o SVGIllustrator. Isso nos fornece caminhos SVG razoáveis, mas (a) perdemos os rótulos e (b) se uma camada tem mais de uma seção discreta em sua sobreposição, é separada em vários caminhos.

Existe uma maneira de inserir essas camadas no SVG, mantendo os rótulos? Ou devemos fazer nossa Export > Illustrator > SVG rota camada por camada?

Estamos trabalhando com o CS5, se isso for importante.

ETA para respondentes: Faz muito tempo que concluímos esse projeto e entregamos o trabalho, por isso não posso aceitar uma resposta, mas fique à vontade para apresentar suas soluções em potencial para outras pessoas.

adobe-photoshop adobe-illustrator vector layers svg pjmorse
fonte

Respostas:

3

Eu escrevi um script PS gratuito que permite fazer isso automaticamente. Apenas nomeie as camadas PS com as quais deseja exportar'.svg 'no final e elas serão convertidas em SVGs, mantendo as cores. o nome do arquivo também será o nome da camada. http://hackingui.com/design/export-photoshop-layer-to-svg/

O script funciona com a divulgação CS5, CS6 e CC: este link para o meu site

DMTintner
fonte
2
Apenas um aviso: isso não funciona, a menos que você tenha o Illustrator, por isso não adiciona magicamente a funcionalidade de exportação SVG ao Photoshop. Você também precisará se inscrever em um boletim informativo. Se você realmente não deseja se inscrever na lista de e-mails deles, clique aqui para baixar o arquivo diretamente.
Pieter
Eu tive problemas com este script. Simplesmente não estava fazendo nada (no mac OSX e no photoshop CS6). Nenhum .svg gerado, nenhum .ai gerado, nenhuma mensagem. Apenas um ícone de carregamento e nada. Alguma idéia?
svassr
@svassr confira a discussão aqui: hackingui.com/design/export-photoshop-layer-to-svg e aqui: hackingui.com/design/… O script funciona com CS6 e OSX. Suas formas estão realmente fechadas? Não funciona em camadas de texto. Se você puder fornecer mais detalhes eu posso tentar ajudar mais
DMTintner
0

Estes são fornecidos por um fornecedor? Nesse caso, talvez não seja possível agora, mas, para referência futura, solicitaria que entregassem os botões em um formato que torne a conversão muito mais prática. O Adobe Illustrator seria melhor ou o Inkscape seria perfeito (já que o formato nativo é SVG).

DA01
fonte
0

Por fim, o caminho (tedioso) que usamos foi:

  • O Photoshop possui um comando "exportar camadas". (Eu acho que era um script.) Isso gera um arquivo para cada camada no documento.
  • Em seguida, abrimos os arquivos no Illustrator, selecionamos o caminho e exportamos como SVG.

Isso foi doloroso e trabalhoso, mas parecia ser o único caminho.

pjmorse
fonte
0

Em uma situação semelhante (tentando exportar Vector Smart Objects para SVGs do Photoshop), o que funcionou para mim foi:

  • Clique duas vezes na camada Objeto inteligente para abrir no Illustrator
  • No Illustrator, selecione Tudo ( Ctrl-A), clique com o botão direito do mouse na seleção e em " Exportar seleção ... "

Se eu tentasse exportá-los diretamente do Photoshop, sempre acabava com dados de imagem PNG incorporados em um SVG, mas as etapas acima me permitiram produzir imagens vetoriais adequadas com caminhos.

Nick F
fonte
-1

O script export-photoshop-layer-to-svg oferecido pelo Hacking UI não funcionou para mim.

Existem também esses plugins do photoshop, que oferecem uma melhor integração na interface do photoshop (e no menu de opções de exportação). Eles também permitem exportar camadas agrupadas.

svassr
fonte