{"id":6045,"date":"2022-05-31T17:55:59","date_gmt":"2022-05-31T16:55:59","guid":{"rendered":"https:\/\/www.katsbits.com\/codex\/?p=6045"},"modified":"2024-04-22T09:38:19","modified_gmt":"2024-04-22T08:38:19","slug":"anyshape-furniture","status":"publish","type":"post","link":"https:\/\/www.katsbits.com\/codex\/anyshape-furniture\/","title":{"rendered":"IMVU Studio Toolkit &#8211; Anyshape Furniture"},"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-6a174e5991ba9\" 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-6a174e5991ba9\"  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\/anyshape-furniture\/#description\" >Description<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.katsbits.com\/codex\/anyshape-furniture\/#mesh-primitives-uv-maps\" >Mesh Primitives &#038; UV Maps<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.katsbits.com\/codex\/anyshape-furniture\/#vertex-group-assignments\" >Vertex Group Assignments<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.katsbits.com\/codex\/anyshape-furniture\/#fauxfake-depth\" >Faux\/Fake Depth<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.katsbits.com\/codex\/anyshape-furniture\/#types-of-transparency\" >Types of Transparency<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.katsbits.com\/codex\/anyshape-furniture\/#timestamps\" >Timestamps<\/a><\/li><\/ul><\/nav><\/div>\n<div style=\"background-color: black; position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0; overflow: hidden; max-width: 100%;\"><center><iframe style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%;\" src=\"https:\/\/www.youtube.com\/embed\/WLU8FV0CTaM?rel=0\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/center><\/div>\n<h3><span class=\"ez-toc-section\" id=\"description\"><\/span>Description<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Using the Furniture Tool aspect of the IMVU Studio Toolkit we take a look at making a simple furniture item, an &#8216;anyshape&#8217; rug, that is, a flat plain whose shape can be changed using an opacity map. As this is a simple item all that&#8217;s needed is a flat plain which is assigned a transparent material so the &#8216;anyshape&#8217; can be previewed in Blender. This is then duplicated to create a sense of depth. Once the mesh is done it&#8217;s prepped for export and then assembled in IMVU Studio.<\/p>\n<p><b>Duration<\/b>: total c. 20 mins (00:20:00).<br \/>\n<b>Info<\/b>: 1080p.<br \/>\n<b>Source<\/b>: <a href=\"https:\/\/www.katsbits.com\/files\/imvu\/katsbits - toolkit rug.zip\">KatsBits \u2013 Toolkit Rug<\/a> (500 KB, *.blend, *.fbx, *.tga, *.png). Requires <a href=\"https:\/\/create.imvu.com\/articles\/studio\/toolkit\/\" rel=\"noopener\" target=\"_blank\">toolkit<\/a>. For <a href=\"https:\/\/www.katsbits.com\/codex\/imvu-studio-toolkit\/\" rel=\"noopener\" target=\"_blank\">Blender 2.93 LTS<\/a>.<br \/>\n<b>Product ID<\/b>: <a href=\"https:\/\/www.imvu.com\/shop\/product.php?products_id=59731656\">Toolkit AnyShape Rug<\/a> (PID 59731656).<\/p>\n<blockquote><p><b>Design note<\/b>: as &#8216;anyshape&#8217; furniture isn&#8217;t really a 3D mesh some additional considerations need to be kept in mind when using the Toolkit for IMVU;<\/p>\n<h4><span class=\"ez-toc-section\" id=\"mesh-primitives-uv-maps\"><\/span>Mesh Primitives &#038; UV Maps<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Mesh primitives, i.e. the basic objects dropped into the Scene to model something, <a href=\"https:\/\/www.katsbits.com\/codex\/uv-maps\/\">include basic UV maps<\/a> so may not explicitly need to be unwrapped or mapped; once an image is associated with the material that&#8217;s assigned to the object it will orientate based on this default UV map and mapping. With this in mind make sure the UVs extend to the outer limits of the mapped image [1] to ensure there aren&#8217;t clipping or tiling issues once transparency is set up in Blender or Studio\/Classic.<\/p>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/imvu-studio\/anyshape-uv-extents.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 98.5%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/imvu-studio\/anyshape-uv-extents.jpg\" alt=\"UV extents\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>In UV Editing Workspace ensure the UVs extend to the edges of the mapped image [1] to avoid clipping and tiling issues once transparency is set up &#8211; Blender essentially provides a preview of the effect as it would appear in Classic editor or Studio, the latter especially due to the way it implements transparency.<\/i><\/p>\n<h4><span class=\"ez-toc-section\" id=\"vertex-group-assignments\"><\/span>Vertex Group Assignments<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>For basic non-animated furniture the toolkit automatically preps meshes for export and use in IMVU so long as they&#8217;re placed within the <b>Mesh<\/b> collection of <b>FURNITURE EXPORT<\/b> in the <b>Outliner<\/b> [2]. In practice this means the traditional &#8216;<b>Root<\/b>&#8216; vertex group assignment is not specifically needed so <b>Vertex Groups<\/b> in <b>Object Data Properties<\/b> will be blank [2]. However, if a groups do need to be added to accommodate more complex items, objects with multiple parts or parts that animate, the root group shown in <b>Vertex Groups<\/b> (click the <b>+<\/b> button to add) should be named <b>Attachment.Root<\/b> [3], with objects then parented to Attachment.Root or appropriate node from <b>Object \u00bb Parent \u00bb Object<\/b>.<\/p>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/imvu-studio\/anyshape-vertex-groups.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 98.5%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/imvu-studio\/anyshape-vertex-groups.jpg\" alt=\"Optional Vertex Groups assignments\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>A vertex group assignment is optional if the furniture object is placed in the <b>Mesh<\/b> collection [2]. Otherwise the root group should be named <b>Attachment.Root<\/b> [3] to link it to the root node in the scene.<\/i><\/p>\n<h4><span class=\"ez-toc-section\" id=\"fauxfake-depth\"><\/span>Faux\/Fake Depth<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>To better affect the faux-3D appearance of theses types of opacity defined &#8216;<i>anyshape<\/i>&#8216; products\/projects, each layer can be resized or shrunk slightly from bottom to top, bottom being the largest, top being the smallest [4]. What this then does is create an offset that emphasises the perception of depth created by the stack. In practice this type of modification is best done once the layers are set up the way they need to be, in terms of general appearance, i.e. material assignments and being UV unwrapped to ensures they all use the exact same UV mapping and image placement. Using the <b>Scale<\/b> widget in Blender to do this, be sure to click-drag the appropriate axes, e.g. a flat plain only needs to be modified on the X (red) and Y (green) axes (front\/back, left\/right).<\/p>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/imvu-studio\/anyshape-mesh-offset.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 98.5%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/imvu-studio\/anyshape-mesh-offset.jpg\" alt=\"Changing layers sizes\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>Changing the relative size of each layer increases the sense of depth due to the slight offset this creates in how the boundaries of the mask are perceived [4] &#8211; the effect is not affected by the shape described by the opacity mask.<\/i><\/p>\n<h4><span class=\"ez-toc-section\" id=\"types-of-transparency\"><\/span>Types of Transparency<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>When previewing transparency; <b>Alpha Blend<\/b> in Blender represents <b>Composite Blend<\/b> in Studio; <b>Alpha Clip<\/b> in Blender is <b>Alpha Test<\/b> in Studio. With assets auto-assembled\/loaded [5], <b>Composite Blend<\/b> [6] renders transparency &#8216;as is&#8217;, so <i>black<\/i> is fully transparent, <i>white<\/i> is fully opaque, <i>grey<\/i> varies transparency depending on a particular tone being closer to black or white. <b>Alpha Test<\/b> on the other hand, clips transparency based on a <b>Threshold<\/b>, the higher the value the stronger the effect &#8211; black is transparent, white is opaque, with grey being either fully transparent or fully opaque based on the aforementioned Threshold value, 0.0 &#8211; 1.0 (0.5 default).<\/p>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/imvu-studio\/anyshape-opacity.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 98.5%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/imvu-studio\/anyshape-opacity.jpg\" alt=\"Anyshape Opacity\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>The different types of transparency in Blender have corollaries in IMVU Studio so opacity maps and the effect [5] appear different relative to the setting used [6]; Composite Blender for &#8216;soft&#8217; edges, Alpha Test for hard edges.<\/i><\/p><\/blockquote>\n<h3><span class=\"ez-toc-section\" id=\"timestamps\"><\/span>Timestamps<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Times are approximate;<br \/>\n &#8211; 00:00 : Meshing &#038; Materials.<br \/>\n &#8211; 07:00 : Texture Painting.<br \/>\n &#8211; 11:00 : Mesh Layers.<br \/>\n &#8211; 13:00 : Prep &#038; Export.<br \/>\n &#8211; 15:00 : Assembly in Studio.<\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":6056,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[34,37,230],"tags":[825,878,879,195,194,738,835,221,220,685],"class_list":["post-6045","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blender","category-imvu","category-tutorials","tag-alpha-test","tag-anyshape","tag-composite-blend","tag-furniture","tag-imvu","tag-imvu-studio","tag-imvu-studio-toolkit","tag-opacity-map","tag-transparency","tag-vertex-groups"],"post_mailing_queue_ids":[],"_links":{"self":[{"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/posts\/6045","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=6045"}],"version-history":[{"count":14,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/posts\/6045\/revisions"}],"predecessor-version":[{"id":8759,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/posts\/6045\/revisions\/8759"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/media\/6056"}],"wp:attachment":[{"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/media?parent=6045"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/categories?post=6045"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/tags?post=6045"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}