Live blogging web 2.0 expo – blackberry

See table of contents for full list of web 2.0 expo posts

I was going to have Blackberry and IBM share a blog post but Blackberry had too much good content and deserves its own. I’m really excited about trying Ripple.

Live blogging note: when typing on your lap, it helps to have the angle/stand for the ipad. And as usual, i will fix typos/format from home

The BlackBerry Web Platform – Adam Stanley

  • Web app platform on BlackBerry changed a lot in last 2 years
  • Powered by webkit (finally gave up on blackberry browser engine and moved to open standard)
  • On blackberry 6+ (half of users are still on version 5)
  • Showed graph that Bold 4 times as fast as Torch
  • AliceJS – framework to add CSS based animations
  • “the great thing about web is that it is built on standards … As long as we follow those stamdards” – problem #1?
  • devblog.blackberry.com – has most announcements for developers
  • Off topic: noted use micropayments to buy apps (iphone and android too). Why can’t the newspaper do this? 5 cents per article?
  • Even 99 cents is a barier to entry. See if can give away part for free to get people to try
  • Don’t know or can’t say what percent of users are business users (vs those who can download apps)
  • Blackberry makes a tablet now (playbook) – supports flash (ipad giving in one day?)

Dev tips

  • Use feature detection over browser detection [when will this become universal?] – modernizr and has.js frameworks help
  • Viewport – use initial scale so can scale
  • Use addEvenListener rather than assigning to onclick so don’t wipe out extisting (or use jquery)

Blackberry webworks framework

  • for apps that have own icon on the device.
  • Write app in html 5
  • Webworks platform like an adapter from the html app to the java code actually running on the blackberry
  • Provide javascript apis so can call blackbeery specific parts – blackberry.invoke lets you do things like open the camera
  • Other choices : adobe air

Coding concerns

  • Need index.html ( app home screen) and config.xml (blackberry icon and the like)
  • That’s how launchers work. Point xml to url on web
  • Blackberry ripple emulator – said better than simulator because faster. Can see how app looks without fully running it [ i look forward to testing the coderanch mobile site with ripple]. Ripple is a chrome extention. Can run against local or internet content
  • Web inspector – profiling and debugging tool that comes with webkit. It needs to be opened up so can connect to it

javaranch forums go mobile

Want to know what went  on behind the scenes of JavaRanch’s mobile site creation?

Timeline

  • January 2009 – We started talking about how poorly the site renders on a BlackBerry
  • July 2009 – I got a BlackBerry for work.  And ugh.  The forums do look horrible.
  • August 2009 – Tried out BlackBerry emulator and explored the minimalistic approach possible to creating a mobile version (see next section.)  That didn’t work and I wasn’t prepared to spend a lot of time on it in the summer.
  • mid November 2009 – Start discussing design/UI.  Noted it took 4 minutes to edit a post via BlackBerry.  Very excessive.
  • late November 2009 – Restart development using approach #2.
  • December 2009 – Weekly deployments to production using “secret URL that only the moderators know” for beta testing.
  • January 3, 2010 – Mobile URL announced to public and added to e-mail notifications

Approach #1 – Mobile CSS

My original theory was that the easiest thing to do would be to just add a mobile stylesheet that would hide some columns.  It wouldn’t shrink the pages of course.  But as a first step: slow and readable beats slow and un-readable.  I quickly ran into some problems:

  1. The BlackBerry doesn’t like mobile stylesheets.  Bushido covers the options in a lot of detail.  Search for “Alright, alright. Gimme the code already!” for the ugly CSS imports.  The real problem is that you don’t have a mobile stylesheet with this technique.  You have a stylesheet that everyone uses called mobile and the main stylesheet which cancels out the main one.  Developing for this is crazy as you are compromising what stylesheets appear to do.  And it will break when RIM finally gets their act together.
  2. JForum uses a largely table based layout.  This doesn’t go well with CSS for hiding things.
  3. The table layout made changing anything incrementally very difficult.

Approach #2 – An actual mobile site

This approach is definitely more mobile friendly as the pages are designed to be mobile sized.  They are also written from scratch and get to use <div>s.  Basically what I did was take the real page, pick the most important parts and create div layouts for them.  Once I had one done, the rest followed easily.  There are a few limitations documented in the JavaRanch announcement site.  But overall, I’m happy with it.  It is certainly way better than what we had before.  And we will continue to tweak it.

Testing

I tested locally using the BlackBerry simulator and later with the Droid emulator. I also tested using my real BlackBerry after deploying to the test server.  The aggravation of using a real mobile device isn’t captured on the emulators!  It is possible to use testiphone.com as an emulator.  It is not completely accurate though.  In particular, it didn’t show the viewport problem.

<meta name=”viewport” content=”width = 320″ />

We also tested on a variety of real devices.  Many moderators tested on their personal handhelds and we got a good variety that way.

I’d like to thank a few people in particular.  Thank you to everyone who let me test on their device, especially

  1. Gregg Bolinger – for instant feedback in testing the viewport fix at 11pm on both the iPhone and the Droid.  (And more testing than anyone else.)
  2. A few coworkers (at my real job) – for the wide variety of devices I got to put my hands on.  The simulators really aren’t the same.  Five minutes on the real handheld at lunch really helped.
  3. Chuck from the NYC Spin for offering his tiny touch screen device (the smallest I’ve tested on) without my even asking!

Marketing

You know how sometimes marketing picks a ship date and it overrides “doneness” ?  Well, I really wanted to announce this on January 3rd – the one year anniversary of us being on Java based software.  There are some things that I wish were more resolved like why Google Mobilizer is injecting itself in links. Overall, I think it is in good shape and ready for people to try out though.

What do you think of the new site?  Share in the JavaRanch announcement thread or as a comment here!