Necesidad de crear sprites mantenibles

¿Alguien sabe de una buena herramienta o generador que me permita crear sprites, guardar el conjunto de sprites y poder actualizar la hoja css si agrego nuevos íconos al conjunto de íconos? Lo que quiero decir es esto:

Actualmente tengo 100 iconos. Todos ellos necesitan ser convertidos en sprites. Una vez que entran en producción, el CSS no puede cambiar (lo que significa que deben permanecer exactamente en la misma ubicación cada vez). Sin embargo, se esperará que actualice el conjunto de iconos cuando deba agregar más.

¿Alguien sabe de algo que exista así? Probé una extensión de Photoshop (no recuerdo el nombre) que crea sprites a partir de las capas en mi archivo de Photoshop, pero lamentablemente no funcionó y seguía teniendo errores (presumiblemente porque tengo demasiadas imágenes que necesito ser convertidos en duendes).

Cualquier ayuda es muy apreciada.

Respuestas (4)

Si este fuera mi problema, configuraría un archivo de Photoshop con guías donde las necesitaba y todo colocado correctamente. Entonces podría editar cualquier cosa, todo permanece dentro de las guías que configuré y podría agregar nuevos elementos en cualquier momento. Luego, simplemente vuelva a guardar el archivo a través de Guardar para Web como .png (o lo que sea) y tenga una nueva hoja de sprites sin que nada se mueva.

Las soluciones automatizadas rara vez funcionan para problemas complejos.

Esta es la misma técnica que siempre he usado.
así es como lo he hecho normalmente... excepto que tengo tantos íconos que la idea de hacerlo manualmente es un poco angustioso :-/

La respuesta a tus sueños gestionando sprites con Sass y Compass .

Compass hace que sea muy fácil combinar varias imágenes en un sprite y luego administrarlas a medida que avanza el proyecto.

Aquí hay otro tutorial con más ejemplos: Diseño Web: CSS Image Sprite With Compass

En realidad encontré esta joya.

http://spritepad.wearekiss.com/

Puedo guardar SpritePads y seguir agregándolos según sea necesario. El UX en esto es un poco escaso (en mi opinión), pero me ahorró tanto tiempo que fue ridículo.

Recientemente me encontré con este problema y encontré una herramienta llamada Stitches . Le permite arrastrar imágenes y organizarlas de diferentes maneras. Esta aplicación generará una hoja de sprites, así como un documento CSS y también es compatible con LESS.