Guardar para web hace que mi archivo de Illustrator se vea borroso. (30x30 píxeles)

He estado atascado en Illustrator durante 2 días legítimos. Todo lo que intento hacer es crear un ícono simple de 30x30 píxeles para un proyecto de aplicación que estoy creando. El dibujo consta de como 4 líneas negras. Se ve perfecto en Illustrator, pero luego, tan pronto como lo guardo para la web, se ve borroso. Cambié de Photoshop a Illustrator porque me dijeron que los vectores harán líneas más limpias/nítidas.

¿Qué está pasando? ¿Estoy peleando una batalla perdida aquí? Cuando una imagen tiene 30x30 píxeles, ¿es posible que no estén pixelados? Por favor alguien ayuda !!!! :( PS he mirado tantos otros foros.

¿Ha intentado exportar la imagen como un archivo vectorial SVG? Si es una imagen rasterizada, ¿ha intentado verla al 100% y no hacer zoom? ¿Puedes publicar ejemplos del gráfico del problema?
Es posible que solo tenga que presionar píxeles enteros.
Después de más comentarios sobre la respuesta de Cai, veo que es un icono de trama. Illustrator es prácticamente inútil para crear pequeños iconos de trama. La persona que le dijo que usara Illustrator le ha dado un consejo espectacularmente malo.
¿Algún otro programa que puedas recomendar? @BillyKerr
@Mella. Sería mejor un editor de imágenes rasterizadas, como Photoshop, o el software gratuito GIMP.

Respuestas (1)

Desafortunadamente, si está exportando a una imagen rasterizada, no obtendrá líneas más limpias o nítidas de Illustrator. Lo hará dentro de Illustrator, o si exporta a un formato vectorial (SVG es bueno para íconos web, por ejemplo), pero exportar a un formato raster (JPG, PNG, etc.) le dará poca diferencia.

Si está trabajando en Illustrator y exportando a un formato ráster, es mejor trabajar con (o al menos verificar periódicamente) la vista previa de píxeles activada ( Ver → Vista previa de píxeles ). La única forma de asegurarse de que no tenga ningún "desenfoque" (que es solo suavizado) es asegurarse de que su obra de arte se alinee con la cuadrícula de píxeles. Puede activar "Ajustar a cuadrícula de píxeles" para que Illustrator haga esto por usted.

Entonces, la única forma segura de obtener su ícono sin "desenfoque" es ajustar o volver a dibujar para que se alinee con su cuadrícula de píxeles ...

Un ejemplo ( tomado de una respuesta anterior )...

Tome este ícono SVG de boom box. El vector original de la izquierda se ve muy bien. Vea lo mismo a 16 × 16 píxeles y se ve terrible. Puede ver que esto se debe a que las rutas no se alinean con los píxeles. Hay demasiada información para ser vista en la cantidad de píxeles disponibles.

ingrese la descripción de la imagen aquí

Imagen 1: vector original (izquierda), vista previa de 16 × 16 píxeles (derecha)

La solución es diseñar el ícono específicamente para el tamaño en el que se verá. Tome el mismo ícono nuevamente y vuelva a dibujar las rutas para que se alineen con la cuadrícula de píxeles y tenga un ícono limpio y agradable (limpio, al menos, el altavoz / círculo probablemente necesite más ajustes):

ingrese la descripción de la imagen aquí

Imagen 2: vector original de vista previa de 16 × 16 píxeles (izquierda), rutas ajustadas para adaptarse a la cuadrícula de píxeles (derecha)

¡gracias! Entonces, si estuvieras dibujando líneas diagonales, ¿supongo que siempre se verá borroso?
Si está exportando una imagen ráster, entonces sí, no hay forma de evitarlo
No tengo idea de cómo funcionan estas imágenes SVG, cuando las abro, ¿su código?
SVG es un código sí (es una forma de XML), debería (dependiendo de dónde lo esté usando) poder usarlo como una imagen como lo haría con cualquier otra imagen (en CSS o una etiqueta, por ejemplo <img>)
hmmm, no creo que funcione en Xcode. ¡Lo intentaré mañana y te lo haré saber! Gracias por tu ayuda :D
No hay problema. No lo he hecho en mucho tiempo, así que no lo recuerdo, pero definitivamente hay formas de usar SVG en XCode.
Guardar para web hace que mi archivo de Illustrator se vea borroso. (30x30 píxeles)
RespuestasAquíPolítica de privacidad1y, 0v