Cardboard Mini NES + Nes mini and Famicom mini themes

[momaw27]

Great stuff guys!

Really looking forward to all you have in store for us!

[ruckage]

Okay, thanks to @Stuart2773 I haven't added any systems today as I got side tracked with a famicom mini theme ;). As I thought mixing colours was a problem so I think a separate theme using only the famicom mini menu colour scheme will work better.

I liked @Stuart2773 menu design but I had a go myself and moved some things about, made everything a bit rounder to match the real famicom mini menu and think I have a good enough concept now.

So basically, as you can see from this 7800 example, all the system header logos will be the solid gold color and the relevant manufacturer will be displayed to the right. The rest of the background will remain the same for all systems (apart from different shaped frames for the box art on some systems).

I can use the work I have done so far on the nesmini theme to make this so once up and running I will then add any new systems to them in tandem.

Let me know what you think. Also, do you think I should start a new thread for these themes as it's not really the original topic I posted? (or is it possible to edit the topic title?)

edit: damn - just realized I forgot to add the black shadows on that concept art - it gives you an idea anyway.
edit: I've updated the image with the black shadows.

[Stuart2773]

@ruckage

Ok, i may a few changes (mainly for my own personal preference) just to give it more of the original feel,

*added original NES/Famicom navigation buttons
*added the updated boxart & info box (rounded edges) to the NES Mini by @ruckage
*changed the bottom left option buttons to red (NES Mini)
*changed the blue background slightly to make the drop shadow on the boxes more visible.

Stuart.

[ruckage]

@Stuart2773
Hi Stuart.

Feel free to modify the theme how you like for your personal use however the rounded corners/drop-shadows are only actually on the Famicom mini menu (though I personally like the round corners and shadows as well). Also as much as I like the icons I didn't add them as they serve no function within ES so are superfluous and possibly confusing to a casual user (plus placing them at the top as you have on the nesmini theme would cause some problems as some of the system logos would cover that area.).

Personally I'm not sure about the help icons in red - I did try that myself when designing but it doesn't look right to me somehow - they work well against the dark blue which is where they appear on the real menu but not so well on the light grey.

Anyway, a lot of this is personal preference so modify it how you like it :)

[ruckage]

I've been busy all evening and now feeling very tired but I have a Famicom-mini theme ready to try.

Ironically it doesn't support Famicom yet as I've just built it to the stage where it matches the Nes-mini theme but I should be adding Famicom, Snes, GBA and Megadrive/Genesis over the weekend. This version also has sound effects for the scroll list and game launch using wav's that reddit user soulctcher dumped from a real nes classic. Sadly ES doesn't seem to support playing sounds for any other events or I would add more.

You can download it here: Famicom-mini ES theme

Thanks to @Stuart2773 for the inspiration to make this

Edit: I've just noticed that retropie is showing lots of errors on exit due to a small mistake I made. I've already fixed it but won't upload a new version until I've added the new systems as it still works despite the error (just a missing image).

[momaw27]

Great work!

Is it me, though, or are the background boxes for the tg16 boxart too small?

I've tried downloading three different versions and they all seem to be longer than the box background border is...

Do I just have the wrong set of boxart?

Thanks!

[ruckage]

@momaw27 said in Cardboard Mini NES + Nes mini and Famicom mini themes:

Great work!

Is it me, though, or are the background boxes for the tg16 boxart too small?

I've tried downloading three different versions and they all seem to be longer than the box background border is...

Do I just have the wrong set of boxart?

Thanks!

Thanks for the feedback.

It's probably a mistake on my part, I think I've forgotten to adjust the image size in the tg16 xml file. (i'm fairly certain I didn't change it on the nes-mini theme either). I'll make sure I fix it for the next updates.

[momaw27]

Thank you!!

[celly]

Thank you ruckage! I can't wait to try this out on my rpiz.

[ruckage]

I'm going to do some more work on both themes today, I noticed a few minor scaling artifacts with the Famicom-mini theme on the raspberry pi so I'm currently converting everything to vector to hopefully stop the issue.

[ruckage]

Well, vectorizing everything got rid of the scaling artifact I was seeing at 1080p but introduced some different artifacts, and worse of all made the ES startup time painfully slow so back to the drawing board. I think I'll go back to PNG images and try pre-scaling everything to 1080p and see if that produces better results (ideally in both 720p and 1080p).

Out of interest are most people using retropie on a 1080p display? I assume they are.

[Stuart2773]

@ruckage

im using 1080p display,

BTW, was the scaling artifact appearing on the 2nd from top game selection tab?

[ruckage]

@Stuart2773 said in Cardboard Mini NES + Nes mini and Famicom mini themes:

@ruckage

im using 1080p display,

BTW, was the scaling artifact appearing on the 2nd from top game selection tab?

Thanks for the reply.

Yes, you can see it on the 2nd from top game selection tab (on the very right) and also on the gold stripe at the top for some systems (try gameboy).

The reason it's happening is that this is all based on an image which is 240 pixels tall. This multiplies evenly into 720p but doesn't into 1080p. This means when scaling the size of some of the pixels has to vary - this usually happen on a row or column basis so for example one row of scaled pixel may appear as 4 pixels high while another may be 5 pixels high.

For some reason though ES when scaling doesn't seem to scale the same across the entire length of the row so you end up with a step like this:

This is just a mockup but it shows exactly how the artifact appears on the pi.

I could of originally used a base resolution height of 270 pixel which would divide evenly by 1080 but I was trying to mimic the nes classic menu as faithfully as possible and that uses 240 pixels (i believe it outputs at 720p). 30 extra pixels doesn't sound a lot but it would have altered the overall look quite a bit.

Pre scaling works well however and fixes the issue at 1080p but does produce a very slightly anti-aliased picture at 720p but still very acceptable. I have several options now.

• I can scale using Nearest neightbour - this produces the sharpest pixels but will result in varying row heights (this is unavoidable but it doesn't have the artifacts which the ES built in scaling produces). For me this is the best option as it's a lovely clean image at 1080p. Downside is it's very slightly anti-aliased 720p display.

• I can scale using bicubic - this will give the illusion that all rows and columns of pixels are the same width/height but the image is noticeably softer. Downside - neither 1080p or 720p will have really sharp defined pixels.

• I can leave everything thing as it is - perfect 720p image but artifacts with 1080p - not particularly keen on this as the 1080p artifacts although quite minor are annoying me.

[Stuart2773]

my mockup

thats what i was experiencing on mine, and it was driving me mad
also i noticed a gap on the top when the boxart image has been added

[ruckage]

@Stuart2773 said in Cardboard Mini NES + Nes mini and Famicom mini themes:

my mockup

thats what i was experiencing on mine, and it was driving me mad

Yep, that's it. It seems to be a raspberry pi/linux specific issue as the artifacts don't happen on windows.

also i noticed a gap on the top when the boxart image has been added

Could you provide some more info regarding this - do you have a screenshot of the issue and does it only occur with a specific boxart image?

[Stuart2773]

@ruckage

i get a thin black line above the boxart image,
some games its not too bad but on others its noticable,

not sure if its just a resizing issue when scraping images?

[ruckage]

@Stuart2773 said in Cardboard Mini NES + Nes mini and Famicom mini themes:

@ruckage

i get a thin black line above the boxart image,
some games its not too bad but on others its noticable,

not sure if its just a resizing issue when scraping images?

Thanks Stuart.

The theme should be re-sizing the images to fit exactly (again though it could be due to a scaling artifact). Is it just that image or all of the boxart? could you post an offending boxart image here so I can check it and then I can modify the theme if needed?

Thanks.

[ruckage]

Actually, don't worry Stuart. I've just double checked on mine and the black line is there as well (I just hadn't noticed it as most of the box art on mine was quite dark).

I think its due to the scaling of the background image - it doesn't happen on the famicom-mini theme interestingly enough but that is setup differently.

I'll work out a fix - it may just resolve if I scale the images to 1080p as I intend too but if not a small tweak in the xml files will fix it.

EDIT: small adjustment to the boxart position in xml file seems to fix it so I will apply that to all systems affected.

[Stuart2773]

@ruckage

your a genius, can't wait to try the next update :)

[ruckage]

@Stuart2773 said in Cardboard Mini NES + Nes mini and Famicom mini themes:

@ruckage

your a genius, can't wait to try the next update :)

:)
I'll hopefully have more updates sometime this weekend. I've been busy again but mainly just tidying up the theme so it's easier to work with and maintain. I've moved as much of the code as possible into the main nesmini.xml so that global changes are easy to do and I've created separate xml files for each of the box art sizes, many systems are using the same boxart size/shape so now if there is a problem like the black line above the boxart I only need to edit 1 file instead of 15.