¿Por qué mi logo se ve terrible y borroso en Instagram y Facebook?

Yo no soy un diseñador gráfico en absoluto. El primer logo que hice fue en Photoshop para mi tienda de Etsy. Ahora quiero dejar Etsy, pero no puedo crear mi propio sitio web hasta que tenga gráficos de buena calidad.

Entonces hice el logo como un vector en Inkscape.

Se ve bien, pero tan pronto como lo configuro como mi logotipo de Instagram o algo así, se ve súper borroso y horrible. He probado diferentes formatos y haciéndolo del tamaño de px que requiere instagram, pero siempre sale igual.

Adjunté el png y también una captura de pantalla de cómo se ve en Instagram.

logotipo de instagram logotipo png

¿Has intentado configurar tu fondo en un color diferente? Esto es relevante: graphicdesign.stackexchange.com/questions/21204/…
¿Qué tan ampliado estás? Cuanto más cerca estés, más pixelado quedará el logo. Además, Instagram podría comprimirlo aún más después de subirlo.

Respuestas (7)

El ejemplo que publicaste tiene artefactos causados ​​por el cambio de escala de Instagram y la adición de una compresión jpeg excesiva a la imagen. La única forma de resolver esto es cambiar la escala y exportar como jpeg usted mismo, para que Instagram no tenga que hacerlo. Si toma el control de cambiar el tamaño y convertirlo en un jpeg, el resultado debería ser mucho mejor.

Instagram y otros sitios de redes sociales como Facebook son conocidos por aplicar una compresión excesiva a las imágenes.

Un logotipo de Instagram debe tener 110 px x 110 px.

  • Abra su imagen grande original en Photoshop o GIMP, o un editor de imágenes rasterizado similar.
  • Escala la imagen a 110px x 110px
  • Exportar como jpeg, con un ajuste de calidad alto (alrededor del 60 %)
  • El tamaño del archivo debe ser un poco menos de 5kb
  • Ahora sube la imagen redimensionada a Instagram

Así es como debería verse. No caiga en la tentación de acercar el zoom o se verá borroso/pixelado.

ingrese la descripción de la imagen aquí

Su obra de arte se ve nítida a 1000 x 1000 px, lo que debería ser más que suficiente.

Su captura de pantalla está pixelada como si se hubiera ampliado unas cuatro veces.

Supongo que su navegador está ampliado. Intente verificar si el nivel de zoom es del 100%.

Veo dos cosas que pueden estar en juego aquí:

El color rojo es conocido por comprimirse mal.

Otra cosa a considerar es que las redes sociales tienden a tener un límite en el tamaño de la imagen que puedes subir. Cuando superas eso, la compresión se activa.

Esto sugiere para Instagram que el tamaño de píxel es relevante pero también el tamaño de archivo en MB.

porque su algoritmo de compresión se activará cuando el tamaño de su imagen supere los 1,6 MB y los 1080 px.

y para facebook

Fotos normales: 720 px, 960 px o 2048 px de ancho Fotos de portada: 851 px por 315 px Para evitar la compresión cuando cargue su foto de portada, asegúrese de que el tamaño del archivo sea inferior a 100 KB Guarde su imagen como JPEG con un perfil de color sRGB

Gracias, Emilie. Probé muchas versiones diferentes probando con los tamaños correctos de px y MB y jpeg con sRGB, pero todas terminaron luciendo más o menos iguales, ¡mal! Creo que el problema es con el color rojo mate. Gracias por traer esto a mi atención.

Como dijo Emilie, hay tamaños especiales para cada red social.

Instagram

Si el tamaño de su logotipo es 1000 X 1000 px y el tamaño de la foto del perfil de Instagram es 110 X 110 px, quién sabe qué hace Instagram con los otros 890 px.

En este enlace, una gran lista de cada tamaño de imagen multimedia .

Solución posible

Instagram es una aplicación de imágenes, es decir, imágenes con una secuencia de medios tonos. Su logotipo tiene áreas de colores planos. Vea la diferencia entre poner su logo como imagen de perfil en Instagram y Behance:

Instagram :

Instagram

Comportamiento :

ingrese la descripción de la imagen aquí

Está claro que en Behance la imagen es más nítida, no produce el conocido como "artefacto de photoshop".

Si Instagram produce artefactos de Photoshop en grandes áreas de colores planos, evítelos. Este es su logo como imagen de perfil en Instagram con un patrón de fondo en lugar del rojo plano:

fondo

Y esta es la imagen subida:

oso

Gracias Danielillo, probé con 110x110 px pero seguía igual. Cambiaré el fondo del rojo plano a un fondo texturizado. Gracias

Mis experimentos mostraron que al usar la versión del navegador, ninguna de las sugerencias sobre cómo hacer que Instagram no vuelva a comprimir sus archivos funciona. Sin embargo, agregar algo de textura al logotipo hace que los artefactos de compresión sean inconcebibles.

Un consejo genérico rápido es exportar imágenes a 100 dpi, el estándar es 72 dpi para ilustraciones relacionadas con la pantalla y no parece gran cosa, pero hace que las cosas se destaquen más.

¿Cómo exportar imágenes a 100 ppp "hace que las imágenes destaquen más"? una imagen de 110x110px tendrá la misma cantidad de píxeles sin importar cuántos DPI.
la pantalla estándar es de 72 ppp: haga una imagen a 1000x1000, haga 2 copias, escale una a 100x100 a 72 ppp y luego haga lo mismo con la otra pero a 100x100 a 100 ppp y compare las imágenes una al lado de la otra. Esto imita el proceso que la mayoría de la gente usa junto con el uso de opciones de tipo "guardar para la web" que no le permiten configurar los dpi.
Esto no funciona porque una imagen de 110x110px es exactamente igual, independientemente de la configuración de DPI. DPI no es una medida de calidad, es solo la resolución de salida (es decir, la resolución de impresión). Los navegadores ignoran por completo la configuración DPI/PPI. Tienes que leer esto: El mito de DPI

simplemente guarde su imagen como png 150 ppp y cárguela.

¡Bienvenido! ¿Y por qué resuelve el problema dado? ¡Por favor explica mejor!