Graphic and Theme Editing

[Draco1962]

Theme Title: Enter the Dragon

Theme Type: HTPC

Theme Version: V4

Theme Resolution: 1680 x 1050

Theme Description: Two-tone wood elements with an Asian flare.

Theme Features: Large collection of original logos with and without system images. - Extensive Photoshop PSD and GIMP XCF files included for custom foreground and background files creation. - Theme-based Vertical Bezel and Windows Desktop/Logon Screen included - Works well with default menu or custom menu layouts. - Makes good use of transparencies with Color Key disabled.

Date Submitted: 06/03/2011

Download URL: http://www.gameex.co...he%20Dragon.zip

Download Size: 132 MB

Additional Notes: Give it a try, let me know what ya think. Simplicity of display was the goal without appearing too busy with too many visual elements in the design itself, while keeping with most GameEx features enabled.

[Draco1962]

Theme Title: Space Invaders

Theme Category: HTPC

Theme Version: V4

Theme Resolution: 1680 x 1050

Theme Description: Theme based upon Bally Williams Space Invader bezel and elements and original game sounds.

Theme Features: Large collection of original logos with system images. Scroller, Date, and Time features enabled. Color Key disabled to take advantage of "true black" and transparencies. Weather, Pop-up, and Select 1 & 2 disabled to avoid clutter and keep arcade machine "feel.".

Date Submitted: 07/14/2011

Download URL: http://www.gameex.co...%20Invaders.zip

Download Size: 94 MB

Additional Notes: Special thanks to Adultery for providing the system sound files and to various members for providing encouragement and feedback! Also thanks to Celly for providing me with a copy of the theme in action!

[Draco1962]

Theme Title: Joust

Theme Category: Cabinet

Theme Version: V4

Theme Resolution: 800 x 600

Theme Description: Theme based upon the original bezel and elements and original game sounds.

Theme Features: Large collection of original logos with system images. Date, Time, Weather, Select 1 & 2 features enabled. Color Key disabled to take advantage of "true black" and transparencies. Scroller and Pop-up disabled to avoid clutter and keep arcade machine "feel" as much as is possible.

Date Submitted: 07/20/2011

Download URL: http://www.gameex.com/themes/Joust.zip

Download Size: 67 MB

Additional Notes: Special thanks to Adultery for providing feedback!

[Draco1962]

I have created this thread with the sole purpose of maintaining a location where we can discuss and share image and theme editing techniques, discussions, and tutorials for all things GIMP, PhotoShop, or other editing software related.

Below is a list of the more popular FREE PROGRAMS (Online or for download) that I will update periodically with additions as they come available from you. If anyone can provide names and site links to good tutorial sites for these programs as well as PhotoShop, I will gladly include them as well!

Free Image Editing Programs:

The GIMP (Gnu Image Manipulation Program)

Inkscape

Paint.net

MyPaint

PaintStar

Online Fonts and Font Manipulation:

Flaming Text

Tutorial Site Links:

Gimp Tutorials on Pixel2Life.com

To start things off, please take a look at the attached images and let me know what ya think. Tinkering with scan line effects in GIMP. Thanks!

[ehuonder]

I like the scan line effects for some themes. If your logos become available in both styles, I'll have to switch to them almost full time! After that, you'd only missing vector graphics styles... Nice work!

[Draco1962]

Thanks for the feedback!

The effect is actually very easy to achieve in GIMP (probably equally as easy or maybe easier in Photoshop). What I did was:

1. Loaded the image

2. Applied a new layer and chose the default Foreground Color (which is 000000 - Pure Black).

3. I then accessed the Filters, selected Remove Every Other Row from the Distorts Section, an removed every even row from that black layer.

In effect, you are creating a black "screen" consisting of alternating odd rows of black pixels that is blocking the corresponding rows of pixels from the image below.

Now this is reflected in image _Console__Atari_Pong-Ex1.png attached to this post. I like this option better as it allows me more flexibility and preserves the alpha transparency (gradient dissolve) effect from black to nothing. If I apply directly to the image, then I have to create a solid layer of black below the image (see example image _Console__Atari_Pong-Ex2.png) or else the image appears as if it is disappearing - example _Console__Atari_Pong-Ex3.png. This is due to the fact that I have removed every other pixel row from the actual image exposing the alpha channel below.

[celly]

From the first post, I love the look of the icons with the scan lines. Of the Pong images, the second image with the solid layer of black I like the best. These would be a great addition to the Space Invaders theme!

[Adultery]

Thanks for the share Drac ol buddy!

Teaching the community to fish will feed them for a lifetime.

[Draco1962]

All - I have uploaded Logo Pack #4 which Tom has graciously added to the main GameEx site. It is a fairly large file as it contains all of the logos from packs 1-3 and some more recent. All of the logos are in Photoshop .psd and GIMP .xcf formats and sorted by category. This will allow those using either Photoshop or GIMP to save the files however they need to. I have included with each .psd/.xcf the following:

1. A scan line layer that, when selected, will overlay the selected image below it. This gives the effect of monitor/TV scan lines to the image.

2. Image layers. All logo images have been sorted into separate .psd/.xcf files by category - Arcade, Console, Corporate, Emulator, GameEx Core-Misc, Handheld-Fruit Machine, PC-Pinball.

3. Color layers beneath the image layers so that the end user may "colorize" the background underlying the image as desired to fit their theme.

Give them a try and let me know if you have any questions.

P.S. A word of caution! If for some reason you resize your images, the scan lines will not look right. For example, if you enlarge the res form 640x480 to 800x600, the pixels will multiply for all aspects of the image, including the scan lines and they will appear too thick. Always best to use a scan line layer created fresh for the size image you will be displaying and that image should not have scan lines already in it.

Edited July 30, 2011 by Draco1962
Additional word of caution!

[celly]

Thank you Draco!

[Adultery]

Thanks again Drac! You da man!

[Adultery]

Do I need to tell you my opinion? It'll be a strong competitor for the contest for sure!!

[Draco1962]

I think those with the HTPC rigs that like the HSL enhancements for MAME will also like this as it has a scan line layer in the image fields so this will ensure a similar effect in the demo vids without having to edit them for the effect (same goes for the static snaps), and will look especially good with the H264 480p MP4's available on EmuMovies for those with paid memberships. The 240p MP4's look nice as well, but the more pixels you can throw at a larger display the crisper the image.

[Draco1962]

Just a quick share for those of you that are designing your own themes and might need a quick reference as to scalability within aspect ratios. I have found this to be quite handy. Generally speaking, when you scale images within the same "family" there is little to no distortion (although sizing up from a smaller image res will degrade the quality and sharpness of the image, pixelization, etc.)

Also, a hex table of color codes for those GIMP and PS Pros that I have found to be very useful.

[Adultery]

Everyone should have a hex table!

I often use this along with the eyedropper tool.

[ehuonder]

Thanks for the images! I've seen the resolution one before (and refer to it often), but not the hex image. That will come in handy, instead of guessing so much.

[Draco1962]

To All - As you know I am working on another theme. I am also revamping some of the logos from the most recent packs. If you have any good logos (no drop shadows, vector preferred when possible, the larger the better for scaling) and/or system images, please share them here!

[Draco1962]

Well, things are moving along at a deliberately slower pace with my Hexed theme. It will be a 16:10 V4 theme (1920x1200) geared towards HTPC and will be employing recent changes to the Theme Editor. Because of the layering limitations I have found my creativity challenged, but in a positive way. While not ideal, it is getting better and I hope to have some solid suggestions to provide for Ben and Tom as they continue towards the next generation GameEx Theme Editor and Skinning utilities!

Here are a few snaps and, as always, your feedback (constructive criticism) is always welcome! As you can probably tell, I am taking advantage of the foreground top most setting in theme editor. This makes the selector bars appear below the foreground image which looks more polished. I am also using the scan lines effect over all image files. I will also have the header bar populated with system names and system images as they are available. The completed theme will include the core system displays and will have PSD/XCF files so that the end-user can create foreground images as needed for their specific emulated systems. I have replaced some of the logos entirely and added color where previously the gradient dissolved to transparency.

[Krakerman]

Looks freakin sweet Draco! Yeah I agree we need a newer NextGen Theme Editor for GameEx! I really don't like the current one at all. Maybe that's why we don't see more themes out there.

Really looking forward to you releasing this one

[hansolo77]

@ Draco

The bottom info far looks too difficult to read. The icons are in the foreground, but the text next to them is under the hexagon grid. This makes it hard to read that stuff. Is there a way to bring the text to the foreground too? Like the cloud in the weather. Just looks wrong? Also, I'm not a huge fan of scanlines. Some purest out there might, but if I got this theme, I'd be hard pressed to find a way to disable them...

[Draco1962]

@ Han - The scan lines are optional and if the end user prefers, the PSD file can be used to create the foreground files they need without the scan line layer included. I have to agree with you about the hex pattern overlying the text in the footer and have modified it to remove this layer so that the text is not affected. Thanks for the feedback!

[Krakerman]

Hey Draco have you ever made a Super Gameboy Image to go with your image packs that you have made?Also any ETA when you gonna release your latest HTPC Theme?

[nullPointer]

I’m using a combination of GIMP and Inkscape to do some image editing and creation. I’m learning the ropes for both of these programs, but have used Fireworks for a number of years. I’m finally making the switch since I figured it was high time that . . . ahem . . . I go legit (if you know what I’m saying ) . I’m using GIMP for bitmap manipulation, but prefer the vector capabilities of Inkscape for creating new graphics. These programs seem to cooperate fairly well together.

I’ve got a couple questions for the local GIMP masters around here. I’ve been working with Draco's logo packs in order to leverage his awesome talents into some controller images I’ve been working on. So my first question is:

• Hey Draco, is it alright if I’m modifying your images for my personal use?
  

Specifically I’m using GIMP to remove the backgrounds from the logos so that the backdrop is purely transparent. To that end I’ve been tracing paths around the stuff I want to keep and removing the backdrop via the wand tool. This can be time consuming depending upon the complexity of the images I’m tracing. The other downside of this technique is that the ‘foreground’ image ends up with a thin line around it. It's not terribly noticeable so long as my lines are crisp and I use a neutral line color. I’m sort of OK with that part. (An argument could be made that I should use the lasso tool rather than tracing a path, but what can I say I’m much better at playing connect the dots than I am at freehand artwork ) This leads me to my next question (for you GIMP masters):

• Is there a better and/or preferred method for pulling this off? A faster technique would be fantastic. Perhaps this just amounts to needing more practice? Additionally I’d like to do away with the tracing line resulting from my current technique.
  

Finally one last bonus question:

• What’s a good technique for managing all those floating panels in GIMP!? Perhaps I just need to hook up a second monitor and move the panels there, but it sure would be sweet if I could dock those suckers!
  

Thanks in advance for any help and/or suggestions!

[Draco1962]

Answer to question #1: Yes you may! A nod in my direction for any submissions is nice but not necessary. As I see it, 99% of what we work with and modify is borrowed and manipulated.

Answer to question #2: This is a multi-part answer to your question. I have had to go back and extract images from my logos for other work. Because the transparency fades to black, in some cases I have found that adding another layer underneath (often black is the color of choice) makes it easier to use the "magic wand" tool to obtain an outline of the image. You will find that there are tool combinations that will need to be used to obtain a clean extract - eraser, wand, select by color tool, lasso, etc. Additionally, once I have a somewhat clean image to work with, I will often use invert and shrink. I will first "select all", then click on Invert, then Shrink. Depending on the size of the image, I usually shrink the outline by 1 pixel. I then click on Copy and then Paste as a New Image. Again, you may have to wash-rinse-repeat any or all of the above steps until you get a clean, crisp image.

Answer to question #3: I have a second monitor so this is not a problem for me. I believe that you can dock several items within the Toolbox but to be honest, I have yet to figure it out.

I will have you give Inkscape a looksie - perhaps you can give me some pointers!

[Draco1962]

Hey Draco have you ever made a Super Gameboy Image to go with your image packs that you have made?Also any ETA when you gonna release your latest HTPC Theme?

Probably not or it would be in there! LOL! Do you have a good image for me to work with? No ETA announcement other than soon...