# RITO

> Mostrar estilo y disponibilidad sin caer en clichés vintage de barbería.

- Servicio demostrado: Diseño web para barberías
- Tipo: demostración independiente
- Sector: Barbería
- Dirección visual: Contacto fotográfico
- Interacción: Estilos y turnos
- Caso: https://devforgeapp.pro/proyectos/rito-barberia
- Demo: https://rito.devforgeapp.pro/

## Respuesta corta

Fotografía frontal, servicios con contexto y un recorrido que termina en una reserva directa.

## El reto

RITO debía comunicar técnica, personalidad y confianza sin recurrir a rayas vintage, bigotes dibujados o una estética de barbería genérica. La página tenía que mostrar el resultado del corte y también a las personas que lo hacen posible.

## Dirección

La dirección usa noche, papel y azul eléctrico para construir una barbería urbana y contemporánea. Las fotografías funcionan como hoja de contactos: retratos cercanos, gestos de trabajo y encuadres que hacen visible la precisión del oficio.

## Experiencia

Los cuatro estilos se exploran como una selección completa, no como tarjetas recortadas. Servicios, equipo y disponibilidad se conectan con un flujo de reserva directo; los cambios de imagen, los estados hover y los revelados por viewport aportan ritmo sin convertir la interfaz en un efecto.

## Resultado

El resultado es una demostración independiente que muestra una experiencia comercial completa para una barbería: dirección de arte, catálogo de servicios, equipo contextualizado, responsive y reserva. La identidad permite vender una visita sin depender de una plantilla de salón.

## Decisiones

- El hero funciona como una portada fotográfica, no como un split desconectado.
- Cuatro estilos se presentan completos en una hoja de contactos controlada.
- El equipo aparece con función, especialidad y disponibilidad legible.

## Capacidades demostradas

- Servicios expandibles
- Selector de estilos
- Equipo contextualizado
- Flujo de reserva

## Fuentes

- [WCAG 2.2 — Target Size (Minimum)](https://www.w3.org/WAI/WCAG22/Understanding/target-size-minimum.html): Referencia para servicios, estilos, perfiles y reserva en pantallas táctiles.
- [MDN — prefers-reduced-motion](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion): Base para conservar la experiencia sin movimiento cuando el usuario lo solicita.

Este caso no representa a un cliente real ni atribuye testimonios, disponibilidad o resultados comerciales reales.