Interaction Design Publication

My friend and colleague, Joe Force, pointed me to a link this morning that considers and discusses many of the finer points of XD and Interaction Design! "Thoughts on Interaction Design" was a book published in 2007 by Brown Bear LLC. There were only 1000 copies printed and a second run is not planned. So, to continue to dialogue, the complete book has been created in a web format for consumption!

The content is very well positioned and thorough on the topic of Interaction Design. It helps to frame up many of the questions and answers we as XD professionals struggle with each day.

One of my favorite sections is authored by Chris Connors of Apple:

When I entered the marketplace as a newly-conferred graduate with a Masters in Human Computer Interaction, I can recall trying to explain to my family and friends exactly what HCI was - something I still occasionally find myself doing. Describing our discipline to potential employers was a recurring challenge: many were confused by a CS degree without production programming, a design degree that didn’t deal primarily with product form, or a cognitive psychologist who wasn’t solely focused on modeling human performance or conducting experimentally-driven usability testing.

I have felt the same lack of understanding and appreciation for what we as XD professionals bring to the table but, the times are changing! It's encouraging to hear Chris' stories and see that Interaction and Experience Design are being recognized as valuable additions to a product's life cycle.

Thank you to all the contributors for their excellent insight!

YouTube Musician Kutiman Kicking It!

This is amazing! An artist from Isreal - Kutiman - took some time and 'found' YouTube videos of people performing and edited them together to create original pieces.

Uploaded with plasq's Skitch!

Please take the time to listen to these. It's an amazing collection of work! www.thru-you.com Here's his MySpace page as well: http://www.myspace.com/kutiman

Augmented Reality - 'Living' Flash 3d

I think I just saw quite possibly one of the coolest things I've seen since working on the web: Augmented Reality. The use of Flashpaper3d, a webcam, and FlashPlayer 10. Check out this link for the GE Ecomagination site:

http://ge.ecomagination.com/smartgrid/#/augmented_reality



In a nutshell, the effect is created by using the Papervision3d library, a new library called FLARtoolkit http://www.libspark.org/wiki/saqoosha/FLARToolKit/en and the interaction of your webcam with a printed 'marker' page. The page has a unique pattern on it that the Flash environment is 'seeing' through the webcam and drawing the Papervision3d objects in place relative to the real paper! Very, very cool stuff!

Dashcode Browser Back Button Issue

Wow. I just spent 2 days trying to hunt down a pain in the butt issue with Apple's Dashcode application. I'm creating a web app version of fx360.com for viewing on the iPhone and would like to make it as iPhone sexy as I can. I've been using the Dashcode application from XTools to create the basic framework of my 'browser' application.

All is good for the basics of the app. I've created multiple views and have used the standard list controls for usability consistancies. The struggles began when I was customizing the content for the app. I have a design here


that shows a 15px space at the top of the white background for the content to be placed on. So, when I built this page in Dashcode, (without all of my graphics for background and such) I created a div that had a 15px margin on the top to create that space. Then I filled that div with my content... Simple right? Not so fast!!

The issue was that when I clicked on my nav



the first time, my detail page would show up fine. Like the screen shot here that shows a gap at the top of the page (not the full size for the gap but you get the idea):



But, if I continue to go back and forth between the detail screen and my selection list, my content page gets pushed down the viewport! If I kept going back and forth it eventually pushed it right out of view... wtf!



After much frustration and searching the blogosphere for some help with this issue, I finally figured it out by tracing the entire DOM of the HTML generated by Dashcode as it was running. It seems that either the StackLayout component or the Browser component is adding inline styles to the DIV's that represent the pages as a user clicks on the navigation list! I also noticed that this style incremented the 'top' style for the DIV by 15 pixels each time the HTML traced out... AH HA! So, now I needed to find where in the code this was occuring.

I found a section in the StackLayout.js file that points to this here:



It is referencing a _topPosFromBody and curElement.offsetTop properties and adding them together on line 74. This is the closest thing I could find that had a 'top' sounding property in it. Unfortunately, the file in the project space within Dashcode is locked so a user can't edit it! Stupid.

So, for now, I've removed my margin from the top of my placement div so the 'offset' is zero. It functions as expected. The larger issue is the way that Apple has released this stuff. The tools seem to be nice and well organized, but there is no documentation on any of the components. No reference as to how their objects are put together. No list of methods, properties, and styles... nothing... anywhere. That's lame. All of Adobe's built in objects and components are fully documented and searchable. At the minimum, we should be able to find a reference to these packaged components to see how they are structured from a best practice point of view.

I'm Speaking at 360|Flex Indy!

Well, this is pretty exciting: I just got accepted to speak at 360|Flex Indy! My session is Experience Design with Flash Catalyst and Flex Gumbo. The show is May 18-20, 2009 in Indianapolis. You can check out the other great 49 speakers on the schedule at: http://360conferences.com/360flex/downloads/schedule.pdf It's looking like it's gonna be another great 360|Flex conference. Tickets are cheaper on a first come, first serve basis! So buy your tickets asap at http://360flex.eventbrite.com to get the best possible price. Hope to see you there!

(RED) Wire Launches

The subscription product from (RED) recently launched. It's a music and awareness subscription that allows users to contribute to the global fight on AIDS/HIV. It was showcased at the Adobe MAX 2008 conference in San Francisco in the Fall as it was built in Flex and distributed via AIR!

You can sign up for an account at www.redwire.com! Check it out.