Project type Collaborative project

Role 2D editor + all 3D visualization / interaction

Fabric.jsThree.jsUV mapping2D editing3D previewCollaboration

Screenshots / architecture / flow

Structured cover placeholders are used instead of published project screenshots.

Background

  • Exhibition-style scenarios need real-time linkage between 2D editing and 3D model preview.
  • Image, texture, text, crop, and color adjustment in the edit surface.

Requirements

  • Real-time preview for boards, stands, and exhibition models
  • Read internal model nodes and expose selectable lists
  • Map 2D edits to model surfaces via UV/texture
  • Unified access via model node naming and organization conventions

My role

  • Full 2D editor features and interaction
  • 3D visualization, node reading, and preview linkage
  • Collaboration with backend partner on APIs and data formats

Key challenges

  • Consistency and performance between 2D edits and 3D surface mapping
  • Different model node layouts need one access convention
  • Frequent edits need responsive preview feedback

Approach

  • Clear pipeline from 2D canvas to UV/texture
  • Shared data structures for node lists and selection
  • Modular verification of edit → map → preview

Engineering highlights

  • 2D: images, text, crop, color adjustment
  • 3D: node list and live material updates
  • UV/texture mapping to model surfaces

Outcome / delivery status

  • Demonstrable 2D/3D linked editing experience
  • Clear collaboration: backend partner + my front-end 3D and editor modules

What this case demonstrates

  • 2D/3D linkage and UV mapping as a focused delivery
  • Lead role on core interaction modules in a collaborative project

Technologies

Fabric.jsThree.jsJavaScriptVue

Related services

Get in touch

If this case type matches your needs, email me with project background, scope, and constraints.

Email me

Back to case studies