User interface ============== Overview -------- Material Maker mainly consists of 3 panes: * The top left pane is the library, that contains all available nodes that can be used to create materials. Library items are shown in a tree view * The bottom left pane is the preview, that shows at the same time the current material applied to a sample mesh in a sample environment, and the texture generated by the currently selected node * The right pane contains the graph editors where materials are described for current projects First steps with the user interface ----------------------------------- When opening Material Maker, a new empty project is created and shown in the right pane. An empty project simply consists of a material node where textures for all elements of the material should be connected. To create a new node, simply choose one (for example "bricks") from the library (the top left pane) and drag it into the graph editor. Depending on the selected library item, a preview or a simple description will be displayed while dragging. .. image:: images/create_node.gif :align: center Selecting this new node (by clicking on it) shows it in the preview pane. The very small 2d preview of the preview pane can be maximized by double clicking on it. This will hide the 3d preview but is useful when working on the different textures of the material. To connect a node output to an input of another node, simply drag one to the other. For example we can drag the first output of the Bricks node to the albedo input of the Materials node. This will automatically assign the simple Bricks texture to the albedo element of the material, and the 3d preview will immediately be updated (if you maximized the 2d preview it can be minimized by double-clicking on it again). Nodes can also be disconnected by dragging a connected input away from its node. .. image:: images/connect_nodes.gif :align: center Nodes can easily be configured by modifying their parameters, and previews are updated automatically. Since each input can be connected to a single output, reconnecting an input will automatically remove the previous connection. Graph pane ---------- The graph pane is where materials can be edited, by adding and configuring nodes, and connecting them. .. image:: images/graph_pane.png :align: center Grid and zoom ^^^^^^^^^^^^^ .. |zoom_out_button| image:: images/zoom_out_button.png .. |zoom_reset_button| image:: images/zoom_reset_button.png .. |zoom_in_button| image:: images/zoom_in_button.png .. |grid_button| image:: images/grid_button.png In the top left corner of the graph pane, the following buttons can be used to modify the zoom level and configure the grid: * the |zoom_out_button| button zooms out. * the |zoom_reset_button| button resets the zoom factor. * the |zoom_in_button| button zooms in. * the |grid_button| button toggles the grid. When moved, nodes will stick to the grid when it is active. The grid size can be modified using the spinbox next to the grid button The view can be centered using the **View -> Center view** menu item or the **C** shortcut, and the zoom factor can be reset using the **View -> Reset zoom** menu item or the **Alt-0** shortcut. Material navigation ^^^^^^^^^^^^^^^^^^^ .. |graph_navigation_button| image:: images/graph_navigation_button.png .. |group_randomness_button| image:: images/group_randomness_button.png .. |graph_up_button| image:: images/graph_up_button.png In the top right corner of the graph pane, the graph navigation button |graph_navigation_button| can be used to show a tree view of the material. Double clicking on an item in this tree will show it in the graph view. When a subgraph is shown in the graph pane, additional items are visible in the top right corner: * a text entry shows the name of the subgraph and can be used to modify it. * a |group_randomness_button| button to decide if the current subgraph transmits its random seed to its children. * a |graph_up_button| button to move to the parent of the currently shown subgraph. Selecting and copying nodes ^^^^^^^^^^^^^^^^^^^^^^^^^^^ Clicking on the title bar of a node will select it. Selecting a node will show its first output (if any) in the 2D preview. It is possible to select several nodes by holding the **Control** key while selecting. Selected nodes can be copied using the **Edit -> Copy** menu or the **Control+C** keyboard shortcut. They can also be cut using the **Edit -> Cut** menu entry or the **Control+X** shortcut. Both operations store the selected nodes and their interconnections in the clipboard. Note that the format used is JSON, and nodes or group of nodes can easily be shared using this format. The contents of the clipboard can be pasted into a graph using the **Edit -> Paste** menu or the **Control+V** keyboard shortcut. Library pane ------------ The library pane shows all nodes defined in both base and user libraries in a tree view. The base library is provided with Material Maker and the nodes it contains are documented in this manual. The user library contains all nodes that were added using the **Tools -> Add selected node to user library** menu item. The filter field above the library tree can be used to quickly find a specific node. The tree will be updated whenever the filter string is modified. It is possible to give focus to the search field using the **Control+F** keyboard shortcut. .. image:: images/library_filter.gif :align: center Preview pane ------------ The preview pane shows a 3D preview of the material, and a 2D preview of the first output of the selected node. .. image:: images/preview.png :align: center The left select button can be used to select a model for the 3D preview, and the second one provides different environments. The **R** button can be used to start and stop the object's rotation animation. Pressing the **O** button will show the 3D preview as background of the graph pane. In the 3d view, the object can be rotated about the yaw and the pitch axes (from the camera's point of view) by holding the right mouse button and moving the mouse horizontally or vertically. The object can also be rotated about the roll axis by holding Shift and and the right mouse button and moving the mouse horizontally. Holding the left mouse button will rotate the camera while the object remains static. Rotating the object or the camera will automatically disable the object's rotate animation. The mouse wheel can be used to move the camera along its longitudinal axis (hense zooming forward or backward). Clicking on the 2D preview will minimize or maximize it. Main menu --------- The main menu is organized in 4 sections: * the *File* menu contains actions to create, load, save and export materials * the *Edit* menu has common edit actions cut, copy and paste * the *Tools* menu has actions to add items to the user library * the *Help* menu can be used to find more information and submit feedback about the software File menu ^^^^^^^^^ * *New material* creates a new material and opens a tab in the right pane to edit it * *Load material* opens a file dialog to select a procedural material (.ptex) file. If a material file is selected, it will be open in a new tab in the right pane. If the current tab contains an empty material (about material that only consists of a Material node), the material will be loaded into this tab. * *Save material* saves the current material. If it was not previously saved, a file dialog will be displayed to select a location and file name. * *Save material as* prompts for a location and file name and saves the current material. * *Save all materials* saves all currently open materials. Materials that were already saved are ignored. * *Export material* generates PNG image files for all elements of the material. File names are defined using the path of the **.ptex** material file and their role (albedo, emission...) in the material. The Ambient occlusion, roughness and metallic textures are saved into a single file whose suffix is **orm**. If the material contains **export** nodes, their textures will be exported as well. * *Close material* closes the current material. * *Quit* closes the software. Edit menu ^^^^^^^^^ * *Cut* Copies the selected nodes to the clipboard and removes them from the current material. * *Copy* Copies the selected nodes to the clipboard * *Paste* Copies the clipboard into the current material. Note that the nodes will be added to the center of the view, so it is advised to scroll to the correct location before pasting. Pasting also unselects all previously selected nodes and selects all newly created nodes, so they can easily be moved around. View menu ^^^^^^^^^ * *Center view* Centers the current material graph view * *Reset zoom* Resets the zoom level of the current material graph view Tools menu ^^^^^^^^^^ * The *Create* submenu can be used to create any of the node templates. * *Create group* creates a subgraph node with the currently selected nodes, and shows the contents of the newly created group in the current graph view. * the *Make selected nodes editable* menu item will toggle edit mode for all selected nodes that support it. Shader and graph nodes will show 3 buttons to edit, load and save the node, switches will show controls to modify the number of choices and outputs, and input/output modes will become editable. * *Add selected node to user library* first prompts for an item name. If a name is entered and confirmed, the selected nodes in the current material will be added to the user library under that name. The user library is saved automatically. * *Export the nodes library* will prompt for a location on the disk and save the whole node library. Help menu ^^^^^^^^^ * *User manual* opens an external web browser to show this manual * *Show selected library item documentation* opens an external web browser to show documentation from the User Manual for the current library item * *Report a bug* opens a web browser on the Issues page of Material Maker's GitHub project. Please do not hesitate to use it to suggest improvements for Material Maker. * *About* Shows the about dialog.