Sign in to follow this  
aFalcon

Export glTF Animation -> Blender2Babylon -> Minimum Steps Example

Recommended Posts

QUESTION: What are the minimum steps required to get a bone to export from blender and to be visualized with Debug.SkeletonViewer?

          Having trouble making a cube add a bone and then export to babylon. After a bunch of variations I see why... there are many steps:

          Applied: Object->Apply->Location & Rotation & Scale. And ensured Camera Icon is on Armiture (exporting). Weight Painted. Or setParent-> Auto Weights.

          And added Armiture modifier... still no bones.

           Tried two different loading types, two different export types (Tower of Babel), and then... #3 glTF. Fabulous!

          I'll leave the tips that I find below.

 

GOAL: open blender > add 1 bone inside a cube or tube and > export to .babylon > then see bone with Debug.SkeletonViewer. 

 

PURPOSE: to run a bunch of test animations on bones (at runtime).

 

CONTEXT:

          Blender version (2.78) and updated the exporter (babylon.js ver 5.4.2). Also Tower of Babel, and glTF exporter 1.0.

 

UPDATE: 

        glTF animations look promising. I'll provide answer here for minimum steps to animate GLTF Blender Export.

 

Any tips of things to try in this experiment? Thx.

 

 

 

Share this post


Link to post
Share on other sites

For the 2 babylon specific exports, I guess the minimum # of steps is: all of them.  The # of Blender export formats make it ideal for a great many of BJS workflows.

The specific exporters are designed for the most compact files, and hooking in as many of the BJS features that a generic exporter has no knowledge of.  Eg. the many different shadow options, different types of cameras, ignoring of non-deforming IK control bones at export time.  Variable # of bone influencers (1-8).

They are not really designed for testing very simple models for bones, filling in matrix weights when you do not provide them.  Ignoring of bones during export also limits the order of processing of the exporter.  If you found GLTF does use it during development.  When you progress to the point where you have a complete armature, try switching if you like.

One thing I am interested in adding is exporting "traditional" IK bones, which do deform vertices.  I cannot quite line up the fields which need to be transferred.  @adam is there an docs / scenes on what you did for IK inside of BJS.

Share this post


Link to post
Share on other sites

Thanks @JCPalmer, yep that insight helps, and I am also interested in IK. I do have a full armature, and I've narrowed it down to "something missing on blender".  Also had success with gltf. And yes, the goal is to get the complete armature through to glTF bone export animations. 

Bone exports (and animation) completed four times before, each a challenge to recall all steps.

So that is where "Minimum Steps to Bone Export Example" would help... and attempting!

glTF is running but - also not imported bones... so that is how I see your insight is correct. :) 

Re-reading blender rigging and then also glTF export guidelines (links):

https://docs.blender.org/manual/de/dev/rigging/armatures/skinning/introduction.html

gltfOverview-2.0.0.png

Cheers...

 

Share this post


Link to post
Share on other sites
19 minutes ago, JCPalmer said:

I cannot quite line up the fields which need to be transferred.  @adam is there an docs / scenes on what you did for IK inside of BJS.

https://doc.babylonjs.com/how_to/how_to_use_bones_and_skeletons#boneikcontroller

https://www.babylonjs-playground.com/#1EVNNB#15

https://www.babylonjs-playground.com/#PNJGW#7

Share this post


Link to post
Share on other sites

@adam, I like that.  You just use a mesh, which is easy to set position / rotation.  Blender uses other bones as the "target" in your terminology.  Those are the bones I am ignoring, when you are doing the posing prior to export.  Sounds like nothing needs to be done in Blender.  Modeler can simply add a couple of plane meshes, setting visibility to false, & export. 

In my case, I also need to delete some bones as my chain is too long for legs.  Just to clarify, when it is said that the chain length must be 2, is that including the end bone?  That would not be a problem if the bone used when instancing the IK Controller does NOT have to be at the end of the chain.  That looks to be the case in the pg.

Share this post


Link to post
Share on other sites

Our exporter used to require parenting the mesh to the armature as well.  Now you can either do parenting or simply ad the armature constraint.  The advantage the 2nd is you can then be parented to something else as well.

TIP:  still use parenting to add though, as then you can pick automating weighting.  Just move what it is parented to afterward later.

Share this post


Link to post
Share on other sites
6 hours ago, JCPalmer said:

Just to clarify, when it is said that the chain length must be 2, is that including the end bone? 

Yes, to replicate it in Blender you would select the end bone, add the IK constraint and then select a chain length of 2.

Share this post


Link to post
Share on other sites

SUCCESS: MINIMUM GLTF BONES FROM BLENDER (methodology):

Thanks @adam for SkeletonViewer. It is great!

 We have similar animation methodologies: animate in code with a starting Blender Armature.

My search is for BOTH, or ALL animation methodologies (later)...

image.png.1efa6021ad60906128b768cf658f5cb6.png

So, steps here for anyone who wants to replicate methodology.

 

STEPS TO MINIMUM-BONE:

It is an ongoing challenge to get the pipeline correct because there are many options. Gotta get em aligned.

This is not a problem when the pipeline is working - but it is when it isn't. : )

So all parts need to be streamlined to get the right results. Or flow not flowing... what?

 

1) Loading Options (Append works, need to try each. Also, skeleton or mesh locations can be different in parameter): 

  - BABYLON.SceneLoader.Append         //good  (example below)

 - BABYLON.SceneLoader.ImportMesh //better

 - BABYLON.AssetsManage                    //best (for my needs):

                var assetsManager = new BABYLON.AssetsManager(scene); 

               var meshTask1 = assetsManager.addMeshTask("mesh1", "", "../../3d/", "bonebox10.gltf");
                meshTask1.onSuccess = function (task) {   

                    var mesh = task.loadedMeshes; //.meshes[0];
                    var skeleton = taskloadedSkeletons; //.skeletons[0];

});

               assetsManager.load()

 

2) Import options (blender export plugins: File > User Preferences > Add-Ons > Install Add-On From File > Save Settings) ... derp.

      - .babylon              //favorite

      - Tower Of Babel  //interesting (tons of custom options in Blender)

      - glTF                     //looks awesome: compression, interoperability, complex animation compositions, and (MSGb) multi-scene-graph-baby! (links above)

 

3) Blender Options (Challenge Area #1 )

     It takes a while to memorize the special sequence of Blender hotkeys that unlock the magic prize!

     FUTURE-NOTE (to self): Don't need Armature-Modifier, and don't need Weight-Paint. Enstead...

     *Parent Bone to Mesh using Automatic-Weights. (wiki-link above) STEPS:

        @gryff mentioned all this... years ago.

      -> Right click Mesh first, then Armature last (for the bones to be the parent). Important.

      -> ctrl + p -> Set Parent To -> Armature Deform -> With Automatic Weights.

      -> Pose mode, rotate a bone.

image.png.71f204930a380ee9e816cadf39a5068c.png

      -> File -> Export -> (blender plugins) -> gltf 2.0 (gltf)

                  https://en.wikibooks.org/wiki/Blender_3D:_Noob_to_Pro/Bones

 

  4) Loading into Babylon (Challenge Area #2)

        Trouble-shootin' time! What is this? Two Blender bugs... Ha! And grey hair...

       image.png.129be03895fe0ab2c4c0bc52fbfdfa59.png

        1st SOLUTION: again thx gryff - "the bones and the mesh not in the same spot."  Ah, ha!

               

        BLENDER FIX (RTS-RESET): 

              Select Armature, Object Mode -> Object -> Apply -> Location & Rotation & Scale.

              Select Mesh, Object Mode -> Object -> Apply -> Location & Rotation & Scale.

              Export....again. Where is the other bone?!?

image.png.aa627d090dffab1551e73b15d52fc992.png

         2nd SOLUTION: thanks to @adam (1.5 yrs ago), if he didn't mention it....

         "doesn't draw the last bone if the bones don't have a length property.". Look Blender, sure enough. No Length???

                  http://www.html5gamedevs.com/topic/20814-skeletonviewer-class/

         BLENDER FIX: Ah well, added a baby-bone at the end, pieceivecake. :) (HINT: one cannotsee the babybone). derp...

          - export again...

image.png.1efa6021ad60906128b768cf658f5cb6.png

SUCCESS! -> MINIMUM-BONE-EXPORT from BLENDER.

 

6) Why??? To TEST the multiplicitous-animation-methodologies. What, black-magic?!? No, it's just multi... ok:

BABYLON ANIMATION OPTIONS:

        BoneControls(1st thing @Wingnut), Blender Keyframes, Action Manager, ActionBuilder, Morph Targets, Shape Keys, Baking?, Motion Paths, LookAt, Interpolations, etc...

        ->  in another fact-finding-info-thread ... :)

        Also thanks @JCPalmer

 

Here is loader code for EAT... (Export Append Test ):

    BABYLON.SceneLoader.Append("../../3d/", "bonetube2b.gltf", scene, function (obj) {
        var mesh = obj.meshes[0];
        var skeleton = obj.skeletons[0];

        // Create a skeleton viewer for the mesh
        var skeletonViewer = new BABYLON.Debug.SkeletonViewer(skeleton, mesh, scene);
        skeletonViewer.isEnabled = true; // Enable it
        skeletonViewer.color = BABYLON.Color3.Red(); // Change default color from white to red

    }, null, function (obj) {

    });

No, yes. endure. :)

 

5) GLTF (isn't necessary for this solution, but it sure is cool!)

     Get the correct version of Babylon... 

     <script src="../../lib/gltf/babylon.preview.js"></script> 
     <script src="../../lib/gltf/babylon.glTFFileLoader.min.js"></script>

      From glTF ... RTS (rotation, translation, scale). So golden-rule:  'in Blender be sure to Object -> apply -> RTS. Else-anim-stuffs-breaks!' :)

       Here are the great glTF DOCS: https://doc.babylonjs.com/how_to/gltf

 

6) (dot).babylon Blender exporter

  image.png.8acae685acdbc3926692ca8d989b5cd3.png

        - Why different? https://doc.babylonjs.com/resources/blender

        3rd SOLUTION: thanks to the docs on exporting, "gotta check flat-shading"

        BLENDER FIX:

                (check) -> Mesh, Vertex-Data -> Use Flat Shading:

image.png.3a829007e404f5677d03e2cee45ae524.png

              Also the background was black:

             image.png

BLENDER FIX:

              -> No selection, World -> Ambient Color

One last thing: Why is the .gltf tube grey and .blender white? Default colors. 

             -> when no color is specified .gltf defaults to 50% grey. zing!

 

That's that ...

my wife says I must EAT now.

... most of those pesky terrrible jokes removed.

BABYLON.Rocks(true);

 

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.