Search Unity

  1. Welcome to the Unity Forums! Please take the time to read our Code of Conduct to familiarize yourself with the forum rules and how to post constructively.

2D game build in unity UI canvas

Discussion in 'UGUI & TextMesh Pro' started by JeffreyA, Jul 6, 2018.

  1. JeffreyA


    Jun 6, 2017

    Last couple weeks i build a 2d game in Unity. It is based on a chatgame where you play on a smartphone (ingame). The game itself will be played on tablets.

    The complete game is made of UI elements and images, all child of canvas. Although the game is working fine i have a couple of questions about the way the game is build. I am aware that the canvas is for UI / HUD.
    I already watched some tutorials and used unitydocs but i couldn't find the exact answer.

    1) The complete game is build in UI elements, is this a proper way to build a 2d game?
    2) The complete game uses UI-image component to show visuals. Do i need to use sprites or images? I already read this blog post but i didn't understand it at all
    3) I both used the "screen space - overlay" and "screen space - camera" and read a lot about both of the canvas render modes. But is in this particular situation one better than the other?
    In the future i would like to add some simple lightning, i know that screen space - overlay isn't used for this so what is the best canvas render mode?

    If someone could point me in a direction that would be great.

    I added a screenshot of the game below. As i said, everything you see is build up of image components in canvas. What you see is a smartphone where you play the chat-based game (just dummy graphics ;) and colors)

    Cheers & thanks in advance

    Last edited: Jul 6, 2018
  2. Hosnkobf


    Aug 23, 2016
    It depends on what you wanna do. If you make a platformer, you should probably choose a different approach. But for a chat-based game it totally makes sense to use the UI system for it.

    "Image" in terms of unity refers to the component which you add to the object which represents your visualization. You can assign a sprite to the image component so that it knows how it should look. Best practice: Use sprite sheets to have multiple sprites inside one texture. That makes rendering much faster because the graphics card doesn't need to load / unload different textures all the time (PS: I couldn't open the link).

    I am not sure about performance, but probably overlay is better for performance.
    However, with the camera option you are more flexible. Shaders are easier to create and probably also your idea about lightning could work. With screen space this would also work, but probably the shaders must be written in a different way... not sure if you can use unity lights for this anyways.
    I would go for overlay as long as it fits your needs. When you want more which you cannot achieve with overlay, it shouldn't be a problem to switch to camera then.
    FernandoHC likes this.
  3. JeffreyA


    Jun 6, 2017
    Thank you for your answer.

    I followed a few tutorials about sprite sheets and i will definitely use them.

    For the light i have made the following setup:

    - On the black bar of the device i used the image component.
    - To make the light visible i used a shader: Legacy Shaders/Bumped Diffuse on the image component.
    - A spotlight aiming on the shader with a Helo draw is used to create the actual light source (which is reflected by the shader)

    The setup works but i',m not sure if this is the right way to make light visible in a 2d UI scene, but it works. If there are better alternatives for this can someone please tell me.

    Thank you