Ok so this was officially announced at the GDC in March but limited information, but now it has been slated for an official public standard in early 2010. Shortly after the announcement at the GDC we saw Google o3D appear doing exactly that, controlling OpenGL through Javascript in the browser but it was still largely software/harward hybrid rendered. Google, Mozilla, Opera are part of the companies supporting WebGL which is great for browser support, also NVIDIA, AMD and Ericsson are in on it.

Khronos Details WebGL Initiative to Bring Hardware-Accelerated 3D Graphics to the Internet

JavaScript Binding to OpenGL ES 2.0 for Rich 3D Web Graphics without Browser Plugins;
Wide industry Support from Major Browser Vendors including Google, Mozilla and Opera; Specification will be Available Royalty-free to all Developers

4th August, 2009 – New Orleans, SIGGRAPH 2009 – The Khronos™ Group, today announced more details on its new WebGL™ working group for enabling hardware-accelerated 3D graphics in Web pages without the need for browser plug-ins.  First announced at the Game Developers Conference in March of 2009, the WebGL working group includes many industry leaders such as AMD, Ericsson, Google, Mozilla, NVIDIA and Opera.  The WebGL working group is defining a JavaScript binding to OpenGL® ES 2.0 to enable rich 3D graphics within a browser on any platform supporting the OpenGL or OpenGL ES graphics standards.  The working group is developing the specification to provide content portability across diverse browsers and platforms, including the capability of portable, secure shader programs.  WebGL will be a royalty-free standard developed under the proven Khronos development process, with the target of a first public release in first half of 2010. Khronos warmly welcomes any interested company to become a member and participate in the development of the WebGL specification.

Google released O3D this year and there are great strides in 3d within the browser from game engine wrapper technologies such as instant action technology, gaim theory engine (now owned by id Software and runs Quake  Live, hardware rendered Unity 3D (and Torque 3D coming soon), and Flash software rendered  3d engines Papervision 3D, Away 3D, Sandy (Sandy also released a haXe version that exports a javascript version) and others.  But it looks like the movement is to bring OpenGL to the web as a standard under the name WebGL, this would be great!  There would still be lots of times where plugins are better now and in the near future but the path is a good one. Having a software/hardware rendering hybrid like Google O3D for broad video card support (some of the painful older intel cards), or using a plugin like Unity3D, Torque 3D or wrapper technology for bigger engines is a good idea for the time being. But the future is grand in this area.

I think that Google O3D and OpenGL ES success on iPhone games probably combined to get this in motion.  OpenGL and very basic video cards are now standard in most machines out there.  Unity3D actually published hardware statistics on casual gamers (web-based games) ever so kindly and shows that even though there are some older Intel cards out there, for the most part machines nowadays have a video card capable of supporting at least low-poly 3d and hardware supported 2d rendering in real-time for games, user interfaces and more.

This is exciting news, it appears the movement of the web gaming market is getting much more capable and is accelerating the innovation of hardware accelerating the web.

Augmented Reality and the base of the original ARToolkit has taken the flash world by storm with the FLARToolkit and really the speed updates of the AVM2 in Flash9 and Flash10 to be able to pull off the OpenCV calculations needed on the bitmap data from each frame of a camera. It has been around quite some time but now web based engines such as Flash and now Processing can take advantage of this awesome technology.

The Simple ARToolKit Library for Processing (PC) is just a basic port of single marker AR support and it currently only runs on windows.

Den Ivanov did some cool experiments with this kit but adding the capability to do multiple markers.  In his videos the processing runtime seems to process the render pretty quickly.  It seems that most Flash AR is around like 5-10 frames per second for the detection.

*mute the sound*

ARToolkit for processing tests from den ivanov on Vimeo.

Video of the features of SL3 Beta, Demos, at a Slow Pace from #mix09

A few points after the video and taking a tour of the features.

The pixel shaders are written in HLSL (shader 2), however they are compiled to byte code and do not currently use the gpu for rendering. While the pixel shaders are very cool and the language to write them is standard pretty much for shaders in HLSL shader model 2 DirectX-based (the other is GLSL OpenGL based) they have not allowed this byte code to run on the GPU… yet. Here Flash and Pixel Bender actually are ahead there.

Although there are 3d planes which is very exciting, no good pseudo 3d engine exists yet matching the 3 in flash (papervision3d, away3d, sandy). When SL3 comes out I am sure we will see a few emerge or build them ourselves because this iteration of SL3 looks pretty fun.

Pixel based operations will be a huge advancement much like it was in earlier flash versions as it adds some demo scene type abilities and experiments with pixels that are fun.  This also lends to doing cool things like shaders, effects, AR, face recognition, motion detection etc.

Effects like Blur and Drop shadow are good and the ability to add custom ones, great. However currently they are pretty performance intensive.  They are also in Flash but there needs to be some refinement in SL3 effects before launch.

Desktop runnable apps in out of browser will be nice and this is a direct compete with Adobe AIR which was a surprise.

Local Communication supports desktop to browser communication.

Isolated storage (similar to shared objects) supports 1MB in browser, 25MB out of browser defaults.

This version of silverlight is really a 1.0 version as typical with most software.  Version 2 or version 3 is usually what the initial design goals pan out.  Much like the latest unity3d version (2.5) that has windows support and the iPhone SDK 3.0 that both came out this week, even actionscript 3 compared to earlier versions, these toolkits are finally iterated enough that they are really solid platforms for building cool stuff on and become platforms.  The next version of all these could be very, very dangerous.

Huge missing features:

Although there are some great features in SL3 beta, it is still not done and it is still missing some key components that Flash has which make it very attractive in the interactive space.

• Camera and Microphone support - Macromedia hired one of the smartest dudes around in Jeremy Allaire back in flash 6 days to help add support for Flash Communication Server (Flash Media Server now) Camer and Microphone support.  One of the best R&D periods at Macromedia. SL needs this soon.
• Printing support – what was long a problem in Flash is so in SL, there is no good printing support
• No GPU usage for Pixel Effects/Shaders – (neither flash nor silverlight support hardware accelerated shaders in PixelEffects/Pixelbender – Pixel Effects/Shaders need GPU support (see Kevin Goldsmith’s article on GPU mixed with CPU and how this may or may not be good. However processors are speeding up and multi-core helps software rendering, the quality of GPU is well beyond what software rendering can deliver for a few years to come at least while architecture advances, probably more like 5-10 years.
• No UDP plans yet - Adobe has RTMFP, SL sockets has no public plans for adding UDP that I have seen
• No Alpha Channel in Video - You can do this with a shader though but not supported by default.

Silverlight 3 Video

Flash has the upperhand in video and probably will still even though SL3 has H.264.  Flash added this at the same time and though they still have FLV which revolutionized web video they are now much broader in support in video than SL3.  Silverlight has H.264 and VC1 support (their own FLV like codec).  Still pretty cool a couple years ago there was no HD on the web now everyone has it in H.264 video support.

Currently nothing innovative, mainly catchup still, but here are some options

Silverlight 3 beta and the video below the features and highlights will look very similar to flash and flash community advancements over the last couple years.  There is no innovation just yet.

But where that could happen is in socket support with UDP. Flash has moved on this in RTMFP and the beginning of larger scale networking support with UDP with samples like stratus.  This is a huge differentiating feature for what I think will be game changer on the web (it already is on desktop mmos) in real-time or closer to real-time support for larger sets of users in online games like MMOs or virtual communities, even tools to make request based real-time sites like micro-blogging faster and able to handle more users (right now it is very linear if users get many followers, UDP will allow a better distributed framework for messaging).

Local Storage

Silverlight and Unity3D all need this, Flash could use better support for this.  Local saving of a files for cache beyond the internet cache and greater than the 1MB/25MB limits of SL3 IsolatedStorage.  This is an issue when you are making large scale games in that you need to save lots of assets to a client but to make it economical you want ot save more than the default internet cache amount. Flash Shared Object (Local) allow you to do this somewhat but it would be great to have a way to just download files for cache (upon user agreement) to store assets in bulk of allowable types (images, video, models, bundles) to the file system.

Hardware rendering for 3d support and UDP support will put Flash and SL3 on par with the killer Unity3D kit for making online web games and other activex/plugins like instantaction that allow you to do these things already.

The one thing SL has over Flash

Flash and Flex are great. But there is this massive division in the community and marketing of Flash. Silverlight is entirely unified and this has much to do with starting clean at a time that interactive development is heading more into a technology and developers control. Flash and Flex need to bring it together. AS3 has been out long enough that the people with skills have hopped on and taken it to a new level, mainly from programmers. If Adobe created a version of Flash that was a new IDE and consolidated Flex and Flash into just Flash, made the IDE as powerful as FDT or FlashDevelop3 there could be hope to bring the platform together. I understand they had to work it in slowly because it was a designers platform really (even though coders still pushed the limits in games and apps built on it) so they had to tip toe carefully on this to not alienate people. But now I think the division is a serious problem with the platform and must be addressed, noone expected Silverlight to be this quick on at least SL3 features. And even though the initial approach might have been bad as SL1 was a huge letdown, Microsoft does not give up and you can see in the XBOX360 and DirectX that they are very pursuant. DirectX really didn’t become huge until version 7 so these guys won’t relent.

I am not a huge fan of using the proprietary tools. Even in Flash I use as much open source as I can even though the player is locked, but Moonlight is something that trails Silverlight development and is a very unique thing in both open source and cross platform/multiplatform development. It is a clear relationship and aims to make Silverlight run on multiplatform mono including Linux. This could win out in the end who knows.

Futures

Great iterations of software happened this week in the latest unity3d version (2.5) that has windows support and the iPhone SDK 3.0 and now SL3 is quite a surprise in feature set.

I have been really busy this week just delving into all them and hope to start making more cool and useful projects in them.  The best part is right now is great to be an interactive or game developer as all major software companies and markets are focused on retaining good developers.  I don’t’ recall a time other than the beginning the the web virtual land rush that has so many options and markets that skilled developers and designers can choose from.  Good times.

Basically these engines look to be micro and provide pretty nice features while being so small. Micro tweening engines like GTweeny (3k), ByteTween (1.7k), TweenLite (2.7k), TweensyZero (2.9k) and Tweener (9k) have varying levels of support of features (Tweener being the most loaded with color and filter support without other kits just init, also TweenLite with a nice configurator to include only what you need).  Micro kits have benefits when used for banners, animated assets (where you have many assets and the per asset savings is worthwhile) and other places you just want really small output.

Light Transition ByteTween

(1.7k)

This kit has a c# version as well as a small as3 bytetween version.

The ByteTween static class eats only 1.7K of compiled clip! With this size it supports:

• Creation of tweens of any numeric property (not color/uint properties).
• Pause,Unpause,Cancel operations based on the tween target and property.
• Overlap system that cancel tweens of same property in order to avoid erroneous behavior
• Alpha tween with negative alpha support (negative alpha sets the MovieClip visibility to false)
• ’scale’ tween of both ’scaleX’ and ’scaleY’ properties.
• OnComplete callback with any number of parameters
• Easy interface for creating new tweens!

Download light_transition_CS_0.5a.zip.zip (c# version)

Download thelab_ByteTween.zip

TweenLite

(2.7k) base

• SPEED – I’m not aware of any popular tweening engine with a similar feature set that’s as fast as TweenLite. See the speed comparisons yourself.
• Feature set – In addition to tweening ANY numeric property of ANY object, TweenLite can tween filters, hex colors, volume, tint, saturation, contrast, frames, and even do bezier tweening, plus LOTS more. TweenMax extends TweenLite and adds even more capabilities like pause/resume, rounding, event listeners, timeScale, and more. Overwrite management is an important consideration for a tweening engine as well which is another area where the GreenSock tweening platform shines. You have options for AUTO overwriting or you can manually define how each tween will handle overlapping tweens of the same object.
• Expandability – With its new plugin architecture, you can activate as many (or as few) features as your project requires. Or write your own plugin if you need a feature that’s unavailable. Minimize bloat, and maximize performance.
• Management features – TweenGroup makes it surprisingly simple to create complex sequences and groups of TweenLite/Max tweens that you can pause(), resume(), restart(), or reverse(). You can even tween a TweenGroup’s “progress” property to fastforward or rewind the entire group/sequence.
• Ease of use – Designers and Developers alike rave about how intuitive the GreenSock tweening platform is.
• Updates – Frequent updates and feature additions make the GreenSock tweening platform reliable and robust.
• AS2 and AS3 – Most other engines are only developed for AS2 or AS3 but not both.

Download TweenLite

TweensyZero

(2.9k) base

Here are some simple steps to help you get started with creating your first animations with TweensyZero. TweensyZero is a light weight version of Tweensy most core features found in Tweensy are available to TweensyZero. Documentation for TweensyZero can be found under the folder ‘documentation/zero’ or online

Download TweensyZero

gTweeny

(3k)

gTweeny is gTween’s lightweight younger sibling. It strips a lot of the secondary features of GTween (proxy, timing modes, etc) in favour of smaller file size. It is currently under 3kb…

Download gTweeny

Here is a list of all open AS3 “Micro” Tweening engines < 5k

• ByteTween (1.7k)
• TweenLite (2.7k)
• TweensyZero (2.9k)
• gTweeny (3k)
  

Here is a list of all open AS3 Tweening engines and base kits

• Animation Package
• AS3 Animation System 2.1
• AS3Easing
• Go (base animation kit – create your own tween engine)
• gTween
  
• KitchenSync
• Twease
• Tweener (9k)
• Tweensy
• TweenLite (TweenMax)

The decision on which to use can be affected be features you want, how it feels (many use the same object syntax so it is dynamic), what performance do they have (all are orders of magnitude faster than the built in tween (flash) or transitions (mx/flex)), which size is ok, author/community support needed (some are more active than others adding features or simplifying and tweaking performance methodically), and many other factors.  There are definitely plenty to choose from.

Speed Tests for many Tween Engines

• Green Sock Tweening Comparison Tool
• Moses Benchmarking Tool (relative comparison against SimpleAS3Tween sample)

For more on each features see their sites or these previous lists on tweening engines:

• Updated: List of Best Animation Packages for AS3

The latest haXe file format library contains complete support to read and write PBJ file, enabling you to write Pixel Bender assembler directly in haXe, then compile it on-the-fly into PBJ bytes, which can then be saved on disk or loaded directly in Flash.

I plan to have much more on Pixel Bender (shaders in flash) and Adobe Alchemy (compile other languages to which is a very cool technology that involves LLVM that Nicolas also has lots of great input on.

The FLARToolKit is doing some of this cool in Flash.  This little toolkit is pretty sweet mapping points and sets of points to patterns, colors or other visual queues that technology can latch onto.  Combine this with a webcam and you have some pretty cool AR.

Desktop Fireworks from Saqoosha on Vimeo.

Found via today and tomorrow:

I’ve been following the development of FLARToolKit for some time now and it’s getting more interesting day by day. What it is? FLARToolKit is a Flash Actionscript port of ARToolKit, a software library for building Augmented Reality applications. Huh? Maybe you’ve seen some really cool Augmented Reality videos before. The FLARToolKit will bring all of this to your webbrowser when you have a webcam and a recent Flash Player.

This is one of the most exciting Flash things I’ve seen for a while now. Saqoosha, a Japanese Flash developer, made this little demo: Desktop Fireworks. You will need a the Flash Player 9, a webcam and you’ll need to print out this marker. I’ve already did some tests together with Papervision3D and I can say we’ll probably see more of this soon. This is Flash at it’s best baby!

Be sure to check out the shadow demo that this is based on:

After posting my shadow experiment, Patrick Matte posed a question wondering if I would be able to do real-time reflections in a similar manner. The next day I had it done, along with some nice iterations along the way: orthographic and perspective projection (I can release those later if anyone really wants them). I’ve been sitting on it every since and finally decided I would take the time to write a little description into how its done and give the code to those who are interested (and I fixed up some code for backface culling in the reflection this morning).

• View the reflections demo
• View the reflections post
• View the shadow demo
• View the shadow post
  

Shock to the system

Mako User Interface

Deadsphere Pt. I

and many more check them out at Iain Lobb.

The SWFZ engine is one Flash 3D engine that took a different approach. It is a bit early in its technique used but the author at custom:media Jono has decided to float the source code out there in ghost mode (no active development but not dead). It is just ready to branch and others to run with it. He is floating the source but I think in 1-2 years this will be the preferred method if processors and multicore parallel usage is optimized. We shall see.

The implementation method and difference with SWFZ engine in Flash for 3d is that is is a pixel based renderer or scanline. It is based on a really fun game engine called Irrlicht which has been pretty active for the last few years but is a C++ DirectX and OpenGL engine. Since SWFZ has to run in Flash and it is a pixel renderer/scanline it has some limitations currently in Flash. Games and renders have to be fast to pull this off and Flash is limited by the software renderer but as computers get multiple processors and flash player gets better at this then this will be a viable option (it is the same thing that limits Canvas based renderers right now). One main problem with this is you can’t go too full screen the biggest sizes that perform well are smaller windows 320×240 etc. But if the processors can handle it it is actually more efficient when it removes overlap, extra triangle drawing and painters algorithm like problems dont’ pop up (triangle overlap when on same plane). This method draws pixel by pixel but fast enough flash engines like Papervision, Sandy3D and Away3D draw overlaps due to the drawing technique, back to front.

But SWFZ still manages to pull off some amazing feats such as these demos

Quake Demo

Terrain Demo

Yoshis Hip Hop Couzin

Jono has put some great classes into SWFZ engine such as bsp parsers, quake md2 parsers, animated mesh, and lots of great examples in porting C++ Irrlicht to AS3. This was a very early example of how AS3 was fun for programmers to port stuff from C or C++ into Flash. AS3 is just fun. Also be sure to check the site for more samples like an FPS game, some basic ai etc.

Jono has been working on 3d in Flash for a while and actually this message is what shows the difference betweeen this approach and other flash engines the way Papervision, Sandy and Away3D (pv3d derivative) make 3d in flash fast enough (Painter’s Algorithm and drawing skewed movieclips and textures.

Demos

• Post on Open Sourcing of Code
• Post on Some Unfinished Work to Build On
• Demo Quake Prototype
• Demo Terrain
• Download Source SWFZ
• Download Source Dependency (FileSystem)

More about the Engine Some Notes

The SWFZ engine.

Overview:

SWFZ engine is the result of four years of me messing with 3D in Flash.

I was a complete newbie to 3D, so a lot of learning has happened to get to here.

If you’re interested in 3D engines check out the resource links at the bottom of the page:

The Demo:

Model

• .md2 format from ID’s Quake2.
• Uses frame based animation
• Textured with jpeg
• No lighting, No Gouraud Shading, just plain texture

Skybox

• Textures are just jpegs.

Boxes

• Rendering – Textured Gouraud , Textured Gouraud with Alpha, Textured Gouraud with Quick Alpha, Gouraud Shaded, and the large box is just Textured.
• Star Texture – Targa (.tga) file format.

AS3 classes

• 171 classes and interfaces

Scene

• No lighting
• No collision detection

SWFZ engine technology:

The demo only shows a small part of the capabilities of the engine. In the coming weeks I will get www.custommedia.co.nz up and running and start to post more info then.

Currently implement stuff:

New file formats supported

• .tga – Targa Image
• .bmp – Bitmap Image
• .3ds – 3D Studio Max
• .bsp – Quake3 levels
• .md2 – Quake2 models
• .obj – Wavefront 3d object (static)
• .zip – Read from a zip archive (all in Flash, no server side scripts)

3D Rendering

• mipmaps
• perspective correct texturing + affine texturing
• Flat shading
• Gouraud
• Textured Gouraud
• Textured Flat
• Textured Two Layers
• Gouraud Alpha
• Textured Flat Alpha
• Textured Gouraud Alpha

3D Scene

• Billboards
• Parent, Child scene nodes
• OctTree
• Skybox
• Static Meshes
• Animated Meshes
• Basic collision detection
• Scene node animators

If any code is useful to you maybe drop him a donation or what would be nice if this was all setup at google code and used to be integrated into other engines. Irrlicht ports are fun and there is a future in this method when processors catch up I think.

To the feature! This is a sweet game by mr. doob, called burn and brag for Nascar.

Now I don’t’ particularly like Nascar all that much but who doesn’t like to peel out to some fiddlin’? I mainly do Nascar stuff because it is highly marketable and like the only answer most ad agencies have for getting the southern us markets it seems, that and c-o-u-n-t-r-y mu-si-c (must be said at a slower rate).

But I digress, this is a perfect mix of advertisment, game play, fun and experience. It is fast, simple, and playable. Exactly the simplicity and smoothness needed of gameplay and playback.  Great ad work but it also gives something fun to do and best of all it is built in AS3 flash with a plethora of libraries from the flash as3 community.

The game platform is emerging fantastically in the AS3 market. mrdoob used these kits to build this:

• box2dflash for the car 2d>3d physics,
• a modified version of papervision3D 2.0 (Effects branch)
• Tweener for the replay

It would be cool to see a post on how he did the replays with tweener – I imagine just a series of points collected with car state (current position state) and then just play them back with a call back or time delay. You’d have to capture alot for smooth playback without laggy movements.  I am working on multiplayer games with this same issue for a current project.

Game on! The question is when will this be SOTD or SOTM at thefwa.com?