Prompt de revisión móvil de una landing page para Codex

Pide a Codex una versión de 390px de tu landing page con la llamada a la acción en la primera pantalla, zonas táctiles de 44px y una lista de lo que recortó.

Haz una versión de esta página de 390px de ancho en un archivo aparte. Apila las secciones en un orden lógico, mantén la llamada a la acción visible sin hacer scroll en la primera pantalla, haz que cada zona táctil tenga al menos 44px de alto y dime qué elementos de escritorio eliminaste o simplificaste y por qué.

Funciona con

Codex, ChatGPT

De la colección

Landing pages

Sobre este prompt

Codex crea un archivo aparte de la página a 390px de ancho, reordena las secciones para un móvil, mantiene la llamada a la acción visible en la primera pantalla sin hacer scroll y hace que cada zona táctil tenga al menos 44px de alto. También enumera los elementos de escritorio que eliminó o simplificó, con un motivo para cada uno, y esa lista es la parte que más merece la pena leer.

En esa lista se esconden decisiones de diseño: una cuadrícula de funciones de tres columnas convertida en un scroll largo, una franja de logos recortada a cuatro logos, un selector de precios que ya no cabe. Acepta, rechaza o reelabora cada punto en lugar de quedarte con el archivo tal cual. Si la mayoría de tus visitantes usa Android, cambia 390px por 412px, un ancho típico de Android.

Ejecútalo antes de pulir el layout de escritorio, no después. Es mejor descubrir pronto un detalle de escritorio que no sobrevive en un móvil, y como la versión móvil es un archivo aparte, la página de escritorio se queda intacta hasta que decidas qué cambios llevar de vuelta.

Más prompts de esta colección

• Prompt para que una landing page hecha con IA parezca menos genéricaUn prompt de revisión para que Codex detecte qué hace que una página parezca hecha con IA, del centrado total a los textos vagos, y corrija cinco fallos.
• Prompt de landing page de HTML a código de producción para CodexReconstruye la landing page HTML aprobada en tu stack real, como Next.js y Tailwind, con tus propios componentes y los textos tal como están.
• Prompt de brief de landing page para CodexUn prompt de brief que da a Codex tu producto, audiencia, objetivo y pruebas, y le pide las secciones de la página en orden antes de empezar a diseñar.
• Prompt de diseño de hero con tres direcciones para CodexPide a Codex tres heros a 1440×900, editorial, oscuro y suave, con el mismo texto, para comparar el estilo visual y nada más.
• Prompt de diseño de landing page completa para CodexAmplía la dirección de hero que elegiste a una landing page completa, con ocho secciones con nombre en un orden fijo para que Codex no añada relleno.
• Prompt de sección de funciones de landing page con contenido realReescribe las funciones de una landing page con un titular concreto, un detalle o una cifra específica y un pequeño elemento visual en HTML, sin iconos.