SVG format for EmulationStation
-
@Riverstorm Glad that you like them :-)
Last time I used Inkscape was really long time ago so it took me a while to get the grip again.If you need also specific version logos (lr-mame 2003, lr-mame 2010 etc), at this stage it's quite easy for me to create them by adding version text into the graphics. Just let me know.
For actually using them in ES, you'd need also to define separate <system>s with specific rom <path> in es_systems.cfg and, of course, create actual specific rom directories the path refers to.
-
@UDb23 said in SVG format for EmulationStation:
If you need also specific version logos (lr-mame 2003, lr-mame 2010 etc), at this stage it's quite easy for me to create them by adding version text into the graphics. Just let me know.
I think that would be great as it gives more options in your download pack. MAME is unique in it has several versions around 10 or so. It's by no means a hurry and as it stands they are extremely useful to me.
It's tough as mame4all-pi and lr-imame4all share the same directory. The directory may have a mix of the two ROMs. I mainly use mame4all-pi as its functionality is way more complete than lr-imame4all so I would attach the mame4all logo but there's always exceptions so options are good. :)
It's the same for lr-mame2003 and lr-mame2010. They share the same directory but it might be handy to have a logo that reflects the main ROM set. It seems some are venturing into the 2010 territory but I think 2003 is the mainstay for now but maybe in the future they break those two apart as the version gap is fairly significant.
AdvMAME does have two ROM sets but is its own beast and stands alone so that logo is definitely a no brainer.
I like the idea of being able to break out the two non-libretro cores (mame4all and AdvMAME) but with options to reflect the different Libretro cores is really nice too. I guess that's the long way of saying if you have time but in no hurry I think the extra logos to reflect MAME would be great! :)
-
@Riverstorm If I find time I'll work on it in the weekend.
-
@UDb23 said in SVG format for EmulationStation:
@Riverstorm If I find time I'll work on it in the weekend.
Thanks UDb, I appreciate all the work you put into the new logos, they really do look sharp!
-
@UDb23 Could you tell me the difference between using SVG and PNG on Emulationstation? Is it just the scaling? Is there any performance difference?
Say you had a 900 x 450px png vs a 900 x 450px svg to be used as a logo in the System carousel. Would one be better to use than the other? Would there be much difference?
Also, I suppose there would be some difference depending on the style of artwork; vector style line work vs raster style image (but still made with vector)...
-
@mattrixk best way to check is to test it out. the way the svg is drawn may potentially affect it from what @Rookervik alluded to but I'm really not sure, it takes vram to display on the screen either way, though I've found that forcing a lower resolution helps with that but I havent done extensive testing to know one way or the other.
-
@herb_fargus Okay, thanks. I don't know anything about vram (how it works, what it does, what it is etc), but from what I've gathered, the smaller the image, the fewer resources it uses, which makes sense.
Also, that you can load an image and no matter how big you scale it, it uses the same amount of resources, so you can use a tiny image and scale it up, but then it would be pixelated, which works fine for the Pixel themes, or blurry images, but not so much if you want crystal clear images.
-
Yeah, that's pretty much correct. Smaller images take smaller resources.
The thing you have to remember is that SVGs scale indefinitely. They're vector, not bitmap. So a PNG and a SVG, displayed at the exact same size on screen, will take up exactly the same VRAM. It's when you start stretching the PNG larger than full size that you start seeing performance boosts. No matter how far you scale that PNG (and how bad it looks doing so) it will always take the same VRAM. Whatever size a SVG is displayed at is what VRAM it's going to use.
if you take a 1kb SVG and stretch it to a full 1920x1080, it will take the same VRAM as a full size uncompressed 1080p PNG. Even though the size of the SVG was very small. But if you take a 1kb PNG that's normally 8x8 pixels and stretch it to full screen, it doesn't take any more VRAM than it did at 8x8. That's the difference between bitmap graphics (png), and vector graphics (svg).
From what I've seen, PNGs are a lot lighter on system resources than SVGs. It shouldn't really matter once those pictures are loaded into VRAM - from there the graphics does the work... but it sure seems SVGs lag the system more than PNG.
-
Thanks @Rookervik. That was really well explained.
So it basically boils down to personal choice and experimentation, but png/jpg are better for some uses and svg is better for others.
-
The only benefit for SVG is that is scales indefinitely. Sometimes you can get some nice small file sizes if the vector is fairly simple. So, in 30 years when we're all using 16k TVs and still using EmulationStation, Carbon will still look sharp. Even though... the Pi can't handle a screen that big, nor does it have enough VRAM to display a SVG of that size. Hehehe. So I guess Carbon will be broken at that size, but Pixel will still be cranking. :D
-
@Rookervik Ahh, but in 30 years we'll be using a Pi 5, or maybe even 6. They may have even worked out perfect N64 and Dreamcast emulation by then.
-
@mattrixk Hahaha, perfect n64 emulation. That's a laugh. Not even in 30 years. :D Isn't Pi finished? Can't we have something other than this graphics chip? LOL. I don't even think Broadcom knows how to use it.
-
@Rookervik well they are definitely going to need a new chip if they want to support more than 1 GB of RAM. They are sort of getting opengl working but I'm sure there is much room for improvement on that front.
-
@herb_fargus OpenGL would make the linux desktop environment completely usable, wouldn't it? I'd be really excited for that. Probably get us an awesomely accelerated Quake 1 and maybe even Quake 2. Throw several 3D emulators into the 60fps range with HD resolutions. Ahh dreams...
-
@mattrixk In general main reason for using vector image formats, like SVG, is that
image is resolution independent = image is always sharp whatever screen (or print) resolution/size you use. File size is also usually smaller than equivalent bitmap image.
Due to their nature vectors are mostly used for graphic images/logos; they are not suitable for pictures. -
@UDb23 Well, it makes sense when you put it that way :D
-
@Riverstorm All mame version specific logos basically ready.
I did some additional testing on ES's svg support. As I imagined ES does not support 'advanced' svg functions like blurring; this means gradients and shadows are quite difficult to create.
It makes sense of course as ES is not supposed to be a graphic editor and probably, even if supported, they would slow down rendering of the ES menu.Also checked official logo on the FBA website; it's quite different that the fba logo provided as standard in ES. The current official bitmap logo uses textures that cannot be recreated easily.
Still tried to make a 'simplified' svg version; result so far is this:
Size of the file is bigger than usual system logos in ES but it is rendered correctly with no noticeable delay in displaying the menu ( on Pi3).Will upload the new mame system logos tomorrow.
-
@UDb23 said in SVG format for EmulationStation:
Also checked official logo on the FBA website; it's quite different that the fba logo provided as standard in ES. The current official bitmap logo uses textures that cannot be recreated easily. Still tried to make a 'simplified' svg version.
I think it looks great! After looking at the official logo a few times back and forth I prefer the one you made. It's a fun logo. I do like the glowing bloom effect on the stars/bursts of the original but I think it would throw off the nice clean look. I am a fan of drop shadows but yours looks sharper and just seems to fit the whole scheme better with the other logos but still pays homage to the original. I do like the color palette used too. :)
-
@Riverstorm New Logo pack is available for download -> updated link in post below.
It also includes VIC-20 logo (Fixed colors of the SVG I found with google + added separate german VC-20 version).
FInal burn alpha's finalized new logo is this:
In the ES menu it actually looks much better than here ;-)The pack includes both new and standard FBA logo (the one provided with ES) and their variations.
The standard logo has been optimized as it included some duplicate objects.I'm not fully satisfied with the Mame4all logo as due to its height it results in a quite small logo in ES menu. Suggestions & feedback welcome.
-
@UDb23 I tried to grab your download pack with the new FBA logo but the page displays an invalid link. I have the original pack from the same link or has it changed?
Contributions to the project are always appreciated, so if you would like to support us with a donation you can do so here.
Hosting provided by Mythic-Beasts. See the Hosting Information page for more information.