Monday, July 26, 2010

Vote for my prediction of Virtual Worlds in 2020

The UK Trade & Investment are holding a competition of predictions for the year 2020. I have submitted a prediction that is related to virtual worlds and augmented reality, and it was accepted as one of the top 30 finalists.

Now it is the voting phase (Until Aug.4th) - So I'd appreciate your votes as well, especially if you're into virtual worlds and/or augmented reality.

Here's the link (I am at group 2, number 6 - "Ofir Leitner"):

For full disclosure, I'll tell you that if my entry wins, I will be entitled to a business trip to the UK with meetings with key industry people. But of course it will also raise awareness to the virtual worlds and augmented reality spaces.

Thanks, and see you in the UK!

Monday, May 10, 2010

Mobile Web in JavaME apps - now with CSS!

Twitter's home page as rendered by HTMLComponent before CSS support and after

Following my post on Mobile Web in JavaME that discussed the new possibility of embedding web content inside LWUIT applications using HTMLComponent, I'm glad to announce that CSS support was added to HTMLComponent and is now publicly available in the LWUIT SVN.

Now, developers can not only render HTML documents in their JavaME apps, but can also design them with CSS by adding colors, borders, backgrounds, fonts and more. This means that now HTMLComponent is almost fully compliant with the XHTML Mobile Profile 1.0 standard, which requires WCSS support (WCSS specs here)

The support is about 90% complete and provides almost complete coverage for most pages today. The 10% that were not implemented (at least yet) are features that do not sit well with LWUIT's styling model and/or they require extensive efforts and provide with little value (Some of these are less used tags or edge cases). In any case, you should be able to see most pages rendered correctly (And if you create your own content you can simply avoid using unsupported properties for now).

And while there's a great difference in how HTML pages will look now, the change is transparent to developers, and there's almost no difference in using HTMLComponent. Basically once you load a page that has CSS segments (either external, embedded or via the style attribute) they will be parsed and rendered.

The only difference is that you can turn CSS off by calling HTMLComponent's setIgnoreCSS method, if you don't want CSS segments parsed for some reason. And actually there may be reasons for that - CSS does require extra memory, and adds some performance overhead as well, all depending on how complex the CSS used in specific pages are.

There are also more esoteric methods such as addSpecialKey and setCSSSupportedMediaTypes - I won't go into details on those here, you can read the documentation.

Here's the full list of what's supported and what not:

Fully supported CSS properties

Background: background-color, background-image, background-repeat, background-attachment, background-position-x, background-position-y
Border: border-*-width, border-*-style, border-*-color
Fonts: font-family, font-size, font-style, font-weight, font-variant
Lists: list-style-image, list-style-position, list-style-type
Margins: margin-* , padding-*
Text: text-align, text-indent, text-transform
Misc: color, height, width, visibility
WAP : -wap-access-key,-wap-input-format,-wap-input-required
Shorthand properties: All shorthand properties are fully supported
(* = top/left/bottom/right)

Unsupported/Partially supported properties:

Unsupported: clear, float

Partially supported:
- display - Supported: none, marquee / Unsupported: block, inline , list-item
- white-space - Supported: normal, nowrap / Unsupported: pre
- vertical-align - Works only within tables

Known issues
  • width/height work for simple elements, but may be problematic with complex elements.
  • font-family accepts the first mentioned font and ignores all fallback fonts, since finding a matching font is very time consuming, and also since in the ME environment usually there aren't that many fonts anyway.
  • text-decoration is unrelevant: since the only mandatory WCSS decoration value is 'none' which is usually used to remove underlines from links - since we don't have underlines it has no meaning.
  • text-transform may have issues when overriding a parent which has a different transform.
  • HTMLComponent.FIXED_WIDTH mode does not work with some CSS attributes, and thus its default value is now false (The downside is that in FIXED_WIDTH mode 'justify' alignment doesn't work).
  • Some properties will be ignored if associated with a pseudo-class (such as a:focus/hover) - and that's because while LWUIT does have separate styles for selected, unselected and pressed states - these styles include properties such as padding, margins, colors, background, font - but for example not alignment or visibility which affect the component in all of its states.


Monday, March 1, 2010

MWC 2010 Recap

As in the past 4-5 years I've attended the Mobile World Congress (MWC) in Barcelona. I must say that being a veteran attendee it is starting to get a bit old and also a bit sad to see the show shrinking a bit every year, but still I did manage to see some interesting stuff that are worth mentioning, so here goes:

Missing but yet present: Nokia

Nokia's decision not to present inside MWC was definitely a blow to the GSMA. But still though it didn't pay the $$$ to the GSMA to be inside the show, it had its own side event a few steps away from the Fira (MWC's venue). So still even for those wanting to meet Nokia, coming to Barcelona in that time a year is still worthwhile which of course works in the best interest of MWC. Nokia's strategy was to create a more targeted side invite-only event, which they hoped would be more productive than the buzz and noise inside the show halls. It will be interesting to see if they repeat that strategy next year and if any other big players will follow.

Saddest Hall: Hall 2.1

And very related to Nokia's decision, the show was simply smaller this year both in terms of visitors and in terms of booth space. Last year some halls were already a bit thinner than in previous years, but this time, aside from most halls being less dense, the second floor of hall 2 almost completely disappeared. There were only 2 booths there and the media center and that's it. In the good times it was filled with booths all over. The good news is that I noticed more advertising on the streets, metro stations and next to the Fira, way more than the previous year. So guess we'll have to wait till next year to see if there's a trend here or just a minor setback.

Best Booth Babes: CBOSS

Well, there's really no competition here... The CBOSS girls simply give the best show of MWC year after year... Definitely the show stopper of hall 1 in which you can see quite an audience every time these lovely girls make an appearance. On the other hand, other companies failed to deliver on the oldest trick in the show marketing book and it was kinda dry elsewhere... I can only say MWC still has a lot to learn from the great E3 games show...

Most "out-there" product: Motorola

When I walked into the Motorola area, at first I thought I stepped into Borg territory (Startrek reference...) - It seemed to inhabit half-man half-machine beings... Soon enough I was assimilated and became one of them by wearing Motorola's thingie... And in fact what seems to be science fiction at first is very down to earth. This device includes a tiny screen with a magnifying glass that is placed right in front of your eye (with a flexible arm that can be tilted) and when you look into it you get the experience of a full SVGA screen. It has no keyboard, and is activated by vocal commands and has several useful applications like a media player, an office-like suite etc. The idea here is to give people who need their hands free the ability to interact with a computer - for example in construction sites where you need both hands, but may need to take a look at some drawings from time to time. Pretty neat and useful - the only down side (Other than looking like a cyborg) is that it did give me a headache after a short while.

Yummiest Phone: NTT DoCoMo

One of the things I've noticed is that as handsets technology advances, it is very hard to really thrill in this domain. If a few years back a touch screen or a full qwerty phone was something to write about, today there's basically nothing new - all improvements of the UI and other handset parameters. So, if you can't innovate in the technology department, you can always do that in the style and design department, and this is exactly what several vendors did, and one of those is this really tasty looking NTT DoCoMo phone along with some cookies...

Worst Party Ever: Samsung

And talking about food, I can't forget the special treat some of Samsung's guests got in their party in the first day of the conference: Food poisoning... Yes, unfortunately for me I decided to go to the Samsung party and ate some tapas which tasted a bit weird and proved later on to be truly funky... Anyway, the lesson learned is to be very careful in Barcelona with the food... Samsung - please pick another venue next time... And despite their attempt on my life, I'll be kind and at least mention their Ruggedized phone edition which includes a phone for field purposes (Sand resistant and battery lasting for weeks) and their water-resistant phone shown here. Placing a mobile handset in your aquarium is elegant and it saves the need to buy fish food...

Sweetest Ride: Qualcomm

Another trend you couldn't miss this year was mobile integration with vehicles. It was very difficult to miss due to the cars several of the big companies placed in their booth. The one that caught my eye was Qualcomm's system installed in a luxurious Audi model (Coming to a dealership near you...). It had all you can dream of - a computerized system that includes GPS navigation, media system, speakerphone, internet browser - and all built it - the driver even has very convenient controls for the system near the stick. All communication is done mobile of course, and passengers can also enjoy wireless internet as the system includes a WiFi router... Indeed a sweet ride...

Coolest Demo: BlackBerry

The Blackberry guys had the neatest demo I've seen. To demonstrate their device's gyro, they wrote a controller for a small Lego robot - If you tilted the device forward, the robot drove forward and so on for all directions - that was really neat, and though I don't think that Apple has driven them into the Lego business, it was really a nice way to catch audience and explain about their stuff - so way to go...

Greenest solution: Asimelec

The green trend is all over the world these days, and Asimelec, which is a Spanish association backed by some of the prominent handset vendors and mobile operators has a solution for your old mobile device: recycle it... These guys place recycling bins for mobile phones and disintegrate them into components that can be recycled back into other industries. And with the current rate of devices innovation, they probably have their hands/bins full... Asimelec's booth was also the most original one: It was made wholly out of cardboard... The booth, the chairs, the table - everything...

Worst use of space: A bags shop?

Yes, the picture here is from MWC 2010 and not from a fashion trade show... It seems that they will sell space just about to anyone these days...But seriously this booth which was quite centrally located (Right in the entrance to hall 8) was a bit weird to see considering the surroundings, but still perhaps when you have lots of men away from home that have to come back with some gifts, it might be a pretty good idea... In fact, I bet they are the only booth who actually made instant money in this show...

Best Giveaway: Google

It was a good show for Google - if last year we saw only a few Android prototypes, this year we experienced an explosion of Android based devices from many vendors. But every blessing has its drawbacks and in this case word of the fragmentation in the Android platform was heard from various sources (And we all saw the toll it took on JavaME). But anyway, Google will probably not be remembered in this show (only) for this but rather for the generous giveaway.... Now, we all got used to giveaways in conferences, including branded mints, pens, bags and even sometimes disk-on-keys. But Google really set a new barrier in MWC 2010: Everyone who attended their Android seminar got a Nexus One phone. Yes - EVERYONE. The only catch was that you either had to be pre-registered to the seminar, or stand for an hour-two in the non-registered queue (Which got bigger as the rumor spread...). And BTW - If you saw people with weird pink markings on their hands - it is how Google marked (or indexed?) people so they won't grab more than one device... Unfortunately for me I got the news kinda late, so when I got there it was already closed... So, Google - if your intention was to hand out phones to mobile developers, bloggers and other professionals so they would spread the word - you missed one (Should I give you my mailing address?... :)


Well that's all for this year, I am sure you all had your experiences as well, so if you saw something interesting drop a comment right here.

Wednesday, February 10, 2010

MWC 2010 party list on your mobile!



A video of the app - fonts look better on actual devices (video compression takes its toll)

Everybody knows that MWC is more than just the show itself. The networking events and parties are sometimes as important (not to mention quite fun...). But with almost anyone throwing a party, it is easy to lose track, especially when you're on the move looking for the evening's next adventure...

Well, no more! Meet the MWC 2010 Parties List Mobile Guide - A small JavaME mobile app with all the info you need in your fingertips, and best of all, it's free and all info is stored in the app itself offline so there's no need to go online while you're roaming!

To download it point your mobile browser to: http://budurl.com/mwcp
Or download the JAR to your PC - http://budurl.com/mwcpjar

I made this small app over the weekend with LWUIT and what started out just as a small test for a new feature became quite a useful app. It still has some bugs and quirks, but thought I'd better release it now rather than after MWC.....

You can also find more info on the app here: http://budurl.com/mwcparties

Also, if your phone supports JavaME and this app doesn't work, drop me a line or fill in your feedback in http://budurl.com/mwcupdates.

And if you want to get "technical" on how this app was made, you can read this post.

Wednesday, February 3, 2010

Mobile web and HTML inside JavaME with LWUIT



In the video: A use case of using HTMLComponent. Used both to render offline content within the JAR (The events detailed descriptions) and also to access external web-flows (Facebook, Google forms). Fonts look better on actual devices (video compression takes its toll...)

One of the things I always missed in J2ME was the ability to perform some web-based flows or display HTML in general as part of the application (and not by sending the user to the native browser with platfromRequest, not knowing if he'll ever come back...).

Most of the other mobile platforms do have solutions that allow embedding web seamlessly into the application, but in J2ME it never existed. So this is why I am glad to unveil my latest project which was done as part of my consulting work at Sun Microsystems: HTMLComponent.

HTMLComponent is a LWUIT component that allows J2ME developers to render HTML documents (local or remote) that conform to the XHTML Mobile Profile 1.0 standard. It truly revolutionizes the things you can do in J2ME and brings the platform to new heights.

Use Cases

There are many use cases for HTMLComponent, here are a few I can think of:

Rendering rich-text locally - The simplest one is when you need to render some rich text locally - for example a text segment that part of it should be bold/italic and an image next to it, or maybe even a small table - to do that with current tools is not an easy task. But with HTMLComponent, you can simply compose an HTML document describing that exact scenario and you're done! This is classic for Help/About pages and can also scale up to rendering parts of your UI with HTML (Since it supports forms).

Dynamic Content and UI - Another common use case is dynamic content and UI. When you release your app, sometimes you need parts of it to be dynamic - for example a catalog section for your app that changes daily or a news page or an elaborate details page. Up until now developers had to make their own frameworks to support such cases and most of the time it wasn't truly 100% dynamic. With HTMLComponent you can simply have the app refer to a URL, and serve HTML there - and since HTML is not only the content but also the layout and even UI, your catalog can look totally different without you changing anything in the application and having to release a new version of it.

Using your existing web flows - A third use case is when you already have a web server-side, and instead of writing the whole thing again for mobile, and having to handle 2 separate processes you want to utilize the already existing process for mobile. A good example for that is registration and login - why recreate this process if you can simply redirect users from your app to the existing registration URL?

Embedding third parties web flows - the fourth use case is when you want your users to be able to access third parties existing mobile web content. For example you have an LBS app and want to let your users check the weather in an affiliated site - no problem - just provide the URL. Other examples can be referring users to online dictionaries, translators, search engines and other services.

Anyway - The real strength here is the fusion between the client application and the web. It is ideal for use cases in which a simple mobile web site is not adequate enough - and an application needs to rely also on web-based flow for dynamic content/UI (either existing or specially designed for the app)

Getting HTMLComponent

And now you probably ask yourself: When can I get it and for how much? Well the answers are the best you could hope for: Now and for free!

HTMLComponent is a part of Sun's LWUIT framework, a UI toolkit that allows you to create great looking and portable UI for J2ME applications. I worked with LWUIT since it came out back in mid 2008 as a consultant for various companies. I did several project including adding RTL support to LWUIT, and in the past few months I have joined the LWUIT team at Sun as a consultant.

One of the best things about LWUIT is that it's open-sourced and can be used also for commercial purposes for free, and HTMLComponent is no different here, so basically this solution is available now for all J2ME developers out there and can be checked out from the LWUIT SVN (Note that it is not included in the LWUIT 1.3 drop, so downloading the latest drop wouldn't help, you have to check out the sources from the SVN).

If you check it out, don't forget to check out also the LWUITBrowser project which I wrote to demonstrate what you can do with HTMLComponent. I'd like to emphasize that a browser is not the use case we're aiming for, since all mobile phones (at least those with J2ME...) have native browsers that nowadays support even more than XHTML-MP1. But still this demo is the best way to show what types of documents HTMLComponent can render without us having to build a whole server side.

About XHTML-MP 1.0

And now a few words about the XHTML Mobile Profile 1.0 standard: XHTML-MP 1.0 is a subset of XHTML adapted to mobile. The standard supports most of the basic elements such as Images, Fonts, Lists, Tables, Forms and even CSS. It does not support however Javascript and frames and also other tags or attributes. The full details of which tags it supports can be found in this document, and also a more detailed list of which attributes in each tag are supported can be found here, though I am not sure of its accuracy.

The XHTML-MP1 standard should be sufficient for most use cases above, and as for the fourth use case above (using existing third party content) - While there are not many sites that conform 100% to the XHTML-MP1 standard, a lot of mobile sites are very close, and since the parser in the package is not very strict they can be rendered. Just make sure you're using the mobile versions, since using regular web will surely be unsuitable.

Detailed support list

And now for those of you who stayed this long, here's a more detailed list of what is supported and what's not (in general and in the current version):

Text - Obviously text is supported... But that also includes most of the important ways to format it in HTML including alignment, paragraphs, div, new lines using the BR tag etc. Text justification is not supported yet (align="justify") and will hopefully be added later on.

Fonts - Fonts can be changed anytime for example by using B for bold, I for italic BIG for a bigger font, SMALL for a smaller etc. Also header definitions (The H1-6 tags) and other less known font directives (such as KBD, CITE etc.) are supported, but all subject to availability of such font in the device. If the needed fonts are not available in your device or don't look as expected, you can always add LWUIT bitmap fonts and assign them to the various tags.

Images - Images are supported and basically any image format that your device's JVM support will work here. Image download is done asynchronously by using a number of threads, so the document loads up even before all images are available. The number of threads can be tuned and image downloading can also be turned off. Note that HTMLs containing large images may cause memory problems and/or cause the page to look weird.

Lists - Lists are supported including nesting. This includes ordered lists (the OL tag) and unordered lists (the UL tag) with their items (the LI tag) and also definitions list (the DL, DT and DD tags).

Forms - Forms are also supported. Both the GET and POST methods are supported as a form action. The HTML package takes care of URL encoding and most input field types are supported including: text fields and areas, check boxes, radio buttons, combo boxes, hidden fields and of course the reset and submit buttons. Regular buttons (both input type=button and the button tag) are not supported due to the fact that they can only function with Javascript. Also not supported is the File upload control (input type="file") as it is not part of XHTML-MP1.

Tables - Tables which are still the best way to layout HTML documents, are supported including nested tables. There are still some open issues here and there but these will be solved over time.

Char entities - In order to be able to write HTML reserved characters such as the tag brackets or non-displayable/type-able characters, char entities are used and they are supported. All char entities up until ASCII code 255 are supported and beyond that you can add your own.

HTTP - HTMLComponent is mainly a UI component and its job is to render HTML documents. As such it does not deal with network/IO and the complexities of the HTTP protocol. It does use an interface by the name of DocumentRequestHandler that should be implemented by developers to fetch documents from wherever they need and in whatever protocol they want to use. Since the most common uses are fetching HTML via HTTP, there is an implementation of this interface in the LWUITBrowser project that handles the HTTP communication and knows to take care of request/response headers, cookies, redirects, network errors etc.

Parsing - HTMLComponent uses an internal parser to parse the given HTMLs. The parser is not 100% strict and will also accept some errors in the document. The developer can control however which errors to ignore and continue parsing and which errors to stop on by implementing the HTMLCallback interface. Also note that some errors may be too fatal for the parser, so try to stick to the XHTML-MP1 standard and especially always close tags that have been opened and in the correct hierarchical order.

Refresh/Redirect - HTMLComponent performs refresh/redirect directive that are defined in the META tag and HTTP_EQUIV attribute of the HTML. As for redirect response codes, these should be implemented in the request handler.

CSS - While CSS (or more accurately WCSS) is a part of the XHTML-MP1 standard, it is still not supported in the current version. The meaning is there is no way to change individual style properties of elements. So for example while you can determine the colors of regular text, links and other elements (with LWUIT styles) as a whole per component type (i.e. all text will be black, all links will be blue), there's no way yet to make one word blue and the other red. But this will be added as CSS will be introduced later on.

Embedded objects - While the OBJECT and PARAM tags are a part of XHTML-MP1, embedded objects are not supported, and there are currently no plans to support those (as they would require writing mechanisms that actually run these objects which is a whole different issue...)


Anyway, that's about it - hope you'll find this new piece of software helpful for your innovative mobile project, any comments and feedback will be appreciated so we can further develop this technology.