Being the major iPhone geek that I am, I am extra excited about the launch of AKQA SF’s first iPhone Web Application to support the Nike Olympics website (nikelab.com) that we launched back in August.  Meant to bring the Nikelab website to mobile, we designed and built a custom experience specifically for the iPhone. When it was first launched, it became the #1 Web App on Apple.com!Features:

• Custom user interface for easy mobile viewing – modeled for iPhone web apps
• Pulls product/athlete content from same place as website – keeping both experiences in-sync as we update
• Animation and high-quality video content (dynamically loads correct video based on the user’s connection)
• Ability to view different colors for the products (e.g. Hyperdunk) by clicking on color swatches
• A Nike Store Locator leveraging Google Maps (re-usable for future Nike iPhone web apps)
• Launched in Korean, Japanese, US English (more languages coming soon)

Technical details

• Pulls the same set of XML and translation content as the website (repurposing all previously created content)
• Auto-resize of layout when viewed in horizontal/vertical mode
• Serves both 3gp and m4v videos depending on user’s bandwidth
• Custom, re-usable AJAX-based framework (powered by Jquery, inspired by iUI), uses JSON for storing config data
• Uses a templating approach for all pages: we feed in XML content for each page, use html/css to create the page layout.
• This framework can be re-used for future iPhone web apps

To see it in action, if you’re on your iPhone, navigate to http://www.nike.com/nikelab.

Dang, I am so bad…have not updated my blog in a month! But, keep in mind that I was on vacation for nearly 3 weeks as well! (More on that later). Anyway, long before I left on my fancy Hawaiian vacation, we launched Nike Lab for the Summer Olympics. Features:

• Content for 58 athletes, 45 products in 22 languages
• High quality video, animation and graphics
• Content includes: athlete stories, product information, up-to-date Olympics news
• Launched in 22 languages

Technical details

• Single code base for all languages
• A custom, reusable Actionscript 3.0 application framework (based on MVC)
• Built-in support for deep linking down to the page, sub page and product level (great for directing online/offline advertising to specific parts of the site)
• Social bookmarking (for adding videos to user blogs, social sites, etc.)
• Dynamic resize of main flash within HTML page (resizes Flash stage within HTML based on content)
• Dynamic re-skin of site based on language selection (no page refresh)
• Custom font render to support double-byte characters
• Dynamic updating of the Title bar based on which “page” of the site the user is on)
• Technologies/tools: Adobe Flash, Adobe AIR(for CMS), Actionscript 3.0, HTML, Javascript, Adobe After Effects

For a more in-depth review of the technical details, please visit Antti’s blog. We then went on to create an iPhone Web App version. More on that in the next blog, I swear!