Archive for the ‘Uncategorized’ Category

Friday, December 17th, 2010

EaselJS is a new library from Grant Skinner that somewhat mimics the Flash display list/display object heirarchy.  It is the result of the game Pirates Love Daisies which demonstrates some great gameplay in html5.

The API is loosely based on Flash’s display list, and should be easy to pick up for both JS and AS3 developers. In our preliminary testing, Easel appears to be fully compatible with iOS, Android, and all major browsers that support the canvas element.

Lots of great javascript libraries have been made public including such contributions as this, Three.js (3d canvas/svg/webgl), Lettering.js (typography), audio.js (audio) and many many others, a complete pipeline is emerging. EaselJS adds to that a helpful flash like api for html5 (<canvas> + javascript).

The API contains these familiar classes for Flash/AS3 developers:

DisplayObject

Abstract base class for all display elements in Easel. Exposes all of the display properties (ex. x, y, rotation, scaleX, scaleY, alpha, shadow, etc) that are common to all display objects.

Stage

The root level display container for display elements. Each time tick() is called on Stage, it will update and render the display list to its associated canvas.

Container

A nestable display container, which lets you aggregate display objects and manipulate them as a group.

Bitmap

Draws an image, video or canvas to the canvas according to its display properties.

BitmapSequence

Displays animated or dynamic sprite sheets (images with multiple frames on a grid), and provides APIs for managing playback and sequencing.

Shape

Renders vector drawing instructions within the context of the display list.

Sunday, March 7th, 2010
Wednesday, January 27th, 2010

Tim Knip, a papervision core developer, has brought a pipeline improvement for users of Blender to import blender files directly into papervision and as3. This allows you to get at the blender objects, or blender DNA as it is called, that construct the 3d scene within Blender.

Unity3D has a great workflow that includes this where you can update your .blend file and then it updates in the Unity IDE, this work by Tim creates a similar workflow for Flash (recompile would be needed to show if embedded).

Typically exporters are made from the 3d IDE SDKs such as Blender using Python to export to COLLADA or other formats.  But here Tim is parsing the source file directly.  This also opens up the possibility to make other exporters from more simplified Flash AS3 code rather than learning a new IDE SDK just for an exporter.

I am not sure how much people want to embed .blend files with their applications as there is more information in the .blend file for the Blender app and it will add to the download.  But what this might do it inspire others to create simplified exporters from Tim’s work for Blender to COLLADA, 3ds and more that work well with papervision and flash 3d engines, directly in Flash.  So instead of learning each IDE to build an exporter that is the same, this solution could act as a proxy or middle man to simplify exporter creation, pretty much any Flash coder that understands 3d could build one from .blend files at a minimum.  If it was made as a higher level abstraction so the 3d software source could be swapped out it may open up simplified exporter tools a bit.  Since it is really just reading the binary data in the file, in theory other formats could do the same (3dsmax, Maya, Milkshape, etc).

There is a whole host of opportunities with this new tool! It is definitely nice to have this as I use Blender for Flash 3D and Unity 3D most often.  It will be interesting to see how this evolves.

Note from Tim on the tool:

I created a library to read Blender files (.blend) directly. So no
more headaches with broken exporters!

Grab the code here:
http://github.com/timknip/asblender/tree/papervision3d

Here’s a first example:
https://dl.dropbox.com/u/438592/blender/PapervisionTest.swf

And its code:
http://github.com/timknip/asblender/blob/papervision3d/src/PapervisionTest.as

ASBlender is simply a library which reads *everything* in a .blend file. So in theory you could grab materials, animations, armatures, the works… But its up to *you* to grab the relevant bits, since *all* the data is accessible.

Of course: this means you need to study the .blend format, see
http://wiki.github.com/timknip/asblender/ for more information.

Sample Code Snippet posted by Tim:

[Embed (source="/assets/crystal_cube.blend", mimeType="application/octet-stream")]
public var BlenderData:Class;

var blend:BlendFile = new BlendFile();

blend.read(new BlenderData());

if (blend.scenes.length) {
    // Blender can have multiple scenes, don't know yet how to grab the "active" scene.
  buildScene(blend.scenes[0]);
}

/**
 * Prints out the DNA as contained in the .blend
 */
private function printDNA(blend:BlendFile):void {
  var struct:DNAStruct;
  var field:DNAField;

  for each (struct in blend.dna.structs) {
    var type:String = blend.dna.types[ struct.type ];

    trace(type);

    for each (field in struct.fields) {
      trace(field.type + " " + field.name);
    }
  }
}

private function buildScene(scene:Object):void {

  var obj:Object = scene.base.first;

  while (obj) {
    // grab the Blender Object.
    // The Blender Object defines rotation, scale, translation etc.
    var object:Object = obj.object; 

    trace("Object name: " + object.id.name + " type: " + object.type + " matrix: " + object.obmat);

    //for (var key:String in object) {
    //  trace(key);
    //}

    if (object.data) {
      switch (object.type) {
        case 1:  // Mesh
          trace (" - Mesh: " + object.data.id.name);
          buildMesh(object.data);
          break;
        case 10: // Lamp
          trace (" - Lamp: " + object.data.id.name);
          break;
        case 11: // Camera
          trace (" - Camera: " + object.data.id.name);
          break;
        default:
          break;
      }
    }

    obj = obj.next;
  }
}

private function buildMesh(mesh:Object):void {
  var numVertices:int = mesh.totvert;
  var numFaces:int = mesh.totface;
  var i:int;

  trace(" - #verts : " + numVertices);

  for (i = 0; i < numVertices; i++) {
    var v:Object = mesh.mvert[i];

    var x:Number = v.co[0];
    var y:Number = v.co[1];
    var z:Number = v.co[2];

    trace(" - - vertex: " + x + " " + y + " " + z);
  }

  trace(" - #faces : " + numFaces);

  for (i = 0; i < numFaces; i++) {
    var f:Object = mesh.mface[i];

    var v1:int = f.v1;
    var v2:int = f.v2;
    var v3:int = f.v3;
    var v4:int = f.v4;

    trace(" - indices: " + v1 + " " + v2 + " " + v3 + " " + v4);

    if (mesh.mtface) {
      // UV coords are defined
      var tf:Object = mesh.mtface[i];

      trace(" - - - uv: " + tf.uv);
    }
  }
}
Wednesday, January 13th, 2010

Gordon, a flash runtime written in javascript, is an interesting project that recreates the Flash Player into svg using javascript from a flash source swf file.

UPDATE: Also check out smokescreen for the same, html5/javascript interpreting SWF files.

This is an interesting direction. There are most likely many things that do not work about this approach for existing content. But it is also a neat way to create new content that might be simple enough to play on desktop and a mobile version.

All these examples work on an iPhone or iPod Touch.

Wednesday, December 2nd, 2009

If you are looking to get into Unity 3d coding/creating a book is a good place to start to get the full overview. Recently, the first Unity book has been released by Will Goldstone via Packt Publishing.

The book is written in a simple yet rapid pace but starts out from beginner level 3d introductions and really explores all areas needed to give someone the handrails to start tinkering on their own in the dark of their labs with Unity. The book explores an introduction to 3d (the biggest hurdle for most in moving to unity although it also does 2d), terrrains (terrains aren’t supported in iphone yet keep this in mind if those are your aims), moving players and cameras, collision detection with colliders and rays, working with prefabs, creating HUDs, creating menu screens and working with the the GUI system in Unity (which can be strange for people coming from flash with event based user interfaces), loading/instantiating objects in the 3d world, particle systems, physics and lots of examples and minigames showing off these areas.

The book is alot like Unity itself in that it gets up and running quickly, gives the tools to do some damage and then opens the door to developing with Unity. After you develop longer in a platform you learn how to dig deeper into all these areas including scripting to do lots of what the Unity Editor can do for you but there is so much to take in that a good starting point to catch onto is needed.  Unity Game Development Essentials, the first Unity book, fills that role easily.

I have been using Unity as a hobbyist then at work at a game company starting in 2007 since it started to invade and take over from Director in 2007 ish then infiltrating the Papervision 3D and flash 3D developers, even with that experience this book still did a great job of exploring the tools and is approachable for almost anyone with some basic scripting skills and a desire to make some creative stuff.

Even if you have been doing Unity for a while a book is always good to see techniques and support authors and community members that give back to help others learn. Pick it up! (Amazon) (Packt Publishing)

If you aren’t ready to make the leap to Unity just yet there is also a great book from Paul Tondeur called Papervision Essentials for 3D in Flash, he has also done some projects in Unity to Flash communication.

Wednesday, September 9th, 2009

Claus Wahlers has a great post on some lower level Flash handling for shapes.  He posts about a tool called as3swf which helps to look into the raw shapes and vector drawing calls in the flash engine.

The output of this tool gives the raw machine code/assembly like procedural output that is very similar to other rendering engines. It actually makes me think of OpenGL a bit in the output switch based, procedural flow except this if for vector drawing rather than raster.

Sample output

[83:DefineShape4] ID: 1
  FillStyles:
    [1] [SWFFillStyle] Type: 0 (solid), Color: 666666
  LineStyles:
    [1] [SWFLineStyle2] Width: 200, Color: ff0000
  ShapeRecords:
    [SWFShapeRecordStyleChange] MoveTo: 400,400, FillStyle1: 1, LineStyle: 1
    [SWFShapeRecordStraightEdge] Horizontal: 2000
    [SWFShapeRecordStraightEdge] Vertical: 2000
    [SWFShapeRecordStraightEdge] Horizontal: -2000
    [SWFShapeRecordStraightEdge] Vertical: -2000
    [SWFShapeRecordEnd]

It is always good to know what is going on in lower levels to better code for projects that perform well.  Another great post on this is the Elastic Racetrack of the AS3 and AVM2 virtual machine which describes how the AVM2 handles drawing those low level shape calls in addition to handling script.

Wednesday, August 26th, 2009

Unity 3d iPhone 1.5 is released and has many things that were requested.

A few features really stand out as stuff we need:

  • Automatic batching of meshes to reduce draw calls.
  • Full support for native Objective C and C++ code opens full access to the iPhone 3.x APIs and custom plugins.
  • Introduced thread based main loop – now you can choose between NSTimer, Thread and OS event pump (CFRunLoop) methods. Thread method is set by default now.
  • Added native plugin support (advanced license feature). Just add custom attribute [DllImport("__Internal")] to your native implemented methods in C# and corresponding implementation to the XCode project.
  • Exposed full-screen movie playback support to scripts (iPhoneUtils.PlayMovie/PlayMovieURL).
  • Added support for GPS/location service (iPhoneSettings.StartLocationService / iPhoneInput.lastLocation).
  • Exposed native iPhone keyboard to scripts (iPhoneKeyboard class).
  • Implemented native iPhone keyboard input for TextField/PasswordField/TextArea GUI elements.
  • Exposed all 4 screen orientations as iPhoneSettings.screenOrientation. iPhoneSettings.verticalOrientation is now deprecated.
  • Added support for vibration (iPhoneUtils.Vibrate).
  • Exposed number of properties via Editor Player Settings UI (including bundle version and UI interface orientation).
  • Implemented support for up to 8 texture units in shaders for iPhone 3GS. Added iPhone 3GS emulation in the Editor.
  • Introduced automatic batching for small (less than 300 vertices) dynamic objects if they share same material. Reduces OpenGLES draw-call overhead.
  • Unity respects your XCode project now. It is not overwritten anymore by default. You can safely add new files, modify project itself or AppController.mm file, Unity will append its things as necessary. Note however that some folders like Libraries, Data, root project folder are always overwritten.

Wow!  See the full feature update and the blog announcement.

Saturday, August 8th, 2009

So many cool and useful technologies are unveiled at SIGGRAPH every year, this year at SIGGRAPH 2009 was no different.  Khronos Group, behind the new guidance of OpenGL, OpenGL ES, OpenCL, OpenVG, COLLADA etc, came another big announcement about hardware rendering within the browser.  WebGL is now an official standard being developed at Khronos Group to bring javascript control of OpenGL to browsers… Wow!

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.

Sunday, June 21st, 2009

This is a very cool project called V8-GL.  It is an OpenGL engine with 80% of the API converted to run on the V8 Javascript engine, the same engine that runs Google Chrome.

This is exciting as more productive languages like Javascript get speed boosts from engines like V8 and are capable of manipulating more complex systems like OpenGL.  Google is also pursing this in the browser with O3D with javascript manipulation of hardware rendering.  Also, a Google funded project called Unladen Swallow is converting Python to the LLVM virtual machine, so that it can have increasing speeds to compete with gcc speeds.

Making things easier to produce and control with more simplified and minimal languages like Javascript, Python and Actionscript etc that control more complex systems, that typically you would need to invest more time in such as a platform on C++ is the goal. V8-GL has this goal in mind.

V8-GL from the author states:

V8-GL intends to provide a high-level JavaScript API for creating 2D/3D hardware accelerated desktop graphics.

In other words, you can hack some JavaScript code that opens a desktop window and renders some 3D hardware accelerated graphics. Bindings are made using the V8 JavaScript engine.

Sunday, June 14th, 2009

Rozengain or Dennis Ippel of AKQA updated probably one of the tools I use the most for flash 3d and that is the blender to as3 exporter.  This simplifies loading in the meshes you have and lessens the bulk of the COLLADA format.  COLLADA is great but flash is still client side and fairly memory intensive for 3d so loading in models directly to as3 is nice if flash is your presentation tool.

AS3 Blender exporter has been updated to allow multiple object export. Also in April is was updated to export quads and modifiers.

One concern you might have is statically binding the code within a main swf fileon compile and resulting file size compared to loading in the DAE dynamically.  But you can just load these in as you would external DAE COLLADA files as compiled swfs and since it is just code it is very compact.   This adds some duplication of code (such as tweening libraries or the 3d engine source as needed) but allows a more horizontal loading or lazy loading of meshes when needed.

This is just another option to get 3D models into the flash 3d engine of your choice in addition to COLLADA, some MD2 support and limited ASE support.

This is an awesome project that keeps getting better, thanks Rozengain.