Search Unity

  1. Megacity Metro Demo now available. Download now.
    Dismiss Notice
  2. Unity support for visionOS is now available. Learn more in our blog post.
    Dismiss Notice

Pixel Perfect and Clean Textures

Discussion in 'Editor & General Support' started by emergence, Mar 17, 2011.

  1. emergence

    emergence

    Joined:
    Aug 25, 2010
    Posts:
    386
    I am trying to make a 2D game, and I don't really know where to start when it comes to simply adding a texture (image) on to a plane, and...

    1) Getting it to be pixel perfect, in relation to the pixel-perfect orthographic camera. So when I load a 500x500 image, it shows up in the game as a 500x500 image. Not stretched, or enlarged, etc.

    2) No anti-aliasing. My graphics are perfect without any of this blurring which occurs, destroying the detail.

    Basically, I just want to put in a 2D image to appear EXACTLY as it appears in photoshop (the real image). No fancy lighting, no shading, no AA or blur, no resizing.


    What must I do to both the Camera and the Plane/Texture?? Not much support for 2D in the tutorials.
     
  2. TwiiK

    TwiiK

    Joined:
    Oct 23, 2007
    Posts:
    1,729
    I would tell you to search your problem as it has been answered hundreds of times, but seeing as I asked the same thing a while ago here's what you need to do:

    1. Choose "Point" as the filter mode for your textures.
    (This is essential for making your textures sharp)

    2. Choose "Advanced" as your "Texture Type" and disable "Generate Mip Maps"
    (You don't need them and I think this makes your textures smaller)

    3. Choose "RGBA 32 bit" as your "Texture Format"
    (You could probably choose a lesser mode and get the same result, I haven't tested)

    4. Set your Camera Projection to be "Orthographic
    (This makes it 2d)

    5. Set your "Orthographic Size" to your screen height / 2
    (This makes it so 1 unit in Unity equals 1 pixel on your textures)

    6. Either create a quad through script or make a 1x1 unit one in a 3d application
    (In 3ds max I set display units and system units to meters and create a 1m^2 plane for this to work)

    7. Scale your quad so it's the same size as your texture
    (A 64x64 texture needs a 64x64 quad)

    I think that's it.

    And since you can't set the game screen size in the editor adding a script like this to your camera is perhaps smart as it always ensures your orthographic size is half your height. If there's a screen resize event you can probably put it there, but I haven't checked for one:
    Code (csharp):
    1. using UnityEngine;
    2. using System.Collections;
    3.  
    4. public class CameraScale: MonoBehaviour {
    5.  
    6.     void Awake () {
    7.         camera.orthographicSize = Screen.height / 2;
    8.     }
    9. }
    10.  
     
  3. Jessy

    Jessy

    Joined:
    Jun 7, 2007
    Posts:
    7,325
    Use point filtering and a shader like this. As for sizing, you'll have to create a quad that corresponds with whatever size you're looking for. I don't think that's a very good idea, though. Screensare going to get insanely higher in resolution soon, making your graphics unviewable. I recommend going with a screen size and aspect ratio, and designing around that, instead. Don't get me wrong, I design graphics for a certain screen size and resolution, to be pixel-perfect, but I don't make the graphics bigger on lower-res devices. I keep them the same size on screen, at a lower res.

    Edit:
    TwiiK posted while I was typing. That's all good info, except, keep in mind that the point filtering and no mip maps combo is not going to work well if you take the approach I just recommended.
     
    Last edited: Mar 17, 2011
    enkryptikon likes this.
  4. emergence

    emergence

    Joined:
    Aug 25, 2010
    Posts:
    386
    I don't know why one would want images to grow bigger when resolution is shrunk. In fact, the graphics need to be SMALLER on lower-res devices.

    Basically, I am going to make the max resolution 1920x1200, and every sprite rendered at 500x500, but the game window is resizable (automatic for lower resolutions, or custom for any) which must resize everything inside it, but also the game can be zoomed in (which results in a native size of images, being EXACTLY 500x500).

    The actual gameplay (images) of even a 1920x1200 resolution will actually be smaller than 500x500, and when "zoomed out" even smaller. The images also have to adjust their size based on the game's resolution.

    I will be having three cameras. "Zoomed out" where every image is probably half the size of "Normal" which is probably half the size of "Zoomed in". So "zoomed in" is native for the image, normal is 50% size images, and zoomed out is 25% size images. However, this is for a 1920x1200 or 1920x1080p resolution monitor.

    So if the resolution is smaller, than universally those images will be that % smaller, up to a minimum resolution.
    The game window will be maximized for the HEIGHT of 1080p, with 1200 having no difference (extra room for the GUI). So the game window will be proximately 1400x1080 on BOTH 1920x1200 and 1920x1080p resolutions.

    16:9 is 16:10.
     
  5. emergence

    emergence

    Joined:
    Aug 25, 2010
    Posts:
    386
    Thank you, btw*
     
  6. bigkahuna

    bigkahuna

    Joined:
    Apr 30, 2006
    Posts:
    5,434
    Stupid question: Why not just use a GUITexture?
     
  7. TwiiK

    TwiiK

    Joined:
    Oct 23, 2007
    Posts:
    1,729
    Why ask for pixel perfect if that's not what you want?

    Also, no idea who or what you're referring to here:
    Seems to me you don't know what pixel perfect is.

    If you do what I suggest your 500x500 texture will take up 500x500 pixels on your screen no matter what resolution you play at. That is pixel perfect. It doesn't get bigger if the resolution gets smaller or smaller when the resolution gets bigger, it stays 1:1.

    This is how it has been in nearly every 2d game ever and which is why so few 2d games let you change your resolution as it would mean you would see more than was intended. Take The Command Conquer games for instance. Back when Tiberian Sun came out I had my hands on a monitor with 2000x1500 or something resolution and could see the entire map at once on my screen, but every sprite was still the same size as if I played in 320x240.
     
  8. Jessy

    Jessy

    Joined:
    Jun 7, 2007
    Posts:
    7,325
    My 2D computer gaming experience consists mainly of three categories.

    Flash games: What you say is true, here, and it sucks. I want a fullscreen button, like Unity provides, and Flash doesn't offer that.

    8- and 16-bit console games on emulators: I blow these up, without antialising, and it's awesome.

    "Casual" games, primarily from Big Fish Games: These are modern, and always stretch to fill my screen, which is what I want.

    I do not approve of this pixel-perfect idea. In the future, I think we're going to have zoom handling on windows, along with the resize handles we've had forever. Being able to decide what you want on your screen, and how big you want it, is ideal. We already have this to some degree. All 2D and 3D content creation apps use this in their canvas/viewport areas, and changing the size of everything in a web browser, at least in Safari, is as simple as pinching your fingers in or out (I don't mean just on iOS).
     
    Last edited: Mar 20, 2011
  9. emergence

    emergence

    Joined:
    Aug 25, 2010
    Posts:
    386
    Pixel Perfect Quality, but not Pixel Perfect Size, is what I must have meant, heh
     
  10. badawe

    badawe

    Joined:
    Jan 17, 2011
    Posts:
    297
    Hey guy, sry by bump up this topic, but this script:

    Code (csharp):
    1. using UnityEngine;
    2. using System.Collections;
    3.  
    4. public class CameraScale: MonoBehaviour {
    5.  
    6.     void Awake () {
    7.         camera.orthographicSize = Screen.height / 2;
    8.     }
    9. }
    I'm working for iOS: 1024x768 so this make my size to: 329
    I'm using ezGUI / SM2 but this make my textures far away! I can't even see this on the screen, I do something wrong?
     
  11. ferro

    ferro

    Joined:
    Aug 25, 2011
    Posts:
    13
    I have 1 important addition to those points.

    8. Textures that you are using must be square and power of 2 like 256x256, 1024x1024. Even if you are using RGBA 32 formatted textures this point is still necessary. By doing this you can achieve pixel perfect with compresed textures.

    Also if you make necessary calculations you can make a pixel perfect game with perspective camera.
     
  12. Foxxis

    Foxxis

    Joined:
    Jun 27, 2006
    Posts:
    1,108
    I was just about to create a new thread but this is related so I'll post it here:

    Is it just us or is Unity4 doing a horrible job of scaling textures if using the override settings?
    Our artist has created a bunch of icons at 1024x1024 (achievement icons so we need the size to upload to iTunesconnect), but obviously we want to scale them down in Unity. The strong point used to be that you could keep the icons at full res in the project and have Unity scale them down to a suitable size (in this case 64x64). However, the icons are looking horribly pixelated when scaled down by Unity using Override->Max Size.

    I have spent 30 minutes playing with settings but there seems to be nothing I can do to force Unity to be more careful when downsampling the textures.
    It looks as if I have to scale each icon down manually in Photoshop to get them to look smooth and good, which breaks the workflow advantage of being able to keep the originals in the project. Am I missing something?

    Thanks in advance!
     
  13. Dorque

    Dorque

    Joined:
    Jul 19, 2012
    Posts:
    16
    Really? How can I do that? I'm trying to make a game that switches back and forth from perspective to orthographic cameras, but I'm having trouble in perspective mode. Do you need to change the field of view to some value?
     
  14. WidmerNoel

    WidmerNoel

    Joined:
    Jun 3, 2014
    Posts:
    64
    I know this is a really old thread but for someone that comes along:
    You probably set the "Pixels to Unity", which is a texture property, to it's default value (100).
    It should be 1 in this scenario.
     
    yangamedev likes this.
  15. HabibAli

    HabibAli

    Joined:
    Aug 19, 2013
    Posts:
    3
    TwiiK Hey Man you just saved my life .... i didn't know that keeping point filter of the texture can make it so sharp. Thanks Man