Promesa · 01 / 04
Una sola mano.
Todos los entregables pasan por la misma persona: del copy al deploy. Sin intermediarios, sin account managers, sin teléfono roto.
Proceso · Cinco tiempos firmados
Del brief al lanzamiento, sin giros.
24díasCorporativa firmada
2rondasDe revisión incluidas
95/ 100Lighthouse garantizado
Baja · los cinco tiempos
Promesas · Cuatro compromisos
Antes del primer pixel firmamos esto. Cuatro promesas escritas en el contrato, no en la página About.
Lo que firmamos antes del contrato.
Promesa · 02 / 04
Un calendario firmado.
La fecha de entrega va en el contrato. Si nos desviamos sin causa tuya, descuento proporcional. No es un eslogan, está en la letra.
Promesa · 03 / 04
Un repositorio tuyo.
Desde el commit 01 el código vive en tu organización de GitHub. Si te vas, te vas con todo — sin dependencias nuestras ni plataformas propietarias.
Promesa · 04 / 04
Una decisión justificada.
Cada tipografía, cada ease, cada color responde a una regla escrita en el sistema. Si no se puede explicar, se cae.
Cinco tiempos · Desplegados
Del primer correo al dominio publicado. Cada tiempo tiene su entregable, su duración y sus herramientas. Nada se improvisa.
El libro de ruta, abierto.
Tiempo 01 · Día 0 — 21 sesión de 60 min · Brief de 3 pliegos · Contrato firmado
01
Brief.
Sesenta minutos contigo. Nada de formularios. Salimos con la pieza escrita y el sistema de decisiones alineado.
Ventana de discovery de una hora, firmada por ambas partes. Te hacemos las preguntas que nadie te ha hecho: quién compite con tu narrativa, qué te prohíbe tu junta, qué no puedes perder. Salimos con un documento vivo de 3 páginas.
Tú aportas
- Rellenas el brief corto en la web.
- Compartes referencias visuales si tienes.
- Abres 60 minutos en tu calendario.
Nosotros entregamos
- Leemos en profundidad, no por encima.
- Preparamos 8 preguntas específicas.
- Documentamos el brief vivo en 3 pliegos.
- Firmamos contrato con plazo cerrado y 50% anticipo.
Herramientas · Tiempo 01
- Notion · brief vivo
- Google Meet · sesión
- Holded · contrato digital
Formato entregado1 sesión de 60 min · Brief de 3 pliegos · Contrato firmado
Tiempo 02 · Día 2 — 5Documento de arquitectura · Prototipo clicable low-fi · 1 ronda de ajustes
02
Arquitectura.
Sitemap, retícula, jerarquía. Antes de un píxel, un plano. Así no hay sorpresas en el tramo final.
Mapeamos cada ruta como si fuera una columna del edificio. Wireframes a baja fidelidad, retícula tipográfica, sistema modular de componentes. Te mandamos un plano navegable antes de abrir Figma siquiera.
Tú aportas
- Revisas el sitemap y los wireframes low-fi.
- Aportas contenido preliminar (copy, imágenes si las hay).
- Validas la retícula base y la jerarquía narrativa.
Nosotros entregamos
- Auditamos competencia del sector (3 referencias analizadas).
- Definimos sitemap + rutas + patrones de navegación.
- Sistema tipográfico: escala, weights, opsz de Fraunces.
- Retícula modular 12 columnas con reglas documentadas.
- Wireframes clicables en Figma (low-fi, estructura pura).
Herramientas · Tiempo 02
- Figma · wireframes y retícula
- Miro · sitemap visual
- Notion · documentación
Formato entregadoDocumento de arquitectura · Prototipo clicable low-fi · 1 ronda de ajustes
Tiempo 03 · Día 5 — 11Moodboards · 3 rutas de dirección · Prototipo hi-fi · Sistema documentado
03
Diseño.
Dirección de arte y prototipo clicable. Validamos el tono entero antes de escribir una sola línea de código.
Dirección de arte, tres rutas tipográficas, sistema de color refinado, moodboard propio — no de Pinterest. Prototipo navegable en Figma con estados hover, transiciones clave y micro-copy definitivo.
Tú aportas
- Eliges entre tres rutas visuales propuestas.
- Validas tone of voice y micro-copy en contexto.
- Aportas feedback estructurado sobre el prototipo clicable.
Nosotros entregamos
- 3 moodboards propios (no Pinterest genérico).
- 3 rutas tipográficas con pesos y tratamiento italic.
- Sistema de color: primario, apoyos, neutros, estados.
- Prototipo alta fidelidad clicable con hovers, transiciones y estados.
- Copywriting definitivo: titulares, lede, micro-copy, CTA, emails.
- Documentación del sistema: tokens, componentes, reglas.
Herramientas · Tiempo 03
- Figma · alta fidelidad
- Framer · prototipo animado
- Google Docs · copy colaborativo
Formato entregadoMoodboards · 3 rutas de dirección · Prototipo hi-fi · Sistema documentado
Tiempo 04 · Día 11 — 20Repositorio a tu nombre · Previews continuas · Dashboard Vercel
04
Build.
Código propio, componentes reutilizables, animaciones serias. Nada de builders. Todo firmado por nosotros.
Next.js + Tailwind + GSAP. Componentes propios, tipado estricto, testing de interacciones críticas. Cada animación pasa por un checklist: finalidad, duración, ease, reducción de movimiento. Deploy en Vercel con previews por cada commit.
Tú aportas
- Recibes preview de Vercel por cada commit significativo.
- Das feedback visual mediante anotaciones sobre la preview.
- Validas puntos de control de rendimiento y accesibilidad.
Nosotros entregamos
- Setup técnico: repo, CI, previews Vercel, dominios.
- Arquitectura de componentes tipados estrictos.
- Integración de animaciones scroll: GSAP ScrollTrigger, SplitText.
- WebGL / 3D si el paquete lo incluye (Three.js + R3F).
- SEO técnico: schema, sitemap, OG dinámicos, robots.
- Auditorías Lighthouse, accesibilidad WCAG AA, W3C.
Herramientas · Tiempo 04
- Next.js 16 · React 19
- GSAP Club · Three.js · drei
- Vercel · previews y deploy
- GitHub · repositorio tuyo
Formato entregadoRepositorio a tu nombre · Previews continuas · Dashboard Vercel
Tiempo 05 · Día 20 — 24Web pública · Código y documentación tuyos · Plan de mantenimiento
05
Entrega.
QA, auditoría Lighthouse, handoff documentado. Te vas con la web tuya, el código tuyo y el mantenimiento decidido.
Auditoría completa en cinco dispositivos, validación W3C, test a11y WCAG AA, Lighthouse ≥95. Handoff con Loom explicativos, documentación propia del sistema, plan de mantenimiento opcional a partir del segundo mes.
Tú aportas
- Pruebas en 5 dispositivos reales (lista sugerida por nosotros).
- Listas cambios mínimos de última hora si los hubiera.
- Decides si contratas mantenimiento post-launch.
Nosotros entregamos
- Auditoría cruzada: Lighthouse ≥95, WCAG AA, W3C validator.
- QA en 5 dispositivos/navegadores reales.
- Handoff: Loom de 9 min, documentación en MDX, Figma final.
- Transferencia del repo a tu organización de GitHub.
- Deploy final en tu dominio con SSL, CDN y backups.
- Checklist post-launch: analytics, sitemap enviado, monitor Core Web Vitals.
Herramientas · Tiempo 05
- Lighthouse · WebPageTest
- axe-core · WCAG check
- Loom · handoff vídeo
- Plausible · analytics opcional
Formato entregadoWeb pública · Código y documentación tuyos · Plan de mantenimiento
Números · Sin maquillar
Lo que ha salido del proceso hasta hoy. Datos medidos en los últimos dieciocho proyectos entregados — promediados y honestos.
El proceso, en números.
01
24días
Del brief a publicadoCorporativa · Paquete 0202
94%
Entregados en plazoÚltimos 18 proyectos03
96/ 100
Lighthouse medioEn el handoff del proyecto04
9/ 10
Net Promoter ScoreEncuesta 3 meses post-launchLímites · Lo que no hacemos
El proceso se define tanto por lo que incluye como por lo que rechaza. Seis cosas que no forman parte del oficio de Brío.
Los noes que protegen el oficio.
01
No reutilizamos plantillas de otros proyectos.
Cada marca merece una dirección de arte propia. Si reciclas diseño, reciclas resultado.
02
No damos presupuestos sin discovery.
Un precio sin entender el proyecto es un tiro a ciegas. El discovery de 60 min es gratis y obligatorio.
03
No trabajamos con builders (Wix, Squarespace, Webflow).
Son herramientas válidas — pero no lo nuestro. Nosotros codificamos desde cero. Si prefieres builder, te recomendamos a gente buena.
04
No aceptamos cambios de scope ocultos.
Si a mitad del proyecto aparece un requerimiento nuevo, se replantea scope y precio. Transparencia antes que complacencia.
05
No cobramos revisiones infinitas.
Dos rondas grandes están incluidas en todos los paquetes. La tercera se valora como scope extra — no es castigo, es sostenibilidad.
06
No hacemos link building ni campañas de contenido.
No es nuestro oficio. SEO técnico sí (schema, performance, arquitectura). Campañas y outreach te mandamos a quien lo hace bien.
Primera línea del proceso · Tiempo 01
Ahora ya sabes cómo. Empecemos.
Rellena el brief corto de tres minutos y entramos al Tiempo 01 contigo en menos de 24 horas. Cero compromiso hasta la llamada — el discovery de una hora es gratis y obligatorio para los dos.