App móvil
App Settings contiene las imágenes y los colores de tu app móvil nativa — la que la gente instala desde la App Store o Google Play. No es la Web app, y tampoco son los ajustes de instalación de la PWA. La rellenas una vez, antes del primer envío, y solo vuelves a ella cuando cambias de marca o publicas una nueva versión. Todo se guarda por versión: una versión es un draft que puedes editar libremente, y marcarla como Ready to submit la bloquea para quien vaya a compilar y enviar la app.
En realidad todo el trabajo se reduce a una cosa: pásale a tu diseñador la lista de tamaños que aparece más abajo y recoge los archivos.
Versiones
Una versión pasa por cinco estados. Solo una versión en Draft se puede editar.
| Estado | Qué significa | ¿Se puede cambiar todavía? |
|---|---|---|
| Draft | En preparación. | Sí. Es el único estado en el que se pueden editar los ajustes. |
| Ready to submit | Aprobada y bloqueada, a la espera de compilarse y enviarse a las tiendas. | No mientras esté bloqueada. Back to draft la vuelve a abrir. |
| Submitted | Enviada a las tiendas, pendiente de revisión. | No. Crea una New version en su lugar. |
| Live | Publicada y disponible en las tiendas ahora mismo. | No. Crea una New version en su lugar. |
| Old | Sustituida por una versión publicada más reciente. | No. |
New version inicia la siguiente; no se puede crear mientras otra versión siga en curso. History muestra los cambios hechos en una versión y permite restaurar uno anterior. Marcar una versión como lista no publica por sí solo la app en las tiendas — entrega una configuración aprobada para la compilación y el envío reales.
Store identity
App name, paquete de Android, identificador de paquete de iOS, nombre de la empresa, Apple Team ID e ID de la app en App Store Connect.
Este bloque es de solo lectura. Se configura una vez por app y lo comparten todas las versiones, porque cambiarlo significaría una app distinta en las tiendas. Ponte en contacto con soporte si realmente hay que modificarlo.
Pestaña App settings
Splash & appearance
Los colores que usa la app mientras se está iniciando, antes de que aparezca tu contenido.
| Campo | Qué controla |
|---|---|
| Status bar style | Si el teléfono dibuja sus propios iconos de reloj y batería en claro o en oscuro sobre tus pantallas. |
| Splash background | El color de fondo de la pantalla que se muestra mientras la app se abre, antes de que cargue el contenido. |
| Splash background (dark) | Lo mismo, para los teléfonos configurados con tema oscuro. |
| Adaptive icon background | El color de fondo del icono de la app en Android. El sistema lo recorta con la forma de icono que use el teléfono: redonda, squircle o cuadrada. |
| Progress color | La parte rellena de la barra de carga que se muestra mientras la app se abre o hay un proceso en curso. |
| Progress unfilled color | La parte de la barra de carga que aún no está rellena. |
| Progress border color | El marco alrededor de la barra de carga. |
| Progress border width | El grosor de ese marco. 0 significa sin borde. |
App images
Los archivos de icono y de splash que se integran en la propia app. Cada casilla muestra su tamaño objetivo — envía esas dimensiones exactas a tu diseñador. Al subir un archivo se sustituye por ti la URL guardada, así que nunca necesitas tocar el campo de URL.
| Recurso | Tamaño | Qué es |
|---|---|---|
| App icon | 1024 × 1024 px | El archivo maestro del icono. Fuente de alta resolución; Android deriva de él los tamaños más pequeños. |
| Adaptive icon foreground | 432 × 432 px | La capa frontal del icono adaptativo de Android — normalmente solo el símbolo del logo, sobre fondo transparente. |
| Adaptive icon background | 432 × 432 px | La capa de atrás. Normalmente un único color plano. |
| Adaptive icon monochrome | 432 × 432 px | Una versión a un solo color, que se usa allí donde Android dibuja los iconos en un único color (iconos temáticos). |
| Android notification | 54 × 54 px | El icono pequeño de la barra de estado cuando llega una notificación. Tiene que ser un logo simple y a un solo color — cualquier cosa con detalle se convierte en una mancha gris. |
| Splash Screen | 1440 × 3200 px | La imagen completa de la pantalla de arranque. Un fondo o un diseño acorde con tu identidad de marca. |
| Splash Icon | 1024 × 1024 px | El logo que se muestra en el centro de la pantalla de splash. |
Cada archivo de App images tiene que ser un PNG exactamente del tamaño indicado. Hub rechaza cualquier otro al subirlo y te dice el tamaño que necesita, así que un archivo equivocado nunca llega a la compilación.
Pestaña Store settings
Las imágenes de las fichas de las tiendas — lo que ve la gente antes de instalar. Aquí los tamaños también son exactos: Hub rechaza un archivo de cualquier otro tamaño.
| Sección | Recurso | Tamaño | Qué es |
|---|---|---|---|
| Google Play images | Feature banner | 1024 × 500 px | Obligatorio para Google Play. El banner ancho de la parte superior de la ficha. JPEG o PNG, sin transparencia. |
| Google Play images | App icon | 512 × 512 px | Obligatorio para Google Play. Cuadrado, con el fondo relleno, sin esquinas redondeadas ni sombra — Google las añade. |
| App Store screenshots: iPhone with Dynamic Island (medium display) | Screenshot 1 / 2 / 3 | 1206 × 2622 px | Obligatorio para Apple. En vertical, PNG o JPEG, sin transparencia. Apple las reduce para los iPhone más pequeños. |
| App Store screenshots: iPhone with Dynamic Island (large display) | Screenshot 1 / 2 / 3 | 1320 × 2868 px | Opcional. Las mismas tres pantallas, en el mismo orden, en el tamaño grande. |
Publicar a nombre de tu empresa y no de una persona requiere un número D-U-N-S en cualquiera de las dos tiendas, y puede tardar semanas en llegar.
Preparar las imágenes
Algunas cosas que te ahorran una ida y vuelta con tu diseñador:
- Envía toda la lista de tamaños de una vez. Cada recurso de arriba es un archivo independiente con un tamaño fijo — un diseñador que trabaje a partir de una sola captura se equivocará.
- Adaptive icon foreground, Adaptive icon monochrome y Android notification necesitan fondo transparente. El color que hay detrás viene de Adaptive icon background.
- Mantén el icono de notificación como una silueta plana. Los degradados y los detalles finos desaparecen a 54 px.
- Haz que Splash background coincida con el fondo de tu imagen de Splash Screen, para que nada parpadee en otro color mientras la app carga.
- Configura también Splash background (dark). Si te lo saltas, los teléfonos con tema oscuro pueden mostrar tu logo sobre un color que nunca elegiste.
- Elige Status bar style según el color del splash: iconos claros sobre fondo oscuro, iconos oscuros sobre fondo claro. Blanco sobre blanco esconde la hora y la batería.
- Las capturas para la tienda son marketing, no documentación — elige las tres pantallas que mejor expliquen lo que consiguen tus miembros. Hazlas en la app real, todas del mismo tamaño, sin el nombre, el teléfono ni el email de ningún miembro real.
- Si las capturas o el banner llevan un marco de teléfono, elige uno neutro que no parezca ni un iPhone ni un Android. Apple rechaza las imágenes del App Store que muestran teléfonos, logotipos o insignias de tienda de otra plataforma, y Google desaconseja las imágenes de dispositivos en el Feature banner.
Mantén el logo dentro de la zona segura
Los teléfonos recortan los iconos y las pantallas de arranque con formas distintas. La zona segura es la parte que ningún teléfono recorta: si el logo está centrado y dentro de ella, se ve entero en todos.
| Recurso | Lienzo | El logo, dentro de |
|---|---|---|
| Adaptive icon foreground, Adaptive icon monochrome | 432 × 432 px | Un círculo de 264 px en el centro — un logo cuadrado de unos 186 px de lado |
| Splash Icon | 1024 × 1024 px | Un círculo de 680 px en el centro — un logo cuadrado de unos 480 px de lado |
| App icon (App settings) | 1024 × 1024 px | Unos 820 × 820 px en el centro. Sin esquinas redondeadas y sin transparencia: el teléfono redondea las esquinas |
| App icon (Google Play) | 512 × 512 px | Unos 410 × 410 px en el centro |
| Android notification | 54 × 54 px | Unos 46 × 46 px — una silueta blanca sobre fondo transparente |
| Splash Screen | 1440 × 3200 px | Unos 1000 × 1800 px en el centro |
| Feature banner | 1024 × 500 px | Unos 820 × 400 px en el centro, cinco o seis palabras como mucho |
Una prueba rápida: pon un círculo de ese tamaño sobre el logo. Si no sobresale nada, está en la zona segura.
El bloque Native bars de cada pantalla del App Editor —el estilo de la barra de estado y de la barra inferior— también se aplica solo a los negocios con una app móvil nativa. Todo lo demás del App Editor afecta por igual a la Web app y a la app nativa.