Mocap & Me

When I was attending the ITP Summer Camp, I went to a session at NYU's Motion Capture (Mocap) studio.  As much as I had been around the 3d digital world, I had never seen a Mocap studio in person.  I was so enamored by the technology I signed up to help volunteer. Well, the professor sent an email blast out to these would-be volunteers, telling people about a class he was teaching.  Unfortunately I'm no longer an NYU student, so I thought there'd be a slim chance that I'd be able to attend this class. Well, after a number of emails he said it'd be fine if I audited the course.

Class last week was pretty cool! There's a lot of really incredible technology that I really can't wait to get my hands on.

The class is project- / research-based, and I've got an idea that I'm really excited to start working on. I wanted to take this opportunity to start building this interaction (only the stuff from 2:24 - 2:39):

This week, I finally broke out my Arduino and used it for one of my projects. Here's a look at what I built:

It should go without saying that I'm a total n00b when it comes to hardware. All that mess of wires is just for one button. I should also note how awesome I am at stitching a button to a glove...  man, I really need to figure out a prettier way to do this...

But whatever, that's not the point. The point is that now I've got a button. I've got a button and motion tracking tools... now I just need a display.

Instead of spending my life trying to apply for / track down / fabricate an AR headset, I'm just going to cheat using head tracking and a responsive 2d display. This video, published by Johnny Chung Lee, has been floating around for quite a while now, and it transforms a 2d screen into a pseudo 3d experience:

[youtube]http://www.youtube.com/watch?v=Jd3-eiid-Uw[/youtube]

With my glove button + real time hand tracking + head tracking, I plan on using the main idea from the video above to make something that behaves more like Spatial Computing - complete with the ability to select and manipulate 3d models in real / pseudo real 3d space.

So excited for class again tomorrow...

Spatial Dimensions of Interactivity

#wrapper #content table.hci_table th, #wrapper #content table.hci_table td { padding: 5px 11px 7px; font-size: 12px }

third_dimension

One of the most exciting aspects of interface design is the process of constructing new perspectives -- discovering new frameworks that help explain how we behave, what our expectations are, and how they are met. Constantly analyzing and re-evaluating behavior and expectations helps identify good design patterns - and identifying good design patterns makes way for creating new, engaging designs.

To give a specific example, back when I was drafting the foundational ideas for Spatial Computing, I needed to wrap my brain around what a "3d interface design" meant and how it would work. I figured that a good way to do this would be to take a look at the interaction design paradigm that exists for things before 3d input -- all types of input from 2d to 0d. Here's what I came up with:

0d*

1d

2d

Point

Line

Plane

Buttons, of any type

Dials, Scroll wheel

Mouse, Track Pad

*A quick note about 0d. The button, by itself has no dimensional context. A button multiplied by infinity in one direction would give you 1d interaction. I may write a separate post about this later...

One thing I was able to immediately take away from drafting this table was that there was a lot of important stuff that this table didn't cover. See, a lot of interactions require something I call a "modifier button."

A modifier button is something that changes the state of another input device when held down. The shift key is a perfect example. When held down, it temporarily replaces your existing keyboard with an alternative one - one that has only capitalized letters and symbols. Some common modifier buttons are: Control, Fn, Alt, etc...

The buttons on your computer mouse operate on the same principle. Moving your mouse around with your hand only moves a cursor around on the screen. Pressing and holding down the left click button creates a mouse with a completely different behavior -- instead of just navigating around, the cursor is now grabbing or selecting something.

(There are a few minor examples of this meta behavior for 1d interaction, but it's not quite as common.)

So, a few examples of what modifier buttons can accomplish:

Button

Scroll Wheel

Computer Mouse

Without

The button ("a")

Scroll up & down on a page

Navigate cursor around on screen

With

Shift+"a"="A"

Ctrl+"a"=Select All

Ctrl+Scroll wheel=Zoom (on many programs)

Select, open, drag & drop, activate buttons & menus...

The utility of the computer mouse comes from its design - a special blend of modifier button and dimensional context. Without a button, the location of the cursor on the screen can't accomplish anything, and without a location on a screen, the buttons can accomplish things in one location and one location only.

The 3d Part of the Picture

Once I realized that the computer mouse was essentially a button with a dimensional context, I knew I landed on a principle that I could carry with me into 3d.

The central design concept behind Spatial Computing is a button that the user moves around in 3d space. Pressing the button creates different behaviors, like selecting or grabbing. Like the computer mouse design, this makes room for both unbound navigation and pixel perfect specificity.

But taking a step back, the frame of "modifier button + spatial context" helped in a much bigger way. When drafting this project I was able to lift my head up from all the detail work and take a good long look at the big picture.

The details are things like triggers, events, and handlers. The big picture is more spatial - it's expectation management, narrative construction, communication design. The big picture is interactivity that is based on dance and theatrical design. Once I honed in on a big picture design, all the details just needed to be aligned to focus in on the parent design.

The best realizations always come in the shower...

I was just in the shower and I made a huge realization: I am focusing all my creative energy in the wrong places.

See, I would consider myself a thinker, a doer and maker. I'm an inventor, a designer and engineer. But looking at my life lately, I've been spending a majority of my energy trying to be something that I'm not -- a brand.

This desire for a brand identity comes from an honest place. A year or two ago I began scaling back my work because I felt like it wasn't really getting me where I wanted it to. I had expectations that I was an artist, and as such, I needed to do artist behaviors and have artist things. The logic being that doing this would get me into some important gallery or some cool press attention.

So I tried to design a brand and I built a website. I went to more events and started schmoozing. I started to dump a disproportionately large chunk of my energy into inflating this identity of "Phedhex" with the idea that this could be a brand that could get me things. Eventually this brand became a manifestation of all my artistic insecurities and fears. I was afraid that, when it was all said and done, I'd just be an unnoticed blip in the art world. I think it's fair to say that this desperate struggle for a brand comes off as a desperate struggle to cover up something that isn't actually all that interesting.

And in the end, all of this irrational behavior taught me one thing: I need to stop freaking about about my insecurities and instead, I need to focus on what I'm good at and what I'm confident in.

See, I know 3d space; I know the human body; and I know computers. I'm a damn good dancer, 3d designer, and engineer. I am very good with my hands, and, most importantly, I know how to grind on a project day in and day out until I can forge a vague emotion into a crystal clear idea -- a fully-developed and well-articulated design to share with the rest of the world.

More importantly, that's what I love doing most. I pride myself on being a brain that has the tools to articulate, sketch out, and otherwise present sharp, inventive ideas.

That said, I think I'm done with my (slightly embarrassing) past. My web identity is going to undergo a makeover:

First -- "Phedhex" is a misnomer for the conceptual artist. "Phedhex" is a brand, it's a pseudonym, and it's all about presentation. I actually donned the name in gaming circles and dance circles (where pseudonyms are appropriate). "Phedhex" is neither a brain nor a human being, but the presentational idea of a person. That said, this week I'm going to retire "Phedhex.com" and redirect it to Albert-Hwang.com

Second -- Heh, this blog theme simply has to go. To me it represents misguided hard work. I want people to pay attention to my ideas, not some brand. My ideas only get muddier when associated with a brand identity. Within a week I'll drop this theme in favor of some free theme I find on the internet that enhances readibility and navigation.

Lastly -- I'm going to write at least 2 posts a month for the next half year. I'm committed to sharing my ideas with the world, so I guess I just need some corresponding behavior to prove it to myself.

Room Sized Wiremap Contest Results

First off, many many thanks to everybody who submitted. Matt & I received lots photos and are really impressed by the quality of the photos! It was pretty difficult to finally decide on a winner, but here ya go: & the winner is:

• 

  (Please click on the photos to view full size... these thumbnails don't really do the photos justice)

  Photo was shot by Jason Eppink. IOU $50, buddy.

  What a beauty! Crisp, bright, and nicely saturated. Matt and I also liked how it gave a good sense of size while still managing to evoke what it feels like to be standing there seeing the whole thing.

• I'd also like to post a few of the many others that were also being considered for the prize:
• This was shot by Tim Szetela. Tim had an entire set of very high quality photographs (and a number of videos of the animations).
• This cool little animated gif was done by Corey Menscher. Gives a good sense of space & depth. (you have to click through to see the animation).
• And lastly: Matt Parker (the other guy on this project) took this shot. Looks good. He wasn't actually considered for the prize money, but I figured I'd share this photo w/ you all anyhow. : )

Thanks again!

Website Redesign!

w00t! The redesign includes a couple of cool new features.  Most notably, the old... uh... plain design, has been updated to this cool, new hex design.  This includes visual updates all across the site, including the mailing list page, the about page, and the empty splash page.

The second thing the new site has that the old site sort of didn't is a project index page.  I compiled all the work I've done and placed it in the projects page.  It may still need reworking as time goes on, but I'm pretty happy with it so far.

One of the things I noticed when building the projects page is that I had never uploaded any footage from The Imhotep Project.  So I uploaded it and listed it in the projects page.

Lastly, the comments on blog posts or project pages are post it notes.  I think that's pretty darn cool.  I had to do some minor PHP coding to allow the commenter to pick out which color post it they wanted to use, but I think it was totally worth it.

Room-sized Wiremap...

Hey all! Think this is cool? [youtube]http://www.youtube.com/watch?v=S97qgnNWhCg[/youtube]

Then you'd be interested to know that colleague Matt Parker and I built one that's roughly 8 feet tall, 10 wide, and 8 deep.  We were initially going to just document it for ourselves, but construction went so quickly we found we had some extra time to do a little exhibiting.

So if you wanna see a room-sized volumetric renderer, the exhibition is open at ITP Thursday and Friday from 7:00 - 10:00.

Additionally, in the interest of getting some awesome photos, $50 and a props in the blog goes to whoever sends me the best photo of the event!

Directions to ITP:

Take the RW to 8th or the 6 train to Astor Place. 4th floor of 721 Broadway (south of 8th st, btn Waverly & Washington).