Archive for the ‘Features’ Category

Real time light baking with Flare3D

Thursday, April 4th, 2013

Flare3D light baking

In the past few weeks, Jason has been working hard to create a real time light baking system, taking advantage of Stage3D and fully GPU processing.

This new feature will allows in few seconds add baked shadows and enhance the ambient illumination in your scene. This is great to get beautiful scenes without the cost to use dynamics lights and because a picture is worth a thousand words, please check the screenshots below..

lightBaking_01 lightBaking_02

On the left you can see a 3D Scene composed by cubes over a plane. This scene only contains the default directional light.

On the right, you have the same scene, but now with baked illumination with multiple lights(point, directional), diffuse baking, soft shadow baking and fixed UV edge feature. To make it, the scene’s illumination was pre-calculated with more than 100 lights and this took only some seconds!

The result? You can obtain a complex illumination without expensive resources.

The advantages of this feature In Jason’s words:

The point of doing this is because:
1) the name of baking dose not mean it is fully static, to bake it into texture in the real-time makes it has the possibility to change if needed, for example there is a scene with sun light at beginning, but may change to a night view later on.
2) the cost of baking is very cheap, may faster than uploading regular bitmap data in some cases,
Just assume we upload 101 light maps for this demo, that would be much slower,wouldn’t it?
3) precision of texture is no longer need as large as it could be, instead 128×128 is enough for a object, that is because we generate the texture by shader, instead of unpacking any bitmap format.
4) it is easier than having a external light maps, since for artist they just need to create an extra UV coordinates, all the rest of work just leave it to the program:)
5) the file size would be reduced a lot, as you can see the whole file is only 135kb, it is a pretty much a light map size, isn’t it?

The light baking feature is in Labs and will be available in a future release. Meanwhile, you can test this demo downloading it from our forum here.

Keep in touch for more news! :-)

Announcing Flare3D for HTML5

Monday, January 7th, 2013

html5_banner

A new exciting year is starting and Flare3D is evolving and growing every day to take advantage of new opportunities!.

So, yes!!, we’re talking about HTML5 and WebGL, and yes!!! We have decided to start a new journey into this new amazing world :D

As always, our mission is to provide Professional workflow to create next-gen 3D web and mobile based applications! – same tools, same workflow, same file format!

In this early Flare3D / HTML5 demo, you can see directly in your browser without any plugin, our lovely Yellow Planet model (zf3d) without any change at all!!!

But, enough talking, show time!!, check it out here.

This is an early stage, there still a lot of work to do!, so, we want and we need to receive feedback and suggestions from you guys, in order to give you the best quality possible product!.

We have more to show. Stay tuned, new things are coming to Flare3D!.

Showing Progress!

Friday, November 2nd, 2012

Last time, we spoke about FLSL here and here, but now, I want to share with you some of the tasks we have accomplished in latest days.

  • First, thanks to Jose Luis, as you may already noticed, we have new super improved forums! (applause), so, we’re not only going to give you a super awesome 3D engine (very modest), but also we want to improve the support and community tools!
  • We also have finished the new 3DMax plugin that already has support for lots of texture formats (including bmp, tga, psd, jpg, png, dds, etc..), automatic lightmaps batching, support for diffuse, specular, opacity, bump, reflection, refraction and ambient maps, additional support for cube maps, simplified interface, bug fixes and more!
  • There is also the new ZF3D format, which is basically a new Open Flare3D Format, which  is a zip file containing all the textures, binary files, animations, resources and a descriptor xml file you can easily edit, or simply replace assets and then convert it to a binary F3D file ready for production. This also means that you can write your custom exporters or editing tools ;)
  • Also, thanks to Ivan, who has been working super hard (trust me!) on the Collada importer, we have now much better support for *.dae files, that is supported by most of the external 3D platforms such as Blender, Maya, Cinema4D, Sketchup, etc..
  • But there are more awesome news!, the new Library (swc), the engine itself!, we already got a very nice and stable version!!! :D – I could enumerate here “tons” of new features, but we’ll go deep on each one in coming posts.
  • But….stop!, there is even MORE!!, latest days I were totally focused on the IDE, cause, we want to give you not only a 3D library but a whole workflow and tools!

And here we are! :) , this is already running with the new version!, you can see in the image, some new panels and tools, dynamic layouts, workspaces and detachable panel windows,  and a large amount of improvements ;)

So, we’re pretty close to release all these things! just a bit more of work! but for those who can not wait (like me), we’ll announce trough the forums an early access during the next week, so..stay tuned ;)

Getting started with FLSL : Part 1

Tuesday, October 16th, 2012

We are going to open a “request for beta” very soon, so, it’s a good time to introduce some of the concepts of the new version.

If you didn’t see the previous post, you may want to take a look first here.

If this is your first time in the shaders world, this short description may be useful: (from wikipedia)

Shaders are simple programs that describe the traits of either a vertex or a pixel. Vertex shaders describe the traits (position, texture coordinates, colors, etc.) of a vertex, while pixel shaders describe the traits (color, z-depth and alpha value) of a pixel. A vertex shader is called for each vertex in a primitive (possibly after tessellation); thus one vertex in, one (updated) vertex out. Each vertex is then rendered as a series of pixels onto a surface (block of memory) that will eventually be sent to the screen.

How do I use them in Flare3D? The process is very simple!

First rule! don’t panic! at the beginning you may get a bit confused, but you’ll see pretty soon how easy and fun is to play with shaders ;)

  1. Write your shader in a file with an (*.flsl) extension.
  2. Drop the FLSL file into the Flare3D tool (image above), and it will output a file with the same name plus a (*.compiled) extension.
  3. Embed or load the compiled shader file into your AS3 project.
  4. To use your shader, you can create a FLSLFilter to use in your Shader3D mixed with other fitlers, or you can just create a FLSLMaterial for a static material.

So, let’s start from the basics and take a look at some of the data types availables in FLSL:

  • Namespace: Yes!, namespaces, like in AS3, you can import different packages (namespaces in flsl) to make your shader code easier.
  • Samplers are the data type related to textures. You can use sampler2D for traditional 2D textures or samplerCube for cube map textures.
  • Techniques: In each FLSL file you could have one or more techniques that define different behaviors for the shader like, different profiles of the same shader, or simply different materials or filters in one file.
  • Outputs are the variables that defines the final state of the shader, at minimum, each shader should write the vertex position and fragment pixel.

There are other data types that will be detailed in future  posts, but for now, let’s see what this code does:

sampler2D texture

We declare a variable “texture” of type “sampler2D”. Samplers are public variables and they are exposed also on AS3 side so you can change it  also by code.

output vertex = transform();

In this line, we declare a variable vertex of type output and assign to it the value returned by the function transform() (declared in flare.transforms), which contains a simple vertex multiplication to transform the raw vertex data into the perspective vertex position into the screen.

output fragment = textureMap( texture );

And finally, the declaration of the variable fragment of type output also, and assign to it the value returned by textureMap(), which gets the pixel value of the sampler texture passed as a parameter.

The output data type, is a dynamic one, and it is reserved for certain output values. In the case of  veretx and fragment variables, they are declared as float4 values which represents a XYZW for the vertex position and RGBA for the fragment.

So, there are so many new things here…but don’t worry!, with just some examples you’ll see how much powerful and easy is to get around it.

See you in the next part!.

Hello FLSL!

Wednesday, October 3rd, 2012

It has been a long journey since we started with the FLSL project (Flare3D Shader Language) , and I can guarantee that it was one of the hardest thing we have ever made!

So, being so close to the coming release, I want to take a little time to share some details and examples about why is FLSL so important and what does it mean for you.

FLSL is a very special (and loved) component of the coming version, is like the heart of the engine!, lets say…

  • It allow you to modify the appearance of each object / material / pixel on the screen.
  • You can not only make things look better, but also faster!
  • It gives to you full control…I mean, it puts all the render pipeline into your hands!!, you will be able to twist the engine to its limits!
  • It’s a very simple and powerful language, you will not need to deal with AGAL/Assembler or low level code.
  • It produces optimized bytecode and deals with all the hard and boring stuff for you :)
  • It is the first shader language based on a dynamic virtual machine (we’ll talk about this later).
  • It Rocks!! ;)
  • What can you do with FLSL?, basically all kind of better looking materials, post process filters, special effects, shadows….the sky is the limit ;)

    There is so much to talk about, but enough for now…..show me!!!!…show me!!!!

    Introducing FLSL!

    Flare3D Shader Language – Sneak Peek

    Thursday, July 26th, 2012

    As many of you already know, coding shaders is a very difficult task, but to write them in AGAL is even harder!

    This is why we created FLSL, a High Level Shader Language for Stage3D!

    But, FLSL ins’t only a typical shader language, it includes tons of amazing and innovative features we will dedicate specific posts, examples and tutorials!

    And to demonstrate some of the power you’ll be able to play with, here is a demo made by our dear user Jason Huang using the new version of FLSL!

    FLSL will be included in the upcoming Flare3D 2.5 version,

    No more excuses! now, everyone can play and have fun with shaders! :D

    Stay tuned!

    Flare3D 2.5 + Starling Integration

    Tuesday, July 24th, 2012

    starling

    To take all the advantages of accelerated content on Flash, and achieve the maximum possible performance, you would like to mix between 2D and 3D accelerated frameworks, well, it is now possible!

    Maybe, you are working in a project where you need to optimize its performance as much as possible (like a mobile project). In this cases, you must to avoid any CPU intensive operations, and one thing that you can do, is changing the traditional 2D Flash interface that uses CPU resources for other based in GPU acceleration. To take advantage of Stage3D capabilities with 2D accelerated graphics you can use The Starling Framework. With Flare3D 2.5 and the next version of starling you will be able to use them together!.

    We were working with Starling team to provide the most easy and simple possible integration, and to prove it we made a short example that shows how Flare3D and Starling can work together. If you were working with Starling framework before, you’ll feel most of the code very familiar.

    You can see this sublime experience (and more) in the following example:

    A public beta of Flare3D 2.5 is coming very soon ;)

    Stay tuned!

    Vertex Spheres + TweenLite = Magic

    Tuesday, May 22nd, 2012

    vertex tweened animation

    When you think in a mesh you are basically  thinking in vertexs.
    In this cute example, our dear Ivan takes four 3D meshes, gets its surface information and place a sphere in each vertex’s position. When the stage is clicked, a new mesh is taken as reference and each sphere is tweened to the new vertex position. For tweening, we are using the famous Greensok’s TweenLite library (I love Greensock’s products Risa ).

    vertexvertex

    This example presents a simple technique for handling objects info and how to use them as reference for manipulating scene objects.

    Live demo and full source code in our Wiki

    Enjoy it!

    Flare3D news: New update v2.0.48 is available!

    Wednesday, April 11th, 2012

    flare3Dv25

    We are excited to announce that Flare3D update v2.0.48 is available.
    This is an small update to fix a few little bugs, and over the time, the engine becomes more and more solid and stable!

    Download links are available here and the changelog here.

    So, is time to bring the engine to the next level, and our team is working full speed, day and night to release a coming new mayor version, Flare3D 2.5!

    Starting from 2.5 version, we’ll not call it “pre-release” anymore, and we’re including a watermak on the trial version (you can easily disable for debugging purposes).

    We expect to launch this version early in May!, and Flare3D 2.5 will include three new amazing features:

    Flare3D Shader Languaje (FLSL v2.0).

    It was created originally as an internal tool, but it has evolved into a full shading language.

    The new version includes several new features, but most importantly, it lets everyone have the ability to extend the native functionality of the in a very easy way!.

    Amazing shaders effects, post process filters, shadows, and tons of amazing new stuff can be created with a few lines of code without needing to use low level AGAL bytecode.

    The new FLSL optimizes every aspect of materials and render pipelines and is very well suited for 3D mobile games.

    FLSL V2.0 is a complete language that includes many special features that simply doesn’t exist today on current shading languages!.

    YES! We are very excited with FLSL V2.0 !!!!

    New 3DMax exporter.

    Our developers recognizes that one of the most important features of Flare3D is deep integration and workflow with 3DMax.

    This new plugin isn’t only a completely rewritten version to support the new Flare3D file format, but also has several cool new features like:

    • Support for shared instances.
    • Support for all texture formats available on 3DMax.
    • Better geometry compression.
    • Full integration with FLSL V2.0. This allows to visualize Flare3D shaders directly on 3DMax viewports!

    Cool right?

    Graphics3D API as the beginning of Flare2D…..best of both worlds!

    • Full integrated Graphics3D API!
    • Can you imagine creating a vector-based  graphics with Flash Pro, and with a single click convert them to a mesh and render them using the power of the GPU??
    • Now you can combine 2D and 3D worlds in the same environment!.

    What’s next?

    We’ll not stop here!, and soon, we will publish a full public roadmap.

    It will include a totally new IDE, dynamic and static shadows, real time post process effects, new collision system, optimizations for mobile, and more, a lot more !!

    We are just thrilled to see what biggest studios are doing with Flare3D all over the world. They are raising the bar of online games with 3D enabled games.

    Exciting times are coming, stay tuned !!!

    Flare3D team.

    Flare3D Physics Engine (Beta)

    Tuesday, December 20th, 2011

     

    The waiting is over, Flare3D physics engine beta version is finally here. Let´s Solve some complex tasks such as mouse detection, mesh collision and many others! 

    avatar

    Check out our Wiki (wiki.flare3d.com) there you will find everything you need to start using this engine. Explore online examples included in Flare3D, code snippets, utilities, experiments and advanced examples.

    Are you new working with Physics? don´t worry, you don´t have to be Isaac Newton to create amazing physicalized developments. In our Wiki we go from the basics, explaining how to initialize a physics engine to how to control an avatar in a 3D map.

    mesh2pool

    During the process you will learn how to handle mesh collisions, primitives (how to create different kind of rigid bodies), understanding materials properties of a body (friction, restitution, force, mass, torque, etc), how to keep attached a body to a specific position and even understanding how mass of body affects its motion.

    Sounds complex, but is not! Why don´t you try it?

    Wiki: http://wiki.flare3d.com

    Team flarephysics credits:
    Marcos Lazo (Core)
    Juan Pablo D’Amato (Data Structures, Optimization)
    Cristian García Bauza (Core, Project Manager)