Images in GS
gyroscope
I am here.Member, Sous Chef, PRO Posts: 6,598
OK, should have got all this this in my head by now concerning graphics. Just in case I haven't, here's a list of what I think is correct. If you could correct me if I'm wrong on any points that'd be great, so that I've got it once and for all, thanks.
All images saved with Save for Web, PNG-24.
Maximum image size is 1024 x 1024 pxls
All dimensions should be power of 8, i.e 8, 16, 24, 32, 40, 48, 80, 168, etc (not just 8, 16, 32, 64, 128, etc.)
When resizing the imported images in GS, this new actor size on screen must be power of 8 still.
If you have an image, lets say 128 x 64 pxls, the iOS treats this in memory as 128 x 128 BUT you will save file size by bringing it in as 128 x 64 in Gamesalad itself.
Any image can be enlarged well beyond the 1024 x 1024 pxls limit, providing that's what has been imported.
All images saved with Save for Web, PNG-24.
Maximum image size is 1024 x 1024 pxls
All dimensions should be power of 8, i.e 8, 16, 24, 32, 40, 48, 80, 168, etc (not just 8, 16, 32, 64, 128, etc.)
When resizing the imported images in GS, this new actor size on screen must be power of 8 still.
If you have an image, lets say 128 x 64 pxls, the iOS treats this in memory as 128 x 128 BUT you will save file size by bringing it in as 128 x 64 in Gamesalad itself.
Any image can be enlarged well beyond the 1024 x 1024 pxls limit, providing that's what has been imported.
""You are in a maze of twisty passages, all alike." - Zork temp domain http://spidergriffin.wix.com/alphaghostapps
Comments
""You are in a maze of twisty passages, all alike." - Zork temp domain http://spidergriffin.wix.com/alphaghostapps
I don't think that's correct.
http://en.wikipedia.org/wiki/Power_of_two
Or......I made that same mistake last time.....could be, i've a vague memory now of this. I thought it was 8 but it's just to make sure all image dimensions are even. Is that correct? (That's the trouble with trying to think at quarter to 2 am here in the UK ;-)
""You are in a maze of twisty passages, all alike." - Zork temp domain http://spidergriffin.wix.com/alphaghostapps
-Josh
""You are in a maze of twisty passages, all alike." - Zork temp domain http://spidergriffin.wix.com/alphaghostapps
Could someone confirm please, does this mean I could have dimensions such as 2, 10, 22, 38, 580, etc; i.e any dimension providing it's divisible by 2 (up to 1024)?
I suspect not, that being power of two, this actually means your graphics dimensions can only be: 2, 4, 8, 16, 32, 64, 128, 256, 512 and 1024.
Is that correct? (I'll take the answer and staple it to my head, promise!)
""You are in a maze of twisty passages, all alike." - Zork temp domain http://spidergriffin.wix.com/alphaghostapps
Anyone answer please? (OK, I know I should know this by now...)
""You are in a maze of twisty passages, all alike." - Zork temp domain http://spidergriffin.wix.com/alphaghostapps
21x32 or 57x43... now for the sizing thing.
GS and the os treats images like this ... it's great to have the images exact 16x16, 32x32, 64x64, 128x128, 256x256, 512x512, 1024x1024... but that obviously isn't the case always so..
16x8 is treated as 16x16
24x32 is treated as 32x32
64x48 is treated as 64x64
46x128 is treated as 64x128
100x100 is treated as 128x128
192x256 is treated as 256x256
540x512 is treated as 1024x512
correct me if i'm wrong
happy thanksgiving..
Stormtrix
1. The pixel dimensions of your graphics should be even. i.e 244x66 instead of 245x66. The reason for this is because GameSalad centers everything. Since all Actors are centered,
any odd pixel will get split - causing the image to blur.
So, Rule #1, make all dimensions even to avoid blurry images.
2. This expands on Rule #1...
If you are making Retina Display graphics using the Resolution Independence feature in GameSalad, not only do your graphic dimensions need to be even, but they need to be multiples of 4.
So 72x36 instead of 70x36. For the same exact reason mentioned above, when GameSalad takes your larger,
beautifully designed Retina Display graphics and makes 25% versions of them for the smaller screens - any odd dimension will cause an image blur. A 70x70 pixel graphic will now become 35x35, and will blur on the older devices.
So, Rule #2, if you are using Resolution Independence, make all dimensions evenly divisible by 4.
3. Save all your images at 72dpi. DPI refers to dots per inch. It is a printing term and gets ignored by the iPhone. However, for your own sanity, make all of your images 72dpi. This is the default standard for monitors and screens. If your image is not saved at 72dpi, GameSalad will automatically convert it to 72dpi and resize it when you import it. In Photoshop, you can change an image's dpi without changing its pixel dimensions. GameSalad does not do this and will resize the image as well. This will cause all sorts of visual problems.
So Rule #3, save all graphics at 72dpi to avoid headaches when importing your graphics into GameSalad.
4. Save all graphics as PNG files. There are two common PNG formats that GameSalad uses: PNG-24 and PNG-8. PNG-24 means that there are 8 bits per color channel. 256 reds, 256 blues, and 256 greens. For a total of ~1.6 million colors per image. PNG-24 also allows an 8 bit alpha transparency mask. So 256 levels of transparency as well. This is what you will most often use for your game graphics.
If file size is a concern, you can also save your images in the PNG-8 format. Instead of 1.6 million colors, the software will select a 256 color palette for your image. You can also choose one single color to be transparent. This will greatly reduce file size at the cost of color choices.
So Rule #4, save all images as PNG-24 or PNG-8
5. A quick note on color depths. High-end image editing software like Photoshop can handle 16 bits per channel and even 32 bits per channel. You DO NOT want to work at these color depths. iOS only supports 8 bits per channel - 1.6 million colors. The higher bit depths are for advanced image editing, allowing you to edit an image many more times without degrading it.
So Rule #5, make sure your image editing software is set to 8-bits/channel.
6. Texture memory. When you import your graphics into GameSalad and place them on an Actor, GameSalad turns the images into textures. Textures are stored in "containers" in memory to save space and increase performance. The dimensions of these "containers" are in powers of 2: 2,4,8,16,32,64,128,256,512,1024. They do not have to be square. 32x1024 is valid.
When you import your graphics, they are placed into the appropriate containers. A 64x50 graphic will be placed into a 64x64 container. A 42x980 graphic will be placed into a 64x1024 sized container.
These containers do not need to dictate your image sizes or the design of your game, but you should be aware of them. A graphic that is 514x514 will need to be placed in a 1024x1024 container. So when you think you are moving around an image that is only 514x514, you are actually moving around an image that is 1024x1024. This will greatly impact performance, as well as waste precious memory on these devices. A better choice would have been to design the graphic to be 512x512. A player Actor that is 66x34 will need to be placed into a 128x64 container. This gets even worse when the player is animated. A player that is 64x32 would be much more efficient. But if your player absolutely needs to be 66x34 or it ruins the whole aesthetic of your game - that's fine - just understand what the performance costs are. Especially when performance really counts. Don't needlessly make the bullets in your space shooter 18x10 when they would look fine at 16x8, and would save half the memory used.
So Rule #6, be aware of the texture memory you use and design your graphics accordingly.
Hope that helps!
Joe
S
""You are in a maze of twisty passages, all alike." - Zork temp domain http://spidergriffin.wix.com/alphaghostapps
Can you do one for sounds as well Oh Awesome One?
Shadows Peak is an atmospheric psychological horror that explores the dark side of a player.