Skip to main content

WebGi SDK - Realistic Rendering on the web.

Get StartedFeatures and Plugins
Showcase and Examples
Latest Version: 0.9.20

Introduction

WebGi is a three.js framework to create 3d applications, ecommerce viewers, configurators.
It includes a set of plugins for rendering, lighting, materials, post processing, and more.
WebGi v0 requires a license to use in any commercial applications.
Email us at [email protected] to buy a license. Check out Threepipe if you would like to start free.
Improved Jewelery rendering and more products are now available at iJewel3D

Updates

For Rendering Jewelery, Gem-stones, Fashion, Precious Metal, configurators, AR TryOn - iJewel3D Developer
The core framework in WebGi SDK is now free and open source - Threepipe SDK

Get Started

Introduction

Read about what WebGi is, the status and how to get started.

Features and Plugins

Exhaustive list of all the features and plugins bundled with WebGi.

API Documentation

Go through the complete API reference of all exported classes, interfaces and functions.

Model Viewer Tutorials

Viewer API

Get started with adding a 3D viewer on a simple HTML page and loading an model with lighting.

Plugin Basics

Learn about the basics of adding and managing plugins to a WebGi viewer.

Asset Management

An overview of AssetManagementPlugin in WebGi that can be used to import, add and export different types of assets like 3d models, materials, images.

Camera Control

Tutorial on how to access the default camera in the viewer, setting the transform, control options and animate between different camera views/states.

Extending with three.js

An introduction of how to access and interface with the three.js primitive objects within the viewer.

User Interaction

An overview of the Picking Plugin bundled within WebGi to handle object selection and manage mouse interactions on 3d models and the canvas.

GLTF Animations

A tutorial and example on using the GLTFAnimationPlugin to play and manage all or selected animations parsed from a GLTF file.

Scrollable 3d websites

A tutorial and example on using the ScrollableCameraViewsPlugin to animate camera along with page scroll.

Animation and Tween

A tutorial on using the Popmotion animation library with the bundled PopmotionPlugin to tween values, and choreograph animations synced with the render loop.

Material Configurator

Provides an overview of writing a custom Material Configurator Plugin to configure materials variants the scene, displaying them in an HTML Ui and handling serialization.

Writing Custom Plugins

An advanced overview of writing custom plugins to extend the functionality of the 3d viewer with custom features while integrating with the existing framework and other plugins.

Writing Custom Material

An advanced overview of creating a new material type with custom vertex and fragment shaders along with setup to create UI for the material and serialize with json and gltf.