VicinityBuzz Update: Windows Phone 8 & More

VicinityBuzz on Win Phone 8

While attending Codemash a few weeks ago, I ended up in a Windows Phone development precompiler (Codemash’s name for a training session). It was my plan to hit mostly mobile and analytics sessions, but I was not originally planning on attending this session. With Windows Phone still struggling for market share, I wasn’t in a rush to work with it. However, other sessions were cancelled because weather had delayed some presenters, so I ended up in this session. Microsoft’s Jeff Blankenburg was teaching the session, and I have enjoyed some of his presentations and a Silverlight fire-starter event in the past. It’s one of my rules of conferences to attend sessions based more on good speakers, rather than based solely on topic.

With regards to marketshare, Jeff made the point during the session that with a less crowded app store, you do have a bit more discoverability. Even if that doesn’t hold up, the platform shares enough similarity with Windows 8 that a port to the Windows Store will be trivial. The Windows App Store isn’t exactly setting the world on fire either, but I’d like to see my app on all of these platforms, and as Windows 8 adoption rises with new machine sales, that marketplace should see constant upticks.

Having worked with Silverlight in the past, I found it pretty easy to get going on Win Phone 8 development. There was some definite rust on my XAML skills, but it came back to me fairly quickly. One thing to keep in mind is that you want to keep things relatively simple on a mobile platform. I have worked on some WPF projects in enterprise settings with MVVM frameworks, dependency injection frameworks, and more. While I followed an MVVM pattern, I just rolled my own with a simple base class.

My project was to do a version of an app I already have in the iOS App Store, VicinityBuzz. It does location based searches of twitter. You can search around you, or by entering an address. The radius is a configurable setting. I like using the app at conferences like Codemash to catch all the chatter that may not have a hashtag. One catch is that obviously only tweets that included location will be found. If folks have that feature turned off in their twitter app, then it won’t show up.

Since I had written the app before (in phonegap for iOS), I knew the feature set and domain cold. The challenge was just getting up to speed with the latest API’s for search and geolocation, and then implementing within a new platform. One of the biggest benefits of this project was getting up to date with the latest Twitter API. I still need to update the version for iOS, as it’s currently non-functional because of api changes over the last several years. I plan on doing that very soon now that I know the latest version.

Anyway, I won’t go into the development details here too much, but I finished a version 1 of VicinityBuzz, and it is now in the windows phone store here, and it’s free. So go check it out. If you like it, I’d love to have some more reviews.

Also, if you are inspired to do any Windows Phone development yourself, you may be interested in a device to do some real testing. I recently found there are some prepaid phones new on Amazon that are dirt cheap for that purpose. Check out the Nokia Lumia 520 and Nokia Lumia 521 on Amazon.

Watch this blog for upcoming posts about working with the Twitter API, and some of the things I learned working with Windows Phone 8. And more mobile in general. I have the bug again…

Why Aren’t You Using PhoneGap?

PhoneGap (now becoming known as the Apache Cordova project) is commonly thought of as a cross-platform mobile development solution. While true, I think it’s best to think of PhoneGap as modernzr for the mobile web.

The W3 is working on standards for web sites to be able to access specific hardware features. These common hardware features were first prominent in mobile, but are coming back to laptops via tablets and hybrids. Feature examples are GPS, Camera, Motion Sensors, Network Sensors. Also, mobile has popularized the idea of system maintained contact lists and other information that is now available (with proper permissions) to all apps.

The runtime in your application is a native app which hosts a native browser control, and that browser control is pointed at a local directory you include in the app with html. And the javascript has access to some os specific features that are exposed to javascript.

When those standards are in place, mobile web sites will be able to fulfill most of the promise of native applications. This is why Steve Jobs didn’t want to build an app store in the beginning, and both RIM and Microsoft have been pushing html/css as 1st class ways for building apps.

In this new world with device access standards, only special circumstances like intense 3d graphics should require native code in a c-like language.

But this isn’t the world. Those standards aren’t in place. So PhoneGap fills that gap (any guesses about the name?). And it has the added benefit of supporting the app store distribution model, where mobile web apps require the user to bookmark the page to their homescreen.

Most cross-platform apps get knocked for performance reasons. Sure PhoneGap apps are html and javascript, but javascript engines are improving a lot these days, and you can always use plugins to push key pieces of your application into the native arena. Plugins in PhoneGap allow you to write native code (ie Objective-C on iOS) that is exposed to the javascript in your application.

Also, cross platform frameworks are usually criticized for their look and feel. In PhoneGap, you’re using html and css, a platform that we’ve been working to style for a very long time (in tech terms). I think this fact explains some of the reasons that companies like facebook and linkedin use html heavily in their frameworks.

If you’re interested in getting started in PhoneGap, I recently reviewed a book I recommend to get started. It’s a couple versions back now, but it covers things conceptually well, and it’s a nice companion to the docs.

Not every application is a fit for PhoneGap. There are reasons to go native. But I think that for basic data goes in / data comes out type of applications, It’s a great way to start. And getting good at writing single page style apps with heavy javascript will push you in the direction the web is already going.

Working With Social Network APIs

Creating Vicinity Buzz naturally involved working with a the APIs of social networks. That information seemed worth sharing for those of you interested in writing any type of application that would integrate with a social network.

Developer Documentation

Any of the social networking sites you probably want to integrate with have developer api’s that are well documented. Here’s the starting points for a variety of services:

Working With JSON

All of these APIs are best used with JSON. If you’re not familiar, you can read up at json.org. It’s the notation for serialization of javascript objects, and object literals.

Where To Make the Call From

If you are working in a standard web page, you could call the api from document.ready (assuming you are using jquery). This is the approach I take on hoolihan.net, my personal homepage. There is a twitter feed on the right side.

If you have a bit more of an application, you may want to look at one of the many javascript frameworks that help you route events to actions. These are frameworks like backbone, knockout, spine, etc. There are also commercial variants like kendo, dojo, and sencha.

jQueryMobile is commonly paired with PhoneGap, and in that scenario, using something like backbone is a bit tricky. You may want to bring in a template binding library, but avoid routing.

Binding

jQuery.templates was one of the first good javascript template binders that I’m aware of, but there are now many different options. In the jQuery world, most of the momentum seems aimed at jsrender. Recently I’ve considered bring in knockout and only using the binding part, but I’m not far enough in to evaluate that direction.

API Keys

Unless you’re using the most basic parts of the API, you’ll probably need to register your app and get an API key. It’s a token that identifies your application. In the event of API abuse (too many calls, etc), they have information to contact you and analytics around the issue.

Open Authentication

This is a big topic, but if your application wants to use a social network to identify your users, this is possible via open authentication. If you are interested in this, get started here.

What Do You Think?

Are there any particular areas of the APIs that you’d like to see more detail about? Any conceptual parts that would warrant their own post? Let me know what you think below.

Lessons of a Failed Startup(s)

A couple of months ago, I finished reading Eric Ries’ The Lean Startup. It got me to thinking about startups and small projects I’ve been a part of in the past.

In particular, I think of a social site for readers that I was apart of that failed. I think of the the end, where I was trying to make the case to launch something and let users drive the feature list. What I find really frustrating is that I did such a poor job of communicating that at the time. Reading the book, I hear a much better way of emphasizing the point of customer feedback loops. The minimum viable product with hypothesis and user testing driving the next steps; it has so much value. Additionally, that movement has a number of successful followers to their name, so they have credibility with their message. Timing and other market factors may have doomed us anyway, but I can’t help but thinking of what could have been different armed with some of that information at the time.

The other part of the book that really resonates with me is how hard successful startups are. People are so afraid of there idea being stolen. In the book, Eric Ries suggests that you try to have someone steal your idea (it’s hard to do). He’s right. If someone actually wants to steal your idea, at least it validates that other people think it’s a good idea.

I get approached by people with startup ideas a lot, looking for programmers who want to work for equity. For young developers with the time, I think they should get involved, it’s a great way to learn the realities of business and to get some extra experience. But beware of how much of a longshot it is to get the product successfully to market. It has to be a good idea, successfully built, successfully marketed, and fill a timely need. Miss any of those categories, and you probably won’t do much.

I’m not suggesting people avoid startups. They are a great learning experience and some of them work out. But go in with your eyes open to the amount of work you have in front of you. And be discriminatory about where you choose to invest your time. Are the others involved willing to put in the same effort you are? Will this new organization be capable of all of the things needed to be done to launch a product?

My advice for evaluating an idea: run a set of books for the project (meaning keep accounting). If you’re working for equity, keep track of time anyway and what you could have been paid at your regular rate to do that work. How long will it take for the project to pay that back? That question opens a lot of eyes. Say what you will about money as a measuring tool, but it’s the standard for all projects and companies. It’s relatively objective, and very compatible with math. The same can’t be said of a subjective goal like “let’s take over the XYZ market.” Presumably, you have your day job because you make someone more money than you cost them. If you can’t say the same of your startup project within the first year, then your project doesn’t even have the ROI of your “boring old day job” (you may love your job, my point here is that people thing of startups as high risk / high ROI and that may not be the case). Every time you sit down to put more into the project, you’re saying that you will get that back in cash on the other end. Is that true, or are you kidding yourself?

There can be other reasons to do a startup. I’ll use a personal recent example. I built VicinityBuzz, and iOS application around Social geo-search (also coming soon to Android and WP7). It’s been slow out of the gate so far, but I’m hopeful that some of the new features coming in the next update and some marketing ideas I have will help. Regardless, I’m certainly a long way from paying myself back for the time I put in. But I have been working in cutting edge technologies more and mobile is a real focus. I knew even if the project never paid for itself that it was valuable time learning and to put the project into my portfolio of work. I went in with those realistic expectations, but try really hard to exceed them.

If there is intended to be a single message of this post, it is to apply measurable goals to your projects, and evaluate and pivot your direction as often as reasonbale. If I had to boil down the message of the book to one sentence, that would be it.

VicinityBuzz: Writing A Mobile App

This post is intended to go through the process of writing and publishing an app. It will be a high-level introduction. The idea is that future posts that will dig into specific topics in depth. This post will be updated to link to those future posts as an index of mobile development topics. The app I’m describing is VicinityBuzz and it’s available here.

Product Vision

While I had been thinking about writing a mobile application for a while, I needed an idea to stick with to completion. The app stores are relatively young, but they are fairly saturated, and bringing something new to the table was a challenge. Recently I read Eric Ries’ The Lean Startup and I do like the idea of MVP(Minimum Viable Product), so I didn’t feel the need to have a telephone book of requirements. I was just looking to have an original idea for the app stores.

In the case of VicinityBuzz, I have always felt that there are not enough good ways to search social media, particularly by location. There are social media sites like FourSquare solely dedicated to location, but I’m referring to something else. Using networks where content is the reason (not location) but by location. For instance, at a conference, users often hashtag their tweets with the name of the conference. But not always. And the hashtag will draw attention from people not at the conference. That’s fine, and there can be useful conversation by just using the hashtag, but what if I want to see posts of all users that are actually at the location.

app screenshot

This is particularly true of news events. On the day of the shootings at Chardon High School, I used the application to see what students and families in the area were posting about. They were each telling their own version of the story. It was heartbreaking and much more informative and up to date than the news being released to the public. Hashtags were useless in this case, for two reasons. First, the students weren’t hashtagging their posts, they didn’t need to. They were posting to their real-life friends and thus already connected on twitter. Second, the tag was full of a lot of the reaction from the public around the globe. That was interesting too, but it wasn’t was I looking for. I wanted facts and eye-witness accounts. It was like CNN’s iReport, but on steroids.

Platform Selection

Native or not? As a web developer, I chose PhoneGap. It’s a mobile platform framework that uses html and JavaScript, which are skills I already have. And the application didn’t have very many device needs that would require native access. GPS is the only device call I make, and that is easily accessible from the PhoneGap JavaScript API. I knew it would be faster than for me to learn the ins and outs of the Cocoa framework and Objective-C, although I am in the process of doing that now for future apps. I have written some small applications in the native iOS sdk, and even paired with some developers to help bootstrap their iOS work, but I just didn’t feel comfortable writing an app consumable by the general public yet. Along with PhoneGap, I’m using jQuery mobile.

Essentially PhoneGap provides project templates for your platform (Android, iOS, WP7, and more) that create a shell of an application that hosts a browser control. All of your files go in a directory (like resources) and get loaded up by the browser control.

app screenshot featuring controls

Using PhoneGap gives me a version that is easily ported to Android and WinPhone 7. Although those markets lag Apple’s AppStore in terms of developer revenue, I want to cast the widest net possible with this application for obvious financial reasons, and also to learn. The more feedback I can get on the application, the better I can make it.

At some point I may go ahead and do a native rewrite. But for now, I’m very happy with what is possible in PhoneGap and jQuery mobile.

Prototyping

I started development with jQuery UI in a browser. Using the built in JavaScript debugger in Chrome was easy. Note you could just as easily use Firebug in Firefox, or the IE Developer tools. Once I was satisfied with functionality, I swapped jQuery mobile in place of jQuery UI and moved the app into the PhoneGap container. More on that in the next section.

One note: If I had to do this over again, I would have simply started with jQuery mobile. It’s not that hard to get started with as the docs are great, and it’s best to just start down that path.

App Store Submission

Thus far, I can only speak to the Apple Store submission process. After going through the steps provisioning portal, it was fairly easy to test the app on a device. In order to submit to Apple, you then create a profile for the application (screenshots, contracts, payment details, etc) and submit a signed binary to Apple for review. The process of signing a binary for release can be a little tricky, but the walk-through on Apple’s developer portal helps a lot.

One thing to note: Apple requires you have a support page. I stole an idea from the Trello folks, and used a public trello board for this purpose. It took less than 5 minutes to setup.

Marketing

I created a basic web page with a description of the application. Apple has a page for making the link to their store. If you are interested in opening the store automatically, either see the options in this stackoverflow post, or add the query paramter “ls=1” to the url you get from the link maker.

What’s Next?

Apple just announced “the new iPad” so I have to do some updating to support that. I haven’t read the new docs, but I assume this means a high-res iPad splash screen and icon. All of my other assets are web assets and scale accordingly.

My next steps are to add a simpler user workflow, a refresh button to update your current search, and add some social networks like Facebook and Instagram.

After that, I’m going to start porting to Android and WinPhone 7. Since the application is already written, it should be as simple as getting a PhoneGap project running for each environment. I have also considered the Mac App Store and the upcoming Win 8 Marketplace for desktop application versions.

Finally, I’ll blog more in depth about some of the topics covered, and provide links to those posts on this page. Mobile development is rewarding, but can be challenging for those coming from a web or desktop background. I’d like to pass on some of the things I learned so that others working in mobile can save some time.

Feel free to provide feedback and questions if you have something in particular you’d like me to cover. And checkout the application!