Interacción y desarrollo
may. 2026
ClinIQ
ClinIQ es una landing de marketing orientada a la confianza para un producto health B2C — desglose de analíticas en lenguaje claro y preparación de visita, no diagnóstico médico. Diseñé y desarrollé la página como una historia continua: preloader intro, hero, How it works fijado, historias de escenario, pricing, contacto y bloque de upload que cierra el arco de conversión.
El motion sostiene la narrativa sin restar legibilidad. Lenis gestiona el scroll suave; GSAP ScrollTrigger impulsa reveals de sección, pin en desktop en How it works (Upload → Understand → Prepare) y hover magnético en las tarjetas. Intro y navegación por hash usan preloaders tipo cortina — saltos a Pricing o Stories sin pop-in. El layout respeta prefers-reduced-motion.
Pliegue hero — titular seguro sobre claridad en salud, ritmo marquee, CTA legible hacia upload; composición calmada antes de la prueba social.
How it works — pin scroll en desktop recorre Upload, Understand, Prepare; copy y visuales hacen cross-fade al avanzar.
Stories — tarjetas de escenario con visuales en CSS; hover magnético en mock UI; narrativas caregiver y labs para confianza.
Pricing — tarjetas Free y Plus con scroll reveal; copy calmado y disclaimer; conversión sin tono enterprise.
Contact — panel Say hello junto al CTA de email; arco semicircular responsive hacia la sección upload oscura inferior.
Embudo upload — tarjetas de archivo apiladas, campos line-style, estado de éxito; footer en tono preloader con disclaimer de compliance.
Menú nav — sidebar con enlaces grandes a secciones, overlay atenuado, borde curvo del panel; FAB abre las mismas rutas tras perder el hero de vista.