Capas de Photoshop en rutas SVG

Tengo un conjunto de archivos de Photoshop que consisten en una imagen base con una serie de capas con superposiciones de colores. Las superposiciones se etiquetan con los nombres de las capas.

Mi tarea es obtener estas superposiciones como SVGrutas, preservando de alguna manera las etiquetas. (Si también puedo conservar los colores de relleno, sería genial, pero podemos definir colores de relleno arbitrarios si es necesario).

Hasta ahora, hemos intentado exportar las capas como rutas de Illustrator y luego exportarlas SVGdesde Illustrator. Esto nos da rutas SVG razonables, pero (a) perdemos las etiquetas y (b) si una capa tiene más de una sección discreta en su superposición, se separa en varias rutas.

¿Hay alguna forma de convertir estas capas en SVG conservando las etiquetas? ¿ O deberíamos hacer nuestra Export > Illustrator > SVG ruta capa por capa?

Estamos trabajando con CS5, si eso es importante.

ETA a los que responden: hace mucho que terminamos este proyecto y entregamos el trabajo, por lo que no puedo aceptar una respuesta, pero siéntase libre de presentar sus posibles soluciones para otros.

Respuestas (5)

Escribí un script de PS gratuito que te permite hacer esto automáticamente. Simplemente nombre las capas de PS que desea exportar con '.svg' al final y se convertirán a SVG, manteniendo los colores. el nombre del archivo también será el nombre de la capa. http://hackingui.com/design/export-photoshop-layer-to-svg/

El script funciona con la divulgación de CS5, CS6 y CC: esto vincula a mi sitio

Solo un aviso: esto no funciona a menos que tenga Illustrator, por lo que no agrega mágicamente la funcionalidad de exportación SVG a Photoshop. También deberá suscribirse a un boletín informativo. Si realmente no desea suscribirse a su lista de correo electrónico, vaya aquí para descargar el archivo directamente.
Tuve problemas con este script. Simplemente no estaba haciendo nada (en mac OSX y photoshop CS6). Sin .svg generado, sin .ai generado, sin mensaje. Solo un ícono de carga y luego nada. Cualquier pensamiento ?
@svassr consulte la discusión aquí: hackingui.com/design/export-photoshop-layer-to-svg y aquí: hackingui.com/design/… El script funciona con CS6 y OSX. ¿Tus formas están realmente cerradas? No funciona en capas de texto. Si puede proporcionar más detalles, puedo tratar de ayudar más.

¿Estos son proporcionados por un proveedor? Si es así, tal vez no sea factible ahora, pero para referencia futura, les pediría que entreguen los botones en un formato que haga que la conversión sea mucho más práctica. Adobe Illustrator sería mejor, o Inkscape sería perfecto (dado que, para empezar, su formato nativo es SVG).

En última instancia, el camino (tedioso) que usamos fue:

  • Photoshop tiene un comando de "exportación de capas". (Creo que era un script). Esto genera un archivo para cada capa del documento.
  • Luego abrimos los archivos en Illustrator, seleccionamos la ruta y la exportamos como SVG.

Esto fue doloroso y laborioso, pero parecía ser el único camino.

En una situación similar (tratando de exportar Vector Smart Objects a SVG desde Photoshop), lo que funcionó para mí fue:

  • Haga doble clic en la capa de objetos inteligentes para abrir en Illustrator
  • En Illustrator, seleccione todo ( Ctrl-A), luego haga clic con el botón derecho en la selección y " Exportar selección... "

Si traté de exportarlos directamente desde Photoshop, siempre terminé con datos de imagen PNG incrustados en un SVG, pero los pasos anteriores me permitieron producir imágenes vectoriales adecuadas con rutas.

El script export-photoshop-layer-to-svg ofrecido por Hacking UI no funcionó para mí.

También existen estos complementos de Photoshop que ofrecen una mejor integración en la interfaz de usuario de Photoshop (y el menú de opciones de exportación). También permiten exportar capas agrupadas.