Una UI que
anticipa a sus usuarios
Deje de tratar a todos los usuarios de la misma manera. Presage adapta su interfaz en tiempo real según el comportamiento, los rasgos y el compromiso — en una biblioteca ligera.
import { Adaptive, Variant } from '@presage-kit/react'
// The right onboarding for every user — automatically
function Onboarding() {
return (
<Adaptive id="onboarding" defaultVariant="welcome">
<Variant id="welcome"><WelcomeTour /></Variant>
<Variant id="checklist"><Checklist /></Variant>
<Variant id="whats-new"><WhatsNew /></Variant>
</Adaptive>
)
}El problema
Su UI trata a todos
los usuarios de la misma manera
Un visitante nuevo y un usuario avanzado con 500 sesiones ven exactamente el mismo panel de control.
La personalización es o bien if/else dispersos o una plataforma de seis cifras.
Lógica dispersa
Verificaciones de roles y feature flags enterrados en decenas de componentes. Añadir un nuevo perfil significa modificar cada archivo.
Ciega al comportamiento
Rastrea lo que los usuarios hacen clic, pero ninguno de esos datos impulsa la UI que ven. Dos mundos separados.
Solo para grandes empresas
Las verdaderas plataformas de personalización cuestan seis cifras y requieren un equipo de datos. Usted solo quiere que su sidebar se adapte.
La solución
Reglas declarativas.
Adaptación instantánea.
Defina quién ve qué en una sola configuración. Presage evalúa las reglas contra el contexto del usuario en tiempo real y renderiza la variante correcta.
const client = createAdaptiveClient({
rules: [
{
id: 'power-user-nav',
adaptationId: 'main-nav',
priority: 10,
conditions: {
all: [
{ field: 'maturity', operator: 'eq', value: 'power' },
{ field: 'traits.role', operator: 'in',
value: ['admin', 'editor'] },
],
},
action: { type: 'reorder',
order: ['analytics', 'settings', 'users'] },
},
],
})Características
Todo lo que necesita.
Nada que no.
Motor de reglas
14 operadores, lógica booleana, orden de prioridad. Declarativo, determinista, fácil de depurar.
Señales de comportamiento
Conteo de sesiones, uso de funcionalidades, mapas de clics — calculados automáticamente a partir de eventos rastreados. Cero agregación manual.
Madurez del usuario
Segmente automáticamente a los usuarios como new, active, power o dormant. Úselo directamente en las reglas.
Agnóstico de framework
Core en TypeScript puro. Hooks de React y composables de Vue disponibles hoy. Svelte y Solid planeados.
Tipado seguro
Generics completos. selectedVariant se restringe a su unión de variantes. Auto‑completado en todas partes.
Ligero y rápido
Menos de 5KB comprimido. Cero dependencias. Inicialización sincrónica desde caché — sin destello de contenido incorrecto.
Cómo funciona
Cuatro pasos. Un solo ciclo de renderizado.
Rastrear
Registre eventos con client.track(). Conecte cualquier herramienta de analytics o use el store integrado.
Calcular
Los eventos se convierten en señales de comportamiento: sesiones, uso de funcionalidades, patrones de clics.
Evaluar
El motor de reglas compara el contexto con las condiciones. La mayor prioridad gana.
Adaptar
La variante correspondiente se renderiza. Mostrar, ocultar, reordenar — todo reactivo, todo declarativo.
Precios
Precios simples y transparentes
Empiece a construir hoy. Escale cuando esté listo.
Gratis
- Motor de reglas
- Adaptadores React & Vue
- Señales de comportamiento
- Segmentación de madurez del usuario
- Persistencia localStorage
- Soporte comunitario
Pro
- Todo lo del plan Gratis
- Sincronización backend y retención
- Panel de análisis
- Seguridad por lista de dominios
- Soporte prioritario por email
- Acceso anticipado a nuevas funcionalidades
Empresa
- Todo lo del plan Pro
- Infraestructura backend dedicada
- Soporte SSR
- Ingeniero de soporte dedicado
- Garantía SLA
- Integraciones personalizadas
¿Listo para construir
interfaces adaptativas?
Instale Presage, defina sus primeras reglas y vea su UI adaptarse en minutos.