Jump to content

All my products and services are free. All my costs are met by donations I receive from my users. If you enjoy using any of my products, please donate to support me. Thank you for your support. Tom Speirs

Patreon

Spinning Ball Animated Wheel Images


scutters

Recommended Posts

Spinning Ball Animated Wheel Images

View File

636087026_SpinballWheelsneon.png.b9dd3eb56d8ac8b5c41918483f1e1c6a.png1262560592_SpinballWheelsfrontandback.png.94d8233136f46197427e2826f6888ab0.png2072999932_SpinballWheelsfront.png.e9a2ee1bd9f9ac0edb8825d34ca0d127.png

Note - This is a not a pack of pre-built wheel images

These are two apps that will allow you to easily build animated wheel images (.apng format) for all your tables, either as rotating plain, neon text (as seen in preview images above) or convert existing images to spinning spheres with options to bulk build all your existing tables or single file build for any tables you add later. No more searching for a wheel for the latest table release - just build your own!.

The apps do not overwrite your existing wheel images. New images are created in a separate ('Made') folder where you can view them before deciding if you want to use them (at which stage you can backup existing wheel images if you wish and then copy the new wheel images across)

Prerequisites

  • The apps are 64bit only. They will not run on a 32bit OS (sorry!).  They also needs .Net 4.5 to run. 
  • You should only use the images produced by this app PinballX  with version 4.84 and later.

Install

No installer as such, just download the file and extract the contents to a folder somewhere and then run TextToSpinball.exe or ImageToSpinball.exe

Using the Applications

Hopefully the app is straightforward, but just in case;

Text To Spinball

image.png.189aedc983ad54ea0027f7cf1e6b605e.png

 

Input Text Area

Set the text to be converted to a spinning ball if building a single animation, with some options for formatting. Format options are used for both bulk and single animations.

Output Image Font

Select a font to use. You can have different fonts for different systems if you wish (or if you have time specific fonts for individual tables). I tend to go for 'chunky' fonts like compacta, or a small caps font like mech effects 2. 

Output Image Type and Format

Set the resolution required and number of frames for animations. To produce a static single frame png image set Rotation Frames to 1. Larger resolutions may not necessarily look better (because of the animation and short time each frame is shown), but will increase file sizes (as will increasing the frame count). Then set the animation type required plain text front, front and back or neon.
For neon you can also set to use a colour or leave it as Auto which will pick a colour based on the text being animated (rainbow colours as the PinballX wheel is rotated), and from v1.1 also choose if you want to 'fill' the letters with dark transparency (useful if not being used with underlays in PinballX)

Overlay APng in Image - use this option to overlay the animation on top of an existing static image file. The static image will then be the background for the completed apng (the static image can be larger than the animation size and can be placed at x,y co-ordinates)

Frame Timing

Speed up or slowdown the animation as you wish. The variate timing option will offer a degree of randomness (0-50%) if you want to vary the speed of wheel image animations (variation is by animation not frame to frame, so that the wheels will 'spin' in PinballX at slightly different speeds).

Image Compression

Compress output images using pingo compression. Use the default auto option unless you need more compression to lower file sizes or less compression because artefacts are seen in output images.  If using manual compression note that 1 is maximum compression, 100 is minimum.

Overwrite Existing Files - If unchecked then existing files (in the 'Made') will not be overwritten and will save processing time in bulk mode if no output options are changed and you are just creating wheels for new tables.

Bulk Build Apngs - Select either a text file or a PinballX database xml file to process. If database xml is chosen wheel images will be created using text of the Table Description filed and named as the Table Name field, for txt files the text and file name will be the same single line from the file. Using xml as source allows you to copy the processed wheels to your databases' Wheel Images folder with no need to import individually (backup existing wheel image first!).

Use Esc key to stop processing if needed.

Open Made Folder - Opens the output folder. 

Build APng - Single animation build using text for as entered in in Input Text area.

Image To Spinball

This application is mainly intended for use converting logo type images to spinning animations.

image.thumb.png.020971b35a49db681e364c51b0a3995e.png

 

A lot of the options are very similar to Text To Spinball.

Exceptions are;

Source Image 

Select an image to convert. 
For images with transparent backgrounds you can also select to 'auto pad' the image ensuring a transparent margin is present around the image (to help prevent warping around the top and bottom of the source image in the ball image, and wrapping the start and end of the image together as it rotates without having a gap. For images with solid backgrounds best results can be achieved be ensuring a tileable background is used (to prevent a visible seam during rotation) and by using a square canvas.

Output Image Type and Format

Underlay Colour - Select a solid colour for use as a background colour in the output ball.
Use Suggested Underlay Colour - Intended for bulk build of apngs where a complementary RYB underlay colour is auto selected based on the dominant colours in the source image
Rotation Axis - Control the angle of rotation for output images
Add Light Overlay - Adds light/shadow highlights to sphere image produced.    Full Sphere - Applies the light/shadow to transparent areas as well.  
Add Tarcisio Overlay - Adds Tarcisio style overlay around the sphere images. Thanks to Rajo Joey for the template used.
Add Extra Overlay - You can select this to add an image as an extra overlay (top level) on the output image. Options allow for placement of the overlay location on the output image. Full control of the overlay location can be done by manually adjusting the overlay image using a canvas size of 1000*1000, the placement and sizing of the overlay will then be respected relative to the output resolution from that.

Bulk Build Apngs - Select image files rather than from database or text files.

Example outputs

Source Image

image.png.991081677157d61517adad19808fb6fd.png

With 250*250 resolution set

Tarcisio         image.png.d63ed27a268aac2e7f6eefec0246a073.png

Non Tarcisio image.png.9ec668d38e671f9b49f294000295eebf.png

General Usage Tips

  • Some files are used by both applications - don't run ImageToSpinball and TextToSpinball at the same time!
  • Only use the wheel images produced by this app with PinballX 4.84 or later
  • Refine / test your settings using single image output before running a bulk build.
  • When bulk processing the app is likely to use 100% CPU so best to just let it run when you're not trying to do something else. Depending on CPU you can expect to process one or two wheels a minute.
  • Different output types produce different file sizes, neon images are the largest. Different fonts also produce different file sizes. You may need to tweak combinations of output resolution, frame count and compression settings to a find file size range that suits your font and output type.
  • Configuration options are saved on exit and restored on next use so any new wheels you make will match the style of ones you made last time.
  • If you want to preview any of the 'Made' files before adding them to PinballX then right click to 'open with' and choose any modern browser like Edge or Chrome, or use MNGer
  • Although intended for use as wheel images you can use apng files for other media areas in PinballX (Topper etc), and with the release of PinballX Database Manager 21.04.08.0 you can also convert them to mp4 format during the import (which will reduce file sizes) if being used in other media areas. The images will likely look stretched into an egg shape though if your defined screen area is not square.
  • Sample PinballX Underlay and Overlay images for use with these wheel images are provided in the support thread. 
  • If the apngs produced by these apps do not play back correctly in GameEx apps then try building them with the compression option turned off (and then try alternate compression methods e.g. https://tinypng.com/).

Any Issues

Please  attach the Log_TextToSpinBall.txt and Config_TextToSpinBall.ini files or Log_ImageToSpinBall.txt and Config_ImageToSpinBall.ini from the apps folder with a description of any issue.

Other Notes

The application uses PixelMap, Magick.Net, ColorPickerapngasm and Pingo libraries, my thanks to their authors. Please visit their sites and support their work!

Feel free to distribute any wheels made with the app as you wish, please don't distribute the app itself - for support reasons just include a link to this page instead, thanks.


 

  • Like 3
Link to comment
Share on other sites

An idea of what the different wheel types look like in use. Apologies for low quality, just a quick knock up on the test system using low quality video settings to keep size down.

No underlay;

 

Using one of @Schreibi34's excellent underlays;

 

 

Edited by scutters
new versions of videos uploaded after conversion to different format
Link to comment
Share on other sites

  • 1 month later...

Simple underlay attached that should fit around wheels created with the spinball app, and tie in with the style of the Additional Detail area box without obscuring the playfield view much (make sure you set underlay image type in PinballX display settings to Fill screen)

 

image.thumb.png.7903e8f13988f7dd1108edcda5ea7135.png 

 

Posted here as i don't think it'll work at all well with 'standard' wheel types. 

Unzip the attached and copy to PinballX\Media\Images\ folder to use it for all systems, or rename as a system name and place in PinballX\Media\System Underlays\ folder if only using for a specific system.

 

underlay.zip

 

Link to comment
Share on other sites

And an optional matching Overlay.apng to go with the underlay..  this just adds a bit of animated colour over the bottom grey bar. Fairly subtle.

image.png.5438ecaa1111119e433e2de36e4a8fd0.png

 

Unzip the attached and copy to PinballX\Media\Images\ folder to use it for all systems, or rename as a system name and place in PinballX\Media\System Overlays\ folder if only using for a specific system.

Link to comment
Share on other sites

  • 5 months later...
23 minutes ago, Fruit-emu_NL said:

But I'm getting this result. Can you tell me what to do to fix it?

Got to honest, at this moment no i can't :unsure:

I've never used Touchplay but i thought it was pretty much the same as PinballX but for touch screens. The underlay looks correct so it is set to 'fill screen' but the wheel image looks more middled on the screen than in PinballX. All i can suggest if you're on the latest version is trying to edit the underlay image so that it moves up the screen to match the wheel location, unless Touchplay has more options for the wheel location than PinballX?

Link to comment
Share on other sites

Hmm.. sorry, not much else i can suggest then except to double check the wheel image itself to make sure it is a centred square image and there isn't a bug i'm unaware of that has caused the app to produce an image in the top half of a rectangle. Just change the file extension to .png and open with paint.net or whatever to check.

Link to comment
Share on other sites

2 hours ago, Mike_da_Spike said:

Not sure if I understand it right, but isn't it 'just the overdlay that needs to be adjusted ?

Underlay, but yeah that should do it. I don't know why it's off in touch screen though. Maybe not a standard screen res?

Link to comment
Share on other sites

  • 4 months later...

This is an excellent piece of work and I am going to tinker and put it to work creating some system logos for GameEx.

A Feature Request: Add ability to read selected layers from a .psd file for source image, overlays, background color or image.

  • Like 1
Link to comment
Share on other sites

On 2/20/2022 at 12:06 AM, Draco1962 said:

This is an excellent piece of work and I am going to tinker and put it to work creating some system logos for GameEx.

A Feature Request: Add ability to read selected layers from a .psd file for source image, overlays, background color or image.

Hmm...might not be as straightforward as it sounds - when mapping the pixels to a sphere the resulting image dimensions are significantly smaller than those of the source image (and therefore also any unchanged layers). Other layers could be resized to match, but the app would not know the dimensions of any visible area left by overlays so it might not match correctly in the output. I'd have to try and get my head back round the maths!

Alternatively i could add some standard underlays / overlays to select in the app presized for the output that could be used as templates where an edited custom version could also be selected.

Let me know your thoughts, and if you have a link to psd file you're thinking of using i'll have a look and see if plan A with selectable layers could work.

Link to comment
Share on other sites

I don't have a psd in mind at this time. I definitely understand that it may not be possible due to how the animations are generated, etc.

Selectable ROYGBIV + Black, White, and Gray color underlays for use with the Tarcisio frame would be an awesome enhancement.

Link to comment
Share on other sites

@Draco1962Here you go mate, give this version a go..

Only two files in the zip so not the complete set of required files for the app, just paste them into the apps current folder that will have the other dependencies already.

You should be able to select an underlay colour, and as a little bonus add an extra overlay image (top layer above Tarcisio image). Hopefully you can guess how to use the features. You should be able to build something like;

vp4.png.bb3b314ffdad38248a5dc6902506a1b2.png

I'll update the proper release and notes if you're happy with it

 

Edited by scutters
attachment removed - update released
  • Like 1
  • Thanks 1
Link to comment
Share on other sites

american laser games.gif

Looks pretty awesome with a little color added. I will need to tinker a little more and find a way to convert logo files that tend towards square in their dimensions more into a rectangle layout. That will make the middle a little smaller but mitigate some of the horizontal disortion closer to the middle of the rotation. 

Awesome job - I think this is a great addtion! :cheers:

EDIT: Still tinkering with the additional overlay option.. stay tuned!

  • Like 1
Link to comment
Share on other sites

I am encountering an error when using the "Add Extra Overlay" feature when set at 500x500. I do not see any settings to push the DAPHNE overlay down or resize it smaller:

image.png

Also attached the original DAPHNE logo which is quite large at 2021x600 which may be part of the issue in retrospect - what are the max dimensions that you recommend?

EDIT: I attempted with a smaller file but it had the same results.

Daphne New (w) Shadow.png

Daphne.png

Link to comment
Share on other sites

6 hours ago, Draco1962 said:

I am encountering an error when using the "Add Extra Overlay" feature when set at 500x500. I do not see any settings to push the DAPHNE overlay down or resize it smaller:

Ahh, sorry.. wasn't sure you'd try that!. That bit probably does need some more notes when i write it up.  Try changing the overlay canvas size / shape to be square, aligning & sizing the logo within the square where you want it positioned in the final wheel image. Note - the size of the square used by the overlay shouldn't matter, it will be scaled up/down by the app to match that of wheel image.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...