GenUI

Inspiration

E-commerce has spent the last decade optimizing what to show users (recommendations, ads, pricing), but almost no attention has been paid to how the interface itself adapts to the person using it. Every shopper—decisive or hesitant, minimalist or visually exploratory—gets the same static UI. We were inspired by the idea that a storefront should feel more like a conversation than a template: one that listens, learns, and subtly evolves as you interact with it. GenUI was born from asking a simple question: what if the UI itself could learn in real time?

What it does

GenUI is a self-evolving AI storefront that dynamically adapts its UI/UX based on real-time customer behavior. As users browse, GenUI:

• Passively tracks behavioral signals (mouse movement, scroll patterns, hover duration, touch velocity)
• Infers cognitive and stylistic preferences (e.g. hesitant vs decisive, dense vs minimal layouts)
• Continuously updates layout structure, component styles, and visual density
• Injects controlled “loud” UI modules to test new hypotheses without breaking usability
• Persists learned preferences so the experience improves over time

The result is a storefront that goes far beyond personalized products—the interface itself becomes personalized.

How we built it

Frontend

• React + Vite with a schema-driven renderer
• Telemetry trackers for mouse, scroll, touch, and interaction events
• WebSocket/SSE for live layout updates without page reloads

Backend

• FastAPI handling telemetry ingestion and layout delivery
• Redis for real-time session state (motor state, preference vectors, layout cache)
• MongoDB for cold storage and historical preference snapshots
• Vector DB (Pinecone/Qdrant) for long-term preference drift

Agent Architecture (LangGraph)

• Motor State Stream (Python, $0 cost): Computes velocity, acceleration, and jerk to classify user cognitive state in real time
• Context Analyst (LLM, batched): Correlates behavior with UI interactions to infer preferences
• Variance Auditor (LLM, batched): Evaluates “loud” experimental modules to validate or reject hypotheses
• Outputs are reduced into a unified preference directive

Layout Generation

• Stability Agent: Serves high-confidence layouts optimized for comfort and retention
• Exploratory Agent: Carefully mutates styles and modules to learn new preferences
• Deterministic post-reducer pipeline assembles and caches the final layout schema in under 100ms

Challenges we ran into

• Real-time performance: Running multiple agents in parallel while maintaining sub-100ms latency required aggressive caching, batching, and separating hot vs cold paths.
• Cost control: We avoided unnecessary LLM calls by using mathematical modelling for high-frequency signals and batching LLM inference every few seconds.
• Avoiding UI chaos: Exploration had to be constrained so the site felt adaptive—not unstable or distracting.
• State synchronization: Keeping Redis, MongoDB, vector embeddings, and live sessions consistent under rapid updates was non-trivial.

Accomplishments that we're proud of

• Built a fully working multi-agent pipeline with LangGraph
• Achieved ~50ms end-to-end blocking latency for layout generation
• Designed a schema-driven UI system that allows instant re-hydration on the frontend
• Implemented real-time preference learning without explicit user prompts
• Created a system that balances exploration and stability in a principled way

What we learned

• Behavioral signals are incredibly information-dense—tiny interactions can reveal strong preferences.
• Mathematical models can replace LLMs for many real-time inference tasks.
• Agent orchestration is as much about when not to run a model as it is about running one.
• UI personalization is most effective when it’s subtle and continuous, not explicit or disruptive.

What's next for GenUI

• Vector-based semantic component selection for deeper personalization
• Stronger exploratory agents capable of generating new React/CSS components on the fly
• Merchant-level controls to constrain personalization within brand identity
• Large-scale load testing and production-grade WebSocket infrastructure
• Deeper integration with Shopify and Backboard.io for stateful, cost-efficient LLM workflows

GenUI is our first step toward the future of advertisement, where we tailor a website to every user to maximize user retention and interaction.

Built With

• fastapi
• langgraph
• mongodb
• python
• react
• redis
• sse
• typescript