What Businesses Need to Consider Before Choosing Between Native Mobile Apps and Responsive Websites

Do we build a native mobile app or make our website responsive?1. Will a native mobile app be sufficient to capture the mobile audience and a regular website to capture the web audience?2. And between these Responsive web and mobile apps, will we be able to cover most of the audience span, or will we end up losing some sub sect?3. Will deciding on either one of the technologies i.e responsive website or mobile app, deny our users the opportunity to utilize the features provided by the other?These are some questions business owners are asking, before beginning the process of making their web presence mobile friendly. These questions are essential, as they have direct bearings over the cost of mobile app development, and the success of the app / website. Developing only mobile app or only responsive website might lead to missing out on a part of audience, while developing both a mobile app and a responsive website might prove to be costly. Although, a lot of App development companies seem to think that the latter option is the best one, since it effectively covers all portals through which audience will reach out to a business.However, what works for one business might not for another. Hence businesses have to make their choice factoring in all of their goals and priorities. Here are some questions that the businesses need to ask themselves before starting to develop a native app or a responsive website.What are the different type of users that will be using your services?What are the goals with which the users will hit your mobile app or website?What will be their mindset, situation and environmental condition when they hit your app or website?The answers to these questions would reveal the kind of experience businesses would need to provide to their users, and based on these revelations, a decision can be made on the choice of mobile cum web interaction that the businesses must adopt.

                                             ......READ MORE

Read more »

Six Secrets to Building a Great UI

The User Interface is the face of a website, and the first impression a user makes of it might make or mar the prospect of the user's engagement with the website. Still, one comes across websites that are so  messy and filled with features, that they prove to be a big turn off for the user. A shoddy UI will fail to attract the user, regardless of how many advanced features it has.  While playing around with features and technologies might be an exciting proposition from the programming point of view, developers must always have the 80-20 rule in their mind. The rule states that 80% of the users use only a few apps on the interface, while only 20% might use all of them (Apple Inc.). Hence, while the 20% need not necessarily be ignored, a UI must primarily be built with the 80% in mind.

Here are six best practices that teams building UIs can keep in mind while creating an elegant and user-friendly interface -

Progressive Disclosure Technique

Instead of bombarding the user with all apps and information you can provide, hide most of them and provide only the most important ones. This will help novice users navigate the page easily and yet allow experienced uses utilize the advanced features provided.

Arranging Menus as per Hierarchy

Menus that display commands to handle high level objects are often placed first, followed by menus for specific objects. For example, in a Word document, the menu list starts with 'File' that has commands for the entire file, and then follow menus for editing, viewing, inserting, formatting etc. Such ordering makes the job of user easy and is also easily remembered.

Use Tooltips

In an effort to make a website slick, the developer could end up creating elements that the user is not familiar with. Leaving instructions in texts strewn all across the page will only make it messy. The best way to familiarize the user with the elements on a page without compromising on the aesthetics is by using tooltips. Tips that occur in a bubble when the user moves the cursor over the element and then disappear when the cursor moves away are a great way to make the user on the go. In case of mobile applications, the user could work with two taps – the first for the tip and then second for the action.

Avoid Taxing User Memory

No user likes to remember more details than he or she really has to. Asking the user to enter the same data on multiple pages would not only irk the user but also is the sign of a non-optimal development. A UI should not put too much stress on the user's cognitive process. That is to say, the user should not have to do more work that he really has to. So if the user is entering his customer id or personal information on one page, the UI should be able to carry the data over to the subsequent pages instead of asking the user to re-enter them.

Be Minimalistic with Modals

The same goes for Modals. Using too many modal popups is akin to screaming at the user to demand his attention. Modals tend to constantly take control out of the user's hand and force the user to look at them whether or not they like to. Using as less modal popups are possible helps give the user a smooth experience in the website. When they must be used, the modals should be easily dismiss-able, either with a 'X' or 'Close' on the top right corner, or with the press of Esc. Making the modals vanish when the cursor moves out of them is also a great way to retain user's control.

Multiple Execution Methods
When blogging in Wordpress, a user can go to the 'Posts' tab, click on a post, bring up a page with the entire post and edit it, or open it in a quick edit mode and do the necessary editing without bringing up a whole page. Sometimes when the user only wants to change the category of the post and not the entire content, he should no have to waste time in loading up all the elements associated with the page. Thus providing multiple paths for execution helps the user to navigate through the website with ease.

Resources:

http://uxmovement.com/thinking/6-tips-to-help-you-build-a-great-web-application/

https://developer.apple.com/library/mac/documentation/userexperience/conceptual/applehiguidelines/UEGuidelines/UEGuidelines.html

Read more »

Single Page Applications

With web pages becoming more fluid and offering rich interaction with the users, writing codes for such flexible pages presents a complex challenge to developers. That is because the more the elements on a page and more the states of interaction, the complex the code, and laborious its loading on the server side. Loading such huge chunks of code on the server and sending it back and forth according to user action greatly increases the loading time of the page and brings down performance, thus striking a blow to the very intent of creating a fluid experience for the user.
The Single Page Applications approach has emerged as the solution for this challenge. Simply put, SPA is an approach for building web applications that fit on a single page and yet provide a rich experience to the user. While traditional approaches for building web applications entail that a trip needs to be made to the server for every action, i.e. Opening a menu, selecting an item on the menu, etc. The SPA approach allows for an ability to redraw any part of the UI according to the user action, without requiring a round trip to the server. The resultant advantage is easy to discern – simple code, lesser load times, lighters and manageable applications.
While the approach might seem to sophisticated and mind boggling at first glance, a closer scrutiny will reveal that this is nothing but stringing together all the best practices of programming and application development. Writing maintainable code by utilizing standard mechanisms to their maximum potential is the primary USP of an SPA. Single Page Applications score over the traditional approaches on three fronts -
Architecture
While traditional architectures give more emphasis to DOM, in SPA DOM is only restricted to a write only mode, output-ing HTML and operations on elements. No data or states are stored in DOM. Instead a set of in-memory models are used to represent all the intermediate states and can be easily pulled up according to the user action. As a result managing the back and forth loading of states and data becomes much more manageable. Reducing the dependence on DOM also increases cross-browser compatibility.
Asset Packaging
Asset packaging helps in making an application modular, which in turns helps in faster loading and increased performance. Needless to say, assets that are correctly packaged are easily manageable and testable compared to random pieces of codes.
Run Time State
The SPA approach provides greater visibility into the run-time state of an application, since the distance from a HTML event to your event handler is shorter. There is also reduced level of detailing associated with the URL, so that the URL supports one primary activity and the rest of the secondary activities are reset to default on page load. This helps in increased support of bookmarks.
There are quite a number of frameworks prevalent today that support the SPA approach. Prominent among them are -

• Backbone.js
• Agility.js
• Stapes.js
• Epitome
• Kendo.UI

Lean Approach
In a nutshell, Single Page Application is a amalgamation of all the good things about coding web applications, and a way to make website more user-friendly and awesome, while still keeping the coder's life easy. This approach is but the outcome of numerous iterations of solving the same problem, and choosing the single golden way from the process. The approach is still in its nascent stages of catching on, but with the number of developers adopting it, SPA is definitely the way to the future.
Resources:

• http://en.wikipedia.org/wiki/Single-page_application
• http://singlepageappbook.com/goal.html
• http://www.infoq.com/research/top-javascript-mvc-frameworks

Read more »

Responsive Web Design – Challenges and Scope for Future

The year 2013 has been dubbed as 'The Year of Responsive Web'. The technology, though still in its nascent form, has taken the world by storm, and is catalyzing a major change change in the way people access information, even as we speak. With the numbers of hand held devices being sold increasing every year (Tablet sales are expected to exceed 100 million this year – Mashable.com), website owners are keener than ever to have websites that will provide a good user experience across all platforms. While the technology might still seem formidable to some due to the fact that it is new and still evolving, it certainly is the way forward for those looking to stay on top.

As the name suggests, Responsive Web Design is the design approach for building websites where-in the code would recognize the device accessing the website and scale the components according to it. For example, the contents and images that are used to load a website on the desktop would get scaled down when the website is viewed from a smart phone. The major advantages of RWD are:

Same code base to load on all platforms.

This makes development simpler and changes easier to incorporate, for otherwise, writing separate codes for each platform would make the code base humongous and difficult to maintain

Better SEO Benefits

When you load the same website with the same URL linking to the same HTML, with only the CSS changing for each device, you derive better SEO results. The same URL will show up on Google searches on all platforms. If there were more than one URLs for different platforms, it might confuse and irk the users since they might end up clicking on the URL meant for a smart phone, on a desktop device. In fact, even Google, the mother of all search engines recommends RWD for websites for a better Google ranking.

However, the one-size-fits-all solution is not always perfect and not without limitations. Some of the major challenges that developers and users alike face with RWD are -

Performance and Speed

Since mobile internet is almost always not as fast as a wired connection, the website loading times on hand held devices might continue to be lower. This is also accentuated by the fact that the a large amount of code still needs to be sent to the device before the application can recognize it and use the code required for that device alone. These factors can greatly bring down the loading speed and thus not give as good a user experience and RWD is supposed to give.

Complexity

Embracing RWD as an approach can be quite a complex process if not handled with diligent planning and some creative designing. Web developers and business owners need to be very clear about what they want the users to see on their websites, when viewed through a desktop or a tablet or a smart phone. Some features that look great on desktop might not work on other devices, and the design should be carried out in such a way that the website looks and feels great on every platform. All this can greatly increase the complexity of creating a responsive website.

The Future

While RWD has entered with a bang and made a comfortable place for itself amongst the most happening technologies of the day, for it to grow further, efforts need to be made to make it more easy and light. One step in that direction is the emergence of RESS, which is defined as a “responsive website with server side detection.” In simple words, with this technique, detection and recognition of the device making a call to the website is transferred to the server side, instead of the client side. The server finds out whether it is a tablet or a PC requesting the website, and send only the code pertaining to that platform to the client. Therefore, the code traveling to the device is largely reduced, and so is the time spent by the device in loading it. And so, better performance and more simplicity!

Resources
http://www.bluetrainmobile.com/blog/the-next-generation-of-responsive-web-design-ress/#.UpQ06NTtmGU
http://inspiredm.com/creating-the-future-of-mobile-responsive-web-design/ http://www.technologybell.com/what-is-role-of-responsive-web-design-in-mobile-seo-strategy/ http://mashable.com/2012/12/11/responsive-web-design/

Read more »

Cross-platform mobile development tools

Developing applications that are functional across multiple operating systems and devices is perhaps the biggest challenge faced by mobile app developers. The reason being, each of these multiple platforms, like Apple's iOS, Google's Android, Symbian, Windows Mobile, RIM and a number of other players, come with their own set of features and capabilities and behavior. While companies cannot afford to lose the audience across other platforms by choosing to build on just one or two, developing and re-developing of applications for each of these platforms imposes severe strains on the their budget and resources. The ideal solution would be a one-time development process for all platforms, so that the time and cost for creation of an app are reduced and the benefits are results are maximized.
Cross-platform mobile development tools
Tools that enable mobile app development across platforms provide an excellent alternative to separate app development for each OS. These tools are said to realize time and cost savings of up to 30%, according to a report by research2guidance. For the first time in the five years these tools have been in existence, their significance is being acknowledged and more and more companies are shifting towards using these tools in their development processes.
Cross-platform Tools Available Today
Xamarin Studio

Xamarin Studio provides a cross-platform IDE for iOS, Android and Mac. It is modern, sophisticated, with a rich editor and advanced debugging and integration features, that make it a preferred candidate with many mobile app developers. What differentiates it from other players in the CPT space is that Xamarin offers development through a single language, C#, which can work across all the major mobile platforms – iOS, Android and Windows Mobile.
Icenium
Telerik's Icenium is an IDE where you can use your HTML5, CSS and JavaScript skills to develop applications for iOS and Android platforms. An Icenium subscription gives you access to three IDEs – Windows client, web client and Visual Studio Extension, so that you can build and deploy apps from wherever you want, whenever you want. This is possible due to the use of Apache Cordova Network, which gives you the convenience of a local coding environment along with cloud based services.
RhoMobile
With Rhodes, an open source Ruby based framework, RhoMobile enables a single development platform for multiple OSes, like Windows, Android, RIM, iOS and Symbian. And then there is also RhoHub, a hosted development environment and RhoSync, a standalone server that looks after data synchronization with the users' devices.
Titanium
Appcelerator's cross-platform development environment, Titanium is perhaps the most favored cross-platform tool among the developers today. Another open source tool, Titanium allows you to develop applications for mobile, tablet and desktop devices using the traditional web development languages such as JavaScript, Python, PHP, Ruby and HTML. A salient feature of Titanium is that it can provide customizable metrics for actions and events, thus making it ideal for monitoring the usage / popularity of the app, or conducting polls and surveys.
MoSync
This FOSS cross-platform application development SDK incorporates common programming standards by tightly integrating compilers, run time libraries, device profiles and many more. It has an Eclipse based IDE for C/C++ programming, and promises support soon for JavaScript, Python and other languages. The mobile OSes supported are – Android, Symbian, Windows Mobile and Moblin (Linux based). Support for IOS and RIM are coming soon enough, in the upcoming versions.
Resources:
http://www.research2guidance.com/cross-platform-tool-benchmarking-2013/
http://mashable.com/2010/08/11/cross-platform-mobile-development-tools/
http://docs.xamarin.com/guides/cross-platform/getting_started/introducing_xamarin_studio/ http://www.icenium.com/

Read more »

Making a Smooth Segue from SharePoint 2010 to 2013

SharePoint 2013 comes with some slick features and amazing capabilities no doubt, but an upgrade from a previous version of SharePoint to a new one is always fraught with risks. Upgrading from SharePoint 2010 to 2013 is no different in this regard. The upgrade has to be carried out with a lot of planning and monitoring, so that one does not face errors or lose out on some functionality due to compatibility issues, or customization differences.

Why Upgrading to SharePoint 2013 is Worthwhile?

SharePoint 2013 comes with some cutting edge tools and developments that make a user's SharePoint experience all the more enriching and productive. Some of its great features are -

·         Design Manager – A whole new array of web-based tools to design your pages, templates and styles.

·         Device Channels – This provides a way for SharePoint developers to design and define pages for various devices – androids, windows phones, iPhones or surface.

·         Cross Platform Portability – 2013 comes with a lot of cool features like HTML5, CSS3 etc., which make the availability of application across devices and browsers a cakewalk.

·         Community Portal – A site for SharePoint developers and users to come together and connect, within the organization.

Challenges Encountered in Upgrade from 2010 to 2013

The sea change in design between SharePoint 2010 and 2013 means that a lot of things that worked in 2010 will no longer work in 2013. That is to say, they would need to be rebuilt to work the same way they did previously or adopted to work in a new and better way in the newer version. Some of the major challenges you might encounter are -

Branding

When upgrading from SharePoint 2010 to 2013, you are bound to lose all your customized branding. That is because 2013 uses HTML5, which is built to work on all platforms, browsers and devices. Since 2010 does not allow such a flexibility, the customization done in 2010 will not be compatible to 2013 and one would need to rebuild the whole branding experience from scratch. The facts that Web parts no longer uses tables, and XSLT has been replaced by Design Templates also mean that the look and feel of content in SharePoint 2013 will be so different from that in SharePoint 2010. Hence branding would need to be made afresh to suit the features present in 2013.

Search

The changes in Search functionality in SharePoint 2013 from 2010 are perhaps the most significant in the new version. For one, Search Scopes does not exist anymore. Which is to say, the scopes you created in 2010 will be brought over to 2013 on successful migration, but you will not be able to create new scopes. Instead, 2013 now offers a feature called Result Sources which stores the previous search results you have accessed so that you do not have to search for them all over again. Since SharePoint 2013 used FAST search in combination with the upgraded Enterprise Search 2010, architectural changes will be necessary both at Search Site level and configuration level.

Authentication

SharePoint 2013 uses Claims mode authentication as a default, as opposed to 2010 which has classic mode. Hence if you had been running 2010 on classic mode, without having upgraded to claims, then you would be left with no choice but to upgrade since classic mode will not work any longer.

To Do or Not To Do

That might sound a bit like Hamlet, but that is a question that an organization needs to ponder over seriously before embarking on an upgrade. If for instance, it runs on a heavily customized 2010 version, it might be wiser to leave it as it is since the rework required in migration might actually belie any benefits it might accrue. However, on the other hand, if the 'cool' features of the 2013 version are sure to bring immense positive benefits to the organization, the effort might actually be justified by the end result. Organizations need to weigh all their options before deciding upon an upgrade.

Read more »

New Year Celebration

Wow what a start at Paragyte, LLC for 2013!!  Gift exchange followed by yummy snacks party!! 

Read more »