I used Microsoft Paint to create the Standard and Realistic skin images for Free42. For the built-in skins for Plus42, I used GIMP.
Microsoft Paint doesn't do a very good job of exporting GIF images, or at least, it didn't when I was using it -- maybe it's better now. I would save the images as BMP files, and then use other tools to do the BMP-to-GIF conversion, specifically, the Netpbm tool set. With GIMP, I used a similar approach, saving the images as PNG and then using Netpbm to do the scaling and conversion to GIF.
As far as the layout files are concerned, be sure to read the layout format documentation carefully. You can find it in skins/README.txt in the Free42 and Plus42 source repositories on GitHub, and in the skin collections in my web site:
The key images for the pressed state can be basically anywhere in the skin image. For skins where the pressed state simply moves the key a couple of pixels, there aren't even separate images. And the annunciators can be basically anywhere as well.
When designing skins for Plus42, there are a few additional wrinkles, but basically any skin that works with Free42 will work with Plus42 as well. The additional layout elements specific to Plus42 deal with the way the display area is expanded, and with the way the +/-, E, R/S, and period keys are rendered differently when the equation editor is active.
One final point: while the Skin: element in the layout lets you specify x,y,width,height coordinates for the section of the gif that is used to paint the main window, you should always use 0,0 for x,y. There aren't any skins that place this rectangle anywhere other than the top left corner, and the skin display logic doesn't really support that. This could be fixed, but there was never an urgent reason to, so this bug is basically as old as Free42 itself.