¿Cómo obtener un favicon alto y claro del logotipo del vector ilustrador?

Cuando importo una imagen vectorial a Photoshop desde Illustrator y trato de reducir la resolución con la opción activada "Bicúbico más nítido (mejor para reducción)". Pero Photoshop todavía proporciona sus interpolaciones y todavía no obtengo una imagen pequeña clara como en otros sitios que veo. Ejemplo:

ingrese la descripción de la imagen aquí

¿Por qué cree que 'otros sitios' también usan Illustrator y Photoshop? Los Favicons son lo suficientemente pequeños como para dibujarlos un píxel a la vez.
No, no lo hago, no soy un diseñador, solo necesito un ícono bonito)
En primer lugar, no desea reducir la muestra. Intente abrir su archivo .ai directamente con PS: ¡obtendrá un cuadro de diálogo del tamaño que desee! Cuando tu arte está en PS, la mayoría de las veces son píxeles, ¡es posible que no quieras eso! Además, intente leer acerca de "Objetos inteligentes".
Para imágenes tan simples, suelo usar editores de favicon en línea. Esto es lo que he creado en unos minutos (no dude en editarlo y usarlo): favicon.cc/?action=icon&file_id=795806 En este sitio web también puede ver una vista previa en vivo del favicon actual en la pestaña de su navegador

Respuestas (3)

La escala de un favicon (típicamente 16x16 píxeles, aunque hoy en día también se 'aceptan' tamaños más grandes y se escalan para adaptarse a la mayoría de los navegadores) es demasiado pequeña para que el software general haga algo útil.

Para obtener el mejor favicon posible , solo dibújelos un píxel a la vez. La imagen de abajo tomó solo 3 minutos más o menos.

Tenga en cuenta que no se muestra al 100%, en realidad es de 16x16 píxeles. Es por eso que las líneas negras son considerablemente más gruesas que las partes blancas, en comparación con la imagen vectorial original.

El blanco adicional a la derecha y en la parte inferior se debe a que su logotipo es muy simétrico . Me di cuenta de eso y opté por mover el diseño 1/2 píxel hacia la parte superior izquierda, en lugar de intentar mantener la posición original convirtiéndolas en líneas grises suavizadas. Eso no es algo que el software actual pueda hacer a esta escala: necesita el juicio humano.

¡mirar!  un favicon!

Desafortunadamente, esta imagen solo se proporcionó para el ejemplo, traté de investigar una forma más común de volver a muestrear imágenes para favicons. Pero ahora me di cuenta de que una forma es dibujarlo en tamaño real manualmente...

La mejor manera en general, como se menciona en los comentarios, es volver a dibujarlo al tamaño necesario.

He probado muchos tipos de reducción de escala, pero ninguno fue de una calidad aceptable.

En la mayoría de los casos, es realmente más rápido y más fácil volver a dibujarlo. Volver a dibujarlo con PS puede ser un poco más difícil de lo que debería ser, porque podría decirse que PS se creó para propósitos mucho más complejos.

Es por eso que acabo de descargar un software gratuito para crear íconos. Es extremadamente simple y el programa está construido prácticamente para crear favicons. Me tomó menos de 30 minutos pulir un favicon que ya había pasado horas tratando de reducir el tamaño, etc.

El programa que uso es Icon Craft , que puedes ver a continuación.

ejemplo

Además, personalmente lo dibujé en el tamaño más pequeño 16px x 16px, y luego simplemente dupliqué esa versión para dimensiones más grandes. Lo cual se puede hacer haciendo clic derecho en el icono en el menú de la derecha.

Por último, pero no menos importante, esto le permite crear y empaquetar múltiples favicons en un solo .icoarchivo.

La forma en que me ayudó fue exportar todas las formas vectoriales de mi logotipo de Illustrator a las rutas de Photoshop (simplemente cópielas en Illustrator y péguelas como Ruta en Photoshop), luego reduzca la imagen con rutas a 16x16 píxeles. Y luego llenar personalmente o trazar cualquier camino. En mi caso no se veía mal.