Geek Ninja Battle Night
Friday night was Geek Ninja Battle Night, an evening of talks, drinks, and fun organized by Geek Ninja Factory.
I was lucky enough to be joined by my friends Sarah Parmenter, Remy Sharp, and Andy Clarke and over 60 people filled up our lovely Lighthouse Arts venue to capacity to see the talks, have a few drinks, eat some fabulous cupcakes, and take part in a roundtable discussion. The topic: Mobile – Web vs. Native.
Andy "M(alarkey) Bison" Clarke
Andy kicked off the talks with one that wasn't about specific web technologies like HTML5 and CSS3. Instead, he stressed that "to avoid becoming intoxicated by technology, we should take a moment to consider the why before the how."
This was like a breath of fresh air for me as I keep stressing the importance of the "why"s over the "how"s in my talks on user experience. The ways we do things (techniques) are, of course, very important. But the questions that interest me the most are the "why"s. Why did you focus on this aspect of the problem? Why did you implement the solution in this way? The "how"s stem from the "why"s. (The more I think about it, this is just another way to state that we should be doing outside-in design instead of inside-out design.)
The following words from Andy's post on his session sum up his take on mobile web development:
Instead of thinking in terms of ‘mobile design’ or ‘iPhone, iPad or tablet design’, we need only think and talk about design that is flexible, adaptable and ‘responsive’ to whatever demands are made of it. I just call that web design.
You can find the outline of Andy's talk on his blog.
Next up was Remy Sharp.
Remy "Cyclops" Sharp
Remy's talk was on developing mobile applications with web technologies. He talked about some of the common misconceptions about the limitations of mobile web apps (such as the lack of local storage) and used the Gmail mobile app as an example of an exemplary mobile web app. (Interestingly, I did the same in my talk and we hadn't discussed it previously.)
Deconstructing the Gmail app, Remy distilled some general principles from it like "inline as much as you can" and "defer work" and gave some CSS and JavaScript tips, including the advantages of using 3D CSS transforms like translate3d and the iScroll 4 JavaScript library for iOS to create better-performing mobile apps.
Check out Remy's site for his slides from the talk.
Following Remy's session, we had a half-hour social break before Team Native took the stage, starting with Sarah Parmenter.
Sarah "Cammy" Parmenter
Sarah gave us an introduction to designing for iOS and asked Andy up on stage to discuss a current project they were working on where she was designing the native app and Andy was working on the web app (or, as Andy would call it, the "web site") :)
It was hugely informative to have a real-world case study in Sarah's talk and it helped highlight some of the differences in designing for native versus designing for web. One of the main ones, as Sarah pointed out, is that people have different expectations for native apps as they do for web apps. In one example, she stated how a relative of her's was confused when she created a shortcut to a web app on her iPhone's Springboard. Since the app was now accessed like a native app (via an app icon), her relative started imbuing it with native OS expectations that she had previously not had when she was launching it from the browser. You can take this point further, as I did in my talk, to state that web apps should look like web apps, not try to mimic native apps because doing so will create expectations that they cannot meet.
Aral "Ken" Balkan
I had the last talk and in it, I started out by defining the scope of what I would consider a web app for my talk ("that which runs in the browser") vs. a native app (a little harder to define). Native apps are a little harder to define, since, it is an arbitrary designation we make to a certain level of abstraction in the technologies we use to make apps. In the case of the iPhone, apps made with Objective-C and Cocoa Touch using the Xcode toolset are usually thought of as native. And yet, you could also use assembler, or – goodness forbid – binary to create native apps. You can cross-compile to native apps from other languages and frameworks.
As part of my talk, I examined a range of tools and technologies for creating apps, whether web, hybrid, native, or otherwise third-party, including Appcelerator Titanium (which I still have not gotten to build even an empty project for me without crashing on either my MacBook Air or two MacBook Pros) and NimbleKit (not having Titanium Developer, it works like a charm), the excellent Corona, and even Game Salad and Unity3D (at two ends of the spectrum of game development tools).
I talked about how "write once, run anywhere" is a myth. It's not about "running" but "running well". Why? Because you have these pesky little things called competitors. You may well get to 90% quickly on a given platform by using cross-platform technologies but how much time and effort will the all-important last 10% take? That last 10% that determines whether your app merely works, or works delightfully well? Will it even be possible to go that last 10%? (e.g., what if you cannot meet the performance of your competitors who built a native app?)
Without competitors, the last 10% doesn't matter and being "first to market" could make all the difference. But when you do have competitors, and if one of your competitors is "best in market" on a given platform, what happens to your product? Then what if another competitor becomes best in market on a different platform by building a native app? Suddenly, you could see your first-to-market advantage being gnawed away, one platform at a time, by competitors who can fine-tune the experience of their apps to specific hardware and operating system combinations.
Of course, it's not all doom-and-gloom for cross-platform development. Far from it. You can optimize the user experience and performance of web apps and other cross-platform technologies. Gmail is great example, and one that I gave in my talk. I love that they don't even try to look native. By "looking web", they avoid creating OS-specific expectations that they cannot meet. And, being Google, and having the resources of Google, they are able to optimize the user experience of their app for different mobile platforms. Remy was able to find at least four different versions of Gmail, each optimized to a different platform.
So "write once, run anywhere is a myth" but "write once, optimize everywhere" is a possibility if your resources permit it. If they don't, you might find the the initial speed gains of cross-platform development are actually outweighed by the time and effort it takes to optimize per platform – especially if you want to compete on user experience. (Which is what you have to compete on these days in the consumer market.)
I ended my talk by saying that "we're all a bit hybrid". And it's true. Web to Native is a spectrum. It's not black and white but a grayscale gradient. You need to make the right choice of tools, technologies, and processes based on the unique needs of your project, the unique skillset of your team, and the unique objectives of your organization.
Download my slides in PDF format (9.5MB) to see the full list of topics I covered.
Debate
The evening ended with a roundtable discussion with questions and comments from the audience.
Thank-yous
I can't end without thanking my lovely girlfriend, Alice Collingwood, for helping me with the design and production of the event. She was also the one who came up with the idea for the cupcakes, which added so much to the event. Alice is looking for a position doing event design at the moment, so check out her site and give her a bell if you want a talented young designer on your roster.
I also want to thank Emma Wickham, operations coordinator at Lighthouse for going above and beyond the call of duty to help us set up on the evening of the event and the whole Lighthouse team for their continued support and friendship.
Finally, I want to thank Victoria Dawe for her beautiful photos of the event, Angel Food Bakery for our lovely cupcakes and Zoli and Exhibit Printing for being so helpful with the printing of our character portraits of the speakers and our Geek Ninja Factory stand (if you want large format printing or art printing in Brighton give Zoli a call – they're one of the few places in town that have their own machines and know how to use them).
Photos, reviews, blog posts, and related links
Here are links to photos from the event, a couple of reviews of the evening I've found, along with related links. If you've written a review or have photos, etc., from the event, please feel free to leave a link in the comments.