{"id":619,"date":"2018-10-15T14:41:40","date_gmt":"2018-10-15T13:41:40","guid":{"rendered":"https:\/\/www.katsbits.com\/codex\/?p=619"},"modified":"2023-09-07T15:53:45","modified_gmt":"2023-09-07T14:53:45","slug":"material-basics","status":"publish","type":"post","link":"https:\/\/www.katsbits.com\/codex\/material-basics\/","title":{"rendered":"Material Basics (nodes)"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_83 counter-hierarchy ez-toc-counter ez-toc-light-blue ez-toc-container-direction\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<label for=\"ez-toc-cssicon-toggle-item-6a15b59b82116\" class=\"ez-toc-cssicon-toggle-label\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/label><input type=\"checkbox\"  id=\"ez-toc-cssicon-toggle-item-6a15b59b82116\"  aria-label=\"Toggle\" \/><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.katsbits.com\/codex\/material-basics\/#summary\" >Summary<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.katsbits.com\/codex\/material-basics\/#blender-render-vs-nodes\" >Blender Render vs Nodes<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.katsbits.com\/codex\/material-basics\/#basic-material-node-tree\" >Basic Material Node Tree<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.katsbits.com\/codex\/material-basics\/#blender-render-style-material\" >Blender Render Style Material<\/a><\/li><\/ul><\/nav><\/div>\n<p>In line with general updates to newer versions of Blender 2.8+\/2.9+ real-time and off-line rendering systems, Blender Render or Blender Internal style materials, those otherwise available in Blender 2.79 or below, are obsolete and superseded by <b>Nodes<\/b>.<\/p>\n<blockquote style=\"background-color: #fc0; color: #000;\"><p><b>Important<\/b>: For newer versions of Blender post Blender 2.8+, <b>Blender Render<\/b> and <b>Blender Game<\/b> engine materials are obsolete. As a consequence all such non-node based materials will need to be <a href=\"https:\/\/www.katsbits.com\/codex\/old\/\">rebuilt, converted or re-established<\/a> to work correctly (some node-based material settings may also require modification).<\/p>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/blender-render-game-materials.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 98.5%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/blender-render-game-materials.jpg\" alt=\"Blender Render materials in Blender 2.79\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/no-textures.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 98.5%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/no-textures.jpg\" alt=\"Blender Render material in Blender 2.8+\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>Blender Render and Blender Game style materials (image top) are obsolete in newer versions of Blender so models and meshes will typically appear as &#8216;white-clay&#8217; (or Diffuse coloured only, bottom image) in the 3D View, requiring they be re-established or converted to use Nodes (see below).<\/i><\/p><\/blockquote>\n<h3><span class=\"ez-toc-section\" id=\"summary\"><\/span>Summary<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>TL:DR summary of basic (Blender Render style) material set up in Blender 2.8;<br \/>\n(<b>1<\/b>) Create new Material instance (Material Properties).<br \/>\n(<b>2<\/b>) Activate Use Nodes.<br \/>\n(<b>3<\/b>) In Shader workspace (Shader Editor) delete <a href=\"https:\/\/www.katsbits.com\/codex\/principled-bsdf\/\">Principled BSDF<\/a>.<br \/>\n(<b>4<\/b>) Add an Image Texture node and link to Material Output.<br \/>\n(<b>5<\/b>) Select\/create\/open image (jpg, tga etc.).<\/p>\n<h3><span class=\"ez-toc-section\" id=\"blender-render-vs-nodes\"><\/span>Blender Render vs Nodes<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>For basic materials, those that might be assigned to a low-poly game model for example, whilst the obsolescence of Blender Render materials means having to use a different system to create, edit and manage materials, the <i>principle<\/i> involved is still the same; three slots or stages, <i>Material<\/i>, <i>Texture<\/i> and <i>Image<\/i>. The way the overall material is put together however, differs; instead of a collection of <i>Properties<\/i>, <i>Material Properties<\/i>, <i>Texture Properties<\/i> and to a lesser degree <i>Image Properties<\/i>, each stage is represented by an <b>Node<\/b>, a discrete datablock, within the <b>Shader Editor<\/b> (formally <i>Node Editor<\/i>) that allows for more flexible and complex connections to be made between Nodes and the effects they accommodate.<\/p>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/blender-render-materials.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/blender-render-materials.jpg\" alt=\"Blender Render based materials are relatively simple to put together and display immediately on the mesh\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>In Blender 2.79 materials are made from three stages or slots, Material, Texture and Image Properties, that generally render &#8216;flat&#8217; to screen regardless of other components (normal maps, specular etc.), and render immediately on the mesh (subject to UV).<\/i><\/p>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/basic-materials.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/basic-materials.jpg\" alt=\"Materials don't immediately appear on the mesh\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>For newer versions of Blender post 2.8+ materials are created using <b>Nodes<\/b> and (currently) display only once assigned to a UV mapped mesh (without a UV the mapped texture won&#8217;t typically display).<\/i><\/p>\n<h3><span class=\"ez-toc-section\" id=\"basic-material-node-tree\"><\/span>Basic Material Node Tree<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>To create a simple node-based material that approximates Blender Render materials a Material instance first needs to be created, a container of sorts for the node collection or tree. Right-click select an Object (mesh or otherwise) then in <b>Material Properties<\/b> [1] click the <b>+ New<\/b> button below the material list aperture if a Material does not exist, or if one does, where its blank. This populates the panel with various options and settings [2]. Next, in the <b>Surface<\/b> subsection now available ensure <b>Use Nodes<\/b> is active (highlights blue when clicked). This creates a basic container for subsequent Node data.<\/p>\n<blockquote><p><b>Design note<\/b>: blank materials are typically empty of any settings and options except as described above. They can be assigned but won&#8217;t display anything; colour, image or effect, i.e. <a href=\"https:\/\/www.katsbits.com\/codex\/tag\/transparency\/\">transparency<\/a>.<\/p><\/blockquote>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/initial-material-properties.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/initial-material-properties.jpg\" alt=\"Using the Shading Workspace, the initial Material contains two nodes by default\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>Although materials [1] import in Blender 2.8 incomplete from old projects [2], the basic properties, <b>Diffuse<\/b> colour in particular, will load as they are used to establish the basic number of instances there should be of a given material (where and how many are assigned).<\/i><\/p>\n<p>With a Material instance available (left) click the <b>Shading workspace<\/b> tab [1], or swap the 3D View for the <b>Shader Editor<\/b>. The node workspace will be displayed, a grid containing two nodes; <a href=\"https:\/\/www.katsbits.com\/codex\/principled-bsdf\/\"><b>Principled BSDF<\/b><\/a> and <b>Material Output<\/b>, the two default nodes presented per new material [3].<\/p>\n<blockquote><p><b>Design note<\/b>: using a workspace will reorganise the entire interface to suit that task at hand whereas switching the 3D View changes only that area. Note also, the Editor Type selector sits top-right corner of the 3D View.<\/p><\/blockquote>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/initial-material.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/initial-material.jpg\" alt=\"Using the Shading Workspace, the initial Material contains two nodes by default\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>Using the <b>Shading<\/b> workspace [1], the Material [2] created contains two nodes by default; <b>Principled BSDF<\/b> and <b>Material Output<\/b> [3], only the latter is needed for simple Blender Render style materials.<\/i><\/p>\n<h3><span class=\"ez-toc-section\" id=\"blender-render-style-material\"><\/span>Blender Render Style Material<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>For simple Blender Render style materials only the <b>Material Output<\/b> node is needed so right-click select the <b>Principled BSDF<\/b> node and press <i><span class=\"shortcutkey\">Delete<\/span><\/i> (or <i><span class=\"shortcutkey\">X<\/span><\/i>) to remove it. Next from the <b>Add<\/b> menu [4] of the <b>Shader Editor<\/b> (bottom-center area shown above) click <b>Texture \u00bb Image Texture<\/b> [5] to place an <b>Image Texture<\/b> node [6] in the work area (left-click to set it in place). These two nodes correspond to <i>Blender Render&#8217;s Material<\/i> and <i>Texture<\/i> Properties.<\/p>\n<blockquote><p><b>Design note<\/b>: the Image Texture node can be added after removing Principled BSDF or vice versa &#8211; the order does not matter so long as the Principled BSDF node is removed and an Image Texture node included &#8211; for very simple materials it may not be necessary to remove Principle BSDF as basic UV assigned images will display without the Node.<\/p>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/principled-bsdf-or-not.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 98.5%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/principled-bsdf-or-not.jpg\" alt=\"Principle BSDF left in place\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>Very simple materials still work with Principle BSDF in place so long as the correct connections are made &#8211; <b>Image Texture<\/b> (Colour output) to <b>Principled BSDF<\/b> (Base Color input), then <b>Principle BSDF<\/b> (BSDF output) to <b>Material Output<\/b> (Surface input).<\/i><\/p><\/blockquote>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/image-texture-node.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/image-texture-node.jpg\" alt=\"Remove the Principled BSDF node and place an Image Texture node from the Add menu\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>Remove the Principled BSDF node then from the Shader Editors <strong>Add<\/strong> menu [4] place an Image Texture node [6] &#8211; <b>Add \u00bb Texture \u00bb Image Texture<\/b> [5].<\/i><\/p>\n<p>With the <b>Image Texture<\/b> node in place; to use a Generated image click the <b>+ New<\/b> button and in the <b>New Image<\/b> pop-up set the name, dimensions and image type; click <b>Open<\/b>, browse to, select and load a suitable image into the node; click the <b>Browse Image to be linked<\/b> button [7] and select an image that might already be available [8], for example one previously imported but not assigned.<\/p>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/select-image.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/select-image.jpg\" alt=\"Selecting an image to assign to the Image texture node\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>Using the <b>Browse Image to be linked<\/b> option [7] to assign an image previously imported [8] to the <b>Image Texture<\/b> node (alternatively click <b>+ New<\/b> to create a Generated image, or <b>Open<\/b> to browse and load one in).<\/i><\/p>\n<p>The final step once an image is associated with the node is to connect it to <b>Material Output<\/b>. To do that, to the right of <b>Color<\/b> in the <b>Image Texture<\/b> node, left-click-drag the <i>yellow output<\/i> connector [9] over to <b>Material Output<\/b> node and the <i>green input<\/i> connector to the left of <b>Surface<\/b> [10]. Release to confirm. This action links the two nodes together and, subject to UV availability, will display the image on the mesh in the 3D View (shown below upper-center area).<\/p>\n<blockquote><p><b>Design note<\/b>: materials may appear reset on surfaces that have not been UV unwrapped prior to assignment making the result heavily tiled (repeated) or otherwise distorted across affected surfaces.<\/p><\/blockquote>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/material-displayed.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/material-displayed.jpg\" alt=\"Linking nodes together using the output and input nodes of Image Texture and Material Output\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>Once the Image texture node is set up it can be connected to Material Output by left-click dragging the yellow output connector from one [9], to the green input connector of the other [10]. When done the image will appear on the mesh (subject to UV map).<\/i><\/p>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/uv-material.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/uv-material.jpg\" alt=\"Subject to UV map availability, once a Material is set up the associated image will appear on the mesh\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>Subject to UV map availability, once the Material is set up the image associated with it will appear on the mesh (relative to UV mapping placement).<\/i><\/p>\n<p><video poster=\"\" controls=\"controls\" width=\"100%\" height=\"auto\"><!--<source src=\"\/images\/tutorials\/viewpoint-navigation.mp4\" type=\"video\/mp4\" \/>--><source src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/material-basic.ogg\" type=\"video\/ogg\" \/><source src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/material-basic.webm\" type=\"video\/webm\" \/><\/video><br \/>\n<i>Creating a basic Material in Blender that approximates Blender Render materials (Blender 2.79 or below) using nodes and the Shader Editor workspace (UV mapping objects beforehand is optional and not shown but done to display resulting material and mapped image reasonably after creation).<\/i><\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":1795,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[34,32,230],"tags":[324,342,368,103,327,334,367,376,366,377],"class_list":["post-619","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blender","category-texturing","category-tutorials","tag-blender-render","tag-layout","tag-lookdev","tag-materials","tag-node-editor","tag-nodes","tag-shader-editor","tag-shading","tag-shading-layout","tag-workspace"],"post_mailing_queue_ids":[],"_links":{"self":[{"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/posts\/619","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/comments?post=619"}],"version-history":[{"count":5,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/posts\/619\/revisions"}],"predecessor-version":[{"id":5199,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/posts\/619\/revisions\/5199"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/media\/1795"}],"wp:attachment":[{"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/media?parent=619"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/categories?post=619"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/tags?post=619"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}