Creating Themes and Reference Tuts?

[Dman1]

Hello, I am a newbie theme creator and got a few questions.

Where is a Tutorial on all the theme.xml options and hypertheme v. 1.1.5  reference material hiding at? Ive only seen one good one on this Arcade Neo site that is non english and I can't seem to save a translated page of it? How do you tilt videos or make them rounded. Where are all the particle effects located for download? Please Help, Thanks in Advance! (Been enjoying Hyperspin for over 10 years! Best Front End Ever.) Creating unique 16:9 themes for the games I can't find themes for anywhere. Finishing my collection to put in my nearly finished cab.

This is the best tut I have seen on the subject:

http://www.neo-arcadia.com/forum/viewtopic.php?t=39026

If some one could capture this in English with all pics and videos! Post it on here would be great or a zip file to download..Thanks again in advance!!!

[THK]

I think there were some around. But it's easy just to play around in HT for a bit and save it to a theme and see how the .xml is structured. Very easy to grasp it.

Donnu where they are, but you have as much luck as me in finding them.

Also, if you have anything better than MS Paint, make you're own vid border and stay away from using HT generated ones.

16.9 themes is a whole other topic. Basically you build the theme in Photoshop, resize everything to 1024x768 and it'll be stretched out correctly by HS when playing. Or just make it 4:3 and convert it to 16:9, there's a tutorial thread on it somewhere.

Particle effects are either artwork layers in the theme and generated by HT or you'r talking about the ones inbetween the themes?

 

[Dman1]

I finnaly managed to save a translated copy of the tutorial. I meant the Particle effects you put in themes. Figured out how to tilt videos. also.

Anyone have any video.png files like a pack of them?

[thatman84]

I dont think there are many HT tuts about. Avar done a bunch on 16:9 theme stuff in the tutorial section.

The only half decent Ht tutorial I remember is from a person we cant speak of which is a pain

Please share what you find out. Also I remeber subzero posted some dummy flv videos for use with HT. Cant find that link right now though

 

[thatman84]

Actually it was SubZero

 

[Bungles]

I probably cant do much of a video tutorial. But I can do a quick guide on how I create themes in general. With pictures etc.

Creating the media itself you are best to read the tips and tricks from the experts.

A lot of the themes I have made have been for modern PC Games so media is usually already available in nice formats with transparency etc.

Give me a few moments and will do something up.

[Bungles]

Please note this is not official, and probably not the ideal way to do it. Its just the way I personally do it.

HOW TO – Create 16:9 Hyperspin Themes

HyperTheme Basics

HyperTheme has some limitations but overall there is a lot of room to create almost anything.

Most of the media for a theme will be saved within the Theme.zip file but the video Layer will need to a separate file with the same name (Case Sensitive) which will be in your video folder for your wheel/collection etc.

Layers

Background Layer: Hypertheme has 1 Main “Background Image” Layer but it will also allow the use of SWF files which can be embedded with video/animation.

Image Layers:  Hypertheme has 4 Main “Image” Overlay Layers but it will also allow the use of SWF files which can be embedded with video/animation.

Each Layer has coordinates and variables you can adjust however they are limited to overlay each other with 1 being on the bottom and 4 being on the top.

Video Layer:

It also has a video layer for commonly video previews, trailers etc. It will only accept .FLV File types but Hyperspin itself also supports .MP4 files so you can just rename extensions or have a dummy video file you can use like suggested above. Just be sure to set its dimensions as per further instructions below so when referencing the real video it snaps back to the correct size.

Each layer can be accessed but the buttons in to toolbar at the top (Hover for Tooltip)

Preparing 16:9 Media

To make a theme in 16:9 you first need to create your theme in an external program like Gimp, Photoshop, Ulead/Corel Draw or Photoimpact etc.

Personally I use Ulead Photoimpact XL as this is what I have used the most in the past and easiest for me to work with.

1.       Collect your media.

2.       Layer your artwork in your preferred image editor remembering if you need to group things due to 4 artwork layer limitations.

Example

With the example above I have a background layer, a title and developer image and 2 Artwork Images.

I name them just Title, Developer, 3 and 4 so it’s easier to grab them when building on the fly but you can call them whatever you wish. (They will be renamed Artwork1-4) when the theme Zip is built for you.

Once all your layers are ready and saved as .png files you can now run Dark13’s script if you have Adobe Flash Professional.

These can be found here:

I run the PNG_to_SWF_dark13_1080p_scale_Artwork.jsfl script for all my artwork as it smooths edges and coverts media to a ratio that looks squashed but as Hyperspin is currently natively 4:3 and stretches it will revert back to its original beauty on widescreen resolutions.

 

Using the script is easy, you just open the file and when prompted give it the folder of your theme contents. It will then open each file and convert them into the same folder so you will .png and now .swf versions that have been converted.

If you do not have Adobe Flash Available it’s hard to get the same quality out of your media when squishing it but if you want you can try reducing the image size to 53.333% on the X axis and 71.111% on the Y as this is what the scrip does.

Adding media to the Theme

Once you have all your media ready in swf and converted open HyperTheme and from a blank theme (Usually what it starts as) add each layer remembering to use the .swf version and not the .png(s).

The left menu has the properties for the layer you have selected so you can adjust these if you wish.

Properties Section: X: Where on the X Axis the Centre of the image is. Y: Where on the Y Axis the Centre of the image is. R: The base rotation of the image layer. Animation Section: Time: The Time for the animation to take. Delay: The delay before the animations begins and/or the image starts to appear etc. Starting Position: If you want the image to fall from the top, or enter the screen from the left/right/bottom etc. Animation Type: This is where you can choose to have it fade in or spiral in etc. Tinker with these and you can preview to see what it does. Note: Some do not work with SWF converted types. Resting Animation: This is where you can have the image rock or hover etc after the first animation has completed.

When you are happy with their positions, times and/or animations etc. add in a video preview that you have saved or renamed as flv or use a dummy file. 

Set its location remembering layers 2-4 will overlay the video and only 1 will be below it. With 16:9 video I force its dimensions to both and set it as 480x360.
It will then revert back to its original widescreen version like the converted image and background layers.

Once you are happy with your preview save your theme as and choose if its an individual game/main menu item etc.
 

That's pretty much it. Once you start using the program more you will find new things, and start pushing yourself further to create better themes.

Once you open a theme.xml file in a zipped theme you can see the formatting you can just write the xml file in a text pad and create the .zip yourself if you want. 
Which was the old way before BBB created the hypertheme program to make it all easier with a GUI. And well before my time.

 

I can copy over the quick guide on how to create video backgrounds etc using Adobe Premier and Flash etc if you want and have access to those applications so you can create things like this with minimal fuss.

 

Any further questions or if I made a boo boo in this guide let me know.

PS. There is also a guide on how to setup your 16:9 media in a lot more depth by Avar posted here.

Cheers,

Bungle(s)

[Dman1]

Does anyone on here have a link or a pack they can upload?  of Video border.pngs??

[Bungles]

Not a pack but I have a guide I use for 16:9 Videos I snake from Youtube as I set them as 480x360 in hypertheme to revert back to 16:9.

Usually I just change the colour/texture of the frame as I am no artist.  But you could layer over it for a reference size etc.

I mainly just use the in-build colour frames these days as I am lazy.. haha. But I used the above for my Telltale Games Collection.

 

[Thepriest]

Thanks alot Bungles for explaining it a bit.

I had a hard time finding information about it again because i couldn't find my own Hyper Theme any more and search wasn't helping much so i tried a search on my computer and found it again.

I haven't created themes in a long while since like last time was 2010 i think

I have started rebuilding my arcade cabinet since it was finished at 2010 but it goten broken by some one without me having a backup.

I wanna try and help creating themes again but it has been a while and now i seen this so i can do some more

 

[Bungles]

No Problemo. 

Its not a complete guide but at least it breaks it down some.

Its actually quite an easy process once you get used to it, the challenge then becomes getting the artwork in HD.

But Google Images "Whatever SVG" or "Whatever PNG" usually gives good results, you can also change the prefered sizes etc or exact resolutions for 1080p backgrounds etc.