AI Builder is built on a modern, event-driven architecture that enables scalable, flexible, and maintainable AI applications. This page explains the core architectural principles and components that power the platform.

​
Three-Tier Architecture

AI Builder follows a classic three-tier architecture pattern, modernized for cloud-native, event-driven applications:
The UI layer that users interact with, built using:
  • Next.js: For server-side rendering and optimal performance
  • React: For component-based UI development
  • BlockProtocol.org Components: For standardized UI building blocks
  • Tailwind CSS: For styling and responsive design
This tier consists of Pages and Blocks in the AI Builder interface.

​
Event-Driven Architecture (EDA)

AI Builder’s core interaction model is built around events, enabling loose coupling and asynchronous communication between components:

​
Key Components of the EDA

​
Event Flow in AI Builder

1

Event Emission

Events can originate from multiple sources:
  • UI components (blocks) emitting user interaction events
  • Pages emitting lifecycle and navigation events
  • Automations emitting custom process events
  • External systems emitting webhook events
2

Event Routing

The event router determines where events should be delivered:
  • UI events are routed to relevant automations
  • Automation events may be routed to other automations
  • System events are routed to appropriate handlers
  • Events can be filtered and transformed during routing
3

Event Handling

Recipients process events according to their type:
  • Blocks may update their display based on received events
  • Pages may navigate or modify their structure
  • Automations execute logic sequences in response to events
  • System components update state or perform operations
4

Event Logging

All events are recorded in the Activity log:
  • Event metadata (timestamp, source, type)
  • Event payload (data content)
  • Correlation information (related events)
  • Processing results and any errors

​
Microservices Architecture

AI Builder is built on a microservices foundation, providing scalability and resilience:

Service Isolation

Description: Each functional area operates as an independent service
  • UI rendering service
  • Automation execution service
  • Event processing service
  • Storage and persistence services
  • Integration services

API-First Design

Description: All services communicate through well-defined APIs
  • RESTful HTTP interfaces
  • Event-based messaging
  • Versioned API contracts
  • Standardized error handling

Containerization

Description: Services are packaged as containers for consistent deployment
  • Docker containers for all services
  • Kubernetes orchestration
  • Horizontal scaling capabilities
  • Resource isolation
  • Deployment consistency

Service Discovery

Description: Dynamic service location and communication
  • Automatic service registration
  • Load balancing between instances
  • Health monitoring
  • Circuit breaking for fault tolerance
  • Failover mechanisms

​
Cloud-Native Architecture

AI Builder is designed as a cloud-native application with key characteristics:
All infrastructure components are defined as code:
  • Terraform: For provisioning cloud resources
  • Helm Charts: For Kubernetes deployments
  • GitOps: For configuration management
  • Declarative Specifications: For resource definitions
This enables consistent deployments across environments and clouds.

​
Security Architecture

Security is built into every layer of the AI Builder framework:

​
Memory Architecture

AI Builder implements a multi-tiered memory system for state management:

Variable Scopes

Description: Different persistence levels for different needs
  • Global Scope: Workspace-wide variables available to all users and sessions
  • User Scope: User-specific variables persisted across sessions
  • Session Scope: Variables tied to the current user session
  • Run Scope: Temporary variables for the current automation execution

Storage Implementations

Description: Appropriate data storage based on scope
  • In-memory Cache: For temporary, high-speed access
  • Redis: For distributed, persistent session data
  • Database: For long-term user and global variables
  • Specialized Storage: Vector databases, document stores via apps

Access Patterns

Description: How variables are referenced and used
  • Variable Syntax: {{scope.variable}} notation
  • Expression Evaluation: Dynamic evaluation in automations and blocks
  • CRUD Operations: Set, get, update, delete operations
  • Reactive Updates: Real-time UI updates on variable changes

​
Integration Architecture

AI Builder’s integration capabilities connect with external systems through multiple approaches:
Direct HTTP communication with external APIs:
  • HTTP Methods: GET, POST, PUT, DELETE, PATCH
  • Authentication: Basic, Bearer Token, OAuth, API Key
  • Content Types: JSON, XML, Form-data, Binary
  • Response Handling: Status codes, body parsing, error management
Used for most modern API integrations.

​
Development Approach

AI Builder supports a range of development approaches to accommodate different skill levels and requirements:

Visual Builder

Description: Graphical interface for configuration-based developmentKey Features:
  • Drag-and-drop interfaces
  • Visual workflow design
  • Property editors
  • WYSIWYG previews

YAML Definition

Description: Declarative definition of components using YAMLKey Features:
  • Text-based configuration
  • Version control friendly
  • Templating and inheritance
  • Bulk editing capabilities

Code Customization

Description: Direct code implementation for advanced scenariosKey Features:
  • JavaScript/TypeScript for UI
  • Node.js for backend logic
  • CSS for styling
  • Python for data processing

​
Next Steps

Blocks

Learn about UI components in AI Builder

Pages

Discover page creation and management

Automations

Explore backend process development

Integrations

Learn about connecting to external systems