Historias de usuario

Derivado de la visión y las personas.

Los flujos detallados actor–sistema están en casos de uso (CU-01 a CU-14).

Épicas

1. Presentación personal — Hero, foto y mensaje principal
2. Trayectoria profesional — Experiencia, educación y habilidades
3. Evidencia de trabajo — Proyectos destacados
4. Contacto y CV — Enlaces y descarga del PDF
5. Experiencia de uso — Diseño moderno, animaciones, responsive

HU-01 — Primera impresión (Hero)

Como dueño del portafolio,
quiero una sección inicial impactante con mi nombre, rol, frase clave y foto,
para generar una primera impresión profesional y memorable en segundos.

Criterios de aceptación

• Se muestra nombre completo y rol profesional de forma destacada.
• Hay una frase corta de presentación (elevator pitch).
• Se muestra la foto principal (sin fondo / recorte profesional).
• Existen al menos dos acciones: ver experiencia (scroll) y descargar CV (PDF).
• La sección tiene animación de entrada moderna y elegante.
• Se ve correctamente en móvil, tablet y escritorio.

HU-02 — Contar quién soy (Sobre mí)

Como dueño del portafolio,
quiero una sección “Sobre mí” breve y clara,
para que el visitante entienda mi perfil, enfoque y valor más allá del cargo.

Criterios de aceptación

• Texto de 3–5 líneas (o equivalente), sin relleno.
• Puede acompañarse de la foto principal o una variante ambiental.
• El contenido aparece con animación al hacer scroll (reveal).
• El tono es profesional y cercano.

HU-03 — Mostrar experiencia laboral

Como visitante,
quiero ver la experiencia laboral en un timeline o tarjetas ordenadas,
para evaluar trayectoria, responsabilidades y logros.

Criterios de aceptación

• Cada experiencia incluye: cargo, empresa, fechas y descripción/logros.
• El orden es cronológico (más reciente primero).
• Cada ítem se anima al entrar en pantalla.
• La información es legible en móvil.

HU-04 — Mostrar educación y certificaciones

Como visitante,
quiero ver formación académica y certificaciones relevantes,
para validar la preparación del perfil.

Criterios de aceptación

• Se listan estudios (título, institución, fechas o estado).
• Se pueden incluir certificaciones si aplican.
• El diseño es coherente con el resto de la página.
• Animación de entrada al scroll.

HU-05 — Visualizar habilidades

Como visitante,
quiero ver habilidades técnicas, idiomas y fortalezas de forma visual,
para identificar rápido si el perfil encaja con la vacante o proyecto.

Criterios de aceptación

• Las habilidades se muestran como chips, tarjetas o grupos claros.
• Pueden agruparse (ej. tecnologías, idiomas, soft skills).
• Hay microinteracción al hover (escritorio).
• No depende solo de color para transmitir información.

HU-06 — Destacar proyectos

Como dueño del portafolio,
quiero mostrar proyectos relevantes con imagen, descripción y enlaces,
para evidenciar lo que sé hacer en la práctica.

Criterios de aceptación

• Cada proyecto tiene: nombre, descripción breve, stack (si aplica) e imagen/captura.
• Enlaces a demo y/o repositorio cuando existan.
• Las tarjetas tienen animación de entrada y hover moderno.
• Si aún no hay proyectos, se pueden usar placeholders sin romper el diseño.

HU-07 — Contactar fácilmente

Como visitante,
quiero encontrar formas claras de contacto,
para escribir o conectar sin buscar en otros sitios.

Criterios de aceptación

• Se muestran al menos: correo, LinkedIn y GitHub (según disponibilidad).
• Opcional: WhatsApp u otros canales relevantes.
• Los enlaces abren correctamente (mailto / nueva pestaña).
• Puede incluirse un mini avatar circular en esta sección.
• La sección es fácil de alcanzar desde el menú o el hero.

HU-08 — Descargar hoja de vida en PDF

Como visitante,
quiero descargar la hoja de vida en PDF,
para adjuntarla a un proceso de selección o revisarla sin conexión.

Criterios de aceptación

• Hay un botón visible de “Descargar CV” (hero y/o navegación).
• El archivo PDF se descarga o abre correctamente.
• El botón es accesible en móvil.

HU-09 — Navegación clara

Como visitante,
quiero un menú de navegación por secciones,
para ir directo a experiencia, proyectos o contacto.

Criterios de aceptación

• Menú fijo o fácilmente accesible con anclas a cada sección.
• El scroll hacia la sección es suave.
• En móvil el menú es usable (hamburguesa o equivalente).
• Opcional: indicador de sección activa o barra de progreso de scroll.

HU-10 — Experiencia moderna y animada

Como dueño del portafolio,
quiero animaciones y efectos modernos pero elegantes,
para diferenciarme y transmitir innovación sin perder profesionalismo.

Criterios de aceptación

• Animaciones de entrada en hero y secciones al scroll.
• Foto principal con presencia (entrada + flotación sutil o halo).
• Microinteracciones en botones y tarjetas.
• Fondo dinámico ligero (gradiente/partículas) que no distraiga.
• Las animaciones no bloquean la lectura ni degradan el rendimiento de forma grave.
• Respeto de prefers-reduced-motion.

HU-11 — Uso en cualquier dispositivo

Como visitante,
quiero que la página se vea bien en móvil, tablet y escritorio,
para revisarla desde cualquier lugar.

Criterios de aceptación

• Layout responsive en breakpoints principales.
• Textos legibles sin zoom forzado.
• Botones y enlaces fáciles de pulsar en móvil.
• Imágenes adaptadas (no desbordadas ni pixeladas en exceso).

HU-12 — Identidad visual con foto profesional

Como dueño del portafolio,
quiero que mi foto profesional se use de forma coherente en la página,
para generar confianza y reconocimiento personal.

Criterios de aceptación

• Foto principal sin fondo (PNG) en el hero.
• Reutilización en “Sobre mí” y/o contacto (avatar).
• Espacios reservados (placeholders) hasta cargar la foto real.
• La foto es el foco visual; el fondo animado no la tapa ni la compite.

HU-13 — Publicar y compartir

Como dueño del portafolio,
quiero publicar la página en internet con una URL estable,
para compartirla en LinkedIn, correo y procesos de selección.

Criterios de aceptación

• El sitio se puede desplegar en GitHub Pages, Vercel o similar.
• La URL es compartible y carga en navegadores actuales.
• Metadatos básicos (título, descripción, imagen de vista previa) para enlaces.

Prioridad (MoSCoW)

Trazabilidad con el diseño

Documentos relacionados

• Casos de uso
• Backlog
• Requisitos funcionales
• Criterios de aceptación (índice)