BELLEZA / SPA · Claude Design · HTML

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

★★★★★4,7 2.140 descargas

Plataforma de contenidos de audio y podcasts Espacios sonoros para mentes curiosas.

↓ Descargar PROMPT.md

GRATIS 0€

NUEVO PROMPT

PROMPT

Cópialo y pégalo en Claude Design

↓ Descargar PROMPT.md

Crea una web completa para la marca ficticia **EcoVoz Studios** (dominio ecovozstudios.com, email hola@ecovozstudios.com, claim "Espacios sonoros para mentes curiosas"). La web es del tipo **Podcast** y debe incluir las siguientes páginas y bloques:

**Tecnología**: HTML único con Tailwind CSS vía CDN y JavaScript vanilla (sin frameworks). Usa la paleta de colores extraída del sitio original: #0A0A0A (fondo principal), #FFFFFF (texto), #FF5722 (acentos), #263238 (elementos secundarios). Tipografía: "Inter" para títulos y "Roboto" para cuerpo, ambos importados de Google Fonts.

**Header** (presente en todas las páginas): barra de navegación fija, logo (svg de micrófono + texto "EcoVoz Studios"), menú con enlaces: Episodes, Blogs, About us, Hosts, Subscribe, Reviews, y un botón destacado "Escuchar ahora". Incluye icono de carrito con contador (sin funcionalidad real). Botón hamburguesa para móviles.

**Home**:
1. **Hero**: fondo claro, subtítulo con icono (usar SVG simple), texto "LA MEJOR EXPERIENCIA DE AUDIO", título grande "Sumérgete en historias que inspiran", párrafo breve, botón principal "Explorar episodios" linking a /episode.
2. **Presentadores**: fila de 3 imágenes circulares, cada una con borde sutil y sombra, bajo cada foto nombre del presentador (texto ficticio).
3. **Episodios destacados**: rejilla responsive 3 columnas (mobile -> 1), cada tarjeta con imagen, título, breve descripción y botón "Reproducir".
4. **Footer**: fondo #263238, columnas con enlaces de navegación, enlaces a redes sociales (íconos SVG), datos de contacto y pequeño disclaimer.

**Episodes**: lista de tarjetas en cuadrícula 2‑4 columnas, cada una con imagen, título, duración, y botón "Escuchar".

**About us**: sección de texto con imagen a la derecha, título "Nuestra misión" y párrafo descriptivo, botón "Únete a la comunidad".

**Hosts**: tarjetas de presentador (foto circular, nombre, breve bio, enlaces a redes).

**Subscribe**: formulario simple con campo email y botón "Suscribirme", más enlaces a redes.

**Reviews**: carrusel horizontal de testimonios (texto y avatar).

**Interactividad**: menú hamburguesa toggles, scroll suave, botones con efectos hover (cambio de color a #FF5722). Todos los enlaces deben ser placeholders (#).

**Requisitos técnicos**:
- Single‑file HTML que incluya la hoja de estilos Tailwind CDN (`<link href="https://cdn.jsdelivr.net/npm/tailwindcss@3.3.2/dist/tailwind.min.css" rel="stylesheet">`).
- Importar fuentes con `<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;800&family=Roboto:wght@400;500&display=swap" rel="stylesheet">`.
- Añadir script al final del body para manejar el menú móvil y el carrusel.
- Mantener la estructura semántica (header, main, section, footer).
- Comentarios claros en el código indicando cada bloque.

Genera todo el HTML 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>
```

3.198 caracteres · 49 líneas Licencia libre · uso comercial permitido

CAPTURA COMPLETA · HOME

ESTRUCTURA DEL SITIO

Tabla de secciones

HOME

1.1 Encabezado con logo, menú y carrito
1.2 Hero con subtítulo, título, texto y llamado a la acción
1.3 Área de presentadores (imágenes en círculo)
1.4 Rejilla de episodios destacados
1.5 Footer con enlaces y redes sociales

EPISODES

1.1 Lista de episodios en tarjeta con imagen, título y descripción

ABOUT US

1.1 Texto institucional con imagen y CTA

HOSTS

1.1 Tarjetas de hosts con foto, nombre y biografía breve

1.1 Formulario de suscripción al boletín y botones de redes

REVIEWS

1.1 Comentarios de oyentes en carrusel

PROMPTS RELACIONADOS · BELLEZA / SPA

Otros prompts de la misma categoría

Ficha de marca

Nombre: EcoVoz Studios
Sector: Plataforma de contenidos de audio y podcasts
Claim: Espacios sonoros para mentes curiosas

Bloques de la home

1.1 Encabezado con logo, menú de navegación y botón carrito; 1.2 Hero con subtítulo, título, párrafo descriptivo y botón "Explorar episodios"; 1.3 Área de presentadores con imágenes circulares; 1.4 Sección de episodios destacados en rejilla; 1.5 Footer con enlaces de sitio, 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

Otros prompts de la misma categoría

Línea Ígnea

Línea Tinta

Línea Vital

LuceBelle