Archive for the ‘Mobile’ Category

BYOD is Not Just Mobile

I’m seeing more and more business units buying servers and services in the cloud in order to circumvent their internal IT. Obviously there is some additional risk here, but I think the main message is that traditional IT is not keeping up with the pace of change that the business wants.

This is an expansion of my thoughts on part of this article.

Posted on:
Posted in Cloud, Mobile | Comments Off on BYOD is Not Just Mobile

jQuery Mobile or Sencha Touch for Hybrid Development

I decided to try both jQuery Mobile + PhoneGap and Sencha Touch 2 to create a simple hybrid application to see how they stack up, and record my initial impressions for building a simple app. I assume a complex app would magnify these issues, although experience with each platform would also improve the experience at that point. I am evaluating the install experience, and the development experience. I wanted to know how easy I could create a simple app that displays a list and has a simple form to add items into the list. I didn’t use any back-end technologies for this, the app is self-contained.

I used a Mac for this experiment, and at this point I am sure it would be a different experience on a PC.

jQuery Mobile + PhoneGap

Install

The install of this is very easy. Download the .zip files, extract them to wherever you would like. I used Eclipse for my IDE. Following the tutorials on both the PhoneGap and jQuery Mobile sites was simple enough to get up and running.

Development

Since I am experienced at both web development and Android development, getting going was pretty easy. I simply imported the necessary files into my project. The tutorials and docs were fairly easy to follow, and I had my demo app running before lunch. Debugging is a bummer if you use the app on the emulator or a device. You are better of using a browser to develop with and debug on, and then deploying to the emulator or device for testing. The code/debug cycle with the browser is very quick and efficient. But you still have to go back to the emulator/device a fair amount which is pretty slow. I didn’t use PhoneGap for anything but being a container, so if you were integrating with any native plugins the browser for debugging might be out.

Given it’s roots, jQuery Mobile will integrate well with server-side frameworks like ASP.NET or JSPs. jQuery Mobile doesn’t have a broad set of controls or features. For instance I wanted a date picker, but I needed to go and search for one because the platform I was targeting didn’t support the HTML5 date input control. I ran into a similar issue with data binding. You will need plugins and other libraries. jQuery plugins are abundant, and it’s not easy to separate the good ones from the bad.

For me, one of the downsides of jQuery Mobile is the UI. It looks like an iPhone app. If I’m building a hybrid solution, I don’t want my Android or WP7 apps to look like iOS apps. There is a terrific ThemeRoller tool, but in the end it still looks like what it is. I’m sure if you delved into the CSS you could get it to look more styled. If you have a high design component to your app, it could be hard to get there.

Sencha Touch 2

Sencha Touch was initially a mobile-web solution, but with version 2 Sencha has introduced the ability to package the app for iOS and Android.

Install

The install experience for this was frustrating to say the least. You need to download the SDK and a SDK tools package. This was really not clear on the download page, and I didn’t figure this out until trying to use the tutorial. The tutorials want these items to be installed in very specific places, so if you have a “standard” way of setting up projects this isn’t going to work for you. Also, you need to install Compass, and that isn’t documented anywhere except in the video, so if you are not inclined to watch a video (like me), you’ll have issues. I’m an experienced developer, it shouldn’t be this hard to get something up and working. As with any framework, there are often more than one way to accomplish tasks, and this is no different in ST2. In general the code used in the tutorial didn’t match up well with the task paradigm in the documentation, so that was frustrating as well.

Development

Since Sencha Touch 2 (ST2) is purely text file development, I used my favorite web editor WebStorm. Any editor would work fine, so this is a bonus for not being tied to Eclipse. You have to do more with the command-line, and I’m sure there are folks who want the IDE experience and folks who want the text editor experience. The command-line tool creates a project structure with all the dependencies set (like Rails, Maven, etc.), so getting going was quick once I got the tool working.

Getting to know the framework for ST2 is certainly harder if you are not a JavaScript guru. Most of how ST2 works is for you to write JavaScript that renders into HMTL at run time. You see this when starting up the app/site, there is an ellipsis on a blue background that displays while the rendering is going on. This makes the code/debug cycle slow. And if you make a mistake, this screen never clears. You have to have a JavaScript dev tool running at the time to know what went wrong.

The paradigm for ST2 is very different, heavy on the JavaScript. If you are a traditional web developer, this will be a tough shift. ST2 does not lend itself to integration with server-side frameworks because you would need to be emitting tons of JavaScript instead of HTML. For ST2 you need to embrace generating you content via JavaScript and writing Ajax web services to get the data from the server. I actually like this paradigm, but it’s going to be tough going for the .Net crowd to adopt this paradigm. This paradigm fits well with native mobile development, because you have to develop the services for data. So now you aren’t completely locked in to the hybrid platform if you want to make a change later. I’ll try to explore writing more HTML with ST2 and less JavaScript and see if it can work more like traditional web development.

I tried to use the command-line tool to build the hybrid Android app, but could never get it to work. I’m certain it is a permissions problem (remember I’m using a Mac), and from here it would probably be a better solution to wrap the ST2 app in PhoneGap. The tool also only took one image for the app icon. I’m not sure how that would work out for the other device sizes on the Android platform. Packaging ST2 this way felt like maybe it was a rushed feature.

ST2 has tons of controls, lots of great functionality like data binding built right in. It’s a steep learning curve though. ST has been criticized in the past for feeling slow, version 2 is supposed to improve upon that. Still, everything is rendering in the browser layer on a memory and processor-constrained device. I predict user’s experiences with speed will vary.

Conclusion

I think neither one of these are a clear winner. jQuery Mobile will force you to spend time to find other solutions to features you need, while ST2 will force you to spend time with its steep learning curve. I think this only further rebukes the myth that mobile web or hybrid is somehow cheaper than building a native app. PhoneGap is clearly a necessity for either of these for a hybrid solution, so you will still need separate projects and hardware platforms to get the work done for a cross-platform app. And as soon as you start using images in your designs, the effort for the creative team will quickly equal the need for creative work in a native development environment. You will need to spend significant time with CSS media queries and Modernizr to deal with the slight differences you will encounter between platforms and browsers. If I was forced to choose today between these two solutions, I would choose ST2 + PhoneGap, simply for the sheer amount of functionality built into ST2, despite the steep learning curve. I don’t believe either of these is THE solution for hybrid or mobile web development. I’m still looking….

Cross-Domain Calls for a WCF Service

As I develop more services for mobile devices (and mobile web in particular), cross-domain calls are becoming more frequent. Essentially, a cross-domain call happens when a web page uses JavaScript to access resources at a different URL. This can be as complex as hosting services completely separate from the app in another web site, or in another subdomain or on another port, and also can happen simply because the web page is calling a service over SSL.

The problem occurs because the browser only trusts calls from the exact same domain, unless the server says that it trusts your domain (or all domains). This is by design.

So the resolution is to have the server tell the clients what domains it trusts for cross-site calls. Seems simple, but of course there is more to it than that.

When the browser detects a cross-domain call, it behaves differently if your service is configured correctly. If you were expecting your JavaScript code to perform a POST to a REST URL, that is no longer what happens, at least initially. Instead of performing the POST, the browser actually sends an OPTIONS verb call to your REST URL. This is called a preflight request. Your service needs to respond to the preflight request containing the OPTIONS verb and let the browser know which parameters are acceptable on a cross-site call. If everything matches up and your client is in an allowed domain, then the browser performs the original POST that you expected and everything continues on normally.

If your service is not configured correctly, the browser doesn’t cooperate and you don’t see anything at all. Again, this is by design.

Configuring The Service

From an HTTP point of view, what we need to do in code is add the following name/value headers to our HTTP responses:

  • Access-Control-Allow-Origin
  • Access-Control-Allow-Methods
  • Access-Control-Allow-Headers
  • Access-Control-Max-Age

The first, Access-Control-Allow-Origin, needs to be added to any request so the browser knows to use the OPTIONS verb for cross-site calls, which just error out otherwise with an XmlHttpReqeust Error 101 in JavaScript. The other three need to be added in response to the OPTIONS verb request. 

The Access-Control-Allow-Origin header can be added with one or more values. If you expect any client anywhere to call your services, like Google Maps does, you want to add * for the value, allowing all callers. Otherwise, the most secure way to use Access-Control-Allow-Origin is to set it for the specific domains you want to accept. Say your services are at https://service.yoursitehere.com, and your client site is http://www.yousitehere.com, you want to set the value to http://www.yoursitehere.com.

The code adds the Access-Control-Allow-Methods header to tell the browser which HTTP verbs your calls will accept as cross-domain.

By adding the Access-Control-Allow-Headers header, you control exactly which HTTP headers are allowed in the actual request which follows the preflight request.

The Access-Control-Max-Age header tells the browser how long to cache the preflight call result before doing it again during this browser session. I set this long to avoid multiple preflight requests.

In my case, I’m using configuration-less WCF services as described here. In my experience much of the pain with WCF in the past has been with the complex configurations, and this option circumvents that problem substantially.

The C# Code

So this is how it’s done programmatically, in Global.asax in my case:

 protected void Application_BeginRequest(object sender, EventArgs e)
 {
  HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin" , ”http://www.yoursitehere.com”);

 if (HttpContext.Current.Request.HttpMethod == "OPTIONS" )
 {
 //These headers are handling the "pre-flight" OPTIONS call sent by the browser
 HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods" , "GET, POST" );
 HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers" , "Content-Type, Accept" );
 
 
 HttpContext.Current.Response.AddHeader("Access-Control-Max-Age" "1728000" );
 HttpContext.Current.Response.End();
 }
 }
 

I put it Global.asax in order to avoid having each request handle multiple verbs and calling the handler in each service call. The downside to this is that any non-service request also gets the additional header and processing as well. For me, there are only service requests in this app so this is not a big deal.

The Client

I’ve regularly used jQuery to access services from client HTML code. It’s not complicated, the important parts are formatting the call to send JSON properly in response to our preflight request, which includes the dataType, contentType and data parameters to the $.ajax call.

 $.ajax({
 url: "https://www.yoursitehere.com/person/add",
 type: "POST" ,
 dataType: "json" ,
 contentType: "application/json" ,
 data: JSON.stringify(personObject),
 success: function (data) {
 //Process success here 
 },
 error: function (jqXHR, textStatus, errorThrown) {
 //process errors here 
 }
 });
 

Tools

If you are debugging REST services, you need some good tools. I have used Fiddler, the Chrome Developer Tools (the Network panel in particular) and the Chrome app Advanced REST Client Application successfully.

References

This post is the basis of the fix I’m describing

W3C description of how the HTTP process works

FireFox and CORS, also a lot of good info on HTTP headers

Hybrid QR Code/NFC Tag

My colleague Melissa Duckworth implemented a great idea: the hybrid QR Code/NFC tag. She superimposed a QR code on top of an NFC tag. Since NFC adoption is slow, you can still begin to take advantage of the rich possibilities of NFC while still supporting users with older devices.

hybridQRNFC

Posted on:
Posted in Mobile | Comments Off on Hybrid QR Code/NFC Tag

Ubiquitous Tech Predictions – Mobile Edition

Every year there are a bunch of articles this time of year predicting what will happen in 2012. So I’ll join the fray and reference a few with my own thoughts, mostly about mobility.

Mark W. Smith from the Detroit Free Press

  • BlackBerry users continue their exodus
    This is low-hanging fruit. I’ve been on this bandwagon for a while. I’ll amend his prediction to say RIM abandons the North American market for the third world, where they are currently making their money. They will focus on the BES in the North American marketplace. If they were smart they would focus on enterprise customers instead of consumers, but there is no evidence of good decision making at RIM. RIM should be bought by Google for the BES business alone in order to help Google get a foot hold in the enterprise back-end space. If not Google, the next most likely buyer is Microsoft, followed by Amazon.
  • Apple Releases the iPad3
    I think the iPad3 will be incremental, like the iPhone 4S, but will continue to dominate the consumer space. With no real competition at this point, there is little incentive for Apple to introduce innovative features that may be hit-or-miss. The real prediction in the tablet space will be Windows 8. Business are craving an enterprise-oriented tablet, and the inclusion of Microsoft Office will make Windows 8 tablets sell like crazy to business customers. Business users want Excel and PowerPoint on their tablets in meetings. The lack of Office on a Windows 8 tablet or late delivery will kill the platform.

Galen Gruman at InfoWorld

  • NFC gets real traction – but not for payments
    There are not enough phones with NFC support today.  Until NFC is common in phones, there is no incentive for businesses to adopt it on the other side. Users have two year contracts, and very few normal folks change phones during the contract time frame (unless you are an iPhone addict, and still no iPhones have NFC). So even if a bunch of phones get NFC in 2012, there will not be enough users to cause a change. Currently there is no widespread NFC infrastructure on the non-phone side because of that, so it will be 2013 before the common user gets NFC.
  • Make that two mobile shakeouts
    Mobile device management (MDM) will be huge in 2012. 2011 saw the proliferation of bring your own device to businesses. The enterprise will have to figure out how to do this securely, and I think MDM is the key. I agree this will cause buyouts and consolidation.
  • Google finally gets its Android act together
    I think Google side-steps the fragmentation by buying RIM/BES to get an MDM solution, and adapting it to hook into Android as a core feature that still allows the hardware makers to customize Android in crazy ways and still be secure for business. The good news for Google is that users largely blame the hardware maker and not the OS for issues with their phones. Google is selling to the hardware vendors, not the consumers directly, so they have a large incentive to please those vendors.

Buzz Out Loud from CNET

  • Amazon buys Netflix
    No way. Netflix is the biggest user of the Amazon cloud, and probably a huge source of revenue for that business, which is really important to Amazon’s future plans. Why buy your biggest customer? Unless Netflix is going to go out of business, there is no point for Amazon to acquire them, it will hurt their cloud business.
  • Video Conferencing on Phones
    Video conferencing has not caught on and still won’t in 2012. Why? No one really wants everyone to see you while on the phone for lots of reasons. PJs, bathrooms, hair, and many more.
  • Users lose confidence in Android, WP7 gains because of this
    Again, I don’t think users blame Android as the problem, but the hardware vendor, whose name is prominent on the front of the device. Look at bad reviews for apps in the MarketPlace. The disgruntled users often list their device. The fragmentation is squarely on the hardware vendors’ shoulders, and they will pay for bad implementations. There is no alternative OS for the hardware vendors. (Bada? MeeGo? Can I get Angry Birds on that?) Users are not smart enough to understand the problem and move to a platform consistent across hardware vendors like WP7. It would be great if Google would stand up to vendors and reduce the crapware and customization, although Microsoft never has for Windows and still dominates. Android is open-source after all, and fragmentation is one of the often discussed possible outcomes of an open source project.
Posted on:
Posted in Mobile, Reviews | Comments Off on Ubiquitous Tech Predictions – Mobile Edition

Living in a Mobile Bubble

I’ve been so entrenched in learning the mobile paradigms over the past few months, that I suddenly realized I’m living in a mobile bubble. I have come to the stark realization that most companies don’t get mobile. I don’t think it’s that hard or a long way to go, but I can see it’s not happening yet.

Lunch with my wife yesterday was a perfect example. It was a sub shop (that I love), and they had advertising cubes on the table. I picked one up, and was briefly excited to find a QR Code on the bottom. I immediately thought, “Wow, these guys are addressing mobile!”, until I actually scanned the code. The URL was a link straight to their home page. OK. I followed the link on my phone. The page opens and the main content is one single graphic, but at least the navigation and header are not. If you have a smart phone, you would know that you can’t scroll the page easily by swiping a big graphic, especially when the page/graphic is loading. So to scroll I had to carefully swipe the obligatory right “social media” box to scroll the page to find out there was nothing below the huge picture. The whole experience was disappointing to me. So lets enumerate the mistakes here:

  1. The QR Code
    1. It contained only the link to the home page. Huge opportunity lost. How are they tracking users coming from the code? They are not. No query string parameters, no redirection/click-through.
    2. No reward for scanning the code. Does this company use email promotions? Why yes they do. Did they give me some incentive to scan any of their QR codes again later? Nope.
  2. The web site
    1. The site is not mobile friendly, yet they made an effort to get me there on a mobile device.
    2. The navigation menus on the web site rely on hover. There is no hover in mobile.
    3. Big graphics load really slowly on mobile networks. Abandon the 1990’s, come to the present. One big picture might look good, but it’s not functional. If pretty pictures sell your food, why bother with mobile devices and QR codes?
    4. Of course the site isn’t formatted for mobile devices. It’s a fallacy to think that because it renders OK on the newer mobile browsers, that forcing the user to pinch-zoom to read anything is acceptable.

This brings me back to my bubble. I probably have unrealistic expectations of how companies are using or embracing mobile. The information on how to do this well is out there. Why aren’t companies finding it? Is it that the technical audience knows these things, but the marketing audience does not? Or is the mobile customer base really that small, and the companies just don’t care at this point? I think in this case they must care if they made the effort to put QR codes on their tables. So maybe I’m in a bubble, expecting these things because it’s what I’ve been immersed in for the past few months. Maybe normal mobile users don’t have that expectation. Maybe next year companies will get mobile.

Android AVD Problem

If you move your user profile off of your c:\ drive (in Windows 7 x64 in my case), Eclipse will no longer be able to start the Android emulator (AVD). It gives the following error message in the console:

PANIC: Could not open:  C:\Users\dave\.android/avd/myAVD.ini

This issue has been documented here, and also a few solutions. The solution that worked for me was to make a symbolic link on the command line to the directory that actually contains the AVD settings:

mklink /J "C:\Users\dave\.android" "D:\users\dave\.android"

Now when Eclipse asks for C:\Users\dave\.android it is redirected to D:\Users\dave\.android where this directory actually exists.

Posted on:
Posted in Mobile, Strange Problems | Comments Off on Android AVD Problem

BlackBerry Simulator Error with SQLite and HTML5

When testing an HTML5 app on multiple BlackBerry simulators, on some of them I was getting the error:

SECURITY_ERR: DOM Exception 18

What this turned out to be was the lack of an SD card in certain simulators. The browser was expecting to use that storage space for the SQLite DB files. Once I set up the SD card for the emulator the error disappeared.

Is RIM the Next Novell?

At one time, Novell was the king of the networking hill. Anyone interesting in becoming a network administrator had to know Novell. Then Microsoft came along and took their lunch money pitting the graphical and desktop friendly NT Networking against NetWare. Novell was seen as lacking vision and lagging behind their competitors. Sounds an awful lot like RIM today. Their last smartphone entries have been failures, and the upcoming PlayBook doesn’t look like an improvement in their track record. One of the strengths of the BlackBerry platform has been messaging, and they are releasing a product that doesn’t do that without being tethered to an existing BlackBerry device. The PlayBook is going to support Android apps instead of fostering their own third party developers because it’s another new platform that is coming out before there is a developer ecosystem. It feels rushed. RIM’s main customer is the enterprise, not the consumer. Enterprise executives want the sexiness of an iPhone or iPad with the security of a BlackBerry. RIM is not making that happen.

RIM has a definite hold on the enterprise market for mobile phones. This is in large part due to their tremendous security on the devices. The BES server is encrypting data transfers and improving network response time to the devices. Everything stored on the device is encrypted. Administrators can remotely wipe data from the devices. None of this is going to come from Apple. The enterprise is not their main customer, it’s the consumer. Google might be able to do this with Android, but more than likely it will come from the cloud. Google does not have the internal server market in hand.

Microsoft has built a huge empire in the enterprise with sever software and networking. They are the most likely competitor to take out RIM. Why haven’t they focused on extending their enterprise platform for mobile devices? If they came out with a secure phone that was integrated with their products (Exchange, Office, SharePoint, CRM) RIM would be out of the game. Microsoft has been blinded by the iPhone’s success (and now Android) in the consumer market.  Recently, they have seen consumer success with the XBox and Kinect. It seems to me they want Windows 7 phones to do the same thing. I really don’t think that is the market for them. RIM is trying to give the enterprise market to someone, why isn’t Microsoft taking it this time?

Posted on:
Posted in Mobile | Comments Off on Is RIM the Next Novell?