How do I create a crisp edges like vector images?
Save in png-24 with transparency. png-8 doesn't do transparency percentages and makes edges rough
Mmm... I've test it, but even for straight line, it still kinda blurry (yellow-zoomed).
Make sure to save in a high resolution. Also do not stretch images in game. I'm working on some vector based images right now, and they aren't blurring in C2. Maybe you'll need to post a capx so we can see whats wrong.
Oh yes, higher resolution fix the problem.
What do you mean by working on vector based image. C2 cannot use vector images, can it?
As a rule of thumb, you should use graphics that are 2X the size that they are on screen. When the computer scales them it will make an ultra smooth line.
Nice tips. It's something new for me.
I have another question:
I have succeeded to create a smooth edges image using photoshop.
But I fail when I save it from vector software such as inkscape or illustrator.
In illustrator I used: save for web and set it for PNG-24.
Anyone knows how to do it correctly using those software?
Develop games in your browser. Powerful, performant & highly capable.
Don't use the Save function in Photoshop or Illustrator.
The 'Export' function will let you create lossless images in PNG
In Inkscape press Control+Shift+E to export PNG files. Make sure you have "Page" selected or it will autocrop the image to whatever you have selected. (This is actually a cool feature , not a bug)
From the export menu you can change the actual output size. increase this if the edges get too "Jaggie".
Be sure to Save the SVG version as well so you can edit it later. Once it is turned to a raster image there is no reliable way to change it back into a SVG file.
If you ever do need to import a raster image to inkscape, you can select "trace bitmap" from the paths menu. This will make a smooth scaling image, the problem is that it only works well with solid colors.