{"type":"doc","content":[{"type":"paragraph","content":[{"text":"In this tutorial, you will learn the basics of the Graphics Gallery file by importing graphical assets that were created by 3D artists. These graphical assets must be created in an external 3D modeling software using the Vortex® 3D modeling guidelines to be divided into logical parts based on their expected mechanical behavior.","type":"text"}]},{"type":"paragraph","content":[{"text":"Via the ","type":"text"},{"text":"Graphics Gallery","type":"text","marks":[{"type":"link","attrs":{"href":"/wiki/spaces/VSD2404/pages/3574538017"}}]},{"text":", you will link textures and graphics materials, and assign lighting properties to the model. In the suggested Vortex workflow, these steps are usually done by the 3D artists themselves; instead of providing just the 3D model, the 3D artists will deliver a Graphics Gallery containing a model that has already been adjusted, lit, renamed, and is ready to use as the basis for a mechanism.","type":"text"}]},{"type":"paragraph","content":[{"text":"You will start from an existing graphical asset from the Vortex Studio Demo Scenes installation directory. The default location is ","type":"text"},{"text":"C:\\CM Labs\\Vortex Studio Content \\Demo Scenes\\Equipment\\Buoy\\Graphic\\Buoy.dae","type":"text","marks":[{"type":"code"}]},{"text":" where ","type":"text"},{"text":"","type":"text","marks":[{"type":"code"}]},{"text":" is the current version installed.","type":"text"}]},{"type":"paragraph","content":[{"text":"For additional reading on Graphics Galleries, click ","type":"text"},{"text":"here","type":"text","marks":[{"type":"link","attrs":{"href":"/wiki/spaces/VSD2404/pages/3574538017"}}]},{"text":".","type":"text"}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Prerequisites","type":"text"}]},{"type":"paragraph","content":[{"text":"You need to have Vortex® Studio and the Vortex Studio Demo Scenes installed to be able to follow all steps in this tutorial.","type":"text"}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Import Graphical Assets","type":"text"}]},{"type":"paragraph","content":[{"text":"In this step, we will import an existing 3D model into the Vortex Studio Editor via a Graphics Gallery file.","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"From the Home screen, create a new Graphics Gallery by clicking the Graphics Gallery button.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Select Gallery in the Explorer panel on the left of the screen, then either:","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Press ","type":"text"},{"text":"F2","type":"text","marks":[{"type":"strong"}]},{"text":" for editing mode, edit the name to Buoy and press Enter to confirm.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Click ","type":"text"},{"text":"Edit","type":"text","marks":[{"type":"strong"}]},{"text":" at the top of the Properties panel at the right of the screen, change the name in the dialog box, and press ","type":"text"},{"text":"OK","type":"text","marks":[{"type":"strong"}]},{"text":".","type":"text"}]}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Double-click ","type":"text"},{"text":"3D Models...","type":"text","marks":[{"type":"strong"}]},{"text":" in the Toolbox. In the resulting panel, locate ","type":"text"},{"text":"Buoy.dae","type":"text","marks":[{"type":"code"}]},{"text":" and click ","type":"text"},{"text":"Ok","type":"text","marks":[{"type":"strong"}]},{"text":".","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"You should see the buoy model in the center of the viewport. Zoom and move around the 3D view by scrolling the mouse wheel, and by holding down the mouse wheel and moving the mouse.","type":"text"},{"type":"hardBreak"}]},{"type":"mediaSingle","attrs":{"layout":"align-start","width":66.0},"content":[{"type":"media","attrs":{"width":1280,"id":"c76fafc6-bd1e-415d-9847-2389064ae450","collection":"contentId-3574537799","type":"file","height":693}}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"In the Explorer panel, you will find the 3D model within a Graphics Gallery that can be opened via the small triangle on the left. Doing so reveals these components:","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Graphics Nodes: Each node contains a number of inputs and outputs, including visibility, transforms, etc. A node can have a graphics geometry and a graphics material, or neither.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Graphics Geometries: This folder contains the 3D meshes of the model.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Graphics Materials: This folder contains the graphics materials of the model.","type":"text"}]}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Save","type":"text","marks":[{"type":"strong"}]},{"text":" the Graphics Gallery file by clicking the Save icon.","type":"text"}]}]}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Clean Up Graphics Node Hierarchies","type":"text"}]},{"type":"paragraph","content":[{"text":"In this step, we will inspect the graphics nodes' hierarchy to ensure we only keep the nodes we need for building the simulation.","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Right-click on a node in the ","type":"text"},{"text":"Explorer","type":"text","marks":[{"type":"strong"}]},{"text":" panel to expand or contract the graphics nodes' hierarchy with the various ","type":"text"},{"text":"Expand/Expand All/Collapse","type":"text","marks":[{"type":"em"}]},{"text":" commands.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"By right-clicking on a node (in the Explorer or viewport), use the ","type":"text"},{"text":"Hide/Show","type":"text","marks":[{"type":"em"}]},{"text":" commands to examine the model. Eliminate parts that are not useful (cables, piping, small bolts, etc.) or that will be hidden (internal parts).","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Right-click on the Graphics Gallery in the Explorer panel and use ","type":"text"},{"text":"Remove Orphans","type":"text","marks":[{"type":"strong"}]},{"text":" to eliminate leftovers (meshes, materials, and textures). Look over the list and press Enter to confirm.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"See if any node is missing both graphics geometry and graphics material. They can often be eliminated, unless they are needed to apply a specific transform. If you need to delete a node:","type":"text"},{"type":"hardBreak"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Make sure the transform is preserved by its children (use the Move tool to display it, then right-click and select ","type":"text"},{"text":"Bake Graphics Node","type":"text","marks":[{"type":"strong"}]},{"text":" on the child node).","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Make sure to move out any child node from underneath its parent (otherwise, they will be deleted, too) by dragging it to its new location. Connections are automatically made.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Delete the empty node. ","type":"text"}]}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Use ","type":"text"},{"text":"Remove Orphans","type":"text","marks":[{"type":"strong"}]},{"text":" to eliminate leftovers.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Use the Hide/Show commands to examine the model. If nodes can be merged into one (e.g., bolts on a wheel), select the nodes with Ctrl + left mouse button. ","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Right-click and select ","type":"text"},{"text":"Merge Graphics Nodes","type":"text","marks":[{"type":"strong"}]},{"text":".","type":"text"}]},{"type":"paragraph","content":[{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"__confluenceADFMigrationUnsupportedContentInternalExtension__","text":"","parameters":{"cxhtml":"

Nodes can only be merged if they have the same graphics material.

","block-inline":true,"nestedContent":{"type":"doc","content":[{"type":"panel","attrs":{"panelType":"warning"},"content":[{"type":"paragraph","content":[{"text":"Nodes can only be merged if they have the same graphics material.","type":"text"}]}]}],"version":1},"reason":"A note macro in a list item can't be created or edited in the new editor."}}}]},{"type":"paragraph","content":[{"type":"hardBreak"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Rename","type":"text","marks":[{"type":"strong"}]},{"text":" the new merged part for clarity. ","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Use ","type":"text"},{"text":"Remove Orphans","type":"text","marks":[{"type":"strong"}]},{"text":" to eliminate leftovers.","type":"text"}]}]}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Import Textures","type":"text"}]},{"type":"panel","attrs":{"panelType":"warning"},"content":[{"type":"paragraph","content":[{"text":"Textures assigned to the 3D model will normally be imported with it, though sometimes you may need to change them, or add some more.","type":"text"}]}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"From the Toolbox, double-click ","type":"text"},{"text":"Texture","type":"text","marks":[{"type":"strong"}]},{"text":".","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"From the Demo Scenes folder mentioned above (default location is ","type":"text"},{"text":"C:\\CM Labs\\Vortex Studio Content \\Demo Scenes\\Equipment\\Buoy\\Graphic\\Buoy.dae)","type":"text","marks":[{"type":"code"}]},{"text":", locate the image files using the browser. Load these textures.","type":"text"},{"type":"hardBreak"}]},{"type":"mediaSingle","attrs":{"layout":"align-start","width":66.0},"content":[{"type":"media","attrs":{"width":1280,"id":"5456c7b2-0131-4747-a82c-3bcb0118f87e","collection":"contentId-3574537799","type":"file","height":693}}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"From the Toolbox, double-click ","type":"text"},{"text":"Material","type":"text","marks":[{"type":"strong"}]},{"text":". In the Explorer, select the new graphics material.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"In the Properties panel, open the desired channel with the small triangle besides its name.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Add a layer with the ","type":"text"},{"text":"+","type":"text","marks":[{"type":"strong"}]},{"text":" button, then match the loaded textures with their proper texture field by clicking on the ","type":"text"},{"text":"...","type":"text","marks":[{"type":"strong"}]},{"text":" button. A dialog box appears. The textures and their fields are:","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Occlusion: Ao_uv1","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Albedo: BL_Ft_pbr_albedo1k","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Specular: BL_Ft_pbr_specular1k","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Gloss: BL_Ft_pbr_gloss512","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Normal: BL_Ft_pbr_normal","type":"text"}]}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Locate the desired texture in the Explorer panel and click on it. Click check mark to confirm.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Repeat to link the other textures.","type":"text"}]}]}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Check Textures and Adapt UV","type":"text"}]},{"type":"paragraph","content":[{"text":"In this step, we will make sure the textures are properly placed and set to the right UV. For the buoy model, we need the ambient occlusion texture to be on its own UV set.","type":"text"}]},{"type":"panel","attrs":{"panelType":"warning"},"content":[{"type":"heading","attrs":{"level":3},"content":[{"text":"Additional Information","type":"text"}]},{"type":"paragraph","content":[{"text":"UV mapping","type":"text","marks":[{"type":"underline"}]},{"text":" is the ","type":"text","marks":[{"type":"textColor","attrs":{"color":"#202122"}}]},{"text":"3D modeling","type":"text"},{"text":" process of projecting a 2D image to a 3D model's surface. The letters \"U\" and \"V\" denote the axes of the 2D texture. The UV mapping process involves assigning pixels in the 2D image to surface mappings on the 3D polygon.","type":"text","marks":[{"type":"textColor","attrs":{"color":"#202122"}}]}]}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"In the Explorer panel, locate the ambient occlusion texture (","type":"text"},{"text":"Ao_uv1","type":"text","marks":[{"type":"code"}]},{"text":").","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"In the Inputs section, change the UV Set to 1.","type":"text"},{"type":"hardBreak"}]},{"type":"mediaSingle","attrs":{"layout":"align-start","width":66.0},"content":[{"type":"media","attrs":{"width":1280,"id":"c1d962f9-c642-44a6-a1c3-6227b7e309a0","collection":"contentId-3574537799","type":"file","height":693}}]}]}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Check Model with Environment","type":"text"}]},{"type":"paragraph","content":[{"text":"In this step, we will activate the daylight feature and see how our model will appear in the simulation.","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Select the BL node in the Explorer panel.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"In its Properties panel, click \"","type":"text"},{"text":"...","type":"text","marks":[{"type":"strong"}]},{"text":"\" in the Graphics Material field.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"In the resulting panel, select the new material you created. Click the check mark to confirm. The material is now applied to the model.","type":"text"},{"type":"hardBreak"}]},{"type":"mediaSingle","attrs":{"layout":"align-start","width":66.0},"content":[{"type":"media","attrs":{"width":1280,"id":"f2cb02c7-b15c-4877-90f0-2f55aef36ef2","collection":"contentId-3574537799","type":"file","height":693}}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Click the ","type":"text"},{"text":"Daylight","type":"text","marks":[{"type":"strong"}]},{"text":" button at the top-right of the 3D View. Use the associated slider to change the time of day.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Go back to each graphics material and change the values to adjust how the object responds to light.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"In the Inputs section, select ","type":"text"},{"text":"Environment Reflection","type":"text","marks":[{"type":"strong"}]},{"text":". You can deactivate this feature if it affects the frame rate too much.","type":"text"},{"type":"hardBreak"}]},{"type":"mediaSingle","attrs":{"layout":"align-start","width":66.0},"content":[{"type":"media","attrs":{"width":1280,"id":"7aec571f-4ff7-4708-bc50-6855639f5080","collection":"contentId-3574537799","type":"file","height":693}}]}]}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Clean Up the Graphics Gallery","type":"text"}]},{"type":"paragraph","content":[{"text":"In this step, we will clean-up our file names and structure to give more order to the model; this will make it easier to read by other users.","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"If it has not already been done by the 3D artist, the textures should be renamed for clarity according to a pre-set nomenclature.","type":"text"}]},{"type":"paragraph","content":[{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"__confluenceADFMigrationUnsupportedContentInternalExtension__","text":"","parameters":{"cxhtml":"

We suggest the following format:
<name>_<texture use>_<resolution> (for example, BL_Ft_pbr_albedo_1k).

","block-inline":true,"nestedContent":{"type":"doc","content":[{"type":"panel","attrs":{"panelType":"warning"},"content":[{"type":"paragraph","content":[{"text":"We suggest the following format: ","type":"text"},{"type":"hardBreak"},{"text":"__","type":"text","marks":[{"type":"code"}]},{"text":" (for example, ","type":"text"},{"text":"BL_Ft_pbr_albedo_1k","type":"text","marks":[{"type":"code"}]},{"text":").","type":"text"}]}]}],"version":1},"reason":"A note macro in a list item can't be created or edited in the new editor."}}}]},{"type":"paragraph","content":[{"type":"hardBreak"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Make sure the name of each ","type":"text"},{"text":"material","type":"text","marks":[{"type":"em"}]},{"text":" accurately reflects its use.","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Add the ","type":"text"},{"text":"_mat","type":"text","marks":[{"type":"code"}]},{"text":" suffix to make its nature obvious to other users.","type":"text"}]}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Make sure the name of each ","type":"text"},{"text":"geometry","type":"text","marks":[{"type":"em"}]},{"text":" accurately reflects its use.","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Add the ","type":"text"},{"text":"_geo","type":"text","marks":[{"type":"code"}]},{"text":" suffix to make its nature obvious to other users.","type":"text"}]}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Every mesh and material should be located in the folder for that type. Drag any that aren't into the correct folder.","type":"text"}]}]}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"End Result","type":"text"}]},{"type":"paragraph","content":[{"text":"All textures and UVs are combined. We see that the contour is a texture that distorts the volume (normal map) and the ambient occlusion on a different UV set creates the suggestion of volume.","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"align-start","width":696,"widthType":"pixel"},"content":[{"type":"media","attrs":{"width":988,"id":"15dc27f0-846f-494d-84b3-3736c6fcf8d0","collection":"contentId-3574537799","type":"file","height":429}}]},{"type":"paragraph","content":[{"type":"hardBreak"}]},{"type":"paragraph","content":[{"type":"hardBreak"}]}],"version":1}

Browser not supported