[Corn Revolution - Technology and workflow ideas]

Hello Greensock friends!

 

I'm starting to get stuck into using Greensock, but looking at the showcase some of them are just blowing me away.  Particularly:

 

https://go.pioneer.com/cornrevolution

 

I was wondering, at a top level, what the technology stack and workflow that has been used to produce this.   It looks like the corn is being rendered in 3D?  Is there a wrapper framework to have lit 3d scenes like this?  What about animating 3D objects, it looks like the plant is growing later down the page.

 

Any insights, case studies into some of these things would be good.    Some of it is just mind boggling!

[How to locally install GSAP and Plugins from Zip]

Thank you for the clarification!  Cheers

[How to locally install GSAP and Plugins from Zip]

Yes Thank you - 

 

Although if I choose to use it a more modular nature, do I do the following?

<script src="js/TweenLite.min.js"></script>
<script src="easing/CustomEase.min.js"></script>
<script src="plugins/CSSPlugin.min.js"></script>

 

Also - Back to Jquery - What the difference between these two files?

\src\minified\jquery.gsap.min.js
\src\minified\jquery.min.js

And on the uncompressed side, there is not a uncompressed version of \jquery.min.js?

src\uncompressed\jquery.gsap.js

 

Sorry - I know it probably obvious - I just can't work out why there is inconsistency between compressed /uncompressed folders.  Or hot to include stuff in modular nature.

 

[How to locally install GSAP and Plugins from Zip]

Hello All,

 

This probably sounds like a silly question, but searching on google and on this site, I can't find a basic how to - when it comes to adding the script files and installing/setting up locally.

 

I've downloaded greensock-js-with-customease and I'm concluding if move the entire minfied folder structure to my Javascript directory and include the following two files. 

 

<script src="js/TweenMax.min.js"></script>
<script src="js/TimelineMax.min.js"></script>

But I can't find a conclusive answer.   The getting started guide just refers to using  CDN or downloading the zip:

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/2.1.3/TweenMax.min.js"></script>

I am guessing that TweenLite.min.js is the a la carte version, but then how to pick and choose plugins?

 

Also in the minified folder there is a jquery.min.js and jquery.gsap.min.js, both these files look very similar, what is difference use?   I'm concluding that they are JQuery Hooks to override animation behaviour?  But what I don't understand is why there is jquery.gsap.js uncompressed, but not jquery.min.js uncompressed?

 

Could someone point me to appropriate page in the documentation which explains the folder structure / usage of the download.  Or if not otherwise summarise here?

 

The Full folder zip I've attached below.

 

Thank you

 

greensock-js-with-customease\greensock-js-with-customease
greensock-js-with-customease\__MACOSX
greensock-js-with-customease\greensock-js-with-customease\docs.html
greensock-js-with-customease\greensock-js-with-customease\getting_started.html
greensock-js-with-customease\greensock-js-with-customease\src
greensock-js-with-customease\greensock-js-with-customease\src\bonus-files-for-npm-users
greensock-js-with-customease\greensock-js-with-customease\src\esm
greensock-js-with-customease\greensock-js-with-customease\src\minified
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed
greensock-js-with-customease\greensock-js-with-customease\src\bonus-files-for-npm-users\CustomEase.js
greensock-js-with-customease\greensock-js-with-customease\src\bonus-files-for-npm-users\umd
greensock-js-with-customease\greensock-js-with-customease\src\bonus-files-for-npm-users\umd\CustomEase.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\all.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\AttrPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\BezierPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\ColorPropsPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\CSSPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\CSSRulePlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\DirectionalRotationPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\Draggable.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\EaselPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\EasePack.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\EndArrayPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\index.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\ModifiersPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\package.json
greensock-js-with-customease\greensock-js-with-customease\src\esm\PixiPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\RoundPropsPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\ScrollToPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\TEMPLATE_Plugin.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\TextPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\TimelineLite.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\TimelineMax.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\TweenLite.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\TweenMax.js
greensock-js-with-customease\greensock-js-with-customease\src\esm\TweenMaxBase.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\easing
greensock-js-with-customease\greensock-js-with-customease\src\minified\jquery.gsap.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\jquery.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\plugins
greensock-js-with-customease\greensock-js-with-customease\src\minified\TimelineLite.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\TimelineMax.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\TweenLite.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\TweenMax.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\utils
greensock-js-with-customease\greensock-js-with-customease\src\minified\easing\CustomEase.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\easing\EasePack.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\plugins\AttrPlugin.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\plugins\BezierPlugin.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\plugins\ColorPropsPlugin.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\plugins\CSSPlugin.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\plugins\CSSRulePlugin.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\plugins\DirectionalRotationPlugin.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\plugins\EaselPlugin.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\plugins\EndArrayPlugin.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\plugins\ModifiersPlugin.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\plugins\PixiPlugin.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\plugins\RaphaelPlugin.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\plugins\RoundPropsPlugin.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\plugins\ScrollToPlugin.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\plugins\TextPlugin.min.js
greensock-js-with-customease\greensock-js-with-customease\src\minified\utils\Draggable.min.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\easing
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\jquery.gsap.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\plugins
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\TimelineLite.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\TimelineMax.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\TweenLite.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\TweenMax.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\utils
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\easing\CustomEase.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\easing\EasePack.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\plugins\AttrPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\plugins\BezierPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\plugins\ColorPropsPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\plugins\CSSPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\plugins\CSSRulePlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\plugins\DirectionalRotationPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\plugins\EaselPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\plugins\EndArrayPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\plugins\ModifiersPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\plugins\PixiPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\plugins\RaphaelPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\plugins\RoundPropsPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\plugins\ScrollToPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\plugins\TEMPLATE_Plugin.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\plugins\TextPlugin.js
greensock-js-with-customease\greensock-js-with-customease\src\uncompressed\utils\Draggable.js
greensock-js-with-customease\__MACOSX\._greensock-js-with-customease
greensock-js-with-customease\__MACOSX\greensock-js-with-customease
greensock-js-with-customease\__MACOSX\greensock-js-with-customease\._docs.html
greensock-js-with-customease\__MACOSX\greensock-js-with-customease\._getting_started.html
greensock-js-with-customease\__MACOSX\greensock-js-with-customease\._src
greensock-js-with-customease\__MACOSX\greensock-js-with-customease\src
greensock-js-with-customease\__MACOSX\greensock-js-with-customease\src\esm
greensock-js-with-customease\__MACOSX\greensock-js-with-customease\src\esm\._package.json