Cómo descargar capturas de la App Store en resolución nativa

Pruébalo una vez y el problema salta a la vista. Abres una ficha del App Store, haces clic derecho en una captura, la guardas y acabas con una imagen de unos 300 píxeles de ancho. Ampliada a cualquier tamaño útil se convierte en un borrón. No es una buena copia del material gráfico. En realidad no es una copia del material gráfico en absoluto.

Esto no es que Apple sea complicada. Es un efecto secundario de cómo está construida la página y, una vez que lo entiendes, conseguir el archivo real es sencillo.

La página nunca tiene la imagen real

Apple sirve el material gráfico de las fichas desde una CDN de imágenes en mzstatic.com. Y esto es clave: la CDN no guarda un archivo por captura, guarda un original y genera una copia redimensionada bajo demanda según lo que pida la URL. Las URL tienen este aspecto:

https://is1-ssl.mzstatic.com/image/thumb/PurpleSource211/v4/…/WH_iOS_03.jpg/300x650bb.webp

Lee el final de esa URL: 300x650bb.webp. Eso es una instrucción. Dice dame esta imagen a 300×650, recortada, en WebP. El navegador pide un WebP pequeño porque un WebP pequeño es lo que hace que la página cargue rápido en un teléfono. Esa es la decisión correcta para una página de tienda, y el archivo equivocado para ti.

Así que, cuando haces clic derecho y guardas, no estás capturando una versión comprimida del original. Estás capturando un archivo completamente distinto que la CDN generó, al vuelo, según las especificaciones de Apple y no las tuyas.

Pedir el original en su lugar

Cambia el final de la URL y la CDN genera un tamaño distinto. Pide 1284x2778bb.png y obtienes la imagen a 1284×2778, en PNG. Ese es el original a resolución nativa.

La pregunta obvia que viene después: ¿cómo sabes que es 1284×2778 y no otra cosa? No puedes adivinarlo, y pasarte de listo no funciona: pedir más píxeles de los que tiene la fuente solo te da un archivo ampliado y borroso que afirma tener las dimensiones correctas.

Por suerte Apple te lo dice. Enterrado en el HTML de la página hay un bloque JSON: busca una etiqueta script con el id serialized-server-data y, dentro de ella, cada pieza de material gráfico se describe así:

{
 "$kind": "Artwork",
 "template": "https://is1-ssl.mzstatic.com/…/WH_iOS_03.jpg/{w}x{h}{c}.{f}",
 "width": 1284,
 "height": 2778
}

Ahí está. La template tiene marcadores literales {w} y {h}, y el nodo te entrega las dimensiones nativas reales junto a ellos. Rellena la plantilla con el ancho y el alto propios de la imagen y la CDN devuelve exactamente el archivo que subió el desarrollador.

Un detalle que conviene conocer: los nombres de archivo se conservan

Mira otra vez esa URL y notarás algo útil: WH_iOS_03.jpg. Las rutas de la CDN de Apple conservan el nombre de archivo original del material gráfico de la subida.

En la práctica esto es más valioso de lo que parece. Las fichas reales suelen llevar nombres como EC-15030-WH-UK-Offer-R30-CPP-UK-iOS-6.5-1284x2778-S01.jpg, que codifica el código de campaña, el mercado, la clase de dispositivo y el número de diapositiva. Si intentas cuadrar los activos extraídos con los archivos fuente de un equipo de diseño o con un brief de campaña, esos nombres hacen buena parte de la correspondencia por ti.

La trampa: no captures el icono de la app equivocada

Una advertencia, porque es un error fácil y embarazoso.

El icono de la app no está de forma fiable en ese bloque JSON: la cabecera donde se muestra se renderiza del lado del cliente y está vacía en el HTML en crudo. Mientras tanto, la misma página lleva una estantería de “También te puede gustar”, repleta de iconos de otras apps, con una forma JSON casi idéntica.

Así que un scraping ingenuo que busque en la página algo con forma de icono devolverá tan tranquilo el icono de un competidor. Lo sabemos, porque la primera versión de nuestra propia herramienta hacía exactamente eso y estuvo a punto de entregarle a un cliente el logo de un rival como si fuera el suyo.

La solución es dejar de rastrear y empezar a preguntar. Apple tiene un endpoint de consulta público que es la fuente autorizada para un ID de app dado:

https://itunes.apple.com/lookup?id=465712788&country=gb

Eso devuelve los metadatos reales de la app, incluida la URL de su icono, y como se basa en el ID de la app, no hay posibilidad de coger por accidente el material gráfico del vecino. Ten en cuenta que este endpoint a veces devuelve una lista de capturas vacía, así que no sustituye al análisis de la página. Usa la página para las capturas y la consulta para el icono.

Qué calidad obtienes de verdad

Seamos claros con esto, porque muchas herramientas lo exageran.

Lo que recuperas es exactamente el archivo que el desarrollador subió a App Store Connect, ni mejor. Apple los guarda como JPEG. Nuestra herramienta los exporta como PNG, lo que evita que se aplique una segunda ronda de compresión con pérdida a la salida, pero no puede revertir la compresión ya incrustada en la fuente. No hay ampliación ni recuperación de detalle que nunca estuvo ahí.

Para uso en pantalla, presentaciones, auditorías, análisis de la competencia o reconstruir una ficha, esto es exactamente lo que quieres. Para imprenta no lo es, y ninguna manipulación ingeniosa de la URL lo cambiará. Ve a buscar los archivos de diseño.

Hacerlo sin el trabajo manual

Todo lo anterior es mecánico, por eso lo automatizamos. Pega la URL de una ficha en la herramienta y lee el JSON, extrae cada nodo de material gráfico en sus propias dimensiones nativas, obtiene el icono desde la API de consulta y te entrega un ZIP con un manifiesto que asocia cada archivo con su origen.

Si prefieres entender también el lado de Google Play, funciona con el mismo principio pero con una estructura de datos completamente distinta, lo hemos explicado por separado.