PlayCanvas, the hidden WebGL editor gem

Good tools for having graphics & dev team working closely together has always been important for providing awesome digital experience! Back then, Macromedia/Adobe Flash was a 2D tool bringing together artists & coders, and that’s why it was so powerful and popular. Later Unity and Unreal Engine did the same for 3D. But those giants are too heavy for optimized web experience and the build workflow is long.

On the other side, the web itself, with evolving standards, is more powerful than ever: complex SVG animations? Hi lottie. Electron framework via Chromium enables softwares like VS Code, Slack, etc on the web. So why not having a powerful editor directly in the web and targeting the web? Here comes PlayCanvas.

Continue reading PlayCanvas, the hidden WebGL editor gem

Building a 3D furniture visualiser with Three.js

Blanc Cambouis is a company selling high end furniture to their customer. In order to let the customer visualize the product they are buying we were asked to create a custom real-time 3D object viewer, able to manage different kinds of models and to customize them on the fly.

While Integral Service worked on the web side of the product, us at Da Viking Code worked on the object viewer.

In order to meet their requirement we built a Three.js (WebGL Based) app using the Haxe language and yar3333’s Haxe extern for Three.js, we needed a modular solution to import the furniture into the engine, but also to enable the furniture’s multiple customization option without implementing new logic for each model.
Continue reading Building a 3D furniture visualiser with Three.js

Pixi.js, Haxe and browser’s fullpage cross-platform experiences

ADN 250 is a serious game around relationship marketing, like a Tupperware meeting. You must learn about different product by using them, then you can start selling theses products to different people and convince them to do the same extending your sellers network and making loads of money.

The principal requirement for the project was to make an accessible game, without installation, accessible both on computer and device : a web game.

 

What kind of technologies would you use if you were asked to build a full-page 2D game, available on the web by PCs and smartphones ?

Here at Da Viking Code we chooses the famous Pixi.js !
This HTML5 javascript library using WebGL enable us to easily build 2D game on canvas.

Unfortunately the JavaScript language isn’t the most comfortable one to use, mistake can be made because of the lack of type and compilation. If you feel comfortable with JavaScript that’s okay, but at Da Viking Code we prefer the strictly-typed and compiled Haxe language for our Web projects :). Using Pixi.s with Haxe isn’t hard, we use the well maintained Adireddy’s Haxe extern for Pixi.js !
Continue reading Pixi.js, Haxe and browser’s fullpage cross-platform experiences

Heineken, The Sub® in WebGL

After our tech presentation app for Heineken’s The Sub® used as part of interactive elements in a popup store in Paris, running on ipad Air 2s, we were asked to build a browser version which would now be accessible to the public, as part of The Sub®’s web site.

The color scheme would change, yet all functionality would be kept.

Now, Unity does export for webgl yet the bulky webgl build and unexpected results we had when first trying the webgl export out, led us to decide on using Three.js and building it back from scratch. It would be lighter and we’d have a bit more finer control over the result.

We would be writing this in Haxe. No specific reason to this, except for a cleaner code… and to code faster… even though we would not be targeting another language.
Continue reading Heineken, The Sub® in WebGL