← Work

Open-source Web Component

viewer-360

A framework-agnostic 360 degree product viewer built as a Web Component with canvas rendering, zoom, high-resolution swaps, and cross-framework wrappers.

Role
Component library author
Year
2024
Stack
Web Components, TypeScript, Canvas, Rollup, React/Vue/Angular wrappers

Problem

Product viewers often ship as framework-specific widgets, which makes them harder to reuse across React, Vue, Angular, and plain HTML environments. The goal was to keep the core viewer portable while still offering convenient integration points for common frontend stacks.

Approach

The core is a Web Component, giving the package a stable browser-native boundary. Canvas rendering handles frame updates efficiently, and the package exposes wrappers so app teams can use it without fighting their framework conventions.

Outcome

The viewer ships as a framework-agnostic custom element with React, Vue, and Angular wrappers. Canvas rendering, image preloading, zoom, and high-resolution swaps provide one implementation that can be reused across different application stacks.