Jump to content
  • Advertisement

Unity Weekly Updates #39 - Going In Depth

jb-dev

1861 views

Why hello there! It's time for your favourite Weekly Update blog again!

This time it's quite heavy in visual, so without further ados, let's dive right into this!

New Shaders

First up, let's talk about shader.

With me being quite active on Reddit, I'm able to see many different boards. One of them is the Unity3D board, r/Unity3D.

To keep this brief, Unity got a visual graph interface for writing shaders called "Shadergraph". In many aspects, it works like Unreal Engine's blueprints where there are different nodes with inputs and outputs. The developer simply needs to link input to outputs to build a shader.

So lately a meme was lately spreading around with using Shadergraph to create water shaders. It's quite interesting, as I've only seen a few here and there but it's a great meme nevertheless.

6munoi90ufq21.jpg

The catch is that ShaderGraph is only available in the pro version of Unity, and while I'd wouldn't mind spending the cash on it I'm currently stuck with the free version.

But that didn't discourage me the slightest. I've decided to build my own water shader with blackjack and hookers (but most importantly don't forget the shader! 😉 ).

The Depth Texture

So, in case you don't know, the first step is to be able to get the camera's depth texture. 

Basically, the depth texture is a colour map holding the depth of each pixel compared to the rendering camera. The furthest the pixel is the greater will be its depth value.

This means that any geometries writhing to the Z buffer will affect the depth. This is quite handy, as with this information nice effects can be made.

Here's a picture of a depth texture for a given scene

depth_buffer_texture.jpeg

Because I'm using differed rendering this texture is kinda given to me for "free" but if I would have used forward rendering another rendering step would be needed.

Nevertheless, getting it is quite easy as it's available in all shaders as a global sampler called _CameraDepthTexture. Just add this sampler to your shaders and you're (almost) good to go.

The Shader

But, using the depth texture itself isn't enough. We need to transform this data to be able to get that sweet sweet water shader.

First thing is to actually project the sampler unto the geometry. We then get the eye space depth for each pixel. This, in turn, creates some kind of gradient that follows the border of any pierced geometries, creating some kind of fade out.

float4 depthSample = SAMPLE_DEPTH_TEXTURE_PROJ(_CameraDepthTexture, IN.screenPos);
float depth = LinearEyeDepth(depthSample).r;
float depthDistance = (depth - IN.screenPos.w);

Afterwards, it's a matter of getting the actual distance and tweaking the gradient a bit to get it sharper (or softer if you want).

float shoreFoamLine = saturate(UNITY_ACCESS_INSTANCED_PROP(Props,  _ShoreFoamDistance) * depthDistance);
float foamLine = saturate( (UNITY_ACCESS_INSTANCED_PROP(Props,  _DepthFactor) / 2.0) * depthDistance);

When the gradient is sharp enough we can create some kind of cartoonish foam around any geometries. Used properly this can create quite the effect.

The last step I've taken was to change the gradient to use a custom gradient instead. I've basically opened my image editor and created a really pixel-ish gradient with clearly defined layers. Then it's only a matter of sampling that gradient texture with the gradient and you can get quite the effect.

With that new gradient, we can change the material's properties in any way we want. It can make various effects when using different colours and settings.

Here's a quick video showing off the different possible effects depth texture can create:

Room Redesign

Secondly, while the shaders were compiling I had time to continue some redesigns here and there. Let's start with the bank, which is by far the oldest rooms.

One predominant difference you'll see in most of these rooms is obviously better lighting. This was due to the room scaling its wall to match the level's wall heights.

While it created a certain level of coherence it was really weird looking. It was also a significant pain to light up, which resulted in badly lit rooms.

Another problem came with the reflection probes, which needed to be re-scaled and re-positioned each time a special room was spawned.

So I removed that wall scaling thing. The effect is that now I can properly set up the lighting of each room and also made those reflection probes easier to manage.

The New Bank

First, let's look at the new bank!

image.thumb.png.1db950cdbe8af4651808b49d0cfe3136.png

now the counters are much more detailed, with each counter having a proper computer setup with screens and keyboard.

The counter screen got a lot more details than before. Now it got metal bars instead of a solid design.

image.thumb.png.71fe2bd4564e9a951a79f63f8e741d2b.png

Another thing to mention is those massive pillars on the sides. It's supposed to mimic classical bank designs.

image.thumb.png.bafdf939bfa5edef9e2822348bf2d0b0.png

The lighting is also greatly updated. It's much more present and in turns make the scene much more detailed and designed than before.

Lastly, I've also added a darkened corridor that is supposed to tell the player that the bank is bigger than it looks. I've used another depth texture shader to create that darkening effect too!

image.thumb.png.11942f4e4f4f8a877c865e44c14c5af4.png

I'm fairly content with that design right now. Can't say its the final design though (because of agility and whatnot), but it's really neat looking, to be frank.

The New Diner

Next, it's all about the new diner.

image.thumb.png.c70ce7ec819036a415de2775d2b88879.png

First, I've decided to change the ceiling, of which I thought was really boring and didn't make me think of diners at all...

To fix this I've decided to add a curve to that ceiling and give it a more "diner" aesthetic altogether.

image.thumb.png.b3c36c8b436f550fcb747703269609a4.png

Another big change is the design change of the props. Now its much more low-poly with its flatten quads and sharpen edges.

image.thumb.png.7fbb12bf445912cfc8e35bd9d8062efe.pngimage.thumb.png.75eeac379ff28658b806ee27d8fdf73b.pngimage.thumb.png.a3c78ce3d77b0c3adde5269146e8d0d0.pngimage.thumb.png.1cb1685aa7d5216a91bbe86c0b0b5087.png 

Another change was the use of metallic materials. In classic diners, metallic materials were used almost everywhere.

ed-s-easy-diner.jpg

In my dinner, there weren't any at all. Now they're a bunch of metallic ridges on most geometries, which gives it quite the "diner" aesthetic I'm going for.

image.thumb.png.e8806a2e41e586b590224ad7aea8f8c9.png

I've also decided to change how the diner displays its menu. Previously the items were put on the counter. It wasn't clear enough that those food items were intractable, so I decided to make them hover above the counter instead.

I've also added a constant rotation to them, which makes them more appealing to the player in a way.

I'm not done with that design, though. I still want to add something similar to the bank's dark hallway. I want to make the player believe that this room is actually just a portion of the whole thing. I still need to think about it, though.

The New Casino

Finally, let's talk about the new casino.

image.thumb.png.3eaea5acde0c950d5fa4b83434a8d50e.png

I'm gonna be honest here, the star of the scene here is mainly the ceiling.

image.thumb.png.61b9b37a49362092eb4eca03f81d0f22.png

I was inspired by my city's casino design, which actually is a reused pavilion from the 1967 World's fair.

Image illustrative de lâarticle Casino de Montréal

It got really funky curves and whatnot. This inspired me to create a spiral-shaped ceiling with big wide windows all around it.

I'm reusing the same "fake sun" lighting system that I've used in my super shoppe room. Basically, I rotate the spotlight to replicate the sun's alignment. I personally think that the projected light makes quite the impression, especially with relatively simple room design and simple low-poly geometries.

I also added a bunch of lights to it just to make it look quite nice too.

That's about it for rooms as of right now

Minor Updates

  • Refactored my enemies (while it's implemented It's still a WIP, so no pictures, sorry!):
    • Now they got a more "humanoid" skeleton:
      • This effectively means that I now have access to things like head IK and many more advance humanoid feature, such as animation mirroring and whatnot.
    • Updated the walk animation blend tree to be 2D;
    • With new walking animations, enemies can now sidestep and backstep;
    • Redesigned the model to match the new designs.
  • Changed the Super Shoppe floor to carve a nice glass design on the second floor's floor:
    • This carving goes through the floor and is also visible from below;
      image.thumb.png.11f3ea30003d98cbb2b403391486d220.png
    • It's supposed to represent the icon for crystals.
  • Optimized some unoptimized code here and there:
    • I've been doing profiling a lot and discovered that some of my GUI elements can give lag (can drop from 60 FPS to ~15 FPS), so it's up to the drawing board again I guess.
  • Bunch of cleaning, refactoring and optimizations.

Next Week

While redesign the rooms are primordial, I'm also worrying about performance too. Its a relatively simple game, and having a 25% lag spike is kind of unacceptable (especially given that the geometries are stupidly low-poly compared to modern games). I have no idea why, but I always was conservative with the resources of the game. Perhaps it's because I'm lacking either confidence in the technology or perhaps it's a lack of knowledge on the actual limit of the engine. I really have no idea, and while I'm not as knowledgeable as others on the mather I also think that it's something that can be learned.

But anyways, first up is fixing that unoptimized GUI element. I don't think it'll take long, but who knows?

Aside from that, I want to continue the room redesigns.

Then it's enemy time and after that, it's your usual suspects.

I really think that if I'm working on it I could have something by about July or August. After hindsight, the March/April deadline was kind of pretentious, especially knowing the fact that the game itself wasn't even 1 year into development, to begin with.

I knew that games like these could take up to 2 years before being done, but I was also kinda cocky about the fact I could do it in half the time.

Needless to say that it wasn't really possible at all. But right now let's focus on now and let's slowly plan ahead as we go: the future can be really unpredictable sometimes.




0 Comments


Recommended Comments

There are no comments to display.

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Advertisement
  • Advertisement
  • Blog Entries

  • Similar Content

    • By Titanomachy Studios
      Project Name: Condors Vs. Ocelots
      Team Size: 15ish
      Genre: Strategy RPG
      Engine: Unity
      Roles Available:
      3D Artists - generalist or hardsurface w/textures
      2D Artists - Characters, World, and UI
      C# developer/engineer(s)
      Social Media/Marketing/Community Manager
      If you feel as if you can offer the team something more that isn’t listed, we are always open to making an exception, just send your resume/portfolio to us!
      Project Length: Currently planning on release Q1 2020.
      Compensation: Rev-share
      Project Status: Vertical slice is done and iteration development has begun.
      Send emails to careers@titanomachystudios.com
       
      Must speak English and have access to a Mic.
       
      Our store page can be found here, https://play.google.com/store/apps/developer?id=Titanomachy+Studios
      Our website here,
      http://titanomachystudios.com/#/
       
      Project Story: Condors and Ocelots have been at war for generations. Battles have left some settlements in ruins. Others teem with refugees. Even away from the fighting, towns and villages suffer from having their fighting-age citizens lured away or conscripted by one faction or the other. Players control their armies and try to wipe out their opponents! Use terrain, abilities and pure cowardice if need be to achieve victory for your faction!
    • By RoKabium Games
      The Riverine design looking like a snake didn’t work very well with the animation so we re-designed this creature to look more like a colourful caterpillar type of animal.
    • By intenscia
      mod.io is an cross platform mod service created by the team behind ModDB.com and IndieDB.com. It can be integrated in-game using the  REST API, C/C++ SDK or engine plugins (if available) Unity is ready and Unreal Engine is in development.
      Features include:
      Platform agnostic (support 1 click mod installs on Steam, Epic Games Store, Discord, GOG, itch.io and even consoles in the future) Clientless (mod.io has no other dependencies and works behind the scenes in your game) Embeddable web app UI, so you can integrate your mod community anywhere Powerful search, filtering and tagging of mods Moderation and reporting systems built-in Steps to getting mod.io integrated:
      Add your game to our test environment or production Read our API documentation for an overview of how mod.io works Choose an Engine Plugin, API or SDK to integrate mod.io into your game and mod making tools Ready to launch? Add your game to our production environment then let's discuss promoting your release Need help? Our team is available on Discord to assist and our getting started guide has more information for you  
       
      Benefits of using mod.io:
      mod.io offers the same core functionality as Steamworks Workshop (1 click mod installs in-game), plus mod hosting, moderation and all of the critical pieces needed. Where we differ is our approach to modding and the flexibility a REST API offers. For example: 
      Our API is not dependent on a client or SDK, allowing you to run mod.io in many places such as your homepage and launchers Designing a good mod browsing UI is hard, our plugins ship with a UI built in to save you a lot of effort and help your mods stand out We don’t apply rules globally, so if you want to enable patronage, sales or other experimental features, reach out to discuss Our platform is built by the super experienced ModDB.com team and is continually improving for your benefit Your community can consume the mod.io API to build modding fan sites or discord bots if they want Large studios and publishers:
      A private white label option is available to license, if you want a fully featured mod-platform that you can control and host in-house. Contact us to discuss.
      Find out more:
      Visit mod.io | About us | Add your game | Chat on Discord
      These screenshots are from our Unity plugin:




    • By SuperVGA
      A little backstory:
      I'm tessellating some simple terrain. I have some patches which are modulo translated up to their own size, so the patches are repeated while giving an effect of being an endless supply of patches to either side. I'd like to only translate them up to one unit instead, so that the far reaches of all my patches don't change by the full patch size, but only by one unit.
      However, the winding order of the triangles differ, and 4 texels in the heightmap render different depending on the winding order, so I'd like to enforce the winding order for all the generated triangles.
      Is there any way to dictate the triangle winding order for all the generated geometry? I'd like for them to be similar, not flipped around the center of the patch...
      Thanks in advance,
      /SuperVGA

    • By INTwindwolf
      THE PROJECT

      INT is a 3D Sci-fi RPG with a strong emphasis on story, role playing, and innovative RPG features such as randomized companions. The focus is on the journey through a war-torn world with fast-paced combat against hordes of enemies. The player must accomplish quests like a traditional RPG, complete objectives, and meet lively crew members who will aid in the player's survival. Throughout the game you can side and complete missions through criminal cartels, and the two major combatants, the UCE and ACP, of the Interstellar Civil War.
      Please note that all of our current positions are remote work. You will not be required to travel.
      For more information about us, follow the links listed below.
      INT Official website
      IndieDB page
      Also follow social media platforms for the latest news regarding our projects.
      Facebook
      Twitter
      CURRENT OPEN POSITIONS
      Website Manager
      3D Character Modeler
      3D Environment Modeler
      3D Animator
      Unity Engine Programmer
      REVENUE-SHARE
      The project is marching increasingly closer to be ready for our crowd-funding campaign. Being an Indie team we do not have the creative restrictions often imposed by publishers or other third parties. We are extremely conscientious of our work and continuously uphold a high level of quality throughout our project.
      We are unable to offer wages or per-item payments at this time. However revenue-sharing from crowd-funding is offered to team members who contribute 15-20 hours per week to company projects, as well as maintain constant communication and adhere to deadlines. Your understanding is dearly appreciated.
      TO APPLY
      Please send your Cover Letter, CV, Portfolio (if applicable), and other relevant documents/information to this email: JohnHR@int-game.net
      Thank you for your time! Please feel free to contact me via the email provided should you have any questions or are interested to apply for this position. We look forward to hearing from you!
      John Shen
      HR Lead
      Starboard Games LLC
  • Advertisement
×

Important Information

By using GameDev.net, you agree to our community Guidelines, Terms of Use, and Privacy Policy.

GameDev.net is your game development community. Create an account for your GameDev Portfolio and participate in the largest developer community in the games industry.

Sign me up!