Graphic and Theme Editing

[Adultery]

For #2: I use Photoshop but GIMP is fairly similar to my knowledge. I think it's easier to make a black background layer and flatten the image, then use a magic eraser tool to erase the black. This works awesome, especially if there's no granient. If there is, you can just use the magic eraser without adding the extra layer. Just a click here and there and viola! No background.

The other method I employ is to use the background eraser tool and it will wipe out the background without wiping out the foreground image. I haven't tried manipulating Drac's logos, but I only use the wand tool if I'm trying to crop something out of a vivid background. That seems to me like a lot of extra work for what you're trying to do.

/end my 2c

[nullPointer]

Awesome! Thanks a lot for the tips guys! I'll experiment with running some manipulation against the background before removing the foreground image. I'll post some results as I get closer to having something presentable.

@Draco: Many thanks once again for your excellent logos and themes! As I'm learning more about GIMP I keep on referring back to your logos and themes for inspiration as to what would look 'right' in GameEx. Regarding Inkscape, I'm really digging this application. As near as I can tell it can perform any of the vector operations that Fireworks could, and in many cases seems to do a better job. My one qualm so far is that it could really benefit from a layers panel.

@Adultery: It was actually your controller images that inspired me to do something similar for my HTPC setup. I don't have the time right now to devote to making an entire theme (at least not one that I would be happy with), but working on these controller images helps me to get my feet wet at least. Thanks for the motivation! And by the way - major, major props on the way you've lined up sponsors and prizes for the theme competition. I wish I had the time to put together a nice theme, since, wow, those prizes are amazing!

Lastly, regarding the dockable panels in GIMP, I just saw this on my lunch break:

New GIMP Release Has Working Single-Window Mode

Sweet Deal!

Edit:

Regarding the layers panel in Inkscape I just found this:

Inkscape: Layer Dialog

Seriously loving this app!

Edited August 23, 2011 by nullPointer

[Adultery]

Thanks for the props! You got quite a while to iron out that theme. Take your time!

Glad to have inspired you. The Xbox controller PSD is my favorite contribution by a long shot (that took a bit to finish but really adds a nice touch of finesse to my cab). I'm here to help if you need it! Remember this key: Layers are your friend! Name them to make them easier to edit!

Good luck, looking forward to see what you come up with!

[ehuonder]

@nullPointer - Just a couple of GIMP additions.

1) +1 with Draco that you can dock multiple tabs in your tools window.

2) You can make the tools 'windows' act like normal windows with minimize/maximize/close buttons (so their not stuck on top). Edit->Preferences->Window Management->Hint for the toolbox: Normal window. The same for Hint for other docks:.

3) A great way to modify your selection is to use the Toggle Mask feature. In the bottom left-hand corner of the image window, you'll see a dashed line box. When you select this, it turns red, and now all of your normal drawing tools are working on the selection. For example: 1) Use the basic selection tools to get as good a selection as you can get. 2) Select the Toggle Mask 'box' (shift-Q). 3) Notice that anything UNselected is tinted red. 4) Now use Black (Unselect) and White (Select) along with the pencil/paint bucket/etc. to alter the selection to your desire. 5) Select the Toggle Mask 'box' and your selection is good to go!

- I'm using this technique to remove all of the 'mirrored' titles from Draco's logos right now. It works pretty well, but the edges are tough to get perfect due to the aliasing that appears to have gone on between layers. My edges aren't that great, but I doing further filtering, so it hasn't been too bad for my current efforts.

Inkscape - I've only tried this for one project (T-shirt logos), but I loved it. I definitely need to learn a lot on that one. I'll be interested to see what images and work flows that you come up with.

[Adultery]

What blows my mind is that there's so many ways to do the same thing! LOL

It's cool to get hints and tips from others with the same interests. We should have a thread dedicated to how-to posts on some of the more advanced stuff.

I think it would be really awesome if all of us worked together on something and added our own personal touches and released a community theme. There's a lot of talented people here and coming-uppers that we could probably spawn something magical.

[Krakerman]

@Draco here is a Super Gameboy image to do your magic with hopefully

[Krakerman]

Opps forgot to get ya the box as well as you might be able to manipulate them together somehow

[Adultery]

Wow, we're getting into some awfully obscure setups here! Just sayin.

[Draco1962]

@Krakerman - I will not be putting time in for Super Game Boy. My rationale is that i have already put together several extensive logo packs that cover most of the popular and obscure systems available.

Since the tools to create the graphic images are out there, and, as much as I love doing work with system and theme graphics, I would like to encourage you and others to fill in any gaps that these types of system add-on's might fill within your systems and share back on the forums with the rest of the community.

As always, we are here to help if you get stuck along the way or need some advice!

[Krakerman]

@Draco I understand my friend !

@Adultery well it's really not that obsure if you think about it the SGB games had a color mame like bezel around the game and was in color so it's just like comparing the differenences between the Gameboy Color and Original Gameboy games that is why I kept it as a seperate emulator. Look even Wikipedia has a seperate page just for the SGB games. That is where I got the original idea to keep it as a seperate emulator

[Adultery]

That may be, but TBH I don't think I've ever seen a log file with a setup for Super GameBoy. And I've seen a looooooooooooooooot of log files!

[Krakerman]

There is always a first time for everything I even have the file extensions for those games as .sgb so it only makes sense to do it. Anywayz if I finds sometime this weekend I'll work on a image for it.

[nullPointer]

@ehuonder Great suggestions! The Toggle Mask feature works like a champ! Thanks again.

Here's a preview of the controller images I've been working on for my HTPC setup. Currently they're in 720p so they may not be appropriate for all setups (that's all my crappy TV can handle at the moment). I created the background image with GIMP using logos from Draco (Thanks Draco! ), and the vectorized GameEx logo found here (not sure who made that). All the buttons and 'lens' graphics are vector graphics I created with Inkscape.

The first image contains the vector graphics for all the button shapes I could think of (I'm still working on different shapes for Turbo buttons and other 'alternate function' buttons). Starting with GIMP, I add the appropriate system images to the background layer (the logo, and the appropriate controller image) and plug that background into the button template seen here. Using the button template, I select the buttons appropriate to the system being emulated, add the pointer lines, and save it off. The finished product will end up looking like the second picture.

All of this is a work in progress, but I'm hoping to create controller images for all my emulated systems. Any feedback is appreciated. Thanks again for all the help and inspiration guys!

[Draco1962]

@null - I am humbled, sir! Those look fantastic! Eventually I would like to do something similar for my original Xbox S-pads (found on ebay a few suppliers that sell the S-Pad female to Male USB adapters) as well as the Logitech Dual Action controllers (sans rumble). Having the files setup as a PSD (and/or XCF) for those images helps the users adapt them for their specific controllers much as Adultery has done with his for the Wireless 360 Game pads.

[Adultery]

Damn! These look awesome! Thanks a lot pal, now I gotta go back to the drawing board and class mine up! LOL!!

Seriously null, these are awesome! I love the little touches, like the controller image in the corner, and the flames around the turbo buttons... Fantastic job!!!

[nullPointer]

Hey thanks a lot fellas! Seriously, the idea to throw this stuff together would have never even occurred to me without inspiration from you guys. I'm learning about some new apps along the way, so really thank you for giving me the motivation to learn!

@Draco – I actually borrowed the idea for my layering scheme from your XCF/PSD logos. If not for that, I probably would have ended up with a separate XCF for every system (instead of one XCF with separate layers for each system). Here’s how I have the XCF background image layered (additional systems will be plugged in as new layers ).

• Primary_Controller - (this is the RumblePad image)
  
• Logo_NES
  
• Ctrlr_NES
  
• Logo_SNES
  
• Ctrlr_SNES
  
• GameEx_Bubble – (The lower left cutout)
  
• Grid – (I like the look of the grid for now, but may change my mind later)
  
• Backdrop – (Forgot to mention that I took this from a Windows wallpaper site and resized it)
  

After edits are made to the background I plug that entire image into the background layer of the SVG graphic. The layering scheme for the SVG looks like this:

• Button_Guide – (This is where all the buttons and ‘lenses’ reside, keeping them in the SVG makes them a lot easier to position and scale as needed. I’ve considered putting the buttons and lenses on separate layers, but right now it seems like unnecessary overhead)
  
• Background – (Flattened version of the XCF from above – it would be awesome if Inkscape could import XCF layers natively).
  

I think I’m at the point now where I can churn through my various systems relatively quickly (key term being relatively ). Not sure how interested others would be in the XCF/SVG files, but feel free to let me know if anyone wants to have a look.

Lastly a question: If I export a PSD from GIMP will it accurately preserve the layers? (I don’t have Photoshop to test this out)

Thanks again guys!

[Draco1962]

Yes it will convert nicely to PSD. I have started to include both PSD and XCF with my projects since we have quite a few users using both products.

[Adultery]

I'd be happy to test your PSD layers for you but I use PSDs from Drac and they work great.

[ehuonder]

Those look great nullPointer! Keep it up!

[nullPointer]

After the positive feedback from you guys, I'm going to take a step back and retool these images to be a full 1080p. I'll just have to tell my TV to suck it up! (at least they'll be future-proof should a decide to upgrade my TV) I figure if I'm releasing something that others might be interested in, I might as well release it in a more preferable resolution. Additionally I plan on adding more primary controllers to the mix so that some of the more popular choices are represented (I'm thinking an Xbox 360 controller, and a DualShock 3). That way if anyone wants to incorporate these images into their system, some of the work is already done for them.

Thanks again for the feedback! I'll post the whole works once I get the above changes made, and add more emulated systems to the layout.

[hansolo77]

I tell you what Null, those look a helluva lot better than mine:

And the scariest one:

[Draco1962]

After the positive feedback from you guys, I'm going to take a step back and retool these images to be a full 1080p. I'll just have to tell my TV to suck it up! (at least they'll be future-proof should a decide to upgrade my TV) I figure if I'm releasing something that others might be interested in, I might as well release it in a more preferable resolution. Additionally I plan on adding more primary controllers to the mix so that some of the more popular choices are represented (I'm thinking an Xbox 360 controller, and a DualShock 3). That way if anyone wants to incorporate these images into their system, some of the work is already done for them.

Thanks again for the feedback! I'll post the whole works once I get the above changes made, and add more emulated systems to the layout.

If you go to 720P should be sufficient I would think.

[Draco1962]

I tell you what Null, those look a helluva lot better than mine:

And the scariest one:

Not too bad, Han. The only criticism I could throw is that when looking "at a glance" it could be a little confusing trying to translate what the controls are from the original system controls to the game pad. It may work for you if you are familiar with what buttons on the original systems are fire, start, etc. Since I am not familiar with all systems, it would be more confusing for me.

[Adultery]

That's what I was thinkin. The controls screen rolls by in 5 seconds, but it really depends on what you like and how many people use it.

You're being modest though. Not bad for a first whip!

[hansolo77]

These are actually the same controller images I used before the fire, they were stashed on my server for safe keeping since they took FOREVER to make. The hardest part was finding a decent enough controller image to use and draw lines from my own controller to them. After that, I kept a notebook with each button assignment, then all I had to do was match them up. Granted, null's looks much more polished. This was only my first go, and null's obviously got a bit more skill than me. It works for my purposes. You can always click the "View Controls" link in GameEx to see it longer if you need too.