Designing for iPhone

I had a wonderful dinner with a friend and colleague, Scott Sutcliffe. Scott is an all-around engineer, comfortable with both mechanical and software engineering. I apologize if this sounds like mechanical/software are either the entire range of engineering or the limits of his expertise, but those are the two areas he and I most often find at the core of our conversations.

Scott was the engineer who oversaw the development of a lot of the back-office b-to-b tools I designed for the Thomas Register of American Manufacturers. He was the coding genius behind the prototype for a color thesaurus, a screen shot of which can be seen in my portfolio. I also designed a logo for him and put some CSS together for his website.

At dinner, Scott showed me his latest endeavor, an iPhone app called Tippety Split. He constructed the tool as a practical exercise to better understand the iPhone SDK. The application is very simple in its sophistication: Scott managed to pack a lot of clever functionality into what seems like very simple UI. Then, like he was reading my mind, he asked if I would be willing to play around with the UI!

How could I turn down such an opportunity. I won't go into all of the stuff I did to the UI (that would be giving away confidential secrets!) but we came up with some very cool concepts. In order to conceptualize them, I had to overcome some of my web design bias. For instance, the application is essentially an interactive form. On the web, with basic HTML and JavaScript, a product designer would be able to infer from that their design needed to accommodate a small series of fairly well known event states: onFocus, onBlur, onClick, onMouseOver, etc..

These states are all gone or different on the iPhone. There is no happy little pointy cursor, there is in fact no single point of focus. One of the features that makes this UI so slick is the fact that a user can create multiple points of focus, and depending on whether those points move closer together or apart, a control will behave differently. An example of this is when looking at a photo, a user can touch two points on the image and push them apart; the effect of this will be to zoom in on the picture. If the two points converge, the photo zooms out.

Another iPhone behavior that I wanted to capitalize on is the focal deceleration that makes the UI so realistic. When looking at a list of phone numbers, a user can put their finger on a number and nudge it up or down. The list scrolls in that direction, decelerating as it goes, then stopping. I won't give the particulars of how I took advantage of this (hint: it doesn't have anything to do with lists) but suffice it to say that we've come up with some very clever UI constructs. I fully acknowledge that acceleration and deceleration are easy to accomplish in JavaScript in a web browser, but the point is that there are common conventions built into the iPhone GUI that users have come to expect. A once relatively stable and small lexicon of mouse events are replaced by a significantly more elegant vocabulary of interactions: nudging, brushing, pinching, pushing, pulling, flipping, etc.

I understand that the iPhone as a device and it's interface as a GUI have practical limitations and a finite shelf life, but jumping into this venue and playing with these new conventions was like being a kid in the proverbial candy store. What a delightful experience this is!

WWW: 16 years in the public domain today

I remember it like it was yesterday. I was at my friend Brad McLean's house in East Syracuse, NY and he had this new program running. He called it "Mosaic" and the logo caught my eye because it animated as he "downloaded" content off what he was calling the "web."

Each page he loaded was not coming off his local computer, but off a "web server." This server wasn't even one of the other computers in his house; it wasn't even in New York State! It was delivering "HTML pages" that "referenced" images and could display them "inline." Sure today this all sounds commonplace but back then he might as well have been speaking Greek and telling me ancient Aztec secrets. What is this thing? Who can put pages up? EVERYONE can put pages up???

I worked at a State University and had been using Gopher for a while by that time but this was radical--it was graphical...each page could have its own design. To the fault of most of the developers putting pages up back then (myself included) each page *DID* have its own unique design. Consistency from page to page was a sign of laziness and we had so many ideas to try out. I will even confess to having used the "BLINK" tag in a few applications, and I won't even try to tell you it was tasteful. We all have our crosses to carry.

In March of 2009, the WWW turned 20 years old. On April 30, 1993 CERN put the web in the public domain. Any form of publicly available interconnected content prior to that was proprietary. You might find Apple or Microsoft for instance, utilizing the network for their own systems, but beyond that, there was no centralized connection for virtually everything. Today, with the exception of content we intentionally hide offline or behind firewalls, virtually any piece of content can link to any other piece of content. Now this seems as normal as microwaving a cup of tea, but back then this was seriously radical thinking. The naysayers were adamant that this was exposing vital content to hackers. Using the Internet as a primary means of acquiring data was dismissed by skeptics as a fad (why bother with slow downloads when you can get data off a diskette instantly?). I have since had many jobs developing web content and applications for this venue, and as far as I can tell it's here to stay.

Those of us surfing the web today, reading this blog for instance, may find browsers unrecognizable in ten years. I made my first VRML page back in 1997. It was my dream office, with a spiral staircase up to a loft for reading and drawing, and it had a T-Rex skull (that skull took A LOT of work) mounted on a plaque over my "hand-carved" oak desk. Under the desk's surface, I had an "escape" button which I hooked up to a random link generator that Yahoo provided. Anyone who knows me well knows that button under my desk was a jolly, candy-like button. As mentioned in previous posts, I have watched a semi-literate six year old flying through operating systems. I myself have wandered around in the PlayStation Home virtual world; this required no technical savvy whatsoever. I even purchased shiny shoes and a business suit for my virtual avatar in preparation for a job interview that I conducted IRL. While no one knew I had purchased the suit, somehow seeing my avatar standing there, all dudded up gave me confidence--we looked good!

I can only guess that the browser of the future will be as revolutionary an advent as Mosaic was over Gopher. People will have to be networked constantly. In the book Snow Crash, Neal Stephenson refers to such folks as "Gargoyles" --although his vision of a Gargoyle was weighted down with a lot of heavy gear. I imagine not too far into the future we will find today's cell phones as cumbersome as we today find "the brick" (the Motorola DynaTAC 8000X). We won't "connect" anymore--if anything we'll have to work to DISconnect. The ideas of synchronous and asynchronous communication will blur. The boundaries between public information and personal knowledge and our access to both will become indistinguishable and instantaneous.

All that said, I still remember with great fondness the first browser I ever saw and how blown away I was by the idea of it. World Wide Web, I embrace you! CERN, thank you from the bottom of my heart for putting it in the public domain 16 years ago. What will you do next?