Quick Hack: PhoneGap + FourSquare = FourDroid

You may or may not have heard of a new service called: FourSquare http://playfoursquare.com, but I am sure at some point in the next year, you will!

It’s from the guy who made (and sold!) Dodgeball (a pre-Twitter mobile social service) along with another super-sharp mobile guy in NYC, and it’s launching at SXSW…. well, at least the iPhone app is.

Feeling left out, I decided there should at least be a basic offering for Android, and realized I could just wrap and tweak the mobile web service they offer at http://m.playfoursquare.com

Hence, FourDroid was (quickly) born, thanks to the always awesome PhoneGap Framework and the built-in WebKit browser on Android.

fourdroid = foursquare for android fourdroid = foursquare for android fourdroid = foursquare for android

The benefit the “app” version has over just pointing your browser at the site:

  • the app keeps its state/page separate from any web browsing you might do
  • You can easily add the app icon to your home screen for quick access
  • the browser font size is increased by default (the size for the mobile site is very small)
  • a bottom button/tab bar provides quick links to often used screens
  • it is just so much hotter to have an “app” than to try to explain how to type in a mobile URL

At some point, PhoneGap can also be used to tie in GPS location detection, photo upload, accelerometer and more, but for now, I’ll just settle for the benefits listed above.

The best part of this whole story is that I wrote the app this evening while I was waiting for other work (well paying work) to compile… so about two hours total interleaved into what I was actualy supposed to be doing. Yay, for PhoneGap on Android!

Search for “fourdroid” or “foursquare” in the Android Market today to try the app out for yourself

Coovents.com iPhone App Demo Video

Tonight at the New York Tech Meetup, I, along with Greg and Chevon, demo’d the soon-to-be-released Coovents iPhone app (sign up to beta test here). David Oliver and I, through our mobile consultancy, Oliver+Coady chosed to work with Coovents due to their great focus on a killer app:

Coovents.com shows you which happy hours are going on today and shows you which ones are going on now. With one glance you can see happy hours in your hood! You can also send a text message to Coovents and we’ll send you happy hours to your phone! Bar hopping will never be the same.

Coovents.com iPhone AppCoovents.com iPhone AppCoovents.com iPhone App
Now, even if you aren’t interested in happy hours, you might be interested to know that this application was writtten using the PhoneGap Framework… in other words, while it may look like a “native” iPhone App, it is actually developed in HTML, CSS and AJAX, using Mobile Safari enhancements such as Scalable Vector Graphics, WebKit Transitions and HTML 5 Database support. The client app on the iPhone interfaces with Coovents via a JSON query interface, with all the rendering, requests and other magic shenanigans in the user interface happening via JQuery.

I’ve blogged about PhoneGap many times before here, but I have to say this is the farthest I’ve taken it both functionally and visually… perhaps it is because the app (happy hours) is an enjoyable problem to solve!

Watch the video below to see the app in action…

You can also checkout the Flickr Screenshot Set of the app…

Again, if you are interested in being a beta tester, please sign up here. Otherwise, the app will be in the iTunes store very soon!

Skadoo: PhoneGap-based app now in iTunes

Skadoo is a PhoneGap based application that is now available in the iTunes store. The app should be considered very beta… though (developers take note!) Apple doesn’t allow you to include the word “beta” in any graphics, description or application meta-data.

In short, say its “Phonegap-based” means that this app was built using HTML, CSS and Javascript, and then wrapped up in a native binary iPhone application. I’ve blogged about this before, when I showed how to turn a blog into a native iPhone app in 10 steps.

The full server app is still under development (server queries are VERY slow), but in short, it is a “people” search engine, for finding various profiles of someone online based on searching for their name. I, through my work with Oliver+Coady, was hired to build the iPhone App and get it into the App Store ASAP. PhoneGap was the best solution to get the job done quickly.

Skadoo in iTunes

Development time was < 1 week... .it took longer to get the app into the store than it did to build it! The app uses JQuery for server interaction and the UI was built in Dashcode. Another quick interesting thing about this app, is that it uses HTML 5 Database to persist search results and Safari/Webkit extensions for CSS translation and transitions. Both working pretty well, though the translations are about 4x faster on the iPhone Simulator than on my iPod Touch. Get Skadoo for your iPhone today!

Android Market Suspends My "Blog App"!

UPDATE 7:20PM January 7: Android Market support responded with this: “Hello Nathan, Thanks for writing in. Your app was suspended because it seems to be a demo of what one can do
with a blog. You may re-upload your app to the “Demo” section of the
market as opposed to the “Reference” section. If we can assist you further, please let us know.

Regards,
The Android Market Team”

Gee – I wish they told me that to begin with! Still I have to now re-release my application, simply to put it in the correct category. Frustrating, but not awful.

Earlier today, I was gleefully attempting to show Dave Oliver the hilarious comment thread for the blog app I recently released for Android. I pulled up the Market app on my T-Mobile G1 and searched for “Nathan”, expecting to see “Nathan’s Blog App” in the results…. but, it wasn’t there. Confusion set in for a bit, followed by disbelief that the app had been removed from the store.

This was confirmed when I received this “friendly” automated note below from the Android Market support team:

noreply-android-market@google.com
6:24 PM (5 hours ago)

This is a notification that the application Nathan’s Blog App Demo (ID: -8575230491255129376) has been removed from Android Market due to a violation of the Developer Content Policy. Please review the Content Policies and Business and Program Policies before you create or upload additional applications.

For more information, or to contact us, please visit the Android Market Help Center.

Thanks,
The Android Market Team

<- This is how I feel right now…
like a sad little lost robot.



Now if you look through the policy links above, and then read about what my app does, you’ll see that, as far as I can tell, I am in no way breaking the rules.

Your application shouldn’t contain content that displays (via text, images, video or other media) or links to:

* illegal content
* invasions of personal privacy or violations of the right of publicity
* content that interferes with the functioning of any services of other parties
* promotions of hate or incitement of violence
* violations of intellectual property rights, including patent, copyright (see DMCA policy), trademark, trade secret, or other proprietary right of any party
* any material not suitable for persons under 18
* pornography, obscenity, nudity or sexual activity

Also, make sure your products don’t:

* harm user devices or personal data.
* create unpredictable network usage that has an adverse impact on a user’s service charges or a Authorized Carrier’s network.
* knowingly violate an Authorized Carrier’s terms of service for allowed usage

blog app menu Now, I’ll admit my app is a bit pointless, some may mistake it as shameless self-promotion, but in truth, it was meant as a proof of concept for gluing together the awesome Phonegap SDK (a mobile web appstack enabler) with WordPress and a mobile-friendly template. This allows my CMS-based website (be it blog or not) to have a “native” presence on a device, one click launch capability AND allow for integration with native services like GPS, media capture, accelerometer and more. Pretty cool, eh?

I guess apparently not. I ask you out there to tell me why *you* think my app was removed. Perhaps I will hear back from Google… not sure. Their “Contact Us” capability was pretty basic and I had to dig for it… considering the notification email came from a “no-reply” address, I am not very hopeful. I am going to post this blog link to the appropriate developer lists, as well, and I look forward to gaining some insight into what I may have done wrong, though I honestly believe I am not at fault here.

Regardless, isn’t Android supposed to the more “open” platform? I thought app censorship was the domain of Apple?! Is there some sort of review process that happens after an app is released? Why not do this before the app even gets into the market… that way at least you know where you stand before you tell the world the app is up. Maybe the Apple way isn’t so bad after all…

Anyhow, for one of the biggest cheerleaders of Android out there, this is not a fun moment.

SVG makes your iPhone webapps more "flash"-y

I’ve been doing some work on a iPhone webapp (natively deployed, wrapped in PhoneGap naturally) and decided to incorporate some advanced visualizations using Scalable Vector Graphics. Achieving robust SVG support in browsers has been a long struggle, and the good news is that the latest builds of both Firefox and Safari, desktop and mobile, do it well. Safari’s support comes from the excellent Webkit project – read more about the status of their SVG support. On the desktop, SVG hasn’t gained much popularity, mostly due to the presence of Flash and Java, the incumbents when it comes to advanced visualization.

However, the reason SVG should matter to iPhone developers is that, since there is no Flash or Java support, it is difficult to achieve rich, dynamically rendered interfaces – think charts, clocks, gauges and other visualizations, through CSS alone.

The application I am developing required a working classic clock with semi-transparent wedges overlaid on top of it showing different upcoming events. The implementation is nearly done, so you will be able to see it in action soon, but for now here’s a screenshot:

working clock rendered with SVG on mobile safari

And for those of you looking to do some rad geo-hacking and break out of the bonds of Google, how about moving towards OpenLayers based SVG maps? There are some links to great SVG map demos at the end of this article. Also check out James Fees GIS Blog for a whole thread on this topic.

Not sure if this works yet in WebKit on iPhone, but have you seen this cool demo of combining SVG with the new HTML video element? Perfect for the multitouch capability of the iPhone, no?

All in all, just food for thought, and an example of a great technology that might have finally found its niche!

Here are some great SVG demos, samples, tools that should all will work in the iPhone Safari browser… and hopefully the Android version of WebKit, as well!