{"id":2986,"date":"2021-05-16T14:33:40","date_gmt":"2021-05-16T14:33:40","guid":{"rendered":"http:\/\/dbbd.sg\/blog\/?p=2986"},"modified":"2021-12-22T01:59:06","modified_gmt":"2021-12-22T01:59:06","slug":"black-hole-shader-graph","status":"publish","type":"post","link":"https:\/\/dbbd.sg\/blog\/2021\/05\/black-hole-shader-graph\/","title":{"rendered":"Sucked into the vacuum of a black hole: Unity Shader Graph"},"content":{"rendered":"

One of the effects I’ve liked in games is the “everything being sucked into a black hole vacuum” look. What are the correct words to describe it? Does this effect already have a proper name or keyword? In Virtual Virtual Reality<\/a>, the conceit is that you’re the human employee pruning and vacuuming some machine’s lovely domestic abode and suddenly without warning it is as if you have done a terrible thing; you’ve accidentally sucked the first layer of the world away by mistake!…<\/p>\n

\"\"<\/p>\n

Today, I was reminded of it again whilst watching the (ever inspiring) devlog for the indie game Farewell North<\/a>, so I wanted to figure out how it was made. In Farewell North, it seems like it is being used in the playback scene for memories; the visual effect of being sucked back into the projector is exactly what makes them feel like ethereal memories being played back.<\/p>\n

\"\"<\/p>\n

This evening I spent a while trying to figure it out. The answer seems to be using Unity’s Shader Graph (which I’ve actually never properly used before, but it reminds me of Blender’s shader nodes, so I guess roughly get the node based system). I looked around for examples<\/a> and explanations of how it was created<\/a>. I am glad to say that with all the power of the internets and online resources, it was indeed possible for me to understand how one can recreate the “sucked into a vacuum” effect. Lerp<\/a> refers to linear interpolation and the value will change from a to b over t. There’s a Vector3 to set the origin point of the “BlackHole” or where everything will be sucked into \/ spat out of. And then there is a slider property for the “Effect” (a bit like “time” in this case) which can be helpfully tweaked in Inspector for testing purposes. “Range” is a fixed value. There’s obviously a lot more I can experiment with Shader Graph. But for now… a working example of the “Sucked-into-a-blackhole-vacuum” Shader Graph looks like this:<\/p>\n

\"\"<\/p>\n

\"\"<\/p>\n

My basic version of the “Sucked-into-a-blackhole-vacuum” look…<\/em><\/p>\n

Imagine my Spheres and Cubes teleporting endlessly from this world to another world and then back again – oh wait now you don’t even have to imagine it, here’s an actual visual representation of it!<\/p>\n","protected":false},"excerpt":{"rendered":"

One of the effects I’ve liked in games is the “everything being sucked into a black hole vacuum” look. What are the correct words to describe it? Does this effect already have a proper name or keyword? In Virtual Virtual Reality, the conceit is that you’re the human employee pruning and vacuuming some machine’s lovely […]<\/p>\n","protected":false},"author":1,"featured_media":3391,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[1048,1028,1031],"tags":[442,1056,1055,157],"jetpack_featured_media_url":"https:\/\/dbbd.sg\/blog\/wp-content\/uploads\/2021\/09\/virtualvirtualreality.gif","_links":{"self":[{"href":"https:\/\/dbbd.sg\/blog\/wp-json\/wp\/v2\/posts\/2986"}],"collection":[{"href":"https:\/\/dbbd.sg\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/dbbd.sg\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/dbbd.sg\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dbbd.sg\/blog\/wp-json\/wp\/v2\/comments?post=2986"}],"version-history":[{"count":5,"href":"https:\/\/dbbd.sg\/blog\/wp-json\/wp\/v2\/posts\/2986\/revisions"}],"predecessor-version":[{"id":3396,"href":"https:\/\/dbbd.sg\/blog\/wp-json\/wp\/v2\/posts\/2986\/revisions\/3396"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/dbbd.sg\/blog\/wp-json\/wp\/v2\/media\/3391"}],"wp:attachment":[{"href":"https:\/\/dbbd.sg\/blog\/wp-json\/wp\/v2\/media?parent=2986"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/dbbd.sg\/blog\/wp-json\/wp\/v2\/categories?post=2986"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/dbbd.sg\/blog\/wp-json\/wp\/v2\/tags?post=2986"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}