iOS indie developers writing every day about their stuff.

Post Schedule

This is another guest post by Ferenc, here about how LaunchRock was modified to show up nicely on a UIWebView.

If you’ve ever wanted built a landing page or had the need for one, you’ve provably heard of LaunchRock. If not, have a quick look. LaunchRock makes an extremely good job at making it super easy to build a landing page. No HTML knowledge is needed. Among many features, the page lets your future customers share about your idea / app / future venture on Twitter, Facebook and LinkedIn. This is a great way to collect emails of possible futures customers as well as starting to build up the buzz about it.

When we decided to create a new app of Soccer Tactics Multiplayer instead of doing an update, it was clear that we had to use cross promotion to get our existing players know about our new product. For this, we built a LaunchRock site to collect the emails of our fans. Although, we have built a way to talk to them via Message Of The Day and feedback, about which I wrote last week, it was just a simple way of putting out text in front of the players.

AlertView

We did try this first by simply showing the url, but only our most active and addicted players would take the effort to actually read the url and then open Safari and then fill the form. Not very effective and also, it turned out later, the mobile representation of the LaunchRock site was not that nice as it was on the desktop.

Since we wanted to extend our internal Message Of The Day service for long time, in a way that it can show media rich content, it was the time to do so. Instead of showing a default UIAlertView, we modified it to be able to show web content in a UIWebView. This is great, because we can now open pictures, videos if we liked, not just UIAlertViews.

The rich MOTD looked exactly like the one on the right. We are still hosting it http://soctics.com/launch.html. If you have look, there are a few things to notice.

motd_launch1

There are two teasing pictures on the top of this screen so big that it actually won’t fit into the whole screen. This was good thing for two reasons:

  1. We hoped, both pictures were eye catchy and it would engage our previous game’s players and
  2. LaunchRock part takes some time to load at the bottom and while it gets loaded hopefully players are still watching the second picture.

Once LaunchRock loaded, it turned out that it wasn’t looking nice on a mobile screen. The font size was too small and the whole page could be scrolled sideways. Although LaunchRock’s support was quick and friendly saying they are working on the mobile version, we did not have time to wait so did our own way :)

It included a quite easy change within the relevant launch.css and another one to duplicate the email form.

The first part in the css is about to fit LaunchRock nicely on an iPhone. (We only targeted those customers. Like 90% of Soccer Tactics games was played on an iPhone). Adjusting the text in the middle and making it bigger so it’s easy to read without pinch-zooming.

The second part, to duplicate the email entry form, was done to maximize the likelihood of the conversion. On a mobile device, only some part of the page is visible and we wanted the form to appear two times.

If you have a look at the source of the html how it was done, there is some nasty things going on. (I must admit, I get dirty when it comes to html :) ).

Here is the relevant part:

var count=0;
function addSignup() {
count++;
if (count==14) {
var y = $(