Diseño y dispositivos
La mayoría de las apps hechas con vibe coding se diseñan a ancho de móvil y se prueban en un portátil. Luego Apple abre la app en un iPad de 13 pulgadas, ve un diseño de móvil estirado con una barra lateral flotando en el vacío y escribe una nota por la Directriz 4.0. Ambos caminos funcionan, dar soporte a las tablets o excluirlas, pero tienes que elegir uno.
Desde $109 de pago único por plataforma, o deja que nuestro equipo lo haga todo desde $698.
El proyecto de Xcode de WebViewGold es una app universal: se ejecuta de forma nativa en iPhone y en iPad, con ajustes separados para cada uno (por eso Config.swift tiene orientationiphone y orientationipad, y por eso el conjunto de iconos incluye los tamaños de iPad de 152 y 167 px). Los revisores de Apple prueban habitualmente las apps universales en un iPad, App Store Connect exige capturas de iPad para ellas y el App Store del iPad muestra tu ficha a millones de usuarios de tablet. Un diseño de móvil estirado a 1024 puntos de ancho no es motivo de rechazo por sí mismo, pero uno roto sí: menús que se solapan, modales fuera de la pantalla, una vista horizontal que se desmorona. Esos casos acaban en la Directriz 4.0 (diseño) o en la 2.1 (completitud).
Android no tiene un paso de revisión para tablets, pero Google Play posiciona y destaca las apps según sus directrices de calidad para pantallas grandes, muestra las capturas de tablet por separado, y los Chromebooks ejecutan apps de Android en ventanas redimensionables. El mismo trabajo responsive compensa en ambas plataformas.
Tu app web debería verse intencionada desde 320 px hasta unos 1366 px de ancho, en vertical y en horizontal. La lista que necesitan la mayoría de las apps generadas:
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr))).Haz que el diseño de la app sea responsive para tablets (iPad y tablets Android) sin cambiar la experiencia en el teléfono: 1. Añade un contenedor centrado con un ancho máximo de 720px para las páginas de una sola columna; mantén el diseño móvil actual por debajo de 768px. 2. A partir de 768px, muestra la navegación principal como una barra lateral a la izquierda en lugar de la barra de pestañas inferior, con los mismos elementos y el mismo estado activo. 3. Convierte las listas de tarjetas en una cuadrícula responsive (1 columna en teléfonos, 2 columnas desde 768px, 3 columnas desde 1100px). 4. Da a todos los modales y hojas un ancho máximo de 560px, centrados vertical y horizontalmente en pantallas de más de 768px. 5. Asegúrate de que todas las páginas funcionen en orientación horizontal a 1024x768 sin desplazamiento horizontal y sin elementos que se solapen. 6. Mantén las áreas de toque con al menos 44px de alto y un tamaño de letra de al menos 16px en los campos de entrada. No uses interacciones que solo funcionen con hover.
¡Gran trabajo! Nunca tuve que usar código para nada, pero logré trabajar con esto y tener mi App lista. ¡Fácil y rápido! ¡También con gran ayuda de los creadores!
| Ajuste | iOS (Config.swift) | Android (Config.java) |
|---|---|---|
| Orientación | orientationiphone y orientationipad: "portrait", "landscape" o "auto" | PHONE_ORIENTATION y TABLET_ORIENTATION: "portrait", "landscape" o "auto" |
| User agent separado para tablets | useragent_ipad permite que tu app web detecte los iPads y sirva un diseño o un comportamiento específico para tablets | Un único USER_AGENT para todos los dispositivos; detecta en su lugar el ancho de pantalla en CSS |
| Barra inferior en iPad | iPadBottombar en true muestra también la barra inferior nativa en los iPads; está desactivado por defecto porque allí el indicador de inicio rara vez se solapa con el contenido | El menú lateral o el pie de navegación nativo se aplica a todos los tamaños de pantalla |
| Tamaño de la imagen splash | scaleSplashImage: porcentaje del lado más corto de la pantalla, para que la imagen escale de forma sensata en pantallas grandes | SCALE_SPLASH_IMAGE |
| Áreas seguras | Las esquinas redondeadas y el indicador de inicio también existen en los iPads; usa env(safe-area-inset-*) en CSS; consulta la documentación de áreas seguras | Estándar; no hace falta gestionar el notch |
| Iconos | Iconos de iPad de 152 y 167 px a partir del maestro de 1024 px | Los mismos iconos de launcher que en los teléfonos |
Obligatorias para las apps universales: un conjunto para el tamaño de pantalla del iPad de 13 pulgadas.
Ejecuta el proyecto de WebViewGold en el simulador del iPad Pro de 13 pulgadas, abre de cuatro a seis pantallas clave y pulsa Cmd+S. Los archivos ya tienen el tamaño que espera App Store Connect.
Instala la compilación de TestFlight en cualquier iPad (el de un amigo, una unidad de exposición de una tienda, un dispositivo alquilado) y haz capturas nativas, o compila con el Cloud Builder y usa TestFlight de la misma manera. App Store Connect indica los tamaños en píxeles aceptados por si necesitas redimensionar.
La Play Console acepta capturas opcionales de tablets de 7 y 10 pulgadas; el emulador de Android Studio (Pixel Tablet) las genera. Las apps preparadas para pantallas grandes se destacan en las tablets.
Reutiliza los textos de las capturas del teléfono; la guía de la ficha cubre los tamaños y las reglas de los textos.
En Xcode, selecciona el target WebViewGold → General → Supported Destinations y elimina iPad. La app se revisa entonces como app de iPhone, no necesita capturas de iPad, y los usuarios de iPad pueden seguir instalándola en modo de compatibilidad (una ventana de iPhone escalada). Es lo adecuado para flujos solo de teléfono, como apps de escaneo o para repartidores.
Mantén el target universal, bloquea orientationipad en vertical si el horizontal no está listo, proporciona las capturas de 13 pulgadas y prueba cada pantalla principal a ancho de tablet. Ganas el App Store del iPad y una ficha "Designed for iPad".
Por defecto, la app se instala en cualquier tamaño de pantalla. Para excluir las tablets, añade restricciones de pantalla en AndroidManifest.xml (supports-screens o compatible-screens); la Play Console oculta entonces la app en esos dispositivos. La mayoría de las apps simplemente mantienen las tablets y confían en el diseño responsive.
Las apps de iPad pueden ejecutarse en Macs con Apple silicon salvo que desactives la disponibilidad en Mac en Precios y disponibilidad (Pricing and Availability) de App Store Connect; las apps de Android se ejecutan en Chromebooks. Ambos son públicos extra si el diseño es responsive.
No. Un diseño que funciona pero no está optimizado suele pasar. La navegación rota, los elementos que se solapan o un modo horizontal que se desmorona llevan a rechazos por la 4.0 o la 2.1.
Sí: orientationipad = "portrait" en Config.swift y TABLET_ORIENTATION = "portrait" en Config.java. Muchas apps de productividad se publican así.
Sí, en modo de compatibilidad con iPhone: la app se ejecuta en una ventana escalada del tamaño de un iPhone. Aparece entre las apps de iPhone en el App Store del iPad.
No. Un único App Bundle sirve para teléfonos, tablets y Chromebooks; el trabajo de diseño se hace en tu app web.
El mismo resultado, con distinta cantidad de trabajo por tu parte. Las tres incluyen la garantía de aprobación y soporte humano 24/7.
$109 por plataforma, pago único
La licencia de WebViewGold: un proyecto de Xcode o Android Studio listo para usar. Pega tu URL, define nombre e icono, activa funciones, compila y envía. Actualizaciones gratuitas para siempre.
Ver planes en la página principal$349 por licencia, complemento de pago único
Sin Mac, sin Xcode, sin Android Studio: configura en el navegador, compilamos ambas apps en la nube y las entregamos a App Store Connect y a Play Console.
Cómo funciona el Cloud Builder Prueba la demo gratuita$698 por plataforma $798
Envíanos tu URL y tu icono. Nuestro equipo configura, compila y entrega tu app en 72 horas, en marca blanca y con los proyectos fuente. Ambas plataformas por $1,158.
Detalles del Full Service Con tecnología de
Precios de la Oferta de invierno válidos hasta el 31 de diciembre de 2026.
Garantía de aprobación en App Store & Google Play – o te devolvemos el dinero en 14 días
¿Prefieres delegarlo? Full Service: configuramos, compilamos y entregamos en 72 horas, desde $698 por plataforma. ¿Preguntas? Chatea con nosotros 24/7.
Los reembolsos se conceden bajo las condiciones indicadas en nuestras FAQ: un rechazo por motivos ajenos al contenido por parte de Apple y/o Google, reclamado dentro de los 14 días posteriores a la compra.