0 Favourites

[Feature Request] Bezier Curves Window and Variable

  • Ashley

    Bezier Curve Object

    Bezier Curve window

    Ok. As part of my job I work with Unity. I wasn't into curves before. But after doing some unique animation, movement and all sorts of stuff. I found that bezier curves are magical, amazing and by far one of the most amazing tools to have in game development. I could manually write a bezier curve plugin and evaluator. However what I can't create is the window to create curves. That's an element of the IDE level we don't have.

    What would be fantastic would be a variable like instance based that stores as a Bezier Curve. That way the curve could be added to Objects, be a global variable or a group variable. So it would sit similar to Number,String

    Some of the stuff I have done with bezier curves.

    *Custom sized banners that animate the size to the speed for nice bounce effects.

    *Easily controlled "jump" effect objects(for not platforming game. just feed back for something simple)

    *Animate 30+ objects with different animations with a single set of frames with 1 animation.

    Let's start with Spriter a tool we have access to.

    Subscribe to Construct videos now

    These are just some of the simpler stuff that can be done. However it shows that as a curve is evaluated position, scale, alpha can all be set based on a time. With curves having controllable tangents allows these evaluated to visual numbers can have some excellent effects.

    Here is an examples of both curves and algorithm

    http://www.motionscript.com/articles/bo ... shoot.html

    At work for my part of a project as a sample. The lead designer requested a procedural generated bush animation that could mimic different states of wind blowing.

    no wind, light win, medium winds, heavy, rapid. When looking at the art there were 40 sets of animated objects to work with. Most of the bushes, grass in various colour tones. The idea of making 40x5 animations was kinda daunting. Since this was procedural I took advantage of curves.

    I had 1 master curve that would represent the scenes wind strength at a long given period of time. The sample used 15 seconds. With the last 5 just representing calm to test out no wind.

    There were 6 curves timed at 0.5 to 1 second a piece. These child curves represented a percentage based animation frame. So 0 was 0 frame, 0.5 was middle frame, and 1 was last frame. So no matter how many frames there were there was a translation 0 to 1 as a percentage to match up the with the animation frames.

    A child curve then represented a cosine wave usually about 2-6 times over 1 second with all of them at varrying heights in the curve. Usually apx 20-30% difference.

    When a child had no animation(first and finished) it would evaluate the current time of the master curve and get the wind strength. Then it would get a random value from current-1 to current +1 out of the child range.

    In the end this produced a very nice wind like effect that conveyed the feeling of the wind at the time.

    Of course this could be just randomized and use more code like methods. however using curves made doing all of this a breeze. It was very enjoyable that just changing a curve would change the results.

    So it would be fantastic if you could please implement a curve window into C2 IDE. Spriter is awesome, but at times could be considered overkill.

    Please, please add bezier curves to the IDE. It would raise C2 productivity many fold on the visual side.

  • Would you rather a visual editor, or some defined expressions like:

    http://gizma.com/easing/

    BTW I think you could also get away with qarp, and cubic.

  • Oh assuredly one can use pure mathematical curves logorithms. In fact i use Lunaray, lerp and cubic here and there. However having actually used a full on bezier curve editor allowed for a lot more fine precision modifications easily.

    Spriters curve editor is more appropriate as an example to be user friendly. I've done the code wise and it works fine. But the editor style is just more of a pleasure to use.

    The alternative is to find a curve editor and create an evaluator plugin. Then use some copy paste the curve into string. It would be just more pleasant to use an in editor window to do so

  • I should addendum. That the curve editor in question would be able to support more than one curve. The curve should have key's and tangets to support multiple curves. I'm not requesting a single curve based on an algorithm, but more complicated curve patterns.

    So to be a little more clear. I'm looking for this.

    http://math.hws.edu/eck/cs424/notes2013 ... ezier.html

    and not this

    http://cubic-bezier.com/#.68,-0.65,.5,1.85

  • Yep, it would be cool to have, but can it be added?

    Does the editor support drawing curves in child windows even?

    If not, an external editor would be fairly easy to make, especially since Rojo's Canvas plug supports paths, and you could use ajax to import the control points to use with cubic.

    Chaining multiple paths... not so much.

  • That's one path I was thinking of using. There are some good plugins already. There is just no cohesive whole in the IDE. I'm sure Ashley could add a curve window if he felt the feature was worth it. Personally I think it is, especially after having use it so extensively. But I honestly didn't think they were that big a deal until I did.

  • Chaining multiple paths... not so much.

    Why not? I was able to do it in CC with the canvas that didn't have all the comfort features of ROJOs plug

  • It depends on what you want to do. If you need more than 4 control points from cubic, then obviously it would get a little complicated, at least timing wise for the novice user.

    On the other hand lerp, qarp, and cubic should work super easy for effects such as ease in.

  • Construct 3

    Buy Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Buy Now Construct 3 users don't see these ads
  • Might be that it gets complicated. But I didn't have that feeling when creating it. The spline is a (bit more but basically) sum of n cubics. But I agree that for simpler tasks, such as ease in/ease out one cubic would do its job very well.

    Also I'd not be concerned about cpu load. As my example shows, and also Spriter, the calculations are fast enough to do them realtime without adding much.

    But extending the editor with curve editing would be the optimum.

  • Well I can't speak for java script on mobile devices that are accelerated or not. But I know in Unity a curve evaluation is pretty cheap. Also if it's really a problem just clock evaluate call on an every 0.033 tick. That will lighten the load if raw js is being a problem.

    On PC's performance isn't a problem.

  • Hello jayderyu newt

    Just wondering if it's possible to live-read data while previewing with construct 2 from a local file. Witch local file also must be live-edited with let's say some kind of curve editor like the one tulamide made here with CC.

    (the "live" thing could also go away)

    Something like this could be really useful

  • Given the inflexibility of C2's IDE, I have kind of given up on this for C2. But it would be right at the top of the list for C3.

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)