Flipping Cards

A forum to share your demonstrations stacks, fun stacks, games, etc.
User avatar
richmond62
Posts: 4831
Joined: Sun Sep 12, 2021 11:03 am
Location: Bulgaria
Contact:

Flipping Cards

Post by richmond62 »

There is quite a bit more to this than meets the eye if one wants to 'go the whole hog' so I have started this thread separately from my Tarot one.
Normally, with a 3D engine it would be really an easy task, as it’s just a primitive which flips along one of its axis.
https://phaser.io/news/2017/09/3d-card-flip-tutorial

Possibly, but we really do not, or should not, need a 3D engine for what is effectively a 2D thing.

The 'problem' with ALL the solutions offered so far:

https://openxtalk.org/forum/viewtopic.php?t=1291

is that they are a bit too 2D to look like authentic card flips.

This image probably illustrates what does NOT happen with the solutions we have come up with so far:
-
Screenshot 2024-12-29 at 18.11.17.png
Screenshot 2024-12-29 at 18.11.17.png (128.9 KiB) Viewed 6418 times
-
As a real card is flipped part of it moves closer to the observer, and if it is not being flipped on a flat surface, part of the card moves further away from the observer.

Possibly this can be effected by distorting a graphic object.
https://richmondmathewson.owlstown.net/
User avatar
tperry2x
Posts: 3209
Joined: Tue Dec 21, 2021 9:10 pm
Location: Somewhere in deepest darkest Norfolk, England
Contact:

Re: Flipping Cards

Post by tperry2x »

flipping.gif
flipping.gif (677.78 KiB) Viewed 6412 times
This is the method Paul talked about, using the lcb extension. You'll have to load that in via the "Tools" menu > "Extensions Manager", then open the oxtstack.

Widget from here.
Attachments
flip.7z
(1.51 MiB) Downloaded 41 times
User avatar
richmond62
Posts: 4831
Joined: Sun Sep 12, 2021 11:03 am
Location: Bulgaria
Contact:

Re: Flipping Cards

Post by richmond62 »

It could be worse, a bit. 8-)
-
Screenshot 2024-12-29 at 18.51.49.png
Screenshot 2024-12-29 at 18.51.49.png (76.84 KiB) Viewed 6408 times
Attachments
FLIPPER.oxtstack.zip
(1.58 KiB) Downloaded 41 times
https://richmondmathewson.owlstown.net/
User avatar
tperry2x
Posts: 3209
Joined: Tue Dec 21, 2021 9:10 pm
Location: Somewhere in deepest darkest Norfolk, England
Contact:

Re: Flipping Cards

Post by tperry2x »

richmond62 wrote: Sun Dec 29, 2024 4:55 pm It could be worse, a bit. 8-)
Seems to work, but happens at lightspeed (I put the backing of a playing card in to test)
flipping.gif
flipping.gif (109.97 KiB) Viewed 6403 times
Attachments
flipper-backing.oxtstack
(84.77 KiB) Downloaded 41 times
User avatar
richmond62
Posts: 4831
Joined: Sun Sep 12, 2021 11:03 am
Location: Bulgaria
Contact:

Re: Flipping Cards

Post by richmond62 »

That is a bit too quick.

Over here (your favourite OS) it was considerably slower.

How did you get the 'card back' image to distort with the graphic?
https://richmondmathewson.owlstown.net/
User avatar
tperry2x
Posts: 3209
Joined: Tue Dec 21, 2021 9:10 pm
Location: Somewhere in deepest darkest Norfolk, England
Contact:

Re: Flipping Cards

Post by tperry2x »

richmond62 wrote: Sun Dec 29, 2024 5:21 pm How did you get the 'card back' image to distort with the graphic?
I just imported the "back.png" image, then clicked on the rectangle graphic of the card (the graphic that was purple), and set the backgroundpattern of that graphic to the ID of the "back.png" image.
User avatar
richmond62
Posts: 4831
Joined: Sun Sep 12, 2021 11:03 am
Location: Bulgaria
Contact:

Re: Flipping Cards

Post by richmond62 »

That's a revelation to me: that the backGroundPattern distorts with the distortion of the graphic: very good to know. 8-)
https://richmondmathewson.owlstown.net/
User avatar
tperry2x
Posts: 3209
Joined: Tue Dec 21, 2021 9:10 pm
Location: Somewhere in deepest darkest Norfolk, England
Contact:

Re: Flipping Cards

Post by tperry2x »

richmond62 wrote: Sun Dec 29, 2024 5:21 pm That is a bit too quick.
Over here (your favourite OS) it was considerably slower.
I think that would be a valid consideration too: cpu speed between various machines and different OS.
Instead of doing it in a repeat loop, if you did it as a function with a "send to" [co-ordinate], you could time it with an offset so that it had a predictable speed, no matter what OS and what CPU speed it might be run on.
Doing it that way, it could also skip frames (co-ordinates) if it's being run on really slow hardware.
User avatar
richmond62
Posts: 4831
Joined: Sun Sep 12, 2021 11:03 am
Location: Bulgaria
Contact:

Re: Flipping Cards

Post by richmond62 »

Um, well my obsession with repeat loops . . .

. . . obviously time for some cold turkey (I mean the Ronnie Wood kind as we had a chicken for Christmas). :lol:
https://richmondmathewson.owlstown.net/
User avatar
OpenXTalkPaul
Posts: 2633
Joined: Sat Sep 11, 2021 4:19 pm
Contact:

Re: Flipping Cards

Post by OpenXTalkPaul »

You need at least 12 or 15 frames per second to look anywhere close to realistic, historically video rates 24,25,30 frames per second was the standard (now days there's ridiculous frame rates for gamers with expensive GPUs and super-high refresher-rate curved ultra-wide screens, lol,).

Like Tom said, create a queue of messages 'Send tMessage in X milliseconds' is a great way to do any sort of sequence with fairly precise timing, although it can be tricky if you need to do a lot of operations in between messages, best to subrtract the processing time of the script operations from the send in time time for the next message (if that makes sense) if you need events to arrive at steady intervals (like for a drum beat for example).

But a convincing pseudo-3D flip effect can be done as just image distortion, like that which can be done with the free-distort tools in 2D image editors such as Photoshop (if you're into something else like Flexo printing on stretchy curved plastics you might want other distortions like arched curves, reversed-fish-eye lens distortion, etc.)..

Sometimes you don't need a 3D engine with GPU acceleration. Isometric psuedo 2.5D can be cool too. Those 1980/90s computers did some 3D(-ish) stuff without GPU and some looked really good (OK maybe terrible by today's standards).

It would be nice to have a library collecting ideas for easy and/or interesting visual effects or visual cue methods (like animated focus borders). Some of the engines transition effects disappeared along with QuickTime. Our XT script does have the ability to manipulate pixels directly (I suppose it you use NetBPM ascii text format https://netpbm.sourceforge.net/ all xTalks can too).
User avatar
richmond62
Posts: 4831
Joined: Sun Sep 12, 2021 11:03 am
Location: Bulgaria
Contact:

Re: Flipping Cards

Post by richmond62 »

Quite apart from any other considerations . . .

. . . I cannot get the backGroundPattern to distort with the graphic 'frame':
-
Screenshot 2024-12-30 at 18.00.46.png
Screenshot 2024-12-30 at 18.00.46.png (421.29 KiB) Viewed 6324 times
Attachments
FLIPPER.oxtstack.zip
(86.9 KiB) Downloaded 43 times
https://richmondmathewson.owlstown.net/
User avatar
tperry2x
Posts: 3209
Joined: Tue Dec 21, 2021 9:10 pm
Location: Somewhere in deepest darkest Norfolk, England
Contact:

Re: Flipping Cards

Post by tperry2x »

richmond62 wrote: Mon Dec 30, 2024 4:03 pm ...I cannot get the backGroundPattern to distort with the graphic 'frame':
Perhaps because it happens so quickly on Linux, it only gives the visual impression that it's distorting.
I just tried it on MacOS, and it runs a lot slower as you said. Slow enough to see that it's not actually distorting.

I did attach my stack higher up in this topic. I'll open this in Linux later on, I'll slow the repeat loop down, and see if it's actually distorting (or not). Just in case it behaves differently (you never know) ;)
User avatar
richmond62
Posts: 4831
Joined: Sun Sep 12, 2021 11:03 am
Location: Bulgaria
Contact:

Re: Flipping Cards

Post by richmond62 »

ALSO discovered (rats!) that one cannot use an imported SVG images as a backGroundpattern.

Nor can one obtain the effective points of an SVG.
https://richmondmathewson.owlstown.net/
User avatar
richmond62
Posts: 4831
Joined: Sun Sep 12, 2021 11:03 am
Location: Bulgaria
Contact:

Re: Flipping Cards

Post by richmond62 »

I have just run your stack, and image distortion does NOT happen:

what between my desperate desire, and the speed of your animation . . . :(

And because of that that method is effectively useless in OXT.
https://richmondmathewson.owlstown.net/
User avatar
tperry2x
Posts: 3209
Joined: Tue Dec 21, 2021 9:10 pm
Location: Somewhere in deepest darkest Norfolk, England
Contact:

Re: Flipping Cards

Post by tperry2x »

Okay, thanks for checking. Saves me from having a go later. Dare I say it, but did you try the lcb extension method I mentioned (that Paul originally mentioned) above?
User avatar
richmond62
Posts: 4831
Joined: Sun Sep 12, 2021 11:03 am
Location: Bulgaria
Contact:

Re: Flipping Cards

Post by richmond62 »

No: I have not tried the lcb extension yet for the simple (but possibly daft ?) reason that all my work outwith "those funny programs for working with dead languages" is aimed at material for teaching rank beginners (and by 'rank beginners' I am targetting school-children in the 9-15 age range who have either NOT done any programming, or just "farted around" with SCRATCH).

To that end I am trying to be like those slightly suspicious religious types who take a vow of perpetual purity (Saint Richmond! Pull the other one.) insofar as I want to try to use the xTalk language alone if at all possible.
https://richmondmathewson.owlstown.net/
User avatar
richmond62
Posts: 4831
Joined: Sun Sep 12, 2021 11:03 am
Location: Bulgaria
Contact:

Re: Flipping Cards

Post by richmond62 »

Screenshot 2024-12-30 at 19.53.06.png
Screenshot 2024-12-30 at 19.53.06.png (150.27 KiB) Viewed 6294 times
-
That last bit (ringed) made me laugh.

So far, unless one plumps for the lcb option I can see very little wrong with my solution beyond the top-and-bottom constraints.

These could be overcome by one hell of a lot of work preparing distorted intermediate images outwith OXT . . .
https://richmondmathewson.owlstown.net/
User avatar
tperry2x
Posts: 3209
Joined: Tue Dec 21, 2021 9:10 pm
Location: Somewhere in deepest darkest Norfolk, England
Contact:

Re: Flipping Cards

Post by tperry2x »

richmond62 wrote: Mon Dec 30, 2024 5:49 pm ... I want to try to use the xTalk language alone if at all possible.
Ah, that makes sense. Keeping it as just a stack.
The thing about adjusting those points, especially on that macOS machine I just did a video on, it was a terrible animation. How it plays back in that video is what it does onscreen.

I have another idea, which I'll sit down and have a go at, later this evening.
User avatar
richmond62
Posts: 4831
Joined: Sun Sep 12, 2021 11:03 am
Location: Bulgaria
Contact:

Re: Flipping Cards

Post by richmond62 »

I've been doing some tweening. :lol:
-
Screenshot 2024-12-30 at 20.58.47.jpg
Screenshot 2024-12-30 at 20.58.47.jpg (130.27 KiB) Viewed 6280 times
-
Clunky and chunky: BUT the blasted thing works . . .

Mind you, the thought of making all those images for 22 Tarot cards, or 52 playing cards, makes me feel a bit woozy. 8-)
Attachments
DISTORT.oxtstack.zip
(1.37 MiB) Downloaded 44 times
https://richmondmathewson.owlstown.net/
User avatar
richmond62
Posts: 4831
Joined: Sun Sep 12, 2021 11:03 am
Location: Bulgaria
Contact:

Re: Flipping Cards

Post by richmond62 »

Mind you, converting those PNG images to GIFs gets them down to about 40% of the size.
https://richmondmathewson.owlstown.net/
Post Reply

Who is online

Users browsing this forum: No registered users and 1 guest