Tiggr interactive HTML prototypes upgrades to use jQuery Mobile version 1.0 Alpha 3.

DZone 's Guide to

Tiggr interactive HTML prototypes upgrades to use jQuery Mobile version 1.0 Alpha 3.

· Java Zone ·
Free Resource

The state of Mobile Web development today is probably what was traditional Web back in 1996. Many companies is racing to create mobile presence, be it in the form of a native applications or mobile Web applications. To set the native vs Web debate a side for now, there is a tool to help you prototype and test your mobile Web applications. You can even use the resulting HTML as a starting point for the application. The prototyping tool is Tiggr. With Tiggr, you can create, share and preview interactive Web and mobile HTML prototypes in a browser.

Not to reinvent the wheel, and build yet another set of mobile components, the components in Tiggr are based on jQuery Mobile components. Recently Tiggr was upgraded to use jQuery Mobile version 1, alpha 3 (starting with Tiggr version 1.2.6). This is screen shot of jQuery Mobile palette (divided into two images):

When you create a new project, to start creating a mobile prototype, just switch the Screen Type to Mobile:

What’s really cool is that once you created the prototype, you can view it and test it in a mobile browser (regular browser also works of course). The prototype is interactive, you can click on controls, open menus and navigate between pages. Here is one mobile prototype I created:


Get your smartphone and enter the above URL (or just email it to yourself). Try it, it’s a (fully) working mobile Web prototype. From here, you can share the URL with other people (make sure you set sharing option to all in Web Preview/Share).

When you open, it will look like this:

The blue border around the prototype is the mobile screen size which you can set when creating the prototype:

If you like, you can use this prototype as a starting point for the application. How to do that? You can export the prototype to HTML (with all JavaScript and CSS). From Projects view, select Options/Export to HTML bundle. You will be prompted to download a zip file containing the entire prototype.

Let us know what you think either at http://getsatisfaction.com/gotiggr or on Twitter @gotiggr.


Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}