Friday, November 4, 2011

HTML5: Getting dragging to work on Mobile

This is as close as I can get to mobile/non-mobile "draggability" this week:


Major Steps:
  • Dragging in both touch and mouse interactions CAN work from a single codebase.
  • On a touchscreen, performance hiccups can occur when an object is toggled between animated via code versus dragging. 
  • Android tablet (XOOM Honeycomb) performs fairly well - Android mobile (HTC Shift - Android 2.2) performs somewhat worse.
  • Screen scrolling (and rotating) are very annoying (an 800 x 500 screen improves matters somewhat, as it takes up all the real estate on a smartphone)
  • Performance is too slow on an iPhone 3Gs from 2008. (It's doubtful that any HTML5 animations can really work on that vintage of iOS device)
  • Accessing child objects of a given class is possible with efficient jQuery code - this is useful for providing dynamic captions, etc. For example:
('#blobby').children('.caption').text('Hello World,) 
accesses the 'caption' class under the blobby div (in this case it's a <span> tag).

Outstanding Questions/ Issues:


Other interesting things:

In looking at upcoming conferences on Adobe I came across open source 3D engines for Flash AS 3:
http://away3d.com/
http://www.stasha.info/index.php?id=25
http://www.nissan-stagejuk3d.com/

I guess this is where VRML-like interactions are today. The Nissan Juke ad takes forever to load and lacks anti-aliasing, but has reflections, particles, and "airflow" effects that are either particles or polygonal with transparency maps. Overall very impressive.

Blender and 3DS Max was mentioned as a possible building tool -- how well can Lightwave work with these applications?