Total Followers 132,503
The mobile market is getting bigger and bigger. A lot of people are spending much more time mobile browsing than desktop. Sometimes I feel like developers aren’t paying proper attention to mobile interfaces. Maybe because we don’t have enough tools to do it, right? No, actually it isn’t.
Despite cool things like Safari Mobile that makes any (non-flash) website “browsable” it’s easy to see that conversion rates are much higher on interfaces design for mobile viewing.
So be ready to see A LOT of tools to help you create cool things for mobile with just what we know (HTML, CSS, JS).
Many of us know how to do things with HTML and JS. Sometimes seriously cool stuff using HTML5 effects and some of the newer coding options. Now you’ll see a lot of tools to help you to bring all your knowledge to create mobile interfaces easily.
If you like drag & drop, this one is for you. Actually you don’t need to know a single line of code to build your android apps with this great software. I’ve tried it myself and it works great despite a final app sizes being a little large.
One of the most well-known frameworks. Helps a lot when you know a little JS and HTML5 and want to create powerful apps.
EmbedJS is a JavaScript framework for embedded devices (mobile phones, TVs, etc.). It takes a different approach than other frameworks by shipping just the code needed for each device. That means, there’s less code going over the wire, less code branching at runtime and less memory usage.
Gury (pronounced “jury”) is a JavaScript library designed to aid in the creation of HTML5/Canvas applications by providing an easy-to-use chain based interface.
For those who knows basic Objective-C, this one is a really useful collection of frameworks to help you in your projects. Really useful!
iWebKit is a file package designed to help you create your own iPhone, iPod Touch and iPad compatible website or webapp.
Web UI Framework for mobile devices – iOS, Android, Palm, and others.
Framework for mobile development with a lot of cool features, like native-like widgets, multiple ways to code, and heavy use of CSS3.
How could I forget this one? Well, this is our well known jQuery with a lot of mobile-optimized features. With its recent 1.0 launch it will be a default script for many sites (just like jQuery “normal” is now).
At first it may look like just another plugin for responsive layouts. Well, it’s actually almost a UI framework with a lot of cool features that will save you a lot of development hours. :)
Kendo has a lot of cool features for responsive UI. It does a lot of amazing things, like responsive charts being one of the most impressive performances you’ll find.
Do you like games? Yeah, you, me and Lime.js do. Build games faster than ever with this HTML5 game framework.
Feel like learning a new language? Mobl is a new programming language for mobile devices. Sounds cool, huh?
NEXT is a free, open source Java and HTML5 framework for building Native Looking web applications for smartphones and tablets.
NimbleKit is the fastest way to create applications for iOS. You don’t need to know Objective-C or the iOS SDK. All you need is to know how to write an HTML page with JavaScript code.
Using the free open source framework or PhoneGap build you can get access to native APIs.
You’ve probably heard about this one, Sencha Touch allows you to develop mobile web apps that look and feel native on iPhone, Android, and BlackBerry touch devices.
It’s a really good framework, with great documentation, built to allow you to develop easily cross-platform mobile apps.
Titanium is different because after your development process it generates a compiled app for iOS or android, so you can get a higher performance with native apps without learning a line of Objective-C or Java.
More than just a boilerplate, it has a lot of built-in functions to do all the heavy lifting, so you can focus on getting your app out there. Touchy goes beyond just an HTML/CSS template, adding performance optimization tools, hardware accelerated animation, device API, fixed positioning and much more so you can really rock the mobile web.
WebApp.Net is a light weight, powerful JavaScript framework taking advantage of AJAX technology. It provides a full set of ready to use components to help you develop, quickly and easily, advanced mobile web applications.
Wink Toolkit is a lightweight JavaScript toolkit, designed and developed to meet the specific constraints of the mobile environment. The toolkit’s core offers all the basic functionalities a mobile developer would need from touch event handling to DOM manipulation objects or CSS transforms utilities.
Zepto.js is a minimalist JavaScript framework for mobile WebKit browsers, with a jQuery-compatible syntax.
Here we have everything from validators to image gallery plugins.
The ‘tiny screen first’ boilerplate extension. It prevents mobile devices from downloading desktop assets by using a tiny screen’s stylesheet as its starting point.
jQuery-mobile-960 is a port of 960 grid to jQuery mobile. It merges the flexibility of 960.gs, and the ease of jQuery mobile.
It’s not ready to use…yet. But you should bookmark this one. It’ll help us create animations for desktop, Android, Blackberry QNX, iOS and WebOS mobile devices.
Responsive carousel script. Check it out!
Galleria is a cool image gallery script that works nice from desktop to mobile.
HTML 5 Boilerplate has a set of cool features for mobile interfaces with a lot of guidelines to get the most from your mobile app.
Since it uses the HTML5 Boilerplate it has the same cool features.
It allows you to use crazy grids that would be just impossible with CSS floats. Plus, with a touch of creativity, you can do cool things, like this Scroll Wall with jQuery Mobile and Masonry.
A complete guide of mobile emulators and tools to help you test your apps.
Not Just a Grid is a flexible and modular CSS framework that is designed to assist in the rapid prototyping and development of websites. It has been designed for the future with larger screen sizes and the use of CSS3 for progressive enhancement and richer user experiences.
The mobiReady testing tool evaluates mobile-readiness using industry best practices & standards.
Treesaver is a JavaScript framework for creating magazine-style layouts using standards-compliant HTML and CSS.
It’s from W3C. No more description needed, right?
Wijmo is a complete kit of over 30 UI widgets with everything from interactive menus to rich charts.
WPtouch: A simple, powerful and elegant mobile theme for your website. WPtouch automatically transforms your WordPress blog into an iPhone application.
A long and very well written guide with all the basics you need to know before getting started with this mobile development thing.
Good guide with a comparison of what you’re used to doing for desktop development and what you should be doing for mobile interfaces.
jQuery mobile is a great tool, indeed. But you need to know how to use it. This really helpful guide will help you get started with jQuery mobile!
I didn’t mention skeleton because this guide will help you understand it better. You can use these principles in all other mobile boilerplates out there.
Check it with your mobile device and be as amazed as I was at first. Pretty cool :)
Get The Only Freelancer crash course you will ever need to read!
I'm a web designer and entrepreneur from Itajubá (MG), Brasil. I love writing about obscure topics and doing some cool stuff. And also I do some FREE stuff, check it out: http://www.roch.com.br/
Wednesday, December 7th, 2011 00:10
One way to run mobile apps and sites through these tests is to use a service that offers Remote User Testing for mobile sites and mobile apps.
Friday, December 2nd, 2011 05:30
I try to exploring phonegap now, look nice and promising
Friday, December 2nd, 2011 14:29
Hi aditia,
thanks for sharing your experience. I’ve bookmarked your link ;)
thanks again
[]‘s
Thursday, December 1st, 2011 16:21
Thanks a lot Rochester for compiling the list. Very useful post for me. Will implement much of this into my own business.
Friday, December 2nd, 2011 14:27
Hey Web Design Watford,
I’m glad to hear that, that’s why I do this sutff :)
[]‘s
Thursday, December 1st, 2011 07:18
Great Post!
Thank you for sharing the resource with us.
Thursday, December 1st, 2011 15:53
Hi Dezudas,
If you liked, help us sharing it ;)
thanks!
[]‘s
Rochester
Wednesday, November 30th, 2011 12:05
Wow! loaded with mobile web tools and information. Thanks for sharing this.
Thursday, December 1st, 2011 15:52
Hey alex,
I’m glad you liked! Hope to see you again soon.
[]‘s
Wednesday, November 30th, 2011 08:45
Really nice collection Rochester
i preffer PhoneGap
Wednesday, November 30th, 2011 13:20
Hi webdesignergeeks,
I just love all of them. PhoneGap is really usefull indeed!
[]‘s
Rochester
Wednesday, November 30th, 2011 07:47
Great guide! I learnt more from this post thanks a lot :)
Wednesday, November 30th, 2011 13:21
Hi Avinash,
I’m glad to hear that. Tip: We’ll have much more on this soon, keep coming :)
[]‘s
Rochester
Wednesday, November 30th, 2011 13:19
Hey hebbe, I’m glad you liked!
thanks :)
[]‘s
Rochester
Get The Only Freelancer crash course you will ever need!
If not, then it's time to learn how to:
You can trust 1stWebDesigner to help you become a better web designer!
- Jacob Cass | Just Creative
Just enter your name and email below and click Get Updates!
hebbe
Wednesday, November 30th, 2011 08:54
love this post , thank you share
Rochester Oliveira
Wednesday, November 30th, 2011 13:19
Hey hebbe, I’m glad you liked!
thanks :)
[]‘s
Rochester
Ajay
Wednesday, November 30th, 2011 08:45
Really nice collection Rochester
i preffer PhoneGap
Rochester Oliveira
Wednesday, November 30th, 2011 13:20
Hi webdesignergeeks,
I just love all of them. PhoneGap is really usefull indeed!
[]‘s
Rochester
Alex
Wednesday, November 30th, 2011 12:05
Wow! loaded with mobile web tools and information. Thanks for sharing this.
Rochester Oliveira
Thursday, December 1st, 2011 15:52
Hey alex,
I’m glad you liked! Hope to see you again soon.
[]‘s
Avinash
Wednesday, November 30th, 2011 07:47
Great guide! I learnt more from this post thanks a lot :)
Rochester Oliveira
Wednesday, November 30th, 2011 13:21
Hi Avinash,
I’m glad to hear that. Tip: We’ll have much more on this soon, keep coming :)
[]‘s
Rochester
Dan
Thursday, December 1st, 2011 07:18
Great Post!
Thank you for sharing the resource with us.
Rochester Oliveira
Thursday, December 1st, 2011 15:53
Hi Dezudas,
If you liked, help us sharing it ;)
thanks!
[]‘s
Rochester
Jim
Wednesday, December 7th, 2011 00:10
One way to run mobile apps and sites through these tests is to use a service that offers Remote User Testing for mobile sites and mobile apps.
Rochester Oliveira
Monday, January 2nd, 2012 19:15
Nice one, Jim, Thanks!
Aiden
Thursday, December 1st, 2011 16:21
Thanks a lot Rochester for compiling the list. Very useful post for me. Will implement much of this into my own business.
Rochester Oliveira
Friday, December 2nd, 2011 14:27
Hey Web Design Watford,
I’m glad to hear that, that’s why I do this sutff :)
[]‘s
aditia
Friday, December 2nd, 2011 05:30
I try to exploring phonegap now, look nice and promising
Rochester Oliveira
Friday, December 2nd, 2011 14:29
Hi aditia,
thanks for sharing your experience. I’ve bookmarked your link ;)
thanks again
[]‘s