Español ▾
Free, Fast & Secure Online Tools
Publicar una app significaba exportar una carpeta con treinta archivos de icono. Ya no: ambas plataformas aceptan un cuadrado grande y derivan el resto. Lo que no ha desaparecido son las reglas sobre qué puede contener ese cuadrado — y son reglas distintas en cada plataforma, que es donde empieza casi todo problema de iconos.
Ambos son cuadrados, ambos quieren que el diseño llene el marco, y a partir de ahí divergen con fuerza.
Dos reglas, y las dos se incumplen constantemente:
No redondees tú las esquinas. iOS aplica su propia máscara de cuadrado redondeado. Si ya las has redondeado al exportar, la máscara redondea el redondeo y aparece un borde oscuro visible donde tu curva y la del sistema no coinciden. Exporta un cuadrado completo, hasta el borde.
Sin transparencia. El icono de 1024 no puede tener canal alfa. Un fondo transparente no se convierte en el fondo de pantalla: suele rellenarse de negro, que es por lo que tantos iconos enviados parecen un logo flotando sobre una baldosa oscura. Pinta un fondo sólido.
Además: nada de capturas de tu propia app dentro del icono, y nada de palabras. El icono se ve en la pantalla de inicio a unos 60 puntos. El texto a ese tamaño es una textura, no lenguaje.
El icono adaptativo de Android son dos capas — primer plano y fondo — de 108 × 108 dp cada una. Eso son 432 × 432 píxeles en la densidad común más alta.
Aquí está la parte que pilla a todos. Solo el centro se ve con garantía. Los 18 dp exteriores de cada lado están reservados: el lanzador los enmascara y los usa para el leve desplazamiento de paralaje al deslizar la pantalla. Lo que queda visible es un círculo de 72 × 72 dp en el medio: dos tercios del ancho.
Así que todo lo que importa tiene que caber en esos dos tercios centrales. El fallo habitual es un icono diseñado para llenar los 108 completos, que luego llega al teléfono con los bordes rebanados.
La reserva existe porque cada lanzador aplica una forma distinta. El mismo icono es un círculo en un teléfono, un squircle en otro, un cuadrado redondeado o una gota en otro. Tu capa de fondo debe ser un color plano o una textura simple que sobreviva a cualquiera de esos cortes, no una forma con contorno propio.
Esta genera un informe de error casi siempre que se pasa por alto. Un icono de notificación en Android no es el icono de tu app. Debe ser una silueta blanca pura sobre fondo transparente: el sistema elimina todo el color y usa solo el canal alfa.
Si le das un icono a todo color, cada píxel se vuelve blanco opaco y la notificación muestra un cuadrado blanco sin rasgos. El archivo es perfectamente válido, por eso pasa la revisión y solo aparece cuando alguien recibe una notificación.
Diseñas a 1024. Se muestra a unos 60 puntos en la pantalla de inicio, y mucho menos en listas de ajustes y resultados de búsqueda. Es una reducción de unas diecisiete veces.
La única prueba honesta es mirarlo a tamaño real en una pantalla de inicio real, junto a otras apps. Juzgado solo a 1024 píxeles, casi cualquier icono parece bueno.
Es tentador, al fin y al cabo ambos son marcas cuadradas de la misma identidad. Pero un favicon está diseñado para 16 píxeles sin máscara, y un icono de app va enmascarado, redondeado y se ve veinte veces mayor. Un favicon ampliado a 1024 se ve tosco; un icono de app reducido a 16 se vuelve un borrón. Son parientes, no el mismo archivo.