Google Docs Palm Pre Stencil

A few month ago, after I was saw the impressive web wireframes templates and iPhone stencil created with Google Docs by Morten Just, on Docs blog, I started playing with this Google’s new addition to the Docs family, Drawing, to copycat this idea and made a Palm Pre stencil.

So here you go! You can check out my Palm Pre stencil on Google Docs.
If you’d like to have your own copy, sign in your google account, then:
Choose file > make a copy

You can drag or copy the UI widgets to the white canvas (printable area). To edit text, you need to ungroup the object first, by selecting the UI widget to be editted and go to Format > Ungroup (you may need to repeat ungrouping grouped objects) then double-click the text to edit.

Also, I labeled each UI objects to match the Mojo UI Widget names so developers can reference the stencil and code easily!

Classification of Mobile Browsers

Today, I am not going to post some CSS3 tricks on Webkit, or stuff like that. Instead, I post a list mobile browsers, since I am often asked about mobile / WAP browsers by engineers, product managers, and mobile-curious or mobile-newbie people.

I gathered 30+ major browsers I have worked with (plus a few I have never even seen), and categorize by the markup that browsers can render – WML, CHTML, XHTML-MP, and HTML4.

So, here you go. If you find some mistakes, let me know!

I have categorized only with the markup type, and did not sub-categorize these browsers. However, if I would, I may want to grade XHTML-MP devices with page memory size (=”deck size”, yes I said deck size), and screen resolution for UI design purpose.

To grade full-HTML browsers, you need to spend massive time and effort on testing rendering capability with CSS, and Javascript DOM compatibility, events, etc. Actually, PPK has done excellent work on mobile browser testing, so you can simply visit Quirksmode.org!

Another WebKit browser – Chrome by Google

So Google has just released Chrome browser, which Mac user still have to wait for its Mac release. I tried to install on VMWare to see how it is like.

It is a WebKit-based with a brand-new V8 JavaScript engine, which supposed to be much faster than existing JavaScript interpreters. Also, Chrome currently supports almost as much CSS3 that Safari 3 supports.

Actually I haven’t really tested yet (cuz my main machine is a Mac of course, and my Vaio is dead now), but as long as I quickly took a look at the test page I made, some are not working quite right – e.g. text-shadow and box-shadow (Correction: box shadow works with webkit extension, as -webkit-box-shadow). Animation and Transform CSS work as expected. (Just like Safari 3.2)

So how about mobile? Current Android browser already uses WebKit engine, so Chrome Mobile will be the future browser for Android?

Yes. According to Sergey Brin, Chrome is going to be available for the platform later.

(This is not a real Android UI. I just photoshopped.)

Google announced API for LBS on Mobile

Google launched the Gears Geolocation API for mobile on last week on their official Goolge code blog, and Mobile Blog, with a screenshot of a sample mobile site, Rummble and video demo of lastminute.com of UK.

On mobile devices with Gears installed, Javascript functions grab the cell-ID of nearby cell towers or GPS (if either is available) to improve the postion fix.

The two methods:
getCurrentPosition() makes a single, one-off attempt to get a position fix.
watchPosition() watches the user’s position over time, and updates the position changes.

Also,
lastPosition get an approximate position fix

The bad news is that API is available on Internet Explorer, Firefox and IE Mobile (selected devices only – incl. Samsung Blackjack II, HTC Touch Dual, TyTN, Palm Treo750 etc.) and will be available on Android. I was going to try it with S60, until I read the line on the announcement.

The good news is that they are currently implementing the editor’s draft of the W3C Geolocation specification with Microsoft and Mozilla guys.

$5 a Gallon? Take Public Transits

maps.google.com/bayarea

I saw this Google ad on the MUNI bus I take for commuting (yes. I take a MUNI and company shuttle to commute to Sunnyvale from SF!) and tried it and like it a lot.

This is a nice additional feature on Google Maps that gives you step-by-step transit directions including estimate travel time. It covers MUNI, BART, CalTrain, etc. also walking route. (but it looks like ferry is not covered).

Google Maps Bay Area Transit

Opera Lanches Widget SDK

Today, Opera launched Widget SDK, enabling web developers to deploy web apps on desktop, TV and mobile devices. Unlike Apple’s iPhone $99 SDK, it is free of charge.

Watch the step-by-step instruction video:

More Mobile App/Widget SDKs:

• Apple: iPhone SDK
• Google: Android SDK
• Yahoo!: Blueprint SDK (this is what I am working for)
• Nokia: Widset
• Openwave: Mobile Widget
• Plasmo: Widget

Android Uses WebKit

My guess was wrong.

I somehow thought Google will partner with Firefox as a defaul browser for their new mobile project (now “Android”), however, Google’s choice was WebKit, accordeing to their SDK. Actually now I think this is a wise choice, since many (mobile) web devs are familiar with developing with WebKit thanks to Apple to make iPhone popular. And needless to say, WebKit for mobile including Nokia N-series is the one of the beat browser around.Anyway, as the storonger-than-ever WebKit is gaining even more power, “Sarfin’ Safari” (Webkit.org’s blog) has announced new features for Safari 3:

1. Enhanced Rich Text Editing
2. Faster JavaScript and DOM
3. Faster Page Loading
4. SVG
5. XPath
6. New and Improved XML Technologies
7. Styleable Form Controls
8. Advanced CSS Styling
9. Reduced Memory Use
10. Web Developer Tools