Nowadays cell phones have becoming so important in our daily life, and they are our main tool for communication with people ‘on the go’; Internet is another important thing in our daily life, so when these 2 technologies meet together this results in ‘mobile web browsing’. So this is the reason why it’s really important that websites have a mobile version of its standard websites, this topic has been exposed by Anders in a previous blog entry. He has also discussed some technologies to meet the requirement of having a mobile version of a website; within those technologies he mentioned The Sencha Touch Framework.
The Sencha Touch Framework
Sencha Touch allows developing mobile web apps that look and feel native on iPhone, Android, and BlackBerry touch devices, which are the leader smartphone brands in the global smartphone marketshare and they have a good growing tendency according to Garner Research.
Worldwide Mobile Communications Device Open OS Sales to End Users by OS (Thousands of Units)
Garner Research, April 2011
Therefore, Sencha Touch has developed such framework to avoid the programmers to develop apps for all mobile Operating Systems, because with Sencha Touch one can develop a single website optimized for any of those mobile OS.
This framework is also optimized to recognize the touch events of modern touch screen cellphones, such as tap, double tap, swipe, tap and hold, pinch, and rotate; it’s so important to take advantage of these features because users are familiar with the apps’ look and feel and behavior, therefore they will be more comfortable with a design and navigation of the same style, this is an important part of Usability.
Sencha Touch gives specific functionalities and interface to make such usable 'mobile web apps', I had the opportunity to do some research on Sencha those last weeks to explore the capabilities of this framework and I have to say that it has a well worked structure, uses the Object Oriented Paradigm, has a detailed API documentation, it also has a free training course and also has a support community behind it. What I explored were the possibilities to have a Sencha Touch front-end over a standard Joomla! CMS installation as back-end, here is the link of the prototype, and here is the link for the standard Joomla! Site.
What I did until now is to recognize all the main menus of the frontpage and display its submenus in a native way as any mobile app menu using Sencha, then it shows the content directly retrieved from the DB.
What is important at the moment of displaying all the content is to use the appropriate Sencha Touch Component to get the best user experience, in this web app I explored and used the NestedList for menus, and Panel, TabPanel, Carousel Panel for contents and finally Docked Items to show the Icon bar at the bottom of the webapp.
Standard Joomla! menu: Notice that there is a single main menu in this installation.
Sencha Touch version: Notice the six items representing the six ‘submenus’ of the single Joomla! Menu.
A further goal in the near future is to do a more standard Sencha Touch front-end layer to fit automatically over any Joomla! standard installation. Summing up then I can say that Sencha Touch is a well-structured framework when it comes to create mobile websites that look and feel like native mobile apps, decreasing the difficulty of its content's navigation, and giving a more comfortable user experience. Developing a Sencha Touch website also allows saving valuable developing time to customers as well as to programmers.
