Screen · Bienvenida

Bienvenida — primera apertura

Primera pantalla en un dispositivo nuevo (pre-auth, pre-registro, ruta /welcome). Carrusel de 4 slides en los ⅔ superiores + CTAs persistentes anclados abajo — siempre visibles y tappables mientras rotan los slides. Footer con acceso permanente a TyC y Política de Tratamiento de Datos (Ley 1581/2012) — sin checkbox: aquí no hay aceptación, solo lectura. Sin permisos del SO en esta vista.

/welcome · pre-auth 4 slides · auto-avance 5s CTAs persistentes Ley 1581/2012 · sin checkbox reduced-motion: sin auto-avance
Layout anotado · slide 1 activo

Tres zonas fijas: carrusel (flexible, ~⅔), bloque de CTAs (fijo) y footer legal (fijo). El usuario nunca tiene que esperar el carrusel para actuar.

ilustración geométrica plana
titular + 1 línea
dots tappables
CTAs persistentes
footer legal · sin checkbox
9:41

Compra y vende cripto en Colombia, con respaldo legal

MiCapi opera como Proveedor de Servicios de Activos Virtuales.

Crear cuenta
Iniciar sesión
Al continuar puedes consultar los Términos y condiciones y la Política de tratamiento de datos.

Composición

  1. Sin app bar · edge-to-edgePre-auth no lleva chrome de navegación. Status bar transparente sobre el canvas (SystemUiMode.edgeToEdge).
  2. Ilustración geométrica planaFormas simples en la paleta (primary 100/300/500/700 + neutral). Cero caricatura cripto-bro: nada de cohetes, monedas con alas ni gráficas subiendo. Sistema de ilustración pendiente (caveat §6 del README) — estas composiciones son el placeholder canónico.
  3. Titular corto + 1 líneaTitular 23dp/700 máx. 2 líneas; apoyo 14dp muted máx. 2 líneas. Sentence case, sin signos de admiración.
  4. Dots tappablesTarget 44dp (padding invisible). Dot activo se estira a 22dp en primary.500. Tap salta directo al slide.
  5. CTAs persistentesCrear cuenta primario solid · Iniciar sesión secundario outline. Anclados fuera del carrusel: visibles y tappables en todo momento, en cualquier slide.
  6. Footer legal · solo lecturaLinks a TyC y Política de Tratamiento (acceso permanente Ley 1581/2012) → abren screens-legal-viewer. Sin checkbox — la aceptación ocurre en el registro, no aquí.
Contenido de los 4 slides · borrador

Un mensaje por slide, en orden de confianza: identidad → transparencia → cumplimiento → soporte. Auto-avance cada ~5s; se suspende al primer toque (dot, swipe o long-press) y no se reanuda.

SLIDE 1 · IDENTIDAD

Compra y vende cripto en Colombia, con respaldo legal

"MiCapi opera como Proveedor de Servicios de Activos Virtuales."

Qué es MiCapi y por qué es distinto: legalidad como primer mensaje, no como fineprint.

SLIDE 2 · TRANSPARENCIA

Tarifas claras y tiempos visibles antes de confirmar

"Ves comisión, tasa y entrega estimada antes de cada operación. Sin sorpresas."

Vocabulario del puente §4.1: Pagas/Recibes, Tasa, Comisión, Entrega estimada.

SLIDE 3 · CUMPLIMIENTO

Verificamos tu identidad por exigencia de la ley

"Cumplimos SAGRILAFT y la Resolución UIAF 314/2021. Tu verificación protege a todos."

La regulación se exhibe, no se oculta — diferenciador estratégico del brief.

SLIDE 4 · SOPORTE (opcional)

Personas reales, desde Villavicencio

"Nuestro equipo de soporte responde en español, en horario colombiano."

Cierre humano. Si el carrusel se reduce a 3 slides, este es el que sale.

Borrador — pendiente revisión Erika. El vault no tiene copy aprobado para onboarding pre-auth. Titulares y líneas de apoyo de los 4 slides son propuesta sobria alineada a §3 (voz) — requieren visto bueno legal antes de build.

Prohibido en slides: rendimientos o captación ("multiplica tu dinero"), features inexistentes en MVP (staking, tarjeta, P2P), cohetes/diamantes/emoji, promesas temporales irreales ("compra en 30 segundos"). Cualquier slide nuevo pasa por este filtro.

Estados y variantes

El contenido es estático y empaquetado con la app — no hay red, por eso no hay skeleton, vacío ni error de carga. Las variantes relevantes son de movimiento y modo.

Slide 3 · cumplimiento
9:41

Verificamos tu identidad por exigencia de la ley

Cumplimos SAGRILAFT y la Resolución UIAF 314/2021. Tu verificación protege a todos.

Crear cuenta
Iniciar sesión
Al continuar puedes consultar los Términos y condiciones y la Política de tratamiento de datos.
reduced-motion
9:41

Tarifas claras y tiempos visibles antes de confirmar

Ves comisión, tasa y entrega estimada antes de cada operación. Sin sorpresas.

Crear cuenta
Iniciar sesión
Al continuar puedes consultar los Términos y condiciones y la Política de tratamiento de datos.

Reglas de movimiento

  1. Auto-avance · 5sTimer de ~5s por slide. Se suspende definitivamente con la primera interacción (swipe, tap en dot, long-press sobre el slide). No se reanuda solo.
  2. reduced-motionCon prefers-reduced-motion: reduce (Flutter: MediaQuery.disableAnimations): sin auto-avance y los cambios de slide son corte directo o fade ≤ 80ms — nunca slide animado. Los dots siguen tappables; el swipe manual funciona.
  3. Transición estándarSwipe nativo de PageView + parallax leve (ilustración 0.85× del desplazamiento). Easing ease-standard, sin overshoot.
  4. Sin variante de redTodo el contenido viaja en el bundle. Si más adelante un slide requiere datos remotos, se degrada a los 4 estáticos — nunca skeleton en la puerta de entrada.
Light y dark · 360dp

La ilustración cambia sus rellenos claros a tintes teal translúcidos; los CTAs no cambian de jerarquía. El footer legal mantiene contraste AA en ambos modos.

Light
9:41

Compra y vende cripto en Colombia, con respaldo legal

MiCapi opera como Proveedor de Servicios de Activos Virtuales.

Crear cuenta
Iniciar sesión
Al continuar puedes consultar los Términos y condiciones y la Política de tratamiento de datos.
Dark
9:41

Compra y vende cripto en Colombia, con respaldo legal

MiCapi opera como Proveedor de Servicios de Activos Virtuales.

Crear cuenta
Iniciar sesión
Al continuar puedes consultar los Términos y condiciones y la Política de tratamiento de datos.
Notas de implementación · Flutter

PageView + timer suspendible + accesibilidad

Carrusel

PageView.builder con PageController. Auto-avance: Timer.periodic(5s) → animateToPage; se cancela en onPanDown / tap de dot y no se re-crea. Con MediaQuery.disableAnimations el timer nunca se crea y animateToPage pasa a jumpToPage.

Edge-to-edge

SystemChrome.setEnabledSystemUIMode(edgeToEdge) + status bar transparente con brillo por modo. CTAs y footer respetan SafeArea inferior (gesture nav).

Ruteo

/welcome es la raíz cuando no hay sesión ni usuario recordado. Crear cuenta → /register; Iniciar sesión → /login; links legales → /legal/terms · /legal/privacy (visor A9, disponible pre-auth).

Accesibilidad

Cada slide es un Semantics container (título + línea leídos juntos). Dots con Semantics(label: 'Ir al slide N de 4'), target 44dp. Con TalkBack activo el auto-avance también se desactiva.

Sin permisos ni trackers

Esta vista no pide permisos del SO, no dispara biometría y no registra analytics identificables — solo un evento anónimo de vista por slide.

Assets

Ilustraciones como vectores empaquetados (composiciones geométricas de la paleta). Sin red: la pantalla funciona offline por definición.