Babylon~cinematics

SHADOWS - CHANGE - EVERYTHING!!!

MOONLIGHT - “mood lighting” - actually, nebula lighting … but who cares!

It looks gr8!

Here is the LINK to the SHADOW DOCS:

https://doc.babylonjs.com/babylon101/shadows#troubleshooting

ANd RESULTS:

image

Shadows on a halfpipe - surfin space 60FPS - couldn’t be happier.

:eagle:

2 Likes

YES!!! Love it! Babylon Cinematics getting better and better!!! Nice one @aFalcon

1 Like

@PirateJC :pray: thank you PJC, for the ~Creative~Fuel. : )


BABYLON.CINEMATICS.CAMZ

There are a few big innovation in 3DWeb… or if you prefer WebCinema.

EXAMPLE:

The ANMSTACK: EPIC, SCENE, SEQ, FRAME, ANM… hierarchy.

Also,

The 3DWebDevelopmentPipeline - from mesh to market.

Those two are obvious.

Today I share a BRIEF on one that was less obvious (to me), and has expanded beyond expectation.

A BIG area of ongoing innovation for BABYLON.CINEMATICS is the concept of WEB~CINEMATOGRAPHY and custom~ability to be creative with CAMZ.

ANMCAMZ - animated cameras.

BABYLON has excellent cameras. So the concept is to EXTEND them with creative customizations.

The NUMBER of those possible CUSTOMIZATIONS, is what was a surprise… to me.


We created a FaceCam in addition to our FreeCam and our FollowCam.

And we wrapped them up in a FACTORY, under a NAMESPACE, like this:

nx.initFaceCam(); nx.initFreeCam(); nx.initFollowCam();

I thought we were done! But then gradually began adding creative customizations like this:

nx.initBirdsEyeCam(); nx.initSpotCam({pos:{},tgt:{}}); nx.initBoomCam();

But still there is more. Next was the trickiest of them all!

The SMARTCAM and the SMOOTHCAM. They are difficult and elusive.


But after FAILING twice… finally figured out nx.initSmartCam and nx.initSmoothCam() today.

Because of some of the internals… that can be appy to MANY NEW CAM BEHAVIORS.


EXAMPLE: SMOOTH-CAM internals were applied to FREECAM to create a new CAM behavior.

When FREECAM, if HERO is not IDLE, and out of FRUSTUM, for 2 seconds, initSmoothCam();

Isnt it a beauty?


Here is how it works in code…

  1. SELF-REMOVING ACTIVE-CAM-LOOPS (look for * )
  • if we ever switch to a different camera - the ACTIVE CAM behaviors - unload themselves!!!

nx.initFreeCam = function(){ //
nx.camz.freeCam = new BABYLON.FreeCamera(‘freeCam1’, new BABYLON.Vector3(0, 0, 0), nx.scene);
nx.camz.freeCam.position.copyFrom(nx.scene.activeCamera.position);
nx.camz.freeCam.setTarget( nx.hero.position ); //CAM:
nx.frustumCamLoopDamper=0;
nx.frustumTimer=0;
nx.scene.registerBeforeRender(function freeCamFrustumLoop(){ //Check hero moving out of view, and switch.
if(++nx.frustumCamLoopDamper%10!=0){return} //DECIDAMPER-. ***
if(nx.scene.activeCamera.name!=‘freeCam1’){ * < --nx.scene.unregisterBeforeRender(freeCamFrustumLoop); } //Auto Unload Loop * < –
if(!nx.frustumTimer && !nx.anmz.hero.isIdle() ){
if(!nx.camz.freeCam.isCompletelyInFrustum(nx.hero)){
console.log(‘START FRUSTUM TIMER’);
nx.frustumTimer = setTimeout(function(){ //dont reset cam right away.
console.log(‘END FRUSTUM TIMER’);
if(!nx.camz.freeCam.isCompletelyInFrustum(nx.hero)){
console.log(‘SWITCH FRUSTUM CAM’);
nx.initSmoothCam(); ← **
} else{ console.log(‘CANCEL FRUSTUM CAM’); }
if(nx.frustumTimer){clearTimeout(nx.frustumTimer); nx.frustumTimer=0;}
},2000);
}
}
});

  1. ** Seamless, Timer CAMSWITCH at runtime.

  2. ***LOOP DAMPER - to custom optimize every loop.


This is very exciting. Because this is how 3DWeb begins. : )

:eagle:


Still more EXAMPLES of advanced CAMZ:

  • FOGBOX, which is a box that goes around a CAM to give atmospheric effects /colors.

  • nx.initFallCam - a special cam for when HERO is falling.

3 Likes

Hey - just came across this thread - i’m working on something similar… a toolset for creators to make 3d shorts on the web.

I can’t totally follow what you’re working on - but would be great to learn more. You got a few examples running somewhere? Or docs or something like that?

The big barrier I see is assets. They’re all made for unity/unreal and converting them to BJS friendly format is a giant pain in the butt. I don’t know how you/we/one gets around that. Cinematics without easy access to assets is a problem.

2 Likes

Fantastic @bigrig!

Good to see you again.

Also it is GREAT to hear … WEB CINEMATICS is no longer a SOLO~ADVENTURE.

Yes, MANY EXAMPLES in 2020 - once episode 1 and free version are released - very close.

Right now code is deeply embedded in custom 3D Planetoid modules- with lots of random ANMS.

Appreciate your interest. Better examples and improvements, next phase.

We are going straight to PWA. Skipping AppStore carnage.

ASSETS - yes, using BLENDER. And yes, it is a pain, but not impossible.

PRINCIPLE - pushing hard to GAIN MASTERY in… CONTENT-CREATION.

Then… make-ends-meet telling WebStories… until retirement.

Thank you for reaching out Mr.Rig!

I’m very happy to help you troubleshoot where we have overlapping challenges.

Or differences also… because … it helps pursuit-of-mastery.

EXAMPLES in 2020 - willl be to try and get this NEW FORM-FACTOR - to be the next greatest thing on the world-wide-web. Waaay better than blogs!

Feel free to post… whenever, whatever. I hope SOMETHING helps YOU SUCCEED.

:eagle: : )

1 Like

No, not lonely. Holds so much promise for accessible storytelling… Did you see “Sonder” a film made in Unity? Sonder | Unity. If only creators could do that in BABYLON JS. It’s incredible. That seems like the promise to me.

But I was/am on the cusp of giving up on BJ and giving it a go on Unity instead due to the assets issue. I’d so much prefer to do it in BJ (dev process so much simpler / faster). But I don’t want to bang head against rock to make stock assets work. (Spent a week last week along with a Blender pro that I hired trying to get a single animated character out of Unity and into Blender… and all of the parts were already FBX. But we couldn’t figure it out alas).

You rock @aFalcon. Thanks for the inspiration to give it another crack.

3 Likes

Wow, what a VID, Mr.Rig! : )

And good timing too. As my wife at wits end with me. And I hadn’t seen it.

Thanks for the link. Yes, the artistry is phenomenal.

I count a team of ~12. And I think that matters. Because…

That is the measure of what it takes. Fewer than before … it seems.


A PRINCIPLE of SILENTLY GATHERING TECHNICAL CAPACITY:

Long ago, was a hypothesis that tech increases gradually, silently, and slowly until one day, it reaches an invisible threshold – where the previously impossible becomes possible – At that very silent moment, only but a few artists, might stretch just enough - to view that which remains - yet to be seen.

I’ve glimpsed it, and it will be real. Regardless of who. A 3DWeb awaits us (still).


We are close.

The assets do appear to be The~Final~Gambit-.


Either way, to hack a path, so that others who come through behind us - go faster.


  • We SIMPLIFY DESIGN of our assets substantially: No Legs! One Eye! Clampy hands!

  • Instead of high-poly short-film, we choose low-poly episodic cosmic adventure.

  • Instead of AppStore we choose PWA

  • Instead of high-definition - we choose weird.

  • Instead of one approach, we try ALL-OF-THE-ABOVE.

  • Instead of restriction, we try whatever works.

  • Instead of team of 12, we search for a medium where web expression CAN … be by team of 1.

SIMPLIFY.


For ALL The~Solo~Artists. The ambitious gambit is to prove content~creation before time runs out.

Has technology reached The~Invisible~Threshold?

I, for one, says yes! : )


Time is short. A good time for TECHNICAL~MASTERY. A good time to move quickly.

Because, a door opened for one - is a door open for all.


Blender assets are BRITTLE.

  • You must TEST EXPORT EVERY_SINGLE_CHANGE.

Funny part? After careful review… ALWAYS find a sensible reason it couldn’t have worked!

Time and again. Failed export - after failed export.

A deeper reason why appears. :joy:

  • You must step through SLOW. And check every change in EXPORT. ROLLBACK frequently.

Because something about the way it was done…was wrong.

Every PAIN, shows the way, along the PATH TO MASTERY.


send your blends… we will help you. : )

:eagle:

2 Likes

BLENDER is very difficult. Each concept is sensible enough.

The problems is … there is 100 of those tricky concepts to get used to.

  • set origin

  • apply POSLOCROT

  • many more.

1 Like

Heya. Yea, i think you’ve outlined my concerns with the BJS approach - mainly that it’ll take mastery of Blender to pursue it - along with constant tweaking of the models. So when compared with Unity, the challenge multiplies - and is ongoing (versus being a single mountain to climb).

In 1998(!) i created this 2d moviemaker: http://www.dvolver.com in Flash4. I haven’t updated the code since circa 2000. But there are still a few hundred users per day… which speaks to the power of giving creators the ability to tell visual stories on the web. I’m hoping to update it with this effort… giving it a bunch more oomph with 3d.

What would be really amazing is if we could create an asset converter that would take a model from Unity/CgTrader and fix it for webgl. I’d be willing to invest time/resource into building that. From what you’ve said above though, it seems like every asset has a different problem. Could you imagine a scenario in which problems could be programmatically fixed? Is there a discrete list of checks that could be run? Is there a way to plug into Unity to get a working asset and reliably export it? (i tried their FBX exporter which did not work). Eager to hear your thoughts.

–ben

2 Likes

That is nice work ben. I hear ya. Dfilm and Flash. Yep, similar trench, different front. Similar results.

Almost like we’ve seen this movie before, eh? Lol. : )

Thanks for reaching out.


ASSET-CONVERTER:

  • “every asset has a different problem.” true.

“Auto-fixing”… a significant effort - it would need a robust test scaffolding.

But also a hard-limit:

  • one missing weight-paint vertex, or un-applied origin … would never be caught.

  • a discrete list … yes. That could work. A long list of things to check.


It just so happens, I work on ROBUST-BLENDER-EXPORTS at this very moment.

AND navigate the same blizzard of brokeness as last year. You will see a support ticket shortly.

It seems I’ve reached a “hard-limit” in exporting. Where I hope it is user error. But, unlikely.

MASTERY gets us most of the way - but at the occurrence of any technical limitation - that becomes a hard-stop - or significant work around. Three years, and multiple work arounds in… with significant mastery - it works. But as before, just barely - with an intentionally SIMPLIFIED model.

The best we can do is to CONTINUALLY IMPROVE THE 3DPIPELINE at every chance.

:eagle: : )

1 Like

So just went through a BIG SOLUTION with BLENDER to BABYLON.

12 HERO ANMS - (imported) and working flawlessly

Yet moar USER~ERROR stumbles. I needed to do something differently.

Seeking minimum BLENDER ANIMATION Workflow (broke the timeline).

BUT, NOT finding it… found something BETTER! Always.

To gain MASTERY ov BLENDER2BABYLON (exports) - requires PRECISE~STEPS.

And WORKFLOW to ROLLBACK / RETRY - on EXPORT failure.

That appears to be THE ONLY WAY (until your “workflow-pipeline” is flawless).

Blender2Babylon,

https://doc.babylonjs.com/resources/blender#installation

:eagle:

1 Like

The ~ Blender2Babylon ~ HAPPY~PATH:

Dozens of times now, I’ve found things that work in Blender - that do not export.

YOU ARE NOT DONE - with BLENDER WORK - until it is EXPORTED correctly.

So I think deeply on this problem, and expand on the SOLUTION above, with an EXAMPLE.


I’d like to think that we could have FLAWLESS~EXPORTS someday. BLENDER~PARTY.

Effortless building, exporting, rendering. Ha! Its a dream.

Because, the deeper I dive into BLENDER~EXPORTS - I see a recurring THEME.

There is always a FLAW! Sometimes unavoidable. Always Solvable. Always USER~ERROR.

It honestly takes me to STOP … sit down and think about it.

But how to SOLVE this in ADVANCE… with PROCESS?

That is the SOLUTION below.


EXAMPLE:

Two EXPORT errors occured back-2-back. And they are worth mentioning as an excercise to…

DEVELOP A STRATEGY FOR FLAWLESS~ASSET~EXPORTS.

The first ERROR RESULT was: mysterious-missing-mesh

After export, mesh missing randomly. See through. Like it was “XRay” or “Back Culling”. Neither were the case.

So why the surprise? It is a detective mystery. And I’ve developed a precise way to track it down.


SAVE EVERY MAJOR CHANGE in a .blend naming convention. Like this:

assetFile1.blend - original (duplicate from last string, considered a success)

assetFile1a.blend - first set of changes (usually not exported).

assetFile1b.blend - some bigger changes. (usually I'll export this and check)

assetFile1c.blend - usually changes added to a successful 1b.

assetFile1d.blend - major changes with successful export.

assetFile2.blend - copied 1d as starting point for next round of BLENDER additions.

I’ve gone well into the TENS with that strategy to build up a GOOD BLEND.


Why?

ISOLATE THE ERROR, then TRY MANY VARIATIONS, without losing progress.

When an export fails (often it is subtle - like animations break - you may not notice for a long time).

WHEN EXPORT BREAKS - I export backwards - until it is NO LONGER BROKEN.

Then REWORK forward - overwriting the broken file…

assetFile1d.blend (.babylon)  - overwritten to find export breakage SOLUTION.

Again, and again… with persistence. Until you find the FLAW, and apply the FIX.


BUT…

FIXES ARE HARD TO FIND!

How to simplify that problem?


EXAMPLE-SOLUTION to the invisible mesh - only showing random faces?

It was a Weight-Paint FLAW - where the TEST, ONLY WEIGHTED ONE ARM - not the whole body.

SOLUTION: WEIGHT PAINT all extra VERTICES to a VERTEX GROUP (spine).

SUCCESS - the export was no longer invisible.


BLAM!

Another Problem in the same export. Ever have the pleasure???

PROBLEM: Grotesque~Animation. But just slightly.

Again, sit and think…

PROBLEM: I Weight Painted the Entire Body to the Spine to get it to render.

SOLUTION: Remove the VERTICES of the TEST ARM from the SPINE Group - double Weighted!

Ironic?


The point is…

These two examples are easy to make FLAWS. Almost unavoidable.

So a GOOD WORKFLOW, is essential TO AVOID THE SAME FINGER-TRAP.

First use the FILE NAMING METHODOLOGY. Rolling back on export error.

Then, THINK DEEPLY ABOUT WHAT IS HAPPENING. To FIND and FIX the FLAW.

Last, use each FLAW to learn PRECISE BLENDER compositions (for export).

:eagle:

1 Like

Problem for today is: I have a FBX file that opens just fine Autodesk’s FBX viewer - and just fine in Cinema4D (which I’ve started using to cross reference files)… but opens a mess in Blender. Would you assume that Blender would open a FBX that other FBX supporting apps can open? Or is its implementation/support of FBX not comparable? (also worth noting that exporting as GLB direct from Cinema4d is also a mess… that’s been my trick recently - to avoid Blender issues)

Cinema4D on left. Blender on Right.

ps. I found a workaround (remove and rebuild animation)… which I’m psyked to have done! But adds 20mins to each conversion.

pps. how’d you know it was called Dfilm? I changed the name many years ago.

1 Like

@bigrig Thanks for the tip!

Yeah, I changed the Mesh, all the Animations went Bork!

:joy:

Had to roll-back.

BLENDER~MENTAL~NOTE:

  • don’t change mesh after animations.

feel like we need a list… or something?


COOL → that you use Cinema4D and FBX and GLB (@bigrig).

I SEEK the one-true HAPPY~PATH!

Your characters are AWESOME. Kudos. Very likable.


HOW TO SOLVE MESH~IMPORT~GOTCHAS (once and for all)?

So many puzzles…

Is MASTERY NOT the way?

I have yet to UPGRADE. 2.8. ( just mastered 2.79 - surprise - we changed everything (again) ).

Memorize, Happy~Path … is best guess.

But is it happy? And is it IMPOSSIBLE PAVE THAT PATH?

SMOOTHER, ASSET IMPORT PRECISION, someday?

Seems unlikely. Will persist, anyway.

: )

From Mr. JCP’s guidance.

BLENDER is the Wild West… at the edge of the city.

So many COMBINATIONS.

Maybe MASTERY is the answer after all.

But the COMBINATIONS, keep changing!


TEMPORARY - SOLUTION:

improving the EXPORT process to be (fewer) HOT-KEYS.

Maybe I can figure that one… (halfway).

YES, I WENT THERE:

“In Depth Blender Hot Keys”

BLENDER~EXPORT, about to be: CTRL + 1 + 2 + 3 + 4

Export-Auto-Indexer.

( yeahno…thatdidnothappen)

SUCCESS: VILLIAN~RIG!!!

image

UPDATE: @JCPalmer && @PirateJC

(100%-exported-character~anims)

Blender in BABYLON…

:eagle: : )

4 Likes

Nice! If you got it down in Blender with series of hot keys and conditional logic (versus human judgement) - you could automate with Robot Process Automation. And then you’ve got a real nice pipeline.

1 Like

@aFalcon! AWESOME! So is part of the goal to show folks how to easily add rigs into the cinematics system? Anything to make that simple for folks will be super helpful and awesome as people start to dive into this world!

Absolutely LOVE to see the progress you’re making!

1 Like

LIKE!

“Conditional Logic”… How? True. Many animations BABYLON-SIDE too. But in Blender? Cool.

Is it possible (to string… all very different things… together?

One mentor, called it “instrumentation”.


For 3DPipline… tons of “verticals”.

EXAMPLE: It is a looong road to PRODUCTION~MARKETS.

The 3DPIPELINE… (is a horrific thing).

As you know!

Basically, we are ALL~IN~PWA. For_freedom.

AppStores have mosquitos. Is it just me?

I believe there is another, a better, way. I believe it.

We are doing it different.

Top of 3DPipeline (so far) is a… SOCIAL~NET.

We have some things planned… ANMZ (everywhere).

TikTok and Twitter, and Insta.


BLENDER-HOTKEY-TIPZ:

Use ctrl+1, ctrl+2, and ctrl+3… in Blender to export more easily.

  • Right CLICK ANY BUTTON (in Blender) >
  • choose ‘ADD SHORTCUT KEY’
  • Then type in … a key … (ctrl+1, ctrl+2, ctrl3)
  • dont override something!
  • And try the EXPORT.
  • With HOTKEYS ON: SAVE AS, SAVE, EXPORT to BABYLON HOTKEYS, and…
  • very last button…not possible.
  • it is the button added by our extension. No ADD SHORTCUT option in RIGHT CLICK.

Could be user error - I DID end up in AIRPLANE MODE.

FYI: to the PythonGods.

  • Blender export to BABYLON button, does not have ADD SHORTCUT magic goodness.
  • I might BEG of you to show me how to add this myself - JCP.

3DPipeline is massive. It will be SMART to automate workflows.

AUTOMATED~WORKFLOWS.

AUTO~FLOWS

<ok: I am terrible at automation/>

Thanks @bigrig

:eagle: : )

That is a brilliant goal, man. : )

Ok, will do.

Make it simple for folks.

Yep, brilliant.

You got it PJC.

Trying!

:eagle: