1. Jean-Marc Le Roux
@promethe42
http://blogs.aerys.in/jeanmarc-leroux

2. Resources
 Sources
 https://github.com/aerys/minko
 Forum
 http://answers.aerys.in
 Samples
 http://github.com/aerys/minko-examples
 Documentation
 http://hub.aerys.in/index.php/Minko:Tutorials
 http://hub.aerys.in/minko/reference/index.html

3. Minko SDKs
Community SDK
 Free and open
source framework
 Free tools

4. Minko SDKs
Professional SDK
 Advanced Features
Community SDK
 Free and open
source framework
 Free tools

5. PART 1: SCRIPTING
Community SDK

6. The bigger the app.,
the cleaner you want to be.
should?

7. I – or someone else – already did this,
I want to re-use the existing code.

9. ISceneNode
Mesh Camera GroupLight
AbstractController
ISceneNode.addController()
AnimationController AbstractScriptController
DataProvider
ISceneNode.bindings.addDataProvider()
CameraDataProvider LightDataProvider
ModelControllerView
Material

10. ISceneNode
Mesh Camera GroupLight
AbstractController
ISceneNode.addController()
AnimationController AbstractScriptController
DataProvider
ISceneNode.bindings.addDataProvider()
CameraDataProvider LightDataProvider
ModelControllerView
Material
MyScript
To create a script:
 Extend AbstractScriptController
 Override the update() method

11. You can keep working the way you want.
You don’t have to use scripts or controllers.

12. But with scripts & controllers…

13. Re-usable loosely coupled code
 Target multiple scene nodes with a single script
 Easily build and share your own library of useful scripts
 Easily fetch and use the communities code snippets
// only 1 script
var kbScript : KeyboardMoveScript = new KeyboardMoveScript();
// but it controls 2 targets
cube.addController(kbScript);
sphere.addController(kbScript);

14. Easy access to
 Mouse/keyboard properties and signals
 time, deltaTime
 Scene
 A lot of other properties useful to script stuff…
// if the right arrow key is down…
if (keyboard.keyIsDown(Keyboard.RIGHT))
target.transform.appendTranslation(.1);

15. Similar to Event.ENTER_FRAME but
 Lighter
 Customisable per-script « frame rate »
// execute this script only once per second
this.framerate = 1;

16. Example: move objects with the
keyboard
public class KeyboardMoveController extends AbstractScriptController
{
override protected function update(target : ISceneNode) : void
{
if (keyboard.keyIsDown(Keyboard.RIGHT))
target.transform.appendTranslation(.1);
if (keyboard.keyIsDown(Keyboard.LEFT))
target.transform.appendTranslation(-.1);
if (keyboard.keyIsDown(Keyboard.UP))
target.transform.appendTranslation(0., .1);
if (keyboard.keyIsDown(Keyboard.DOWN))
target.transform.appendTranslation(0., -.1);
if (keyboard.keyIsDown(Keyboard.PAGE_UP))
target.transform.appendTranslation(0., 0., .1);
if (keyboard.keyIsDown(Keyboard.PAGE_DOWN))
target.transform.appendTranslation(0., 0., -.1);
}
}

17. Usage
// instanciate the script
var kbScript : KeyboardMoveScript = new KeyboardMoveScript();
// add the script to a target
cube.addController(kbScript);
// remove the script from a target
cube.removeController(kbScript);

18. More about scripts and controllers…
 Write your first controller
 A Script To Move Objects With The Keyboard
 Handle Mouse Focus With A Script
 Switching Material With a Controller
 Create Procedural 3D Animations

19. PART 2: SHADERS AND GPU
PROGRAMMING
Community SDK

20. HDR Rendering
Dynamic lights
Static lights
Dynamic shadows
Static shadows
Diffuse texture
Noise
Diffuse texture

21. Kids, this is the story of how I met your shader…

22. 1992 2001 2004 2011
Mortal Kombat GTA III Doom 3 Crysis 2
1996
Evolution of shader languages

23. What about AGAL?
1992 2001 2004 2011
Mortal Kombat GTA III Doom 3 Crysis 2
1996
Language Features

24. In 1992, Flash was called FutureSplash Animator and written by a single man: Jonathan Gay

25.  learning AGAL != learning GPU programming
 AGAL is awesome for 3D engines developers
 Low-level binary assembly code
 Cross-platform
 AGAL is a nightmare for 3D applications
developers

26. With Minko you can program the GPU
using ActionScript 3.0 !

28. Minko embedded JIT
Compiler
Shader ByteCode
ActionScript Shader
Code
public class MyShader
{
public function getVertexPosition() : SFloat
{
return localToScreen(vertexXYZ);
}
public function getPixelColor() : SFloat
{
return sampleTexture(
meshBindings.getTextureParameter(‘texture’),
interpolate(vertexUV)
);
}
}
m44 vt0, va0, vc0
m44 vt0, vt0, vc5
mov oc, vt0
mov v0, va1
tex ft0, v0 <linear,2d>
mov oc, ft0
at runtime compilation

29. ActionScript
Shader
•Use all ActionScript 3.0 features
•getOutputPosition => Vertex Shader
•getOutputColor => Fragment Shader
•OOP style
•CPU/GPU balancing
ASG
•Abstract Shader Graph
•Optimizations
•Constants and temporary registers
allocation
•Operations re-ordering for faster
execution and optimal use of temporary
registers
AGAL
•Direct bytecode generation at runtime
•Custom compiler
•Optional debug data
•AGAL assembly output
•Shader graph output
•Memory allocation map
Execution
 Full AS3 workflow
 Conditionnals and loops
 Classes and methods
 Dynamic OOP coding style
 Exhaustive AGAL implementation
 Extra high-level operations set
 Re-usable « shader parts »
 Shaders compiled at-runtime
 Just like any other AS3 code
 Dynamic according to
 The scene properties
 The mesh properties/material
 Any constant, variable, etc…
 Redistributable as SWF/SWC files

30. ACTIONSCRIPT IS NOW
THE MOST POWERFUL
SHADER LANGUAGE

31. ACTIONSCRIPT IS NOW
THE MOST POWERFUL
SHADER LANGUAGE
(as a language, but not GPU feature wise because of Stage3D limitations )

32. More about shaders…
 JIT shaders for better performance
 Create your first shader
 Understanding vertex to fragment
interpolation
 Get ActionScript shaders compilations logs
 Create a shader rendering per-pixel normals
 Create a « black and white » post-processing
effect

33. PART 3: SCENE EDITOR
Community SDK

34. WYSIWYG Editor

35. Fine tuning

36. Flash Pro-like symbols

39. *.dae, *.3ds, *.obj, …
Common File Formats
Publish MK Scenes
…
editor

40. MK File Format
 Fully optimized for Minko
 More suitable for web/mobile apps in general
 Binary
 Light
 Zip, deflate or LZMA
 Readable with AS3, PHP, C++ and JavaScript

41. More about the editor…
 Normal mapping and specular maps
 Importing Collada files

42. PROFESSIONAL SDK

43. Minko SDKs
Professional SDK
Community SDK

44. After this slide, nothing is neither free nor open source.
(for now… )

45. PART 1: PHYSICS
Professional SDK

46.  Fast, robust and extensible
 Create new kind of forces, force fields…
 Add specialized shapes and collision detection
algorithms
 Comprehensive set of shapes
 Box, sphere, cone, cylinder…
 Triangle mesh
 Convex hull
 Heightmap
 Triggers for scripting

53. // listen to the Collider.collisionStarted signal
redGoalCollider.collisionStarted.add(
function (collision : CollisionStarted) : void
{
_numPointB++;
resetBall();
}
);
// do the same for Collider.collisionStopped…
Working with triggers

54. Best practice: implement triggers using scripts.
You will soon be able to bind them directly in the editor!

55. PART 2: OPTIMIZATIONS FOR THE
WEB AND MOBILE DEVICES
Professional SDK

56. MK Optimizations
 A new file format for 3D content
 Readable with AS3, PHP, C++ and JavaScript
 Optimized for the web
 Lossy and lossless 3D compression
 3D streaming (WIP)
 Optimized for mobile devices
 Automated shape-conservative 3D simplification
 Fast implementation
 Automated ATF compression for textures

57. *.dae, *.3ds, *.obj, …
Common File Formats
Publish Optimized MK Scenes
…
editor
Automated optimizations

58. 0
5000
10000
15000
20000
25000
30000
35000 dae
dae (rar)
obj
obj (rar)
3ds
mk
mk (simplification)
mk (compression)
mk (compression +
simplification)
3D formats size comparison(lower is better)

59. 3D formats comparison
0
20
40
60
80
100
120
140
File Size (MB) Downloading Time
(seconds)
Parsing Time
(seconds)
Original
MK
(lower is better)
Collada

60. 3D
Scene Automated optimizations
 ATF compression
 Texture resizing
 3D simplification
 3D compression
Publish
x10 faster rendering!

61. 3D
Scene Automated optimizations
 ATF compression
 3D compression
 3D streaming (WIP)
Publish
x20 faster download!

62. 3D
Scene
Build your scene once,
publish it for each device automatically.
myScene.mks
myMobileScene.mk
myWebScene.mk

63. Simplification is also very cool to create multiple
level of details for the same scene!

64. Next?
 Public beta next week
 Everything for free (for now…)
 Give us feedback!
 ShaderLab integration
 http://www.youtube.com/watch?v=yuR1e1PjU8Y
 Editor plugins
 Artificial intelligence framework/editor
 Particles framework/editor
 Animations editor
 Terrain editor

65. MERCI !