Rootz Portal: An AI Visual Interaction Layer

The First Graphical Interface Designed for AI Output

Rootz Corp — March 2026
v1.0

The Problem

AI communicates with humans through text. Streams of words scrolling down a screen. Whether it's ChatGPT, Claude, Gemini, or any other AI — the output is the same: text in a chat window.

This is the equivalent of using a command line in 1983. It works. It's functional. But it's not how humans process information best.

Humans think visually. We understand diagrams faster than paragraphs. We remember images longer than sentences. We follow narratives that are shown, not just told. The most effective presentations combine visual anchors with spoken narrative — a few key points on screen while a voice tells the full story.

AI has no way to do this today. There is no standard mechanism for an AI to draw a diagram, render a chart, show an image, or narrate a visual story to a human. Every AI output is text.

Rootz Portal changes that.

What It Is

Rootz Portal is an AI-driven visual interaction layer. It gives any AI the ability to:

  • Draw — diagrams, charts, timelines, architecture maps, SWOT analyses, visual comparisons

  • Show — images, photos, data visualizations rendered on a GPU-accelerated canvas

  • Narrate — voice narration synchronized with visual elements, telling a story while drawing it

  • Interact — clickable elements that respond to the user, enabling AI-driven navigation without URLs

  • See — a feedback loop where the AI captures what's on screen and self-corrects layout or content

    • The interface runs in any web browser. The AI connects via MCP (Model Context Protocol), an open standard for AI tool integration. No special software. No plugins. No app store. Open a browser, connect your AI, and it can draw on your screen.

    How It Works

    Architecture

    ``
    Any AI (Claude, ChatGPT, Gemini...)
    |
    | MCP (HTTP transport)
    v
    Rootz Portal Server
    |
    | WebSocket
    v
    Browser (PixiJS GPU renderer)
    |
    v
    User's Screen + Voice
    `

    1. The AI sends structured JSON commands through MCP — "draw a circle here, write this text there, connect these with a line, narrate this story."
    2. The Portal server routes the commands to the correct browser session via WebSocket, matched by a wallet-based session identifier.
    3. The browser renders at 60fps using PixiJS, a GPU-accelerated 2D rendering engine. Text writes itself character by character. Lines trace themselves. Shapes grow into place. Particles float. Elements glow.
    4. Voice narration plays simultaneously via the browser's speech synthesis engine. The narration IS the clock — scenes advance when the voice finishes speaking.
    5. The AI can see what it drew through a feedback loop — capturing the scene state or taking a screenshot to verify layout and correct mistakes.

    The Key Insight: AI Is Not a Stream. AI Is an Instruction.

    Traditional interfaces expect continuous input — mouse movements, key presses, video frames. AI doesn't work that way. AI thinks, then emits a discrete instruction. Then waits. Then thinks again.

    The Portal is designed for this. It's a message-driven display — a queue of instructions that the renderer consumes. The AI pushes commands as fast as it can think. The renderer draws them at 60fps, smoothing discrete instructions into continuous visual output. The narration provides pacing. The queue provides buffering.

    This is not a presentation tool. It's a display driver for AI output.

    Visual Primitives

    The Portal renders these element types, all GPU-accelerated:

    PrimitiveUse Case
    |-----------|----------|
    TextTitles, labels, body text — writes character by character with glow effects
    BoxData cards, containers — with labels, bullet items, colored borders
    CircleConcepts, nodes — with labels, used for hub-and-spoke diagrams
    LineConnections, timelines — draws progressively from point to point
    ArrowFlow direction — bezier curves between elements
    GridSWOT analyses, comparisons — 2x2, 3x1, any layout
    ImagePhotos, logos — GPU-textured sprites from any URL

    Every element supports: position (0-1 relative coordinates), color, glow effects, animation delay, and click interaction.

    Session Model

    Wallet-Based Identity

    When a user opens portal.rootz.global, the browser automatically generates a cryptographic wallet (key pair) stored in localStorage. No passwords. No accounts. No sign-up.

    The wallet address becomes:

  • The session ID — the unique room for this user

  • The MCP endpoint — portal.rootz.global/mcp/{walletAddress}

  • The persistent identity — same browser, same wallet, same room every time

  • The archive key — when the user saves a session, it's signed by this wallet

    • Multi-User, Multi-AI

    Each wallet creates an isolated session. Multiple users can connect simultaneously — each in their own room. Multiple AIs can connect to the same room — both drawing on the same canvas. The server routes by wallet address.

    The Queue Model

    The Portal uses a message queue architecture:

    1. AI pushes commands to the queue as fast as it generates them
    2. Renderer consumes from the queue, processing one scene at a time
    3. Narration is the clock — when the voice finishes, the next scene starts
    4. No gaps — scenes crossfade smoothly because the next scene is already queued
    5. User clicks enter the same queue — interaction is just another message
    6. The queue IS the recording — replay it later for video export

    This means a 10-scene presentation with narration, images, and click interaction is delivered as a single burst of JSON commands (~15KB). The renderer plays it back as a smooth, narrated, GPU-rendered experience.

    Interactive Elements: The AI Browser

    When elements are marked as clickable, the Portal becomes an interactive interface:

    1. Hover — clickable elements highlight on mouseover (scale + brighten)
    2. Click — the element flashes, and a pre-loaded response scene renders instantly with crossfade
    3. Back/Forward — browser-style navigation through scene history (keyboard shortcuts: Alt+Left/Right)
    4. No round-trip needed — response scenes are pre-loaded in the element JSON, rendering instantly on click

    This is navigation without URLs. Content generated, not fetched. The beginning of an AI-native browser.

    What This Replaces

    1984: Macintosh1993: Mosaic2026: Portal
    |:---:|:---:|:---:|
    GUI replaces CLIBrowser replaces appsAI visual layer replaces text chat
    Humans see computers differentlyHumans see the internetHumans see AI thinking
    QuickDraw renderingHTML renderingGPU instruction rendering
    Mouse + windowsLinks + pagesClicks + AI-generated scenes

    The Macintosh showed that humans interact better with visual interfaces than command lines. Mosaic showed that a universal viewer changes how information flows. Portal shows that AI output doesn't have to be text.

    Technology Stack

    ComponentTechnologyWhy
    |-----------|-----------|-----|
    RendererPixiJS 8 (WebGL2)GPU-accelerated, 60fps, runs in any browser
    TransportMCP (HTTP Streamable)Open standard, works with Claude, ChatGPT, any MCP client
    CommunicationWebSocketReal-time bidirectional, sub-50ms latency
    VoiceBrowser SpeechSynthesisNo API key needed, works offline, free
    IdentityWallet (localStorage)No passwords, no accounts, persistent
    ServerNode.jsLightweight, single process, PM2 managed
    HostingAny server with HTTPSCurrently on Oracle Cloud with nginx + certbot

    Total renderer size: ~200KB of JavaScript. Compare to Chrome: ~200MB.

    Use Cases

    Business Presentations


    AI reads a business plan document and presents it visually — diagrams, charts, narration, click-to-explore. The document teaches the AI how to present it. The presentation is a living, interactive experience, not a static deck.

    Data Dashboards


    AI fetches live data (weather, financials, analytics) and renders it as visual dashboards. Updated in real time. Narrated with context.

    Education


    AI explains concepts by drawing them — hub-and-spoke diagrams, timelines, process flows. Students click elements to go deeper. The AI responds visually to questions.

    Sales and Marketing


    Interactive product demos where prospects click to explore features. Each click generates a tailored deep-dive. The AI adapts the presentation to the audience's interests.

    Multi-AI Collaboration


    Two AIs on the same canvas — one draws, the other annotates. Visual AI debate. Collaborative problem-solving rendered in real time.

    Proven Demonstrations

    1. Rootz Business Plan — 10-scene investor pitch with SWOT analysis, revenue bar charts, partner pipeline, stat cards, and interactive clickable navigation
    2. ReefRootz — 8-scene dive conservation pitch with real underwater photos (Kittywake wreck, stingray encounters, coral reef), narration, and data visualizations
    3. Live Weather — Ocala, FL 5-day forecast fetched from live data and rendered as a visual dashboard with temperature trend lines
    4. Architecture Diagrams — System diagrams with boxes, circles, connecting lines, and feedback loops
    5. Multi-AI — Claude Code and ChatGPT both rendering to the same Portal session simultaneously

    Roadmap

    Now (v0.4) — Shipped


  • GPU renderer with 7 primitive types + images

  • 10 MCP tools (render, add, remove, update, clear, capture, screenshot, narrate, status, open)

  • Queue-driven delivery with narration-as-clock

  • Crossfade scene transitions

  • Click interaction with pre-loaded scenes

  • Back/forward history navigation

  • Wallet-based multi-user sessions

  • Public MCP at portal.rootz.global

  • AI skill file for self-teaching

    • Next (v0.5)


  • Stale narration watchdog (unstick blocked queues)

  • Screen size discovery (AI adapts layout to viewport)

  • Session persistence (IndexedDB cache for offline replay)

  • Docs page with per-platform setup guides

    • Future


  • Retroactive recording — replay the message queue as video (MP4 export)

  • Wallet-signed sessions — cryptographic auth, Rootz Secret integration

  • Archive to blockchain — session becomes a signed, timestamped Data Wallet

  • Open standard — publish the visual command protocol as a specification

  • MCP Registry — claude mcp add rootz-portal` with one command

  • 3D primitives — Three.js WebGPU for immersive visual spaces

    • The Vision

    Every AI interaction today is a wall of text scrolling down a screen. The Rootz Portal is the first step toward AI that shows you what it means — not just tells you.

    The Portal is 200KB of JavaScript. It runs in any browser. It works with any AI that can output JSON. The protocol is simple enough that any developer can implement it in an afternoon.

    This is not a product for a niche. This is infrastructure for how AI communicates with humans. The same way HTTP became infrastructure for the web, the visual command protocol becomes infrastructure for AI output.

    The whole world is on a 286 DOS computer. We have a Mac.

    Rootz Corp
    portal.rootz.global
    rootz.global

    The AI Visual Interaction Layer