Photoshop/Illustrator Unity 4.3 2D workflow.

Unity Engine
1

Greetings fellow Unity users (or shall I say … commUnity, see what I did there?)

First a little introduction is in place, so my name is Matt (or Mac), and I’m a graphics designer mainly working with website design, logo, stationerys and general branding. After years of working in that business I decided to move my entire focus towards doing what I love the most, which is games (and designing graphics, that’s actually two things, well will never say no to a good beer too, or a lovely female company … well there is a lot of things I love, but it’s all about graphics and games here!). With a little bit of money saved I decided to start developing a game of my own. I have some general knowledge of JavaScript and and C#. And that’s all for introductions (for now :slight_smile: ).

Now every time I design something I start with asking a question, where it will be used (print, digital displays etc). Knowing that will determine what colors, and resolution I will choose for the project.

Now, working with games, that’s something new to me.

To make things short, I’d like to ask all of you good people about designing 2D sprites for Unity 2D game (in Photoshop or Illustrator).

Let’s just say for now, I’m designing a PC 2D platformer game (nothing fancy). I want it to be very visual and I want it to display properly on 15" screens and 24" screens and any other screen people plug to their PC (5:4, 16:9 or 16:10). Resolutions will probably vary a lot too from ~1k to ~2k pixels wide.

The questions are:

  • what would be the best dimensions for the images (for example let’s talk about simple background that is supposed to take only 1 screen worth of width. Should it be huge 2k+ px width or smaller…)?
  • what format would you guys say is the best to use (psd, ai, png, jpg …)?
  • does Unity auto scales graphics to the size of the screen (for example, if I created a 128 px height character but I do not want it to be super small on bigger screens. If so, how to prevent loosing quality when scaling up, while at the same time limiting file size)?

For now these are the basic questions I have for you guys. I hope they make sense, I never really worked with game graphics, so excuse me if my questions are just plain stupid (don’t hesitate to tell me if they are, but be constructive about it, please!).

In advance, I’d like to thank you all for all the input!

Kindly,
Mac

2

I believe the maximum you should output is 4096 x 4096 but I could be mistaken.

PSD or PNG are the best in my opinion and I use them both frequently.

The orthographic camera size along with each sprites PIXEL TO UNIT ratio will play a role in how they are displayed on different resolution. An easy way to calculate what size your camera should be is: SCREEN_HEIGHT / 2 / PIXEL_TO_UNIT_RATIO

Welcome to the commUnity! ← loved that. :stuck_out_tongue:

3

You don’t need to use an orthographic camera; in some cases I’d recommend using a perspective camera because you can do parallax effects easily that way. You should make your graphics big enough that they look decent at typical resolutions. They will be scaled down as necessary unless you go to some pains to make your sprites pixel-perfect, which I would normally not recommend for most games because there are too many resolutions to consider for that to be feasible (unless you plan to allow it to run only in a window, or if it’s the kind of game where “higher resolution” = “more visible area” works).

Don’t use JPG, it’s a lossy format. I don’t think you can import AI files directly into Unity, since it only works with bitmap images. Use PSD since you can keep layers for easy editing. I normally only use PNG if I want to keep the project size down for some reason.

Design the game so that anything important happens in an area visible in a 4:3 resolution, which you can easily test in Unity with the aspect ratio drop-down menu. Anchor GUI elements to screen corners, rather than using absolute positions. Here’s a small 2D game demo using sprites that looks and works pretty much the same in any resolution and aspect ratio…you can switch to full-screen and it will work using your native resolution. (Although it probably breaks down on anything wider than 2:1 since that’s what the background image is… The text does distort somewhat in different aspect ratios, which I could fix but didn’t since it’s not really a big deal for this.) Most of the sprites used for the tiles are 128x128.

–Eric

4

First of all, thank you guys for such a quick reply!

I understand (atleast I hope I do!) is that if I’d want to go, for a 2d platformer with parallax background, a side-scroller type, than what I should go for is:

  • assume big dimensions (for example 1920x1200 - my screen for example) and design everything for that dimensions, keeping in mind the 4:3 screens and 16:9 screens (considering they’re in PSD they will already be quite heavy)
  • design backgrounds and import them in PSD format
  • stick GUI elements to edges or objects rather than give them absolute position
  • test different aspect ratios on every step

Now some new questions were born here.

  • Let’s say I just design something in PS with transparent background (in RGB mode) and save it as PSD. Will that count as an RGB with Alpha channel?
  • Considering there will be hundrets of PSD files, each being quite heavy (it’s PSD after all), will Unity somehow compress them when doing a ready build? I mean with all those files (and these are just graphics), simple platformer can take a lot of disk space!

Thanks in advance,
Mac