Posts Tagged ‘mobile web’

bemoko today launched the mobile website for the 2009 Doha Tribeca Film Festival and it’s been featured online in Mobile Entertainment.

Have a read of the article here and take a look at the site for yourselves at dtff.bemoko.com

… or in other words we can readily synchronise local browser storage with back-send server persistent storage. This is one of the fundamentals of compelling off line web applications.

So a little background. You may know that you can store data in your local browser database with javascript like …

1
2
3
4
5
6
7
8
9
10
11
12
13
function store() {
  if (window.localStorage) {
    var count=window.localStorage.getItem("count");
    if (!count) {
      count=0;
    }
    count++
    window.localStorage.setItem("count",count);
  }
}
window.onload = function() {
  store();
}

and you can even see it in action here, if you got a decent browser such as the latest iPhone 3, Firefox 3.5, Safari 4.

But this ain’t much good if you can’t get this data back to the server to do something useful with it, e.g. share with friends, share with your other devices, keep a backup, send a message … I could go on.

So what we really need is a way to easily listen out to storage events and deal with it in one place. Yep, we could create our own Javascript framework to do this and handle getters and setters, but that sounds nasty to me.

Instead we can know use the onstorage attribute on the HTML body tag to hook into a function that will handle all of these call backs based on local stored data.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
function store() {
  if (window.localStorage) {
    var count=window.localStorage.getItem("count");
    if (!count) {
      count=0;
    }
    count++
    window.localStorage.setItem("count",count);
  }
}
function handleOnStorage() {
  myFunctionToSendDataToServer(event.key,
    event.newValue, event.oldValue);
}
window.onload = function() {
  document.body.setAttribute("onstorage", "handleOnStorage();");
  store();
}

Take a look at it in action here in the bemoko mobile test suite. It works on iPhone 3 and Safari 4. You can even see the complete code here.

Imagine if radio came along after television.

… would the first radio shows simply have been recordings off the TV?

Before the days of video recorders I used to sit and record the television with the new shiny mic onto cheap D90s I’d bought from the market. The novelty soon wore off and none of my friends seemed that interested in my recordings.

We’ve grown accustomed to see TV and radio as two very different media channels. In particular we don’t consider the radio as a lesser medium even though from a simple point of view it’s just a constrained TV. I love the radio – in fact I spend more time listening to the radio than I do watching the TV. Why? Not because I think there’s better content on the radio, and not because I think it’s physically better than the TV – more because it fits comfortably into my way of life and my context.

I work quite a bit – and I learnt pretty early on that I can’t work whilst watching the TV. Took me a while to realise that and I still experiment with it, but basically if I’m front of a TV I don’t get any work done. However the radio fits my mood – I can put on some back ground music, or even talk programs, to give me inspiration. It doesn’t tear my attention away and in some respects can enhance my work environment.

radio Squeezing PC web into mobile is like listening to the TV on radio I do quite a bit of DIY, housework – my old paint splattered radio follows me around. I’m often amazed at how long a couple of AA batteries power the damn thing, even though I leave it on too much. It falls off tables, sit’s in damp rooms … it’s so simple and portable and it goes on broadcasting for me.


I can safely say I’ve never tried to watch a TV and drive. Don’t think I’ll ever give that a go, but I obviously do listen to the radio in the car. When good programs are on I don’t even mind sitting in traffic as it gives me a little time to think and relax … as long as it’s not too much traffic.

Radio production has learnt from the strengths of the audio only medium. You can in fact do things you can’t do on a TV, perhaps because of the limited budgets but perhaps because you can create an experience not possible when you’re distracted by the images. It reminds me of the classic line in Educating Rita when, in response to “Suggest how you would resolve the staging difficulties inherent in a production of Ibsen’s Peer Gynt” , … she simply replied … “Do it on the radio. ”

So where does this sit with mobile …

As we start to explore the opportunities with mobile, we’ll start to exploit the true value in an always on, context aware, portable communication channel. We’re starting to see it already. Rummble provide an excellent location based personalised recommendation service. facebook is being accessed regularly from mobile devices by over a quarter of it’s users to keep in touch with their community.

I see the next few years as pretty exciting, as we grab this mobile medium and let it power people’s lives. It’s why I’m spending a good bit of time at bemoko refining the way that we take everything we’ve learnt and created in the web world to power the mobile enabled web; taking the unique benefits of mobile to create experiences we only dreamed of before.

Posted in: mobile No Comments

Over the last couple of months we’ve started to use Canoo Webtest to functionally test our mobile web sites. We now use it for both product deployment cycles (we spin up a full version of bemokoLive and test a sample site prior to packaging up the platform) and site development.

What has particular impressed us about Canoo is the way we can rapidly create clean and succinct tests that address all of the functional aspect of a mobile web site that we can need to automatically test. There is a rich set of functions in Canoo to click around a site, interact with a page and test functionality and content of a page. We write all our scripts in Groovy which provides a language that is light on scaffolding syntax (i.e. code just what you want to do), allows us to dig into misc Java libraries as we choose and provides a functional language that is human readable (well to us techies).

For example, take the following test script:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
package com.bemoko.webtest.live
 
import com.bemoko.commons.test.webtest.BemokoWebtest
import com.bemoko.commons.test.webtest.WebtestXmlParser
import com.bemoko.live.devices.data.conf.HeroDevices
import com.canoo.webtest.engine.StepFailedException
 
 /** 
  * Test that welcome pages are rendered correctly to the hero devices
  */  
class PagesTest extends BemokoWebtest {  
  void test() {
    def parser=new WebtestXmlParser()    
 
    // (1) Iterate over HeroDevices    
    new HeroDevices().all.each { deviceData ->
      webtest("PageTests : ${profile} : ${deviceData.id}") {
        config(liveConfig) { 
          deviceData.evidence.each() { 
            header(name:it.key, value:it.value) 
          } 
        }
 
        // (2) Invoke the welcome page and verify some of the content
        invoke "/welcome/i", 
         description: "Index page : ${profile} : ${deviceData.id}"  
        verifyTitle "bemokoLive - i"
        verifyLinkedContent 
          xpath:"/html/head/link[@rel='stylesheet']/@href", 
          accept:"text/css"
        verifyLinkedContent 
          xpath:"//img/@src | //input[@type='image']/@src", 
          accept:"image/gif;image/png;image/jpeg"
 
        // (3) Validate document using an XML parser
        groovy { 
          parser.parseText(step.context.currentResponse
            .webResponse.contentAsString) 
        }
      }
    }
  }
}

The bemokoLive test suite provides a collections of devices that allow you to easily simulate requests from particular devices. The HeroDevices class, in the script above, provides a collection of around 10 devices that provide a representative coverage of different types of devices. We (1) iterate over this collection and pass in the evidence for the device, i.e. the HTTP headers, into the webtest configuration. We then (2) invoke a particular page, test its title and verify that the linked content is good. Finally (3) we validate the document against the DTD in the document – great for making sure nothing bad has slipped into the page.

Reports get generated with a full break down on the tests and any step failures along with a quick summary, for example the following screen shot shows the summary of test run of 431 tests which we ran against one of our customer sites. I’ve deliberately included a report with failures to make the summary a little more interesting:

Canoo mobile web test summary
There’s much more you can do with canoo and the Groovy scripting approach – take a read of automated testing on our bemoko wiki for some more pointers.

With this approach we can build up a robust set of scripts that verify our deliver and provide great foundations for our real device testing – no more burning time on real device testing dealing with functional issues that could have been caught earlier in development. This is also good black box test, so whether you’re using bemokoLive or a.n.other approach it’s equally applicable. If you’ve got a mobile web site that you want us to test, or help you get started to run this testing yourself just get in touch.

Posted in: mobile No Comments

We’re pleased to be the mobile web partner for the upcoming and prestigious mobile user experience (MEX) conference.  We’ve created a mobile site for the conference at http://mex.bemoko.com which I have to say I’m rather proud of.  It’s getting a lot of good feedback and Marek Pawlowski has written a nice blog posting about the  site.

Posted in: mobile No Comments

Great new service on web access stats including mobile browser segmentation from StatCounter. See Launch of Free Global Stats Tool for more info on the launch, leading with the headline iPhone Takes Global Lead in Mobile Browser Wars – StatCounter Research.

We commented with “Thanks for providing this stats service – a great service especially on the mobile browser segmentation. There’s an interesting thread going on over at on the momolondon yahoo group – you’ll have to sign up to see the thread, but if you’re into mobile then it’s a very active group and well worth joining. It is essentially discussing mobile access stats between StatCounter / AdMob and Bango. iPhone / iTouch play very high on StatCounter and pretty high on AdMob, but is way down on the list for Bango. This is due to iPhone devices accessing PC sites (a.k.a non-mobile-ready sites) as well as mobile-ready sites, but it shows a great trend on how the iPhone has impacted the way that people accessing the web from their mobile.”

Posted in: mobile No Comments

In response to the utter death of the “mobile web”

“An interesting point of view and, there are clear current benefits for local apps at the current time, that does not mean the mobile web is over. I’m looking forward to evolutions in the mobile browser – especially with the innovations coming in from the likes Fennec, Opera and Chrome – where deeper device functionality will be made available via the browser. Just think how tools likes Google Gears and AJAX toolkits are changing the way we can build sophisticated web applications on the PC. On the PC, for the majority of my applications, I much prefer a decent web application delivered through a standard browser than having to download an application. I see no reason why the mobile browser cannot achieve the same thing, allowing people to deliver cross-device applications in standard way that one (1) we know and love (2) has already demonstrated it’s value on the large screen. Neither mobile native apps nor mobile web app will conquer all and both will most definitely survive with both providing incredible value in the ultimate goal of delivering great mobile user experiences.”

(Note – as of March 8th this comment has not yet been accepted by rhomobile)

Posted in: mobile No Comments

bemoko widset widgetI discovered widsets early last year and found it a really enjoyable interface to access my favourite news feeds. It’s been out of beta since last November and has since been polished up well. What impressed me most yesterday was the ease in which I could create a new widget for this bemoko blog and get it published. I had 20 subscribers to the widget within the hour. Many thanks to those early adopters (and of course the Widset developers for making it so easy).

wordpress mobileAn alternative approach is the Wordpress mobile plugin provided by Andy Moore. As with all Wordpress plugins the installation is easy beyond belief. 5 minutes and our blog was optimised for the mobile. Andy does a stunning job in the mobilisation – all in one php and a great light weight device detection. Do take a look at the PHP code that does it all (wordpress-mobile.php) for a little inspiration.

widset dashboardSo how would I access mobile feeds? I’m not too sure whether I prefer the Widset approach or delivering direct to a standard mobile browser. They both have their strengths. The Widset UI is smooth, looks impressive and is responsive, but it does require the user to download and launch another app. The browser route is more lightweight, accessible to more users without an installation and gives extra flexibility to the service provider – you’re not confined by the Widset box. I’ll try both for the next few months and let you know what works for me both as user and a service provider.

Posted in: mobile 4 Comments