Posts

Showing posts from 2013

Mobilize.js versus responsive web design (RWD)

Image
Mobilize.js versus responsive web design (RWD) Both mobilize.js and responsive web design offer solutions to having a mobile and desktop site from the same codebase.  This is a comparison and evaluation of the 2 approches

I previously blogged about mobilize.js and how it can be used to transform a website dynamically between a desktop and mobile-enabled site.  As a brief background, mobilize.js is a javascript library that detects if a mobile browser is being used and, using client-side javascript, and re-renders the page using predefined
mobile-optimised css.  However mobilize.js is no longer being developed - the developers now recommend using responsive web design instead.  In one of the comments to my original post I said I would check out the relative merits and report back - this is me reporting back

Responsive web design works by detecting the size of the display and rendering differently using css (css3) media queries.  The screen size can be set in the css (or different css …

Launch a website as a mobile app using PhoneGap/Apache Cordova

How to launch a website as a mobile app using PhoneGap/Apache Cordova
I spent some time recently trying to find out how to launch my website as a mobile app.  The information was available around the internet but since it took me a while, I thought I'd collate it here in one simple post for anyone who wants to do the same

I decided to use Apache Cordova since it gave me the framework for developing an HTML5 site as a mobile app already, meaning all I really needed to do was plug my website into it.  Their getting started guide has good information on how to create a Cordova project - I used Android but you can use whatever means you wish

A basic Cordova app gives you a way to launch the app with an HTML page that you use to display your app contents.  The trick then is make the page load your website which you can do in one of 3 ways:

1. Package your site inside the app. This means it loads fast and without an internet connection.  The downside is you have to update and re-releas…

Android Daydream with Processing.js

Image
How to create an Android Daydream with processing.js I've spent some time working out how to get processing.js (a nice javascript graphics library ported from Processing) to display an Android Daydream (basically a screensaver that activates when the device is docked or charging)

I previously wrote about how to display an HTML page as a Daydream which forms the basis for this post.  Please see my earlier post for full details but to summarise you can load an HTML page in a webview like this

webView.loadUrl("file:///android_asset/www/index.html");
Processing.js allows you to display Processing code as javascript in a page, so all you need to do is either embed the processing.js code or load the Processing PDE file containing the code as explained on the processing.js site

I only had a couple of issues with it which were:

1. The js code seemed to run at a much higher frame rate than my native Processing code such that my animation looked insane. In the end I just reduced th…