{"id":1649,"date":"2026-03-09T18:59:33","date_gmt":"2026-03-09T18:59:33","guid":{"rendered":"https:\/\/sites.wsagames.com\/stw1g24\/?p=1649"},"modified":"2026-05-14T10:33:53","modified_gmt":"2026-05-14T10:33:53","slug":"unity-shaders-and-fx","status":"publish","type":"post","link":"https:\/\/sites.wsagames.com\/stw1g24\/2026\/03\/09\/unity-shaders-and-fx\/","title":{"rendered":"Unity Effects"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">The use of <strong>effects <\/strong>in <strong>Unity <\/strong>was recommended by my lecturer to add more visual appeal to the game. Me and the <strong>techncial designer <\/strong>decided to independently research into them and see where we ended up. For my research I went to youtube and watched videos on the subject.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong><a href=\"https:\/\/www.youtube.com\/watch?v=m-6QjaDfigs&amp;list=LL&amp;index=3\">https:\/\/www.youtube.com\/watch?v=m-6QjaDfigs&amp;list=LL&amp;index=3<\/a> <\/strong>&lt;- visual effects video<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong><a href=\"https:\/\/youtu.be\/Q-UyHJcFY1g\">https:\/\/youtu.be\/Q-UyHJcFY1g<\/a> <\/strong>&lt;- particle video<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Tree Animation<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">In the first video he used animation on the trees to give them the impression that there is a breeze. I liked this and think this could be a good addition to the game.<\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-f56f613f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img fetchpriority=\"high\" decoding=\"async\" width=\"545\" height=\"207\" src=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-182515.png\" alt=\"\" class=\"wp-image-1693\" style=\"width:448px;height:auto\" srcset=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-182515.png 545w, https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-182515-300x114.png 300w\" sizes=\"(max-width: 545px) 100vw, 545px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img decoding=\"async\" width=\"194\" height=\"121\" src=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-182502.png\" alt=\"\" class=\"wp-image-1694\" style=\"width:220px;height:auto\" \/><\/figure>\n<\/div>\n<\/div>\n\n\n\n<p class=\"wp-block-paragraph\">To do this I made a new <strong>animation <\/strong>and attached it to the tree in the <strong>inspector<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"113\" src=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181612-1024x113.png\" alt=\"\" class=\"wp-image-1690\" srcset=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181612-1024x113.png 1024w, https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181612-300x33.png 300w, https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181612-768x85.png 768w, https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181612.png 1415w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">For the actual animation I hit record and and used the rotation of the trees to move them right, make a <strong>keyframe <\/strong>then move them left and make a <strong>keyframe<\/strong>. The end of the animation needed to be the trees in their natural straight position. To make the effect subtle I dragged the <strong>keyframes <\/strong>to five seconds so that the movement is perceptible but not unrealistic.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Visual Effects<\/strong><\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-f56f613f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"577\" height=\"299\" src=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-183349.png\" alt=\"\" class=\"wp-image-1696\" style=\"width:407px;height:auto\" srcset=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-183349.png 577w, https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-183349-300x155.png 300w\" sizes=\"(max-width: 577px) 100vw, 577px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<p class=\"wp-block-paragraph\">To be able to add <strong>effects <\/strong>to the <strong>camera <\/strong>I installed the <strong>post processing package <\/strong>to the project. <\/p>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-f56f613f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"536\" height=\"995\" src=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-182603.png\" alt=\"\" class=\"wp-image-1695\" style=\"width:288px;height:auto\" srcset=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-182603.png 536w, https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-182603-162x300.png 162w\" sizes=\"(max-width: 536px) 100vw, 536px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<p class=\"wp-block-paragraph\">I then went to the <strong>main camera <\/strong>in the <strong>hierarchy <\/strong>and added a post processing <strong>layer<\/strong>, this then allowed me to add <strong>post process volume<\/strong>. From this component I could access a whole host of effects.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">To the game I added <strong>bloom <\/strong>to make the whites glow, a <strong>vignette <\/strong>around the corners, <strong>grain <\/strong>to add more movement to the scene and some slight <strong>chromatic aberration<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">In the final game I think all of these would be too much but it was helpful to see what could be done. <\/p>\n<\/div>\n<\/div>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Particle Systems<\/strong><\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-f56f613f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"541\" height=\"820\" src=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-08-143055.png\" alt=\"\" class=\"wp-image-1678\" style=\"width:329px;height:auto\" srcset=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-08-143055.png 541w, https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-08-143055-198x300.png 198w\" sizes=\"(max-width: 541px) 100vw, 541px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"175\" height=\"54\" src=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181538.png\" alt=\"\" class=\"wp-image-1691\" style=\"width:191px;height:auto\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">The last effects I wanted in the game were <strong>falling leaves <\/strong>and some <strong>glowing lights<\/strong>. After exploring <strong>Unity&#8217;s <\/strong>options I found <strong>particle effects<\/strong>. These are game objects that get added to the scenes hierarchy and use real time simulation to create particles. There are many ways to edit these such as lifetime speed and size all accessed through the <strong>inspector<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The default particles are airbrushed looking white dots, these are close to what I wanted but I think they could be prettier.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-f56f613f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"541\" height=\"1183\" src=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181710.png\" alt=\"\" class=\"wp-image-1688\" style=\"width:295px;height:auto\" srcset=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181710.png 541w, https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181710-137x300.png 137w, https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181710-468x1024.png 468w\" sizes=\"(max-width: 541px) 100vw, 541px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"394\" height=\"108\" src=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181529.png\" alt=\"\" class=\"wp-image-1692\" srcset=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181529.png 394w, https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181529-300x82.png 300w\" sizes=\"(max-width: 394px) 100vw, 394px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"517\" height=\"155\" src=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181634.png\" alt=\"\" class=\"wp-image-1689\" srcset=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181634.png 517w, https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181634-300x90.png 300w\" sizes=\"(max-width: 517px) 100vw, 517px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">To swap out what the particles look like I followed half of the <strong>second Youtube video<\/strong>. I began by making a new material then changing the shader to particles -&gt; <strong>standard unlit<\/strong>. I then set the <strong>rendering mode <\/strong>to fade and dragged a <strong>PNG <\/strong>of the object I wanted into the <strong>Albedo window<\/strong>. This changed the material into a flat image I then went back to the particle menu in the inspector and in the rendering section changed the <strong>render <\/strong>mode to <strong>billboard <\/strong>and dragged in the materials I made.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">I am really happy with how these came out though further tweaking to the speeds and sizes is required for the final product.<\/p>\n<\/div>\n<\/div>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1610\" height=\"697\" src=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181752.png\" alt=\"\" class=\"wp-image-1687\" srcset=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181752.png 1610w, https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181752-300x130.png 300w, https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181752-1024x443.png 1024w, https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181752-768x332.png 768w, https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Screenshot-2026-03-11-181752-1536x665.png 1536w\" sizes=\"(max-width: 1610px) 100vw, 1610px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">This is the view in the game editor window I positioned the <strong>sparkle particles <\/strong>at the top to rain down and the leaves to come in from the top at the side.<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video height=\"1080\" style=\"aspect-ratio: 1920 \/ 1080;\" width=\"1920\" controls src=\"https:\/\/sites.wsagames.com\/stw1g24\/wp-content\/uploads\/sites\/62\/2026\/03\/Effects-showcase.mp4\"><\/video><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">These are the <strong>final effects <\/strong>in the game I like how this turned out especially the particles and animation of the trees. The post processing visual effects perhaps make the game look too moody. I sent it to my team to hear their thoughts. Before the playtest me and the<strong> <a href=\"https:\/\/sites.wsagames.com\/sz3c23\/sound-and-visual-effects\/\">mechanics designer worked together to add them to the game.<\/a><\/strong><\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-f56f613f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/sites.wsagames.com\/stw1g24\/2026\/02\/25\/animal-animation\/\" data-type=\"post\" data-id=\"1519\">Previous Post<\/a><\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"has-text-align-right wp-block-paragraph\"><a href=\"https:\/\/sites.wsagames.com\/stw1g24\/2026\/03\/14\/cutscene-animation\/\" data-type=\"post\" data-id=\"1715\">Next Post<\/a><\/p>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>The use of effects in Unity was recommended by my lecturer to add more visual appeal to the game. Me and the techncial designer decided to independently research into them and see where we ended up. For my research I went to youtube and watched videos on the subject. https:\/\/www.youtube.com\/watch?v=m-6QjaDfigs&amp;list=LL&amp;index=3 &lt;- visual effects video https:\/\/youtu.be\/Q-UyHJcFY1g [&hellip;]<\/p>\n","protected":false},"author":53,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[42,43],"tags":[],"class_list":["post-1649","post","type-post","status-publish","format-standard","hentry","category-art-development","category-semester-2"],"_links":{"self":[{"href":"https:\/\/sites.wsagames.com\/stw1g24\/wp-json\/wp\/v2\/posts\/1649","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sites.wsagames.com\/stw1g24\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sites.wsagames.com\/stw1g24\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sites.wsagames.com\/stw1g24\/wp-json\/wp\/v2\/users\/53"}],"replies":[{"embeddable":true,"href":"https:\/\/sites.wsagames.com\/stw1g24\/wp-json\/wp\/v2\/comments?post=1649"}],"version-history":[{"count":6,"href":"https:\/\/sites.wsagames.com\/stw1g24\/wp-json\/wp\/v2\/posts\/1649\/revisions"}],"predecessor-version":[{"id":2186,"href":"https:\/\/sites.wsagames.com\/stw1g24\/wp-json\/wp\/v2\/posts\/1649\/revisions\/2186"}],"wp:attachment":[{"href":"https:\/\/sites.wsagames.com\/stw1g24\/wp-json\/wp\/v2\/media?parent=1649"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sites.wsagames.com\/stw1g24\/wp-json\/wp\/v2\/categories?post=1649"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sites.wsagames.com\/stw1g24\/wp-json\/wp\/v2\/tags?post=1649"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}