New image (object) properties

We already have a few nice behaviors that allow to create impressive visual effects.
As there are: Color, Blend, Size, Rotation, etc.

To give us even more options to go wild with our creations I propose the following new behavior blocks ( I know some have been discussed before, but i thought I line them up nicely).

1. Display Order
Handy feature for isometric maps and other situation where an object sometimes has to show up before or behind another object, depending on the situation. Yes, there are workarounds, but why clumsy when it could be easy :slight_smile:

Block suggestion:
display order

2. Skew
If you are not familiar with the term, just ask Dr.Google for CSS 2D skew. Basically it tilts an image along X and/or Y by an angle. Like pushing a rectangle into a parallelogram.
skewX

Uses: simple animations (… trees moving in the wind…) and again, handy for isometric levels. Would allow to create them without having to draw everything in iso perspective, could be done by applying ‘Skew’ to an image that you drew square as usual.
Just to give you a rough idea, one using Skew, the other good old Rotate & Size.

Block suggestion:
skew

and now my favorite drum roll

3. 3D transform
Now that is a tricky one to explain. Basically it is faking a 3D effect by rotating a flat 2D image into 3D space. Would make it so easy to create Wolfenstein like 3D dungeons.
Here a link that explains the CSS version of it: CSS 3D transform
Another use would be for example flip animations for menus, card games, books, etc.

Block suggestion:
3D transform

2 examples that shows how Skew could be used for simple animations (just add X movement to it and it looks like it crawls its way forward)
And an example for mentioned ‘flip’ animation.

Some might remember my attempt to achieve this in Flowlab … possible, but not really practical.

That’s it folks. Ask questions if something doesn’t make sense. Otherwise, remember the more likes and feedback we get on this post the higher the chances @grazer might implement it :slight_smile:

Please leave your vote either way.

  • Yes, that would be great
  • Nah, I don’t see the point
  • I don’t mind either way

0 voters

3 Likes

Really want the display order one. I’ve been wanting to make a side-scrolling brawler and don’t want to hassle with all the layering work arounds.

1 Like

this will be good for a 3d game

All I have to say to this is just a simple YES

1 Like

Found another example that shows what could be done with 3D transform options.
Ok, is a simple one, but you get idea. What I see is ZELDA ISO 3D … LOL

I have to admit they use even more translate options.
Beside the ‘rotate X/Y/Z’ as I stated above they also use ‘translate X/Y/Z’, ‘perspective’ (I called it depth) and ‘origin X/Y’ for the view point.

ss_transform

You would have to brush up your maths for that though :slight_smile:

If you find other application ideas, post away :+1:

display order yessssss

1 Like

I like all of these options! Personally, I think skew and display order should be added first.

I agree with @MetaNinja these ideas are really good :grinning:

1 Like

skew would allow for so many effects like leaves swaying in the wind display order for top down games would be legendary

You think games look terrible now? just wait until everyone skews every sprite to oblivion and back and we trade our glut of super mario clones for paper mario clones. It will be like the first days of flash all over again.

Not that skew couldn’t be useful in a very conservative way for very specific applications.

1 Like

Would a skew tool be useful for the sprite editor too?

Ok, closed the poll, nearly forgot, sorry folks.

Now it is up to grazer if it will end up on his Trello board or not :slight_smile:

@grazer, may I ask what the chances are?
Or is it completely outside Flowlabs capability range? This is more like a long term goal :dark_sunglasses:

1 Like

Where Did You Get These Images From, And These Will Be Great :slight_smile:

@pixelknife31
2D and 3D image transform options are common functions available in most of the ‘others’.
They are so common that they are now supported by most browsers and you could even use it on your webpage to create interesting visual effects … beside the fact that they are perfect for game creation.

Some basic HTML (CSS) references you can find here:
2D transform
3D transform

The details might sound complicated, but once bundled up as I tried to show above it will be easy to use.

1 Like