Advanced Geospatial Editor & Map Tools
Vue 3 + MapLibre editor for creating, editing and styling custom maps with real-time collaboration.
Product in one sentence
Geospatial editor and tooling that lets major news and broadcast TV teams create static SVGs, interactive maps, and video overlays from the same map data — fast enough for live coverage.
My role
I focused on the frontend: building the Vue 3 + MapLibre editor, leading the migration from Vue 2, and tuning rendering and interactions for large, data-heavy maps. I also created shared UI components, a browser-based video editor, and the Stripe-based billing flows that power the SaaS products.
What I did
- •Built geospatial editors with Vue 3 + TypeScript + Mapbox GL / MapLibre: dynamic layers, clustering, offline tiles, undo/redo, and rich tools for editing polygons, labels, and markers.
- •Contributed to a custom MapLibre fork with features like configurable map scale, detail level controls, and grid label-free areas — allowing newsrooms to place their own content on top of maps without label conflicts.
- •Led the migration from Vue 2 → Vue 3 (Composition API) and Vuex → Pinia, simplifying state management and reducing legacy code.
- •Created a shared UI component library reused across the map editor and internal tools, enforcing consistency and reducing duplicated code.
- •Built a browser-based video timeline editor with Vue 3 + TypeScript: drag-to-edit segments, frame-accurate trimming, and FFmpeg/WebCodecs API for client-side video processing without server uploads.
- •Implemented Stripe subscriptions and one-off payments with secure webhooks and reporting, ensuring reliable SaaS billing.
- •Built a real-time interactive election results map for a large news site, focusing on client-side performance and stable live updates under peak traffic.
- •Added an export path to Adobe After Effects (ExtendScript + tracking data) so motion designers can drive broadcast graphics directly from map projects.
Impact & Results
Enabled newsroom and broadcast teams to produce static SVGs, interactive embeds, and video graphics from the same geospatial projects.
Cutting turnaround from hours to minutes by reusing map data across multiple output formats without manual re-entry or format conversion.
Vue 3 + Composition API and Pinia reduced state management complexity.
Made it faster to ship new map features and experiments, with developers spending less time managing state mutations and more time building features.
The optimized MapLibre fork improved FPS and interaction smoothness.
Dense multi-layer maps viewed by millions during live events maintained consistent performance without stuttering or lag during zooms and pans.
The shared component library reduced duplicated UI code and kept performance scores high.
Standardized components across the map editor and video tools, ensuring consistent UX and preventing performance regressions as the product scaled.
Stripe integration unlocked predictable recurring revenue.
Gave the team real-time visibility into subscriptions, churn, and usage patterns, enabling data-driven decisions about features and pricing.
Next Project
SaaS & Portals
Telehealth Patient Portal Modernization