Tag: WebGL

We have recently experimented with a Raspberry Pi 3 Model B, to see how it can work as media player for digital signage display or wayfinding information kiosk. As a result we can say, it works well with 2D wayfinding maps and with 3D Wayfinder Advertisement Module.

What is Raspberry Pi?

Raspberry Pi is a small credit card sized linux based open source computer. It is equipped with:
– Broadcom 64-bit quad core CPU clocked @ 1.2 GHz,
– 1GB of RAM,
– built-in WLAN and BLE modules,
– HDMI output.

But everything is soldered to the board hence there is no option to upgrade, except for the microSD card. You can also have a nice box for it, so it doesn’t look like a hackers development board.

Compared to other small form factor computers like Intel NUC or Gigabyte BRIX, it is much cheaper. Raspberry Pi with a nice case and microSD card would cost about 50..70 USD. The NUC or BRIX boxes start at 110..130 USD new, and you still need to equip them with a hard drive (SSD/HDD) and memory module(s) (DDR3/DDR4 SO-DIMM RAM) which would cost you about an extra 30 USD for a 32GB SSD and ~25 USD for DDR3 or ~30 USD for DDR4. Totalling up to about 165..190 USD.

Raspberry PI plays in Full HD, so it is not a problem to use large resolution screens.

Enable WebGL

For 3D the Raspberry is still a bit weak and by default it doesn’t have WebGL enabled. To enable WebGL you have to:
1. Open up the terminal application (or command prompt if you prefer to call it that)
2. run command sudo raspi-config
3. navigate to Advanced Options
4. enable GL support.

The GPU on the Raspberry PI 3 Model B doesn’t support floating point textures, so we cannot use transparent textures.

To build wayfinding or digital signage project based on Raspberry Pi you need to use a special linux distribution that opens a browser in full-screen mode instead of the regular desktop interface.

At the same time the kiosk based on Raspberry Pi is quite bullet-proof. There’s no need to worry about excessive power consumption as it actually only consumes about 3.7W under full load and only about 1.4W when playing a FullHD video, which is roughly 10% of the Intel NUCs ~38W while under full system load and ~18W while watching a FullHD video.

It boots up fast from a microSD card which can be easily replaced when it wears out or breaks.

Although remote managing a kiosk that uses a Raspberry Pi can prove to be quite a cumbersome task as you cannot use regular GUI remote management tools like Teamviewer or LogMeIn. The fastest way to remote manage the Raspberry Pi is to use SSH, which is a CLI (Command Line Interface) and this might scare-off most of the users that are not used to poking around via a CLI.

We have listed some guidelines for creating 3D models, that look nice and run smoothly in web-browsers. 

3D Wayfinder uses regular 3D models, so there is no special format or way how the 3D floorplans should be modeled. As 3D Wayfinder works in web-browsers through WebGL technology, then in order to get better results the 3D models should be optimized. Read below for some useful tips and tricks on optimizing 3D models for the best performance.

For example keep the 3D geometry simple and use textures, that can be repeated:

An important element of 3D floorplans are different kinds of vegetation (trees, bushes etc.). They help to make the floorplans look more life-like and in some cases are also important for navigating on the map. It is easy to use transparent textures on the simple planes, just never model out the leaves or branches:

With 3D it is possible to create really life-like buildings, but when using 3D for maps, it is always good to keep the models simpler. For this we suggest removing un-important furniture and making the walls as low as possible without losing the general idea of the height of the room. This way the visibility of the visualized path is far greater.

You find the full list of guidelines for creating 3D models are added 3D Wayfinder page here.

3ds Max models cannot be used directly in 3D Wayfinder, as .max format is closed file format and our importer doesn’t support it. But exporting 3D models from Max is not complicated.

3D Wayfinder supports following formats for 3D models: .fbx, .dae, .lwo, .obj and .3ds. But as we are using ASSIMP for model converting it is possible to try also other formats. With 3ds Max, we recommend to use  .fbx or .dae formats.

To exporting 3D models from Max follow these instructions:

1. When exporting models always select what You want to export and then “export – export selected”.

2. Set proper export settings.

If You want to export .fbx use these settings on the picture:

Pay attention that “triangulate” has to be selected and up axis is “Y-up”. Otherwise the 3D model will be flipped in 3D Wayfinder.

If You are exporting .dae then use only OpenCOLLADA exporter and these settings:

There are some minor differences with .dae and .fbx files. You just have to test, what suites better. All the materials can be tuned in 3D Wayfinder Administration panel (see the tutorial), so you don’t have to worry about ambient colors, transparency or other material properties.

We recommend that the whole building should not have more than 100 000 polygons. For kiosk applications (where it is possible to use better GPU-s) you can also have much larger models.

FRAK WebGL engine has now built in Cubemaps and reflection shader. This gives 3D Wayfinder access to use reflections of surrounding area.

We have added built in cubemaps and cubemap reflection shader to FRAK WebGL engine. In addition reflection with cubemaps is efficient way to create reflective surfaces like glass or mirrors.
Also cubemap reflection is a rendering method. It means that reflective surfaces reflect the cubemap textures.

It will be available for 3D Wayfinder in near future. This will be the effective way to create large glass walls or buildings. It make them more realistic. It might be used also for expensive shopping mall floors.

Next feature in FRAK will be specular map to mark efficiently reflective areas.

Cubemap demo can be found under FRAK repository.

WebGL issues are fixed with Android 6.0. 3D Wayfinder is running again on latest Android.

We discovered WebGL issues with Android Lollipop 5.1.1 version, that was available for Google Nexus devices on August. Now Google has started to roll out Android 6.0 Marshmallow to existing Nexus devices. With 6.0 the WebGL issues seemed to be fixed.

See the Nexus 5 with 3D Wayfinder video on Youtube.

We have added full screen mode to FRAK WebGL engine. Now it is possible to create 3D Wayfinder templates that can open 3D floor plans in full screen.

Full screen with browsers is being used for watching videos, using map application, playing games etc. Usually wayfinding applications are configured to run in full screen by default. So there will be no need for separate full screen mode from browser. When embedding 3D Wayfinder in web-pages or web based applications, going full screen can be really useful. This gives the possibility to experience 3D content through the whole screen when needed. Also in normal state 3D canvas can be mixed with other HTML content keeping the 3D area smaller and it needs less performance.

To use full screen mode with FRAK engine you have to make following API call:
Engine.requestFullscreen(useUpscaling)

Exiting full screen:
Engine.exitFullscreen()

Engine.requestFullscreen() has to be called by a user interaction (i.e. click on a button), as browser need user action for going full screen.
If “useUpscaling” is set to true the canvas is resized to screen dimensions, but rendering will continue at the original resolution. This allows for faster rendering, but the image quality will suffer.

Full screen is required for stereoscopic rendering, this we will also add to 3D Wayfinder soon to provide real-time 3D experience with 3D Wayfinder. Stay tuned!

We have released a new version of FRAK WebGL engine with support for JSON 3D model format. This decreases the browser-side loading time as browsers’ native JSON parser is faster, than parsing binary models in Javascript, as we used to do so far. Of course we will continue to support binary models also.

FRAK JSON model specifications can be found from FRAK Github repository.

Initial testing shows, that compressed JSON files are the same size as binary files, but browser side parsing is many times faster.

Here are testing results for parsing with different 3D geometry:

RGB box (12 poly)
With binary format: 250 ms
With JSON: 10-60 ms

Axis Test (3440 poly)
Binary: 300 ms
JSON: 36-60 ms

Wayfinding demo ground level (20069 poly)
Binary: 1265 ms
JSON: 50-70 ms

Browser side parsing time varies a bit, but even with larger models it should be less than 100 ms.

Support for JSON models will be available in 3D Wayfinder in near future. This will probably make the 3D Wayfinder application (with models) loading time smaller about 50%. Of course it will depend on the project size, textures, internet connection etc.

We are pleased to announce that 3D Technologies R&D has launched a service for software developers to visualize and interact with 3D floor plans. For example users can create Wayfinding, Smart House and Architecture visualization solutions. Using 3D Wayfinder floor plan application will save development time and gives users out of the box floor plan. The solution runs on touch-screen kiosks, mobile devices and websites, which makes it well scalable.

There are many areas where indoor wayfinding solution is useful and even unavoidable, such as shopping centres, transportation stations, sports facilities, hospitals, university campuses, etc. All of these facilities have different kinds of integration needs. This service enables developers to focus on these needs and not to waste time on additional development.

3D Wayfinder takes advantage of the possibilities offered by HTML5 and WebGL, that work on all modern web browsers. Taavi Juursalu, the company’s CTO says: „Our JavaScript API enables developers to intersect and send map specific events, so customizing the map is as easy as the Google Maps API. “

The platform is currently in beta version and therefore free of charge. The company’s Sales and Marketing Manager Rainer Saar adds: „3D Wayfinder for Developers is one of a kind tool in the World today that helps to widen Digital Signage and indoor wayfinding possibilities. Our service enables any developer to start creating applications without the need for specific skills in 3D field“.

3D Technologies R&D is also offering a full wayfinding solution with 3D floor plans and customer specific software development service. Today, 3DWayfinder helps to find the way in many shopping malls and transportation hubs across the World.

The whole team of 3D Technologies R&D wishes You a merry christmas and a happy new year.

People move, think and experience the world in three dimensions. The majority of media channels are using 3D technologies to attract people’s attention more and more. Nowadays, 3D has become an icon that is written on many products, even on toothpaste. There it serves a marketing purpose, but in IT sector we can make use of it.

One Estonian company, called 3D Technologies R&D has developed the first wayfinding software using WebGL. The company calls themselves a WebGL pioneers, because this technology is in its baby shoes. Most solutions that you can find at this point are usually object demos or games. They may be cool, but not practical. However, 3D Wayfinder is a very practical solution. It is a web-based service for creating building directories for large public buildings.

What is WebGL?

WebGL (Web Graphics Library) in its most basic level is a graphics library that allows us to create real-time rendered interactive 3D graphics inside browser, so it is browser-based. With it, you can experience rich 3D content within any compatible web browser, without installing additional plugin. Most modern browsers support WebGL technology to deliver hardware-accelerated 3D graphics. The HTML5 and WebGL platform allow direct access to the graphics card. That means much faster load times and smoother operation on PC and on mobile devices. According to the WebGL stats, we can show you some statistics about supported desktops and mobile browsers. Data is assembled from over 15 million visits on more than 615 participating sites over the last 60 days.

Source: http://webglstats.com/

As we can see from the diagrams, almost ¾ of the personal computer users, who have visited WebGL participating sites, use browsers that support that graphics library. Mobile devices percentage is low, but it is increasing on daily basis as more power is put under the hood.

WebGL Advantages

WebGL is the best solution enabling to display 3D content on every browser and platform. It is plug-in free, memory management is handled automatically and, it is royalty free web standard for low-level 3D graphics. WebGL is supported in most of the operating systems (Windows Vista or later, Mac OS 10.6 or later, Linux and Chrome OS) and browsers. Unlike other 3D graphics technologies, such as Unity 3D, Flash.

WebGL elements can be mixed with other HTML elements and composites. This enables to design and integrate according to personal needs in combination with other technologies and content. It all together offers endless possibilities for designers and developers.

3D indoor wayfinding software

3D Technologies R&D created FRAK engine to ease up the 3D content development process. FRAK is a JavaScript 3D engine for creating interactive 3D applications. With this engine, you will have the power to build the next generation application. WebGL and the power of HTML5 gives cool designing and functionality opportunities for the future projects.