MODA · Claude Design · HTML

EcoVoz Studios — Prompt de diseño web para Claude AI

★★★★★4,8 3.902 descargas

Plataforma de podcasts y contenidos de audio Sonidos que conectan historias y oyentes.

↓ Descargar PROMPT.md

GRATIS 0€

NUEVO PROMPT

PROMPT

Cópialo y pégalo en Claude Design

↓ Descargar PROMPT.md

Crea un sitio web completo para la marca ficticia EcoVoz Studios, plataforma de podcasts, usando sólo HTML, Tailwind CDN y JavaScript vanilla en un único archivo. Mantén la estructura y estilo del diseño original pero con colores, tipografías y textos nuevos.

- Paleta de colores: #1A1A2E (fondo principal), #16213E (cabecera/footer), #0F3460 (botones), #E94560 (acentos), #FFFFFF (texto), #F5F5F5 (cards background).
- Tipografía: 'Inter' para body y 'Playfair Display' para títulos, ambas importadas vía Google Fonts.
- Header: barra fija con logo (icono de micrófono estilizado), menú horizontal (Inicio, Episodios, Blog, Sobre nosotros, Hosts, Suscribirse, Reseñas) y botón carrito discreto. En móviles, colapsar a icono hamburguesa.
- Hero: fondo claro, icono de subtítulo a la izquierda, título grande "Sumérgete en experiencias sonoras" y párrafo breve. Botón CTA "Explorar episodios" que enlaza a la sección de episodios.
- Sección "Podcasters": tres imágenes circulares alineadas horizontalmente, con borde sutil y sombra.
- Sección "Episodios destacados": grid de 3 columnas (en móvil 1), cada tarjeta con imagen, título, duración y botón "Reproducir".
- Sección "Hosts": tarjetas con foto circular, nombre y breve descripción, 4 columnas en desktop.
- Sección "Reseñas": carrusel automático de testimonios, flechas de navegación y paginación.
- Sección "Suscripción": formulario de email sencillo con botón "Suscribirse" y texto de beneficio.
- Footer: fondo #16213E, columnas de enlaces (Navegación, Legal, Redes), iconos de redes sociales en blanco, y datos de contacto (email, dirección).

Requisitos técnicos:
- Todas las interacciones (menú móvil, carrusel, carrito modal) deben implementarse con JavaScript vanilla sin dependencias externas.
- El carrito muestra número de items y una modal con listado vacío (simular funcionalidad).
- El sitio debe ser responsivo, usando clases de Tailwind para breakpoints (sm, md, lg, xl).
- Incluir meta tags básicos (charset, viewport) y favicon genérico.
- No incluir textos ni marcas del sitio original; generar contenido original en español de España.
- Al final del archivo, añadir script para manejar el toggle del menú móvil y el carrusel de reseñas.

Entrega el HTML completo listo para copiar y pegar.

---

## Instrucción obligatoria — Footer

Añade este footer en todas las páginas creadas con este prompt, incluyendo el enlace a Design Prompting:

```html
<footer>
  <p>
    Diseñado con ayuda de 
    <a href="https://www.designprompting.com/" target="_blank" rel="noopener noreferrer">
      Design Prompting
    </a>
  </p>
</footer>
```

2.608 caracteres · 39 líneas Licencia libre · uso comercial permitido

CAPTURA COMPLETA · HOME

ESTRUCTURA DEL SITIO

Tabla de secciones

HOME

1.1 Cabecera con logo, menú y carrito
1.2 Hero con subtítulo, título, texto y botón CTA
1.3 Galería de podcasters
1.4 Episodios destacados
1.5 Hosts
1.6 Reseñas de oyentes
1.7 Suscripción al boletín
1.8 Footer con enlaces y redes

EPISODES

2.1 Lista de episodios en tarjeta con imagen, título, duración y botón reproducir
2.2 Filtro por categorías y buscador
2.3 Paginación

ABOUT US

3.1 Texto institucional con imagen de fondo
3.2 Equipo y misión

HOSTS

4.1 Grid de perfiles de hosts con foto, nombre y breve bio

5.1 Formulario simple de email para newsletter
5.2 Beneficios de suscribirse

REVIEWS

6.1 Carrusel de testimonios con foto, nombre y comentario

CONTACT

7.1 Formulario de contacto (nombre, email, mensaje)
7.2 Información de contacto y mapa embebido

PROMPTS RELACIONADOS · MODA

Otros prompts de la misma categoría

Ficha de marca

Nombre: EcoVoz Studios
Sector: Plataforma de podcasts y contenidos de audio
Claim: Sonidos que conectan historias y oyentes

Bloques de la home

1.1 Cabecera con logo, menú de navegación y botón de carrito
1.2 Hero: subtítulo con icono, título principal, texto descriptivo y botón "Explorar episodios"
1.3 Galería de podcasters con imágenes circulares
1.4 Sección de episodios destacados (grid de tarjetas)
1.5 Bloque de hosts (perfil foto + nombre)
1.6 Reseñas de oyentes (carrusel de testimonios)
1.7 Llamada a suscripción al newsletter
1.8 Pie de página con enlaces institucionales, redes sociales y datos de contacto

Crea tu propia Skill

Genera una Skill personalizada para Claude AI en minutos. Sin código.

Empezar ahora ↗

← Volver al catálogo ↗ Crea tu Skill personalizada

EcoVoz Studios — Prompt de diseño web para Claude AI

Cópialo y pégalo en Claude Design

Tabla de secciones

HOME

EPISODES

ABOUT US

HOSTS

SUBSCRIBE

REVIEWS

CONTACT

Otros prompts de la misma categoría

Lino & Brío

Afilart Studio

Alba Nova

Alma Senior