Tag: 3D wayfinder modeling

This tutorial will show you how we use bevel in some of our 3D wayfinding maps.

There are 3 main options in Blender to get the beveled edge look.

First is the Bevel Tool

Select the object you want to bevel in Blender, go to edit mode then select the bevel tool from the left row (press T key to enable it if it’s hidden).

Select the edges you want to bevel and click and drag the yellow circle to adjust bevel amount. When satisfied you can further fine tune it in the toolbar that’s located on the left bottom side. Faster way to add the bevel tool is to use shortcut ctrl + B and adjust amount with mouse. Press right mouse button when you are done.

Second, Less Common Way is to Use Extrude & Scale

Select the object you want to bevel in Blender, go to edit mode then select the face(s) of which edges you want to Bevel. Extrude (press E key) the face(s) on z axis (press Z key) and move them up a bit. Then scale them down (press S key) until you have the desired look.

WHEN YOU ARE BEVELING MULTIPLE OBJECTS AT THE SAME TIME MAKE SURE TO CHANGE TRANSFORM PIVOT POINT TO INDIVIDUAL ORIGINS.

Final and Nondestructive way

Nondestructive meaning that the bevel doesn’t fundamentally change the mesh. This also means that you have to check the apply modifiers button when exporting mesh.

Go to modifier properties (blue wrench icon) and click add modifier then click bevel.
Leave segments to 1 and adjust the amount to your liking. If it doesn’t work right away then go to geometry tab under bevel and turn off clamp overlap and correct the amount.

To add bevel only to those edges that you want, change limit method to weight. Go to edit mode, select the edges you want to bevel then open right sidebar (press N key) under tab “item” change the mean bevel weight to 1.

Before Adding The Bevel Modifier it’s a Good Practice to do and Check The Following

1. Mesh needs to be clean and use only quads.

• Removing tris– select everything– go to edit mode– make sure everything is selected– then use ALT + J or on the top bar go to Face– “Tris to Quads”.
• If there are still some tris then have to manually merge them. Select the vertices and press M– “Collapse”. Second option is to just remake the whole box.

2. Make sure that normals are correct. Check this by going to “Show Overlays” and enabling “Face Orientation”. If Everything is blue then move on to step 3.

• Fixing normals– select everything– go to edit mode– make sure everything is selected– use ALT + N– “Recalculate Outside”.
• If some are still red then you have to manually select the red ones and use “Flip”. (ALT + N)

3. Make sure there are no Doubles.

• Select everything– go to edit mode– make sure everything is selected– press M then click “By Distance”– open the little box on the left corner of the screen– set merge value to 0.00001 m

4. Make sure Object scale is set to 1 on XYZ.

• Select 1 object– use shortcut CTRL + A– click on “All Transforms”. Do the same for every object.

How are 3D map models made in Blender? Here is a step by step look. You find detailed blender modeling tutorial with videos and specific guidelines.

BLENDER MODELING TUTORIAL GENERAL GUIDELINES

Maintain a clean quad topology and keep poly count low, no need for edge beveling and subdivisions, when the situation does not require it.

The floor, outer walls, inner walls, details, locations, stairs, elevators, locations and greyed out areas must be separate objects, please do not combine them into one.

Its also recommended to group objects of the same kind and name them accordingly.

1. SETTING UP THE SCENE AND MODELLING REFERENCE

Before starting the model make sure you have references ready.

Create JPEG or PNG files from the reference DWG’s or pdf’s.

If the buildings have multiple floors, make sure that the images have the same dimensions and the floors align with each other.

1.1 SETTING UP THE SCENE

Start by setting up the folder system for the project and adding the reference images into this folder system, then prepare the scene for modelling by setting the units( make sure units are consistent throughout the project). We use SI units( metric units), usually meters.

Now you can either create the basemap itself first, based on the provided references or you can create a simple rough layout for the building placement and replace it with a basemap later, based on the provided DWG and pdf references. For following examples, I took the rough layout route. Make sure the rough layout texture has dimensions relative to the upcoming basemap and is placement is roughly the same as it is intended to be intended to be on the basemap.

Add a plane into the scene and make sure it is at center of the scene. I usually scale it larger, for the sole reason of dealing with numbers with less decimal spaces. It can be made larger by either adjusting measurements, scaling in object mode( after which I apply the scale for a clean model), or scale in edit mode.

Now apply material and name it basemap and apply either the ready made basemap or the rough layout texture.

From top view, add floor reference image as an reference image, and align it to the rough layout texture and hide the basemap from view.

2. STARTING THE MODEL

Start by creating the floor plane, begin with the area that is not aligned straight, rotate the plane in object mode, by doing so, there will be a local transform embedded into the object, it will make things easier later on (Do not extrude it thicker, if the z fighting makes it necessary that it can be done later, when the modelling is complete, the reason being that all cutting and editing operations are easier to do with a plane ), name it.

Select the border edge, extrude it, separate it into a new object, name it outer wall or (OW), clear out subdivisions for a lighter model.

Add solidify modifier( No need to apply it), and make sure the direction of thickness goes outward and even thickness is checked.

3. CREATING INNER WALLS

Select Outer wall, duplicate a face, and separate it into a new object, name it Inner wall or IW.

Adjust the modifier settings and object height for variety within the model (optional).

From top view and transparency on, select the vertices and extrude them to create corners.

For visibility, you can select edges and mark them sharp.

NB! Make sure that corner combines only two faces, for the solidify modifier to work smoothly.

Duplicate faces in edit mode for additional walls.

Make sure the walls align properly, by using snap settings and limiting transforms to global or local axis.

Make sure the solidify modifier thickness direction is consistent, change face normals (Alt+N) if not.

4. ORGANIZING SCENE

Create a new collection and name it Floor_0 or something of similar nature.

Select basemap mesh, outer wall, floor mesh, and inner walls and add them to the collection by manually dragging them there in the outliner, or by pressing M in the active view.

Create a new collection and name it reference, add reference image into that collection.

5. MAKING DOORS AND OPENINGS

Select the object (Inner wall or outer wall) and in edit mode use loop cut (Ctrl+R) to divide polygon where necessary, and use edge slide or regular transforming to move it to the right place.

Delete the polygon from between said edges.

With solidify modifier active and not applied, the new door opening will not affect the thickness of wall.

6. STAIRS AND ELEVATORS

No limitations besides low poly count.

Easiest way to populate the scene with stairs, elevators and escalators in to finalize one and then duplicate it.

Therefore make sure that the model is to your liking, it has material applied and when using textures, make sure the object has UV’s.

Add a collection into the floor_0 master collection and name it accordingly (stairs, elevators, escalators).

Make sure the object is within the collection, then duplicate it in object mode, use reference to place them.

7. NEW FLOOR

In the outliner, right click on the floor_0 collection and duplicate it, rename the duplicate into Floor_1 and for clarity I recommend to rename other collection within that as well.

In the outliner right click on the duplicated collection and select hierarchy.

Move it up on the z- axis so that the new floor sits directly atop the lower floor. It can be done either by constraining movement on the z axis and using snap settings, or by constraining movement to z axis and inputting the height of the object „Outer wall“( if you do not remember it then select the outer wall on the floor_0, go to edit mode and for example select one of the upper horizontal edges. Press N and look for the global position of the z axis).

Toggle of the visibility of floor_0 collection in the outliner and select the reference plane, select its object data properties panel and change the reference image from floor_0 to floor_1, if you set up the folders properly than the image should be in the same place.

Make the necessary changes and rebuild what must be rebuilt.

For example cutting in the openings for stairs and escalators etc. If quad topology was maintained then loop cuts work well.

Repeat for other floors.

8. EXPORTING

If the scene is organized then everything should be in right collections.

In the outliner, right click on the floor master collection (floor_0, floor_1…) and select hierarchy.

With the selection active, go to „file“, „export“ and then choose FBX format.

Check the box on „Selected objects“ and change scale value to 0.1.

Create a new folder into the folder system, name it export and add the date of export into the name. Whenever changes are made, create a new folder for the exported files.

Name the file and repeat with other floors.

When its necessary to share the whole project, pack all external data into the blender file from „File“, „External Data“.

Then zip and send the master folder of the whole project.

9. CREATING UV’S WITH MATCHED SCALE

Select floor meshes from all floor collections and isolate them with Shft+H (Alt+H to make everything visible again).

With active selection go to edit mode and make sure all faces are selected.

Open up UV editor split view and in 3D viewport go to top view.

With the selection active, press U while in viewport and select „project from view“.

Select and scale the UV’s if necessary.

In case textures need to be custom made in a another software, select one floor mesh, go to edit mode and select the faces in UV editor and export out the UV layout, it can be used for precise texturing. Repeat with other floors.

10. CLEANUP

Add a large cube to the scene and make sure it is in the overall scene collection, not in one of the floor collections.

Make sure all collections and objects are visible.

Select the cube and assign one of the dud duplicate materials to it.

With the cube selected, press Shft+L and select material, that selects all all objects with that material on it, press Shft+H to isolate selection.

Now apply the correct material to the cube.

Select all the objects with the dud duplicate material and then add cube to the selection, press Ctrl+L and select material. The last object in selection determines the material.

Number of material channels and their order is of importance in that operation. If objects with dud duplicates have multiple material channels and Cube has only one, then it changes only the first channel of the objects, if the cube has two then it changes two channels in the same order. Therefore if every object has only one channel, then it works smoothly, but if there are multiple channels and the dud duplicates are not in the same order then it requires some further steps- But in this case it is easier to change the dud duplicates manually on each object, after the selection step (step 4 of this tutorial).

When the changes are made, delete the cube.

On the top ribbon of outliner, navigate to „Orphan data“ and then click Purge.

Now duplicates have been removed from the scene.

As always we are pleased to help you for creating a wayfinding solution for you or your customer. If you like us to make the maps, please also look our floorplan campaign and don’t hesitate to contact us.

Our office was really crowded last week when we had visitors from Tartu Art School. More than 20 people who have just started their studies to become 3D modellers.

Tartu Art School is the only school in Estonia that teaches 3D modelling and visualization as a vocation. As a part of their curriculum the students visit different companies to see how their skills could be used in the future.

Since 3D models have such a big part in our work, it is also important for us to introduce our company to potential future employees or users of our app.

 

So we talked about what we do and how we do it and how students could use our product. 3D Wayfinder is currently used for mostly way-finding applications. But that doesn’t mean it couldn’t be used in variety of cases. It’s also perfect for presenting architectural models or – why not – make a virtual art gallery.

It is interesting and useful for us to see what kind of applications the students can find for 3D Wayfinder. So we can make it more flexible and beneficial for a wider range of customers.

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.

Until now all the materials in 3D Wayfinder have been replaced with each 3D model update. Now it is possible to keep the materials and their attributes’ values. This will save a lot of time, when creating a nice-looking 3D wayfinding application. See how to separating materials from geometry.

We have added a small feature to our 3D model converter. That enables to replace the 3D models without overwriting the materials. This means, that all the changes that were made in 3D Wayfinder for the purpose of tuning materials, are not lost when replacing 3D models. See it in user manual.

3D modelling software packages are different and the way 3D models are exported also varies. In most cases you need to change the color of the materials (diffuse and ambient color). After the creation of the model to get good looking 3D floor plans. We are now supporting specular shader, transparency etc. that might not come directly from the converted models. All these material attributes can be changed in 3D Wayfinder, but these values were replaced each time the geometry was updated. Now there is the option to keep the materials and their values, when replacing the 3D model.

At the same time we have added ambient attributes to each material when uploading the 3D model for the first time or when replacing the model. So there is no need to enter the “ambient” attribute anymore, just change the color.

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.

We have updated path finding functionality and path calculation. Now it is possible to change the weights of navigation nodes in 3D Wayfinder floor plan editor.

Path-finding application calculates automatically the shortest route from the starting node to the required location. In mobile applications, the Kiosk node can be your position inside the building. With 3D Wayfinder, the shortest route is calculated in a 3 dimensional room. It means the shortest path through all the floors.

Now it is possible to change the weights of the connection nodes. With this wayfinding application calculates optimal route, which doesn’t have to be the shortest. For example when you would like to guide your visitors to use the path inside the building instead of going around the building. Then you can set the weight for outdoor nodes higher. The weight is basically virtual length that will be added to the route, when passing the navigation node with a weight.

To use the weights you have to select the navigation node in 3D Wayfinder floor plan editor and change the node weight from the text box. By default all the weights are 0.

For example lets, say that waiting for the elevator takes usually 3 minutes. Lets assume, that visitors are moving with a speed of 3 km per hour, which is 50 meters per minute. So with waiting the elevator, visitor can pass 150 meters (3*50). If we would like to take account this in path calculation. Then we can add weight of 150 to the navigation node, that is marked as elevator.

Pathfinding functionality comes bundled in an add-on you can order from 3D Wayfinder Administration panel. It is also included in the Pro plan.

Read more about 3D Wayfinder’s path-finding capabilities.

Currently we are developing features to insert external 3D models to floor plans. With this it would be possible to add these “little details” (like escalators, benches, trees or even cars). That make the floor-plans look realistic. The best thing is, that it doesn’t require any 3D modelling skills. So all our users can detail the floor plans by themselves.

3D object library can be opened in Editor window with object thumbnails:

Added objects appear on the 3D scene. The good part here is, that the same model can be used inside the scene many times. Therefore it doesn’t increase the downloadable model sizes as each model will be loaded only once.

3D models to floor plans can be resized and moved inside the 3D Wayfinder.

With external 3D models. We will definitely provide common library of models we are using to detail the floor plans. For example these will include trees, cars, different indoor plants, escalators, tables, stairs and so on. See our user manual.

Now the JSON 3D model formats are also implemented in 3D Wayfinder. This gives us better browser-side loading time as browsers’ native JSON parser is faster, than parsing binary models in Javascript. The average gain in loading time is 55%, which means that 3D Wayfinder is loading more than 2 as fast as before.

Below are testing results with 2 different project. It seems, that the improvement affects more larger projects.
We have made a minor change in loading logic also. Now the application will render the 3D models before all the textures are downloaded. Textures will appear as they are loaded. This allows to start using 3D wayfinder as soon as the 3D model files have been loaded.

Here are the initial test results for 2 projects:

1. Project: demo
———————————————–

Project statistics:
Visible faces (opaque/transparent): 5653/646
Visible renderers (opaque/transparent): 10/24
Visible batches (opaque/transparent): 10/4

Total geometry loading time (measured by floors):
Binary format: 1666.570ms + 1941.258ms = 3607.828ms
JSON format: 846.446ms + 945.121ms = 1791.567ms

Loading times without network transfer time:
Binary format: 1211.667ms + 1149.466ms = 2361.133ms
JSON format: 46.198ms + 31.087ms = 77.285ms

2. Project: Large customer project
———————————————–

Project statistics:
Visible faces (opaque/transparent): 229533/6459
Visible renderers (opaque/transparent): 629/13
Visible batches (opaque/transparent): 49/13

Total geometry loading time (measured by floors):
Binary format: 23673.256ms + 13435.160ms + 4924.420ms = 42032.836ms
JSON format: 10225.722ms + 2929.486ms + 3642.354ms = 16797.562ms

Loading times without network transfer time:
Binary format: 20016.574ms + 11549.349ms + 3087.721ms = 34653.644ms
JSON format: 226.997ms + 136.840ms + 70.465ms = 434.302

JSON model specifications can be found from FRAK Github repository.

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.