JVC HM200E


Realtime 3D in browser

Show More

Client

  • JVC

Deliverables

  • Realtime 3D
  • Realistic Model
  • Native Interaction in browser

Techniques

  • WebGL
  • Blender
  • Photoshop

Case description


JVC approached us to develop a new way to promote and display a range of their products on their website.

Things like pictures and videos are all a common appereance on websites, so we had to look for the next step.

We developed a WebGL based viewer which works native in all browsers, and allows the user to rotate, control and click on the model, showing it from all sides and displaying additional features and even videos.

You can try a live version right here

Approach


We received a production 3D model and made reference photos of the real camera.

Since production models are very dense and feature every screw and bolt, we needed to break it down into a more suitable format for web.

High resolution CAD model of the JVC camera

01.Prepping the model


Using the production model as a guideline, we remodelled several parts of the camera and reused others.

Things like animation possibilities are taken into account to make sure we could move certain parts around.

WebGL ready 3D model of the JVC camera

02.Textures and Materials


Because it was going to be a custom environment, there were no premade materials available, like you can find in a 3D modeling software.

This meant we needed to create all those by hand, applying textures and programming all the properties.

Preview of the WebGL solution

03.The Viewer


The final result is an amazing webbased viewer which allows the user to explore the camera and get additional information at the same time

Would you like to try it yourself? Click here or the image above!