¿Por qué las formas y los espacios se distorsionan cuando se reducen en Illustrator?

Lo que necesito:

Estoy creando el icono de la aplicación de Android. Obviamente, está basado en píxeles y quiero prestar atención para que sea "perfecto en píxeles" y luego necesito exportarlo en diferentes dimensiones (por ejemplo, 36x36, 64x64) reduciéndolo en consecuencia, sin perder proporciones y bordes nítidos.

Lo que probé y observé:

(Usando Illustrator 2015)

Lo que estoy usando para obtener una forma perfecta de píxeles es Alinear con la cuadrícula de píxeles para que los bordes no parezcan borrosos. ¡Funciona pero el espaciado y el ancho de las formas cambian!

(A) La alineación con la cuadrícula de píxeles está desmarcada desde el principio

  1. Creé una forma (sin trazos, solo rellenos). La alineación con la cuadrícula de píxeles está SIN MARCAR
  2. Lo reduje al tamaño de una aplicación
  3. Marcado Alinear a la cuadrícula de píxeles y la forma se distorsionó. Una de las líneas se vuelve más delgada y el espacio se vuelve irregular. No está seguro de qué se distorsionará. Depende de dimensiones a dimensiones / forma a forma.

Observación : Los anchos y los espacios se ven afectados

(B) La alineación con la cuadrícula de píxeles se verifica antes de comenzar a dibujar la forma

  1. Creé una forma (sin trazos, solo rellenos). La alineación con la cuadrícula de píxeles está marcada
  2. Lo reduje al tamaño de una aplicación
  3. La forma se distorsionó. El resultado fue similar a (A) - 3

Observación : Principalmente se ve afectado el espaciado. no es proporcional

(Vea la imagen ilustrada aproximada al final (estos no son píxeles reales. Solo hice cuadrículas para que quede claro. Las cosas son un poco exageradas):

¿Cómo puedo arreglarlo (es decir, obtener esos 3 rectángulos del mismo ancho con el mismo espacio entre ellos)?

PD:

  1. Leí respuestas en los foros de Adobe y aquí por Scott sobre preguntas similares. Pero considero que esta es una pregunta nueva, ya que otros no explicaron cómo podemos resolver este problema de espaciado y anchos desiguales si queremos reducirlo y aún así obtener un diseño de píxeles perfecto.

  2. Las cosas se distorsionan más cuando hay esquinas redondeadas. Algunas esquinas obtienen más radio, otras menos eventualmente, en lugar de ser iguales.

ingrese la descripción de la imagen aquí

¿Es esta una pregunta? No parece serlo. Excelente información, pero probablemente se sirva mejor respondiendo una pregunta. Publicar información general como una nueva pregunta es inapropiado. Puede crear una pregunta y luego responderla usted mismo. Hacer eso sería mejor.
Pero no sé la respuesta. Solo quiero saber si realmente es un problema o si puedo solucionarlo o si estoy haciendo algo mal. Pero me di cuenta de que no pregunté algo en cuestión y en detalle, por lo que puede estar diciendo esto. ¿Lo edito para que parezca una pregunta?
Editado por cierto.
De acuerdo, luego de la edición, debo decir que la pregunta no está clara . Hay una gran cantidad de información superflua aquí y tener la pregunta en el medio hace que sea muy difícil averiguar cuál puede ser la pregunta real.
Hola, @Scott, comprueba ahora. Espero que esté mejor explicado y preguntado ahora.
@Scott, le pido amablemente que investigue este asunto. Leí las 2 respuestas aquí pero no parecen resolver mi problema.
Como no tengo respuesta a mi pregunta aquí, estoy haciendo otra pregunta "directa". ¿Estaría bien?

Respuestas (2)

Primero quiero preguntar si esas líneas son de relleno o de trazo. Y si ha marcado la casilla de verificación de trazos y efectos de escala junto a alinear con la cuadrícula de píxeles.

Si todavía es un trazo o no está expandido, siempre debe marcar la casilla de verificación de trazos y efectos de escala. Como se muestra algunas muestras.

Esta es una muestra de líneas en el primer lado derecho (solo trazo) copiadas y escaladas con la casilla de verificación de trazos y efectos de escala que se muestra en la ventana Transformar. Como se muestra, su proporción está bien.ingrese la descripción de la imagen aquí

Esta es una muestra de líneas // en el extremo derecho (solo trazo) copiadas y NO escaladas con la casilla de verificación de trazos y efectos de escala. Está distorsionado o no es proporcional al original.ingrese la descripción de la imagen aquí

Y si está delineado/ampliado, use la herramienta de escala como se muestra y verifique también los trazos de escala y el efecto.

ingrese la descripción de la imagen aquí

Por favor revise los detalles de la pregunta. he editado Espero que lo entiendas mejor y sepas acerca de las formas. Leeré tu respuesta completa en detalle mientras tanto.
La herramienta de escala me solucionó una cosa. Funcionó para las esquinas redondeadas y mantuvo las proporciones cuando se marcó "Escala de las esquinas del rectángulo". En segundo lugar, el problema principal aún no está resuelto. Dibujé 3 rectángulos horizontales como mencioné en el detalle de la pregunta. Los reduje hasta un 20 % marcando las casillas de verificación "Escalar trazos..." y "Escalar esquinas...". Los escaló proporcionalmente, pero cuando encendí la vista previa de píxeles, ¡se mostró un lado de cada rectángulo borroso! Ese es el verdadero problema. ¿Cómo puedo superar esto? Cuando hago clic en "alinear con la cuadrícula de píxeles", da como resultado el mismo espaciado desigual y anchos desiguales :(
Una cosa más. El menú Escala ofrece opciones para escalar en %. ¿Qué pasa si necesitamos exportar en tamaño exacto, como 64x64px?
Si es así, use la ventana de transformación e ingrese la escala deseada, solo asegúrese de que sus preferencias estén configuradas en px (píxeles)
Bueno. ¿Qué dices de mi penúltimo comentario? ¿Por qué los bordes se vuelven borrosos cuando se reducen? ¿Cómo puedo prevenirlo? No puedo encontrar su respuesta.
Verifique las rutas borrosas si tienen un efecto existente que aún no se ha expandido (por ejemplo, esquinas redondeadas, sombra paralela o trazo con textura/forma).
¿Puedes mostrarme los bordes borrosos con y sin la vista previa de cuadrícula de píxeles?
Seguro. Los compartí en el disco en una carpeta y di una descripción de cada uno aquí drive.google.com/open?id=1OP9QWMORkgXdq9l5Ni-rA8s9kfBA3jjk
Por favor, hazme saber si eso es lo que quieres ver :)
Ok, he visto lo que quería. Illustrator lo ha estimado en la vista previa de píxeles porque es tan manual / es tan pequeño que cada píxel está separado y hace una transición entre blanco y negro. Esto es solo en la vista previa de píxeles. Creo que está bien, siempre y cuando sea vectorial.
Sí, entiendo eso, pero necesito crear un ícono de aplicación, es decir, estoy diseñando algo para la pantalla en 3-4 tamaños diferentes, así que necesito que sean perfectos en píxeles. Lo intenté sin alinearlos con la cuadrícula de píxeles, y el ícono no se veía nítido. La mayoría de la gente dice que use la alineación con la cuadrícula de píxeles cuando desee crear un diseño nítido. Pero las cosas no están funcionando aquí. Si ve íconos de aplicaciones famosas como FB, Google, Insta, todos se ven nítidos. ¿Entonces Que puedo hacer?
El formato vectorial es exacto, amigo mío, esto es SOLO en la vista previa de píxeles. Avance. El real será tan nítido como la cuchilla :-). Un ejemplo, una imagen de vista previa de píxeles en Photoshop en impresión real o mostrando que es buena; y cuando hace zoom, se pixela porque muestra su imagen en píxeles pequeños para monitores. En objetos Vector no hay problema. Mofi mushkela entendido? :-)
No. Puedo probarlo y lo he visto cada vez. Vea estas 2 imágenes: drive.google.com/open?id=1GKgcZXxfDx45G25WnMfO92thCeqg8uby Ambos fueron diseñados en Illustrator. Uno tiene bordes nítidos porque está alineado con la cuadrícula de píxeles. Otro tiene bordes borrosos porque no está alineado. Ahora, ¿qué dirías?

Entiendes que es diferente si esas líneas son caminos con trazo o cuadrados con relleno. Si ha trazado líneas, es probable que esto no funcione, ya que la línea solo puede ajustarse a la cuadrícula; sin embargo, lo que tendría que hacer para que esto funcione es ajustar a la mitad de la cuadrícula. Así que expanda los trazos antes de hacer esto.

Además, no puede escalar de forma incremental, necesita escalar el tamaño correcto de una vez o no escalar en absoluto. Entonces puede reducirlo a 2/3 pero 1/3 pero nada más funcionará.

Personalmente, nunca habilito el ajuste de píxeles, ya que es muy improductivo para la mayoría del trabajo *. Como en este caso, es mejor deshabilitar la escala de ajuste de píxeles y luego alinear los puntos para cerrar medio píxel.

* No es que esté roto ni nada, pero la restricción que causa en tus efectos es demasiado grande, hay un número limitado de opciones. Mejor ajuste primero y luego ajuste lo que necesite.