Example1

The IG.Creator is located under: https://3d.intelligentgraphics.biz/creator/Default.aspx Ask the admin for Login credentials and fill the mask

• Domain: In this case, usually it is the name of a supplyer or IG.
• Subdomain: Each supplyer has different models that needs data creation. They are inserted here or Basics
  • Subdomain Basics: In case of a project workflow a Basics subdomain exists. Inside Basics generall stuff, like shared assets or scripts is stored

Together Domain and Subdomain build a workspace, that is usually communicated as Domain.Subdomain. Ask the admin for workspaces.

After filling the mask, click connect to connetct into a workspace.

The next page will be the Products page:

This side has an overview of all available products of a supplyer. In case starting with a new workspace it is initially empty. To learn more about the Products page, check its Wiki page!

In case starting with a new empty workspace usually it is necessary to enable some features in case they are not available now.

• Endable adding new products
  • Switch to the Settings page, by navigating with the side bar on the left side and choose the tab Advanced
  • On the right hand side check the Editable checkbox

Go back to the Products page and notice the New button on the top right corner. Click it and fill the mask.

Apply the new created product with Update.

In case the list was empty at the beginning, now the Cube should appeare there. In case the list was allready filled the Cube is sorted somewhere in the tabel. In this case search for it.

Notice, when ever creating a new product its State starts with New to have an overview of the current working state, this can be changed every time.

Not changeable is the name of the created product. In case the name needs to be changed, a new product needs to be created and the old one needs to be deleted.

As next, lets check what the product Cube looks like at this state.

Select the line with the Cube product and click Configurator.

The Cube is initially structurless, so from the shown dialoge choose either Empty or select an other product that should be cloned. Press the Create/Clone the Product button to continue.

After creating a structure for the Cube the next page that appeares is the Configurator page. Check its Wiki page to learn more.

Click Update to update the 3D view

After this, nothing will happen in the 3D View! But, notice the window below, it will show a log message.

At this point only an empty structure for the product was created. There is no (3D) content defined now!

First of all, make sure the Assets/Geometries page is having some geometries, otherwise upload one manually.

For uploading a new geometry, use this one: unitcube.zip

After ensuring a geometry is available this one will be added to the Cube product. Go back to the Products page and make sure the Cube is still selected. From this, go to the Products/Graphical page.

Fill in the maks as shown and Apply.

Step next to the Products/Graphical/Configurator and press the Update button again.

Notice the wire structure in the 3D view. But it doesn't look like a cube. When rotating the view, this wire will become a wire cube. This is because, there is no material assigned.

Next step, make sure under the Assets/Materials page there exist some materials,otherwise create a simple one.

After this, switch to the Products/Graphical page (make sure the Cube product was selected). Search for the Material section on this page and search for a Material and in Category, choose one from the drop down menu. To confirm the assigned material, click Apply.

Notice the material has a @ as prefix. It is added, so that the IG.Creatir can identify this as a material.

Switch to the Products/Graphical/Configurator page and press Update. In the 3D view a red cube is generated.

This is a more advanced tutorial serie. In case being a newbe, first follow this tutorial!

Use these geometries to follow the tutorial: chair.zip

At the Products page create a new product called Chair. Select the Chair product, click Configurator on the bottom of the page and create a new Empty.

Switch to the Products/Graphical page to build up the structure. At the top, press Add Child to create a child node named Chair.o1.

In the Description field below, type in SeatElements.This node will cover the seat and the seat back geometries.

Press the Add Child button again, to get the child node of the seat → Chair.o1.o1. As Description type in Seat.

For the seat node, add the seat geometry and a material. Apply both.

Scroll up and add a sibling to the seat node. As Description type in SeatBack.

Apply the seat back geometry and a material to this node, too.

Now, add a node Chair.o2. For this press the Up button till node Chair.o1 is displayed (SeatElements).

Create a sibling FootElements. Create a child FootBack and add a geometry and a material for this.

In this case, the feets have black plastic elements for the ground. So, add an other child withe the Description FootBack_Black and assign a geometry and material.

In the structure move up to the FootElements node. Add the front feet with the same schema.

Go to the Products/Graphical/Configurator page and press the Update button. Inside the 3D view the created chair should look like this:

The presentation isn't right bacause:

• The geometries origins are at the left, back, lower corner
• The geometries don't get a position.

Now, go back to the Products/Graphical page and set the position for each geometry. Note, it is quiet time consuming to naviagate through the product nodes. It is also confusing to navigate in this visualisation. There is a clearer visualisation for this.

Go to the Products/Graphical/Structure page.

This is an hierachically overview of the created nodes. On the left side the node tree can filters the listed nodes. For more information on this page, check the wiki

Choose the SeatElements node and click Edit. For Pos Y type in a height of0.417. Click Update to confirm.

This lifts the seat and seat back elements. Correct the positions for all chair parts.

A red chair is possible but not common. Next change the material to a wooden (oak) one.Create one if necessary. Use this texture:oak.tex.zip

Also, check if a simple black material exists or create one.

When both materials exist, go to Products/Graphical/Material. For more information on this page, see the Wiki

Click Edit and change the material for the geometries according to the image below.

Go back to the Producs/Graphical/Configurator page and checking the result, it should look similar like this.

To configure a chair, commercial data are needed. This data can come from different sources. For this tutorial, a set of own properties is created.

This part extends the above described section of the Chair. It will add a property to change the material of the seat. Make sure on the Settings page the workspace settings are set up as following:

Also if switching the mode to SimpleCom make sure to click “connect”. Changing the dropdown value is not enough. If you are not using a contect script make also sure the “Advanced”→“Commercial context” ist set to “NoContext”.

As first the Chair should get a property to switch the material. There for go to the Assets/Commercial page. For more information on this page, check its Wiki.

On the left side, all the available products are listed, in the middle, all available properties for this workspace are listed and on the right side all available properties for this workspace are listed.

To create a new property, click the New button in the middle and fill the mask as shown:

The Id is the displayed name, the Property UL is a description. Confirm the property with Update.

Next the created property needs some values. On the right side click New. Fill the mask:

The Id is the value (e.g. Red material). In case using an other material, make sure to type in the name from the Assets/Matterials page. Otherwise it will not be linked later in this tutorial. The Value UL is the description.

Next step is to link the new created property, the value and the product.

For this, select the product Chair from the left list. Then select the property from the middle list and click Edit. Click the checkbox next to Active and confirm with Update.

Now make sure the Chair and the property are selected both. Next select the new created value on the right side and click Edit. Click the Active checkbox, too and confirm with Update.

Switch to the Products/Graphical/Configurator page. Click the Configure and Update button. The chair appeares as usual, but nothing else happens.

Befor the configuration options are shown in the Configurator, a last step needs to be done. Go to the Products/Commercial page and add the created property here. For more information, see the Wiki page.

As Type choose Material and as Default choose Oak. Confirm with Update.

Go back to the Producs/Graphical/Configurator page and click Configure again. The created property appeares, now. Click on the propery name, on the left side, the value of the property appeares, too.

By clicking on the the material property and updating the 3D view, nothing happens!

This is because the current material is still assigned as fix material. Switch to the Products/Graphical/Material page.

To change this and use the new property, click Edit for the Seat node (o1.o1). In Material Category type in DefaultMaterial and confirm.

Go back to the Configurator page and click Configure and Update. Now the seat is allready red not brown any more, but as configuration, nothing is selected.

There is missing an other part, a Material Category.

To create a Material Category go to the Assets/Materials/Categories page and create a new category. As default value choose Oak.

After this, go to the Products/Commercial page and add this material categroy to the DefaultMaterial Also go to Products/Graphical/Material and change it as shown below.

Notice in both case the assigned material categroy is without @!

Go back to the Configurator page. Click Configure and than Update. Initially the chair is colored oak. Now now from the configuration table, choose the created property and the value. Click Update and see how the seat will change its color.

Unfortunally the color cannot be changed back to oak. For this add a second color Oak to the properties list. Go to Assets/Commercial and add an other color to the right side. Assign it to the material property.

Go back to the Configurator and click Configure. The material property should have two values now.

With this it is now possible to change between two materials.

Now, this Material Category can be assigned to differen geometies as well. As an exercise, create more materials, material categories and other properties to change the materials of differen parts.

This section will teach how to change geometries inside the IG.Creator. For this the seat back geometries of the chair will be changed. Make sure having two seat back geometries for the chair or upload some.

Next go to the Assets/Commercial page and create a new property with two values. Make sure the values Id fit the created geometry names. Assign the property to the Chair.

Go to the Products/Graphical/Configurator page and click Configure. A second property for the seat backs will appear.

For now the new property hasn't any influence on the 3D model. For this, two more steps are needed.

• Update the hierarchical structure
• Create a new property under Products/Commercial

For updating the hierarchical structure got to the Products/Graphical/Structure page. Next to the SeatBack node there needs to be an additional node for the other seat back type.

Select the SeatBack line and press the right mouse button. Add two child elements. The result should look like this:

Name the Description of the new nodes SeatBack_A and SeatBack_B. The new nodes will not get a positioon, they inheriate it from the prarent node o1.o2

As next, go to the Products/Graphical/Geometry page and remove the geometry from node o1.o2.

Add the geometries SeatBack_A and SeatBack_B to the nodes o1.o2.o1 and o1.o2.o2.

For checking, put SeatBack_B a little bit higher as SeatBack_A and go back to the Configurator.

The next step is to hide either SeatBack_A or SeatBack_B. For this, a new property needs to be linked to the geometries. This is done like it has been done with the material befor. Go to Products/Commercial and create a new commercial property. In case testing the new property inside the Configurator the result is: Nothing has changed. This is because the geometries itself are not connected to the created property yet.

Go to Products/Graphical/Structure to link the property and the geometries. Have a close look at the table. There should be a column called Visible.

Take the line with SeatBack_A and for the visibility write: {ComSeatBack==='SeatBack_A'}

This expression is a JavaScript code snippet. Each JavaScript code snippet is written between {}. ComSeatBack is the property created under Products/Commercial. But when using it inside the node structure is gets the prefix Com. SeatBack_A is the name of the geometry. Notice strings are written in '' not ““ !

Because Visible column is asking for a boolean, this line is evaluatoed as If-statement. Make SeatBack_B configuratable as well and reset the position, so it has the same position like SeatBack_A. Test it in the Configurator.

With this, it is possible to configure the seatback with in two differen variations.

As an exercice, add more properties that changes a part of the chair, e.g. the seat or the legs.