August 30, 2008
I’ve been working closely with Reeves Design House over the past year or so on a variety of freelance projects. They’ve been landing some great projects and I’ve really enjoyed being a part of as much of them as time permits. The latest set of projects has offered me some wonderful learning opportunities. We’ve been exploring mobile web design by building a mobile site for Kennington Capital, a real estate investment and development company in the Dallas area. I finally had the opportunity to dive into XHTML-MP coding and some careful testing on a seemingly endless array of handheld devices. I soon discovered that it just wasn’t practical to bug all of my friends to borrow their phones. Thanks to Klaus Komenda’s article called Testing on Mobile Devices Using Emulators, I had a much better approach for testing and tweaking the code. As well, I’ve compiled a bunch of handy links on Delicious related to mobile web design from a variety of sources. The best resource, without a doubt, was Cameron Moll’s short but concise book called Mobile Web Design, A web standards approach for delivering content to mobile devices. Cameron’s original set of articles is a great start as well. So, please take a look at the Kennington Capital mobile web site (m.kenningtoncapital.com) on your handheld device and let me know what you think.
Categories: Mobile, News, Web Standards
August 12, 2008
Developing a web-based application for the iPhone (and iPod Touch) has its fair share of unique challenges. Recently, I had the opportunity to dive into such a project by developing a user interface for an application my brother built a while ago. He had created a server-based web app, just for fun, that provides helpful information for finding such things as movie theater listings, recent DVD releases, critics reviews, etc. Mainly we were using it to find showtimes for local movie theaters at the last minute (e.g., on our phones when a newspaper wasn’t handy). But we also found it useful while browsing movies at the video store in order to view movie ratings, reviews, actors, and other useful things in order to avoid renting bad movies.
We wanted the web app to resemble a native iPhone app as much as possible. So I started by reading a lot of useful information on Apple’s Web Apps Dev Center – there are a lot of great “tech talk videos” that are worth a look. Perhaps the most useful resource was Joe Hewitt’s iUI project and accompanying sample applications.
We’ve been steadily adding features to my brother’s original app. Some of the features include:
- We used Ajax to dynamically fetch a publicly available JSON feed in order to display a list of movie trailers which play full-screen on the iPhone when it’s rotated into landscape mode.
- Each theater’s address links to a Google map (on an iPhone it hands off the link to a fully-featured native Google map application).
- We wanted the site to be available on non-iPhones as well as desktop browsers, so we are doing server-side device detection in order to send two separate CSS files, one for the iPhone and another for desktop browsers and general mobile devices.
We’re keeping the web app private for now (it’s just for fun), but if you happen to see me in person I’d be happy to give you a quick demo.
Categories: Mobile, News, Web Standards