RoopM: Privacy-First Vector Canvas & Edge Design Engine

A high-performance C++ & canvas design suite solving the un-editable AI image trap with smart hierarchical typography, vector tables, and privacy-first local edge intelligence.

Comment

Inspiration: Breaking the Cloud Dependency & The "Hallucinating AI" Trap

Today’s creative software landscape is fundamentally flawed:

  1. Cloud Privacy & Data Exfiltration: Modern platforms (like Canva or cloud AI generators) force users to transmit private financial sheets, personal documents, and proprietary designs to remote cloud servers—posing severe data security and surveillance risks.
  2. The "Flat Raster & Hallucination" Bottleneck: Current generative AI produces flat, static bitmaps (JPEGs/PNGs) plagued with hallucinations—garbled text, unchangeable typography, and broken tables that cannot be mathematically edited.
  3. The Heavy Cloud Compute Trap: Running massive 7B+ cloud LLMs costs billions and requires fast internet, completely failing privacy-critical and low-resource edge environments.

As an independent student researcher, I am engineering RoopM (live at roopm.com)—a zero-server, high-performance visual canvas designed to transition away from cloud dependence into ultra-compact, deterministic Edge-AI architecture that runs entirely on low-end consumer hardware with complete data sovereignty.

What RoopM Does Today: Live Client-Side Engine

The production canvas is live and functional at roopm.com/editor, executing 100% inside the client browser memory without backend servers:

1. Vector Studio & Interactive Bézier Anchors

  • Node-Level Precision: Interactive vector pen tool with sub-pixel Bézier anchors. Toggle individual points between Smooth and Corner, open/close geometries, and adjust tension handles dynamically.
  • Stroke Geometry & Multi-Stop Gradients: Path smoothing (up to 100%), custom Cap styles (Butt, Round, Square), Join styles (Miter, Round, Bevel), linear/radial gradient fills, and custom color palettes.

2. Spreadsheet-Grade Table Engineering

  • Context-Driven Editing: Native right-click context menus to dynamically Insert Rows/Columns (Above/Below/Left/Right), Delete, and Clear Content.
  • Multi-Cell Drag Selection: Spreadsheet-style multi-cell bounding box selection with independent border styling (Solid, Dash, Dot, Double), precision border weights, and multi-axis alignment (X/Y).

3. Parametric Typography & Spatial Layout

  • Smart Relational Scaling: When batch-scaling mixed text sizes (+10pt), RoopM calculates proportional relative offsets (e.g., 30pt & 10pt scale to 40pt & 20pt), preserving typographic visual hierarchy instead of flattening them into a single uniform size.
  • Sub-string Text FX: Inline word/character styling with real-time Glow, Outlines, Drop Shadows, and clipboard integration.
  • Equal Spacing & Layer Hierarchy: Automatic horizontal/vertical distribution spacing, full object z-index stacking, and element locking.

4. Client-Side Print Compilers

  • Compiles transparent PNG, JPG, and raw standalone vector PDFs client-side without cloud APIs:
    • Custom PDFExporter.js and TTFParser.js embedding TrueType fonts directly in memory.
    • ISO standard print sizes (A3–A6, Legal, Letter), custom margins, and an industry-grade Vector Text Quality slider up to 12x DPR.

AI Architecture: Prototyping Today vs. Groundbreaking Edge R&D

1. Transparent Prototyping Disclosure (Current State)

  • Currently, RoopM utilizes the Gemini API strictly as an experimental testbed to evaluate declarative natural language canvas manipulation (testing automated mutations, layout shifts, and multilingual commands including Gujarati and English).
  • The Reality: We openly acknowledge that cloud-based APIs cannot guarantee absolute zero-leak cybersecurity. There are currently no finished on-device edge models deployed in the live web app—it is actively being researched and engineered under the hood.

2. Our Edge AI R&D: Sub-10MB Neurosymbolic & Liquid Architectures

Instead of relying on bloated, non-private cloud LLMs, our active research focuses on building a fundamentally different edge-intelligence stack:

  • Targeting Sub-10MB Footprints: We are researching ultra-compact models designed to run locally on low-end consumer devices without heavy GPU dependencies.
  • Liquid Neural Networks (LNNs) & Neurosymbolic AI: Moving beyond standard transformers, we are exploring continuous-time adaptive architectures (Liquid models) paired with neurosymbolic rule engines.
  • Zero-Hallucination via Mathematical Grammars: Inspired by the rigorous, deterministic structural rules of Sanskrit morphological grammar (Paninian algorithmic logic), we are engineering deterministic semantic parsing. Instead of "guessing" text or layout coordinates, the engine enforces strict rule-based boundaries to achieve Zero Hallucination.
  • Pure C++ Native Inference (Bypassing Python): Python stacks are too slow and bloated for low-resource edge hardware. We are developing our core parsing, OCR pipelines, and background segmentation directly in pure C++, delivering orders of magnitude faster execution speeds and strict memory safety.

The Vision: From Layout-Aware Canvas to High-FPS 3D & Video

Our roadmap expands RoopM from a structured 2D document/image canvas into an autonomous, voice-and-text directed visual workstation:

  • Autonomous Layout Vision: An edge model capable of visually understanding complete canvas hierarchies and executing pixel-perfect parametric adjustments.
  • Beyond Static Design: Expanding from 2D images and documents into hardware-accelerated 3D spatial graphics and a high-FPS timeline video editor with instant local export.

How We Built It: Low-Level Systems Engineering

  • Web Frontend: Pure Vanilla JavaScript (CanvasTextElement, CanvasTableElement, CanvasPathElement, PDFExporter.js). Zero external canvas frameworks.
  • Native Edge Core (Active Pipeline):
    • Blend2D: JIT-accelerated vector graphics via AsmJit.
    • Yoga: Flexbox and coordinate layout engine.
    • QuickJS: Memory-isolated, sandboxed JavaScript runtime.
    • Cross-Platform: Windows binary (roopm_demo.exe) and Android NDK cross-compilation (roopm_demo_arm64-v8a.apk).

Challenges We Overcame

  • Eliminating Hallucinations: Bridging generative neural intent with strict deterministic geometric rules so that canvas elements never break layout constraints.
  • C++ Systems Performance: Building a unified rendering toolchain in C++ that out-performs conventional Python/Electron stacks on constrained hardware.
  • Client-Side PDF Binary Compilation: Building font parsers and vector byte streams directly in the browser without server-side rendering.

What We Learned

  • Architecture Dictates Privacy: True cybersecurity cannot be retrofitted on top of cloud databases; it must be built into the core by eliminating cloud telemetry and computing strictly at the edge.
  • Deterministic Rules Beat Pure Probabilities: Neural networks are powerful for comprehension, but strict symbolic rule systems (like Paninian grammatical logic) are mandatory for producing zero-hallucination vector layouts.
  • Systems-Level Efficiency: Dropping bloated Python runtimes in favor of pure C++ unlocks high-end AI capabilities even on budget consumer hardware.

Accomplishments We're Proud Of

  • Engineering a live, production-grade vector design studio from line zero (roopm.com).
  • Innovating a Smart Relational Typography engine and 12x DPR vector export pipeline.
  • Cross-compiling working C++ native builds for Windows and an operational Android APK (aligned_arm64-v8a.apk).
  • Pioneering sub-10MB neurosymbolic edge architecture research to bring true zero-leak, private AI to everyday devices.

What's Next for RoopM

  • Completing the integration of lightweight, local on-device SLMs (via WebGPU / ONNX) to execute YAML canvas commands 100% offline.
  • Native on-device computer vision models for instant background removal and asset extraction.
  • Multi-track timeline-based video and keyframe animation export.

Built With

  • android
  • asmjit
  • blend2d
  • c++
  • canvas-api
  • cybersecurity
  • data-privacy
  • edge-ai
  • edge-computing
  • generative-ai
  • html5
  • javascript
  • lexbor
  • pdf-generation
  • quickjs
  • typography
  • vanilla-javascript
  • vector-graphics
  • yoga-layout
  • zero-dependencies
Share this project:

Updates

Submission history