Share and Enjoy !

Good afternoon folks, John Underwood here, coming to you on a sunny, beautiful day from just North of Atlanta in Alpharetta, Georgia. Hope you’re having a good day wherever you happen to be. I want to thank you for carving out some time to talk a little bit about mobile solutions for SharePoint. Looking through the attendee list, some of you have been to my webinars or classes before, and for those of you, I say thanks for coming back. For those of you that are new, just a little bit about me. My title is Technical Evangelist, I work for ThreeWill, my job really involves a lot of things from engineering chores to webinars, to video production, I also teach classes, that’s something I really like doing and feel a lot of passion about.

If you’d like to be able to contact me, either during the webinar or afterward, you can see that I’ve put my email address up there. I encourage you to record that and make a note of it. Also, if you’re somebody that likes to use Twitter, please follow me on Twitter. I put out a lot of things related to SharePoint. I’m actually in the midst of doing a how-to, quick start video series right now, so if you’re looking for some good techniques that you can apply to SharePoint 2013, again, I encourage you to follow me on Twitter and you’ll see some more information about that.

Just a couple of quick housekeeping matters here. I’m planning to keep our time, today, for about 45 minutes to an hour, just so you can plan your afternoon. Also, if we do have any outages during the event, if you want to scribble down my email you can send me an email directly and it will show up in my inbox on my phone here, and I’ll be able to know something is wrong. If we do have an outage, however rare that might be, we’ll do our best to get reconnected and continue with the event, so don’t give up on me if we have a short outage. Also, if you’re not familiar with GoTo Webinar, it has a facility for asking questions, so you can use that to post questions any time during the webinar. I probably won’t address those until the very end, but do make a note of that and then we’ll have a little Q and A time at the end where I’ll try to address those. I also welcome your questions after the event, feel free to use my email address for that purpose, if you so choose.

With the housekeeping matters out of the way, let’s talk about what we’re going to talk about today. The first thing I’m going to do is talk a little bit about mobile device proliferation. What is happening in the world of mobile devices? Then, from there, we’ll talk a little bit about BYOD. For some of you, this is an important thing that you’re already dealing with. For others of you, it’s an acronym that you don’t know yet, but you’re going to know it, you’re going to know it pretty soon, so you want to be ready for what it’s going to mean to you.

Then, from there, we’re going to try and bring the conversation around to SharePoint event. The idea here is that if we’re going to have to deal with mobile, and if we’re in an enterprise that’s using SharePoint, we’re going to have to figure out how those two fit together. We’ll talk about the two major usage patterns that you’re going to encounter when it comes to SharePoint. Then, from there, we’re going to focus in specifically on SharePoint 2010. A lot of you are still on 2010 and probably will be for some time to come, so we want to look at the unique challenges and opportunities we have when it comes to mobile enabling your applications for SharePoint 2010.

As you’ll see, this is something that’s become a bit of a specialty for us here at ThreeWill. I really want to try and show you how we can help you in that area. Then, from there, we’re going to talk about mobile support in SharePoint 2013. As you will see, the good news there is that Microsoft has really stepped up their game in terms of proving a lot of out of box support. Not only that, as developers and integrators, but we’re also going to see that there are some huge opportunities there as well. Really a very positive story going forward.

Now, I know there are plenty of jokes out there about statistics and their reliability, but in this example, I’m using a few statistics just to make a point. According to Pew Internet, 56% of Americans now own a smartphone or American adults. It’s funny, I can remember when smartphones first came out and I remember thinking, “Why do you need a camera? Why do you need all this stuff.” Obviously, my perspective was wrong because I have one now, I have an iPhone and I love. I don’t know how I would get along without it. I think the important part of that is that, as more and more adults that are either in our employee base or our customer base, acquire these devices, they get used to how that works and they want to begin to apply that to their life as an employee, or to their life as the customer of a company.

Another thing that kind of drives this forward, not just phones, but mobile devices in general. Statistics show, based on Cisco, that we’re going to have more mobile devices than people on the earth, by the end of this year. Obviously, that means we’ve got a lot of people with multiple devices. Again, count me in that. When I think about that, what I really think is, I want to be able to use my devices when I interact with companies or when I interact with my employer. If I’m sitting at Starbucks and I’m on my tablet and I’m reading an article and something urgent comes up that I have to respond to, I don’t want to put my tablet away and drag out my laptop, and open it and connect. I just want to be able to deal with it right there.

Another thing that’s kind of driving us forward in the mobile world is the relationship between the PC and the mobile device. As a developer, I’ve been writing PC or Windows apps, and then along with that, web apps, for a really, really long time. For that period, whenever I would engage a customer, or do something internally in my company, the perspective was always, “Okay, what are we going to do around the PCs?” What we see now is we’ve actually passed a point where mobile devices and their sales numbers are starting to surpass PC sales. If they’re accounting for half or more than half of the sales, then the frequency with which we’re going to have to deal with that as developers, is only going to get higher.

Now, as interesting as these stats are and how they point the way to the future, I think if we take a minute and look at BYOD, this is going to bring it even closer to home. For a lot of us that are in a corporate setting, we’ve encountered this already or we’re soon going to encounter it, bring your own device or BYOD. Again, the idea here is that it’s coming and you can’t really stop it. Your employees are used to doing things a certain way when they’re on their own and when they come to work, they don’t want to put away the convenience of their tablet or their phone and have to go back to always using a PC. As developers, this is a really important thing to us, as strategic business people, this is a really important thing to us.

All of us that have a role in this IT universe, have got to begin to prepare for this onslaught of devices. Again, not only the notion that our employees want to bring in their own stuff but taking it a step further, there are some business problems that we encounter, either internally or externally with our customers, that would be better served with some kind of mobile solution. Think about being in a retail setting. Are you better off having to go over to the cash register and log in to a PC in order to meet a customer’s needs? Or, are you better off having a tablet on your arm and being able to pull up their information right there?

It isn’t just, “Hey, this cool new device.” It’s integrating it into the way that we do business. Then, for those of you on the call that are developers or people that manage or lead developers, I think this is a really interesting stat, projecting that by 2015 the mobile app development projects are going to outnumber native PC projects by a pretty big ratio. Now, let’s say this number’s exaggerated and that it’s only 2 to 1, maybe even 1 to 1, even at that number, that means, potentially, 50% or more of what we’re doing as developers or IT people is going to slanted toward mobile.

I can think back to when I was a Windows developer and really loved doing that, and we kind of had the advent of the web. At the time, I remember thinking, “I don’t know if I really want to do this. Is this something I’m interested in?” Eventually, I figured out that was the future and I’ve got to embrace it, fully. I think we’re at that place, again, as IT people, developers, strategic decision-makers. Mobile is upon us and we’ve got to be ready to deliver that on behalf of our employees or our customers.

Given those kinds of forces, then, let’s see if we can turn this around and think about what it means in the SharePoint universe. A lot of companies have rightfully settled on SharePoint as the place where they build their business apps. There are a lot of compelling reasons to do that, I’ve even done some webinars that talk about the benefits of having this environment where it’s very easy and very quick to build your company apps, it’s maintainable, it’s easy to back up and restore. Then, let’s see if we can blend those two together. As a modern developer, or as a strategic decision-maker that has IT in your sphere of influence, you’re going to be doing some sort of mobile development for your enterprise, either facing internally or facing externally. Then, particularly on internal apps, we’ve already got SharePoint as a destination.

What we really don’t want to do, if we can avoid it, is have to build another silo of web application infrastructure and mobile application infrastructure, that’s parallel to or competes with, SharePoint. Rather, what we’d like to do is make those two worlds fit together. As we go through the rest of this webinar, that’s really the overarching theme that I’m going to be addressing in my time with you. How do we take SharePoint and extend it out into the mobile world? In some cases, we’re going to do this because Microsoft just made some really good product choices. In other cases, we’re going to do it because we’re going to have to write some custom code ourselves in order to make that extension. That’s something that not only stats back up but our own experience here at ThreeWill. More and more of our customers are coming to us, and not only are they saying, “We want you to build us a compelling app on top of SharePoint, but we want to make sure and extend it out to our mobile users as well.”

Then, given that we’ve got this intersection of SharePoint and the mobile universe, let’s talk a little bit about the way those 2 universes collide. There are really 2 ways that one might think about SharePoint in the context of a mobile user. The first of those, I’ve entitled browsing SharePoint from a device. Here is really the use case, “Oh my gosh, I need that document right now.” I can think of a circumstance where this literally happened to me about 2 or 4 months ago. I was away from the office, I was doing some volunteer work for an organization here in Atlanta, I’m out in the middle of a parking lot, I’m sweating, I’m working, and all of a sudden I get this urgent call from a coworker that they needed some piece of data that I had access to, and it was on our SharePoint site.

At that moment, I had to take out whatever device I had in hand and try to get to that site and try to share that information for that user. When you think about this, this is really more of a general case, where someone is just trying to engage SharePoint directly. Now, how is it that they’re going to be able to do this? In SharePoint 2010, it ships with some basic, mobile capabilities, kind of very dumbed down, bland, generic HTML. While it’s not much to look at, it does at least function at some level, and it lets a person get in the front door, and perhaps locate the data that they’re looking for. I’m happy to say that that story is greatly improved in SharePoint 2013. The user experience is far more compelling when we have to do this kind of ad hoc browsing, where I just need to find something and I need to find it quickly from the device that I’m currently on.

For those of you that are still using SharePoint 2010, what are other options do you have for this general-purpose solution? You probably don’t want to try to write something yourself. Trying to write a general-purpose app that would let you browse and interact with all part of SharePoint is really quite a gargantuan job, but there are some third-party apps out there that can help you with this. There are several to choose from. One, in particular, a company that we’ve actually done some partnering with is Rover Apps.

There’s really 2 parts to their solution, there is a gateway that makes a commodity interface into SharePoint and provides the necessary security and authentication, and then, various mobile clients that are actually written to the native device. That’s a theme that I’m going to mention a lot as we go through our time together. There was a time in the past when your mobile users would have just been thankful if they had had access. Now we’ve gotten to the point where there’s this expectation that not only are they going to have access, but it’s going to have a rich look and feel, and whenever possible, a native look and feel to the device they’re working on. That’s one of the cool things that Rover Apps actually provides.

Moving forward, I will talk a little bit more about this general case and I’m going to do a demo for you, but as we dig deeper into the webinar, we’ll be looking at the other use case that we have for mobile users. That will really be the focus of our conversation. With that, let me do a quick demonstration for you and just show you a bit about the mobile experience as it exists in 2010. Now, a couple of little disclaimers here as I begin to work through this, first of all, I’m running all of what you’re going to see today via a series of VM’s. I’m going to encourage you not to draw too many conclusions about the performance of these various applications. In the proper environment, they’ll all perform really, really well, it’s just that I’m doing it from a VM.

Also note that when it comes to demonstrating the mobile stuff, I’m using an emulator and an emulator is a nice starting point, but it’s never a substitute for a real device. In fact, I’ll take that a step further, when you start doing mobile development, it is absolutely a requirement that you have hardware for every single device that you’re going to certify and support. Running it through the emulator and saying, “Oh, well we’re good on that.” Is simply not going to be sufficient. That’s part of the cost that you’ve got to count when you go into this process.

I’m going to start by visiting a very simple team site, link thousands of team sites that you may have built before. You can see this one’s got some tasks associated with it, it’s got some documents, and Sure Point 2010 does a really good job of serving up this content. Notice that I can click on a particular document and it’ll open it in OWA. If you’re not familiar with that acronym, basically these are web applications for Microsoft Office, office web applications. You can see here, just using a browser, I can interact with the document, I can edit it, so give credit there for SharePoint 2010, that’s a pretty rich experience.

Now, let’s see if we can contrast this a little bit with what we would experience with the out of the box mobile capabilities that come with SharePoint 2010. What I’m going to do is toggle over to my emulator, and before I go very far on that let me go ahead and copy the password that I’m going to need here. For those of you that are security-aware, yes, I know you might be able to see my passwords, so I promise I’ll change them after the event is over. What I’ll do now is, obviously I’m running an iOS emulator, I’ll go ahead and bring up my Safari browser, and then, I’ve set up a favorites shortcut to the very same site that I navigated to just a moment ago.¬† Then, in this case, it did happen to cache my credentials because I was visiting it earlier.

Now, the good news is that I can get to a fair amount of data here. The bad news is that this going to fall way below your user’s expectations when it comes to look and feel. This looks more like a website circa 1995, very, very plain. Also, notice that I have some pretty limited functionality. As an example, if I go to all site content and try to navigate to my tasks, I’m going to see my tasks and I’m going to be able to look at them, but I’m going to have pretty limited experience in what I’m able to do.

Now, one other perspective on this, when we start talking about this mobile access that we have from devices, you’re going to see that on SharePoint 2010, it kind of takes a 1 size fits all approach. That’s something else, that as we work through this content, we’re going to have to address this notion that there is a different expectation as to what you would get on a phone versus what you’d get on a tablet. If you just create a mobile interface and you try to use it for both of those, 1 or both of those audiences is going to be a little bit disappointed that they didn’t get something closer to a native look and feel.

All right, that kind of lays the baseline for what we can expect in terms of mobile support for SharePoint 2010. What I’d like to do now is address the second way that your users would interact with SharePoint, and that’s really where we’ll get into the meat of how you can extend mobile capabilities to your SharePoint 2010 users. We said the first use case was this idea that you’ve got a user, they’re in an emergency, and they just need to browse SharePoint and find something. You can see the capabilities there are functional but basic. Now, the second way that your users are going to want to interact with SharePoint is via the SharePoint applications that you, or someone else, may have authored.

Microsoft has done a really good job over the past few years of bringing the story to bear that we SharePoint to build our internal apps, whether it’s soliciting user input, whether it’s dealing with customer service issues. Any kind of app where we have to track, and store, and return data, SharePoint is just a natural fit for that. There’s a really good story there in terms of the apps being easy to build, easy to prototype, easy for IT to manage. That’s the reason that SharePoint has done as well as it has. However, when we go down the path of building those applications, what we see is that a lot of times, we don’t really have any thought upfront about providing a mobile user interface for those users.

Without the deliberate plan on our part, we’re going to find ourselves missing out on an opportunity. Really, the first part of this is, going forward, when you being to build SharePoint apps, either on your own or with some partner or organization, you need to be thinking and talking about mobile support from the start. Again, particularly if you’re dealing with users that are going to be in some other physical location, like a doctor’s office, or a retail store, anything where it might be to their advantage to have a tablet on their arm. Another thing you got to think about, sooner or later you may find yourself in a circumstance, organizationally or individually, where you have to retrofit this into an existing SharePoint application. In fact, that’s the very thing that I’m going to be demonstrating for you in just a few minutes.

You’ll see I’ve got a case study of one of our customers where they had an app finished and then decided that they needed to extend mobile support. You don’t have to be terribly experienced as a developer or an IT pro to know that the first option, where you deliberately plan for it, is a better option than a retrofit. Having said that, I think that the app that I’m going to show you does definitively prove that it can be done and that at ThreeWill we’ve got the expertise and the experience to do that. Now, going forward, if you’ve got to extend mobile capabilities for SharePoint 2010, you’ve got a far more challenging job, and you’re going to see that in the demo that I show you. SharePoint 2013, not only has better out of the box capabilities but a lot more options that are going to useful to developers. When we get to the third part of the webinar and I talk about 2013, I’ll dig in on that in just a little bit more detail.

All right, so given our 2 scenarios there, the random browsing of the site looking for data, or the deliberate extension of an app to mobile users, let’s focus now on what it would take to extend mobile applications to our SharePoint 2010 clients or users. Some of the challenges that we’re going to face, first of all, is just history. Think about where we were when SharePoint 2010 was being developed in 2008 and 2009. We did begin to have some mobile device proliferation, but certainly, we were not nearly as far along as we are now. While we may look at Microsoft HTML offering for interfacing with SharePoint and say, “Wow, that’s really weak.” The truth is, what we had at the time, it wasn’t that bad and it was a viable alternative. It’s not really knocking SharePoint as much as it’s just saying the world has changed, your users have changed, and their expectations of the kind of experience they’re going to have from a mobile device has changed. That puts pressure on us to come up with a more compelling solution.

Another thing that’s changed over time, HTML 5 and J-Query. These things either didn’t exist at all in the SharePoint 2010 world, or they were in their infancy. Whereas now, they’ve really become the cornerstones of mobile development. Even though there are people who write native mobile apps and there’s a compelling story for that, in a lot of cases, if we’re trying to stitch in an existing app and make it mobile-enabled, this is our path of least resistance for doing that. On the one hand, you have these very cool tools and the skill sets to go with them to it happen, on the other hand, as you see here, SharePoint 2010 doesn’t really, officially acknowledge these.

There’s going to be a certain amount of elegant duct tape that is required in order for you to use these modern tools against the SharePoint environment. In fact, when we get to the end of our webinar today, I’m going to refer you to some specific articles written by several people here at ThreeWill, that talk a little bit about these issues of how to take these leading-edge tools and blend them in to SharePoint 2010. Again, when we get to 2013, no problem. There’s native support for all of these things. Until we get to that world, we’re going to have to figure out how to employ these new dynamic web technologies in our SharePoint development stack.

Another thing that’s going to be a challenge for us, when we think about the way that SharePoint 2010 supports mobile clients, it tends to take one size, or one page fits all mentality. You’re either a mobile device or you’re not. If you’re detected as being a mobile device, then you get redirected to the mobile master page and that’s that. Think about the differences between a fairly modest smartphone and a really large tablet. Making those 2 use the same UI is really not fair to one or both of those parties, but given the infrastructure as it exists today, that’s kind of the way it works. What that’s going to mean to you as a developer is that you’re probably going to have to intervene in that process, you’re going to have to use some combination of master pages and page layouts and other things that include some logic that let you figure out what kind of device are we dealing with and then, what kind of UI can we provide to that device. In fact, we’re going to see an example of that in just a few moments.

Now, the case study at hand, I’ve hinted at this just a little bit, but let’s dig a little bit deeper. We’ve got a client that we wrote a custom SharePoint 2010 application for, it’s an app that allows users to give input about suggested improvements. Most companies have something like this where their employees can give suggestions and feedback in hopes of increasing profitability, reducing red tape, or things like that. Now, deep into that process, the customer decided that they have a legitimate need to extend this to mobile clients, in some cases their users were actually people that were going to be in a retail setting and it was a bit laborious for them to constantly have to go over to their PC. It was much easier for them to be able to do this from a tablet, or from a phone.

The problem though is that there just simply wasn’t the funding to blow it up and start over, we needed to be able to reuse as much of the existing application and its forms as possible. One of the big requirements that we had, and this directly addresses the problem I mentioned on the previous slide, we had to be able to detect the size of the client, and make some intelligent choices about how we present the data to the client. If it’s a mobile phone, we’re going to go with a very minimalistic view. If it’s a tablet, we’re going to go with something that’s either very close to or identical, to what we would see on a PC. All right, with that set up, let me take a moment now and go in and show you this application, both from the perspective of a PC browser and then from a perspective of a mobile client.

I’m going to switch back over to my environment here. Then, let me close out a couple of tabs here just so we can focus on what’s important. Let me refresh the page here, just to make sure that I haven’t timed out. What you see here is the top level of our site. Obviously, I’ve done some simplifications here so that it’s not company-specific. The idea here is that a user could show up, they could make new submissions, they could check on the submissions that they’ve already made and see the status of those, and really it’s all about just managing information and networking around this idea of process improvement. You can also see that we have some search capabilities.

I have to do a quick aside here because I think this is really important. This is SharePoint, even though it doesn’t look anything like SharePoint. That’s something that we commonly do as a partner with companies, as well. I can’t tell you how many times we’ll begin an engagement where the first thing out of the customer’s mouth is, “We want to use SharePoint because it’s the corporate IT standard, but we don’t want to look like SharePoint.” That’s a theme that you’re going to see regardless of whether you’re dealing with PC clients or with mobile clients. In our case, we had already done the work to customize the work and feel for a PC, we just built upon that to customize the look and feel for a non-PC client.

Let me just take you through this real quickly. I’m going to go in and create a new submission. I have to provide a form number, so I’ll give my phone number there. Then, who I report to in the organization. This particular company also had different initiatives that we might do, for this one I’m just going to stick with not applicable. Then, we’ll talk a little bit about maybe what I want to suggest. I want to suggest some billing statement improvements. Notice another clever little thing that our engineers did here, as we type in the title, it’s actually using the SharePoint search API to look and see if there are any existing items that are similar, and if so, it will pop them up for us. In this case, we don’t have any so we’ll just go with what we’ve got here. Then, obviously, this is going to have something to do with our accounting department, in terms of how we bill our customers.

Now, I’m not going to get really caught up on the options down here. These are all just driven from various lists that we have in the SharePoint site. Obviously, this is related to billing and billing questions, so you get the idea here. Then, some kind of relative score on how important this thing is and then a description, “Having better, bigger fonts on our bills will help us out.” Then, the benefit here, obviously, we want to have happier customers. Again, don’t get too caught up on the demo nature of my input. The bigger picture here is just that we’ve provided our users with a pretty compelling application.

Now, if I want to save the draft, I can do so. That gives me time to review, talk to other people, have people collaborate on this. Then, at some point, I can submit it. Then it goes through a process using the publishing infrastructure and some workflows that allow us to actually promote these to the right people within the company. Then, you can see, if I look at my submissions, I can see that there are several in here that I have submitted over time. Now, let’s talk a little bit, and demonstrate, how this would be for our mobile users.

Think about different scenarios. We want to support multiple devices, we also have to be cognizant of the fact that those devices have different capabilities, and we also want to be cognizant of the fact that some devices are more prone to data input, whereas other devices are more prone to just be used for review purposes. What I’m going to do now is go over to my emulator once again, and I have a shortcut set up that will take me into this very same application. I’m going to click on the link for that and then it may or may not prompt me for credentials, in this case, it did not.

Now, you can see that we have some of the same kinds of headings that we had available to us inside of our actual web page. In fact, you can see the main web page in the background. Obviously, the form factor is quite different. Then, I have similar options here. If I want to go in an look at one of my submissions, I can see my list of submissions there. Notice that if I click on one of those, it actually brings it up in an editable view. Now, if we were going to blow this thing up and write it from scratch, we would’ve gone for the most native look and feel possible, but in this case, because we were having to reuse as much as we possibly could, we tried to strike a good balance between making it work and not having to reinvent every wheel.

You can see the approach we chose here, is that we actually made it so that different sections of the form could be expanded and collapsed. Then, we just used the concept of a next and a previous metaphor to be able to move through those various sections. Then, obviously, this is an iPhone emulator, on a real device, we could click on the screen and drag up and down and do the various things that we needed to do. All in all, not a bad approach for being able to give our users a legitimate way to use this thing in an environment that otherwise, might not have been all that friendly. Now, the other thing we want to see in this app is, not only do we have a rich experience here in terms of using it from a phone but then what happens when we begin to use it from a tablet.

What I’m going to do here is, switch my emulator so that it’s now emulating an iPad. Then, I’ll just go ahead and rotate it to the left so that we have a little better view of the world. Then, I’ll go back into Safari and then, I’ll go back to that very same site. This time it’s going to make me log in, so that’s fine, I have that information available here. Then, let me see if I can paste in my credentials, I’m pretty sure I still have those on the clipboard. Then, notice what you get here. We’ve been able to detect that we’re now coming in on a device that has a much bigger screen with a better resolution, so what you see here is something that’s virtually identical to what you would have experienced on a PC. From there, we’ve got the same kind of options, we can create a new submission, we can browse our existing submissions, and so on.

Let’s talk a little bit, now, about what it was that we had to do in order to get to this point and to be able to provide these different capabilities. The first thing that you’re going to have to do when you’re trying to extend mobile capabilities to your existing SharePoint 2010 applications, is that you’re going to have to take control of the redirection process. As I mentioned earlier, we have the concept of mobile master pages inside of SharePoint 2010, but they tend to be an all or nothing thing, where if you come in with a device that’s not recognized as a PC, it’s just going to send you to the mobile page and that’s that. There were a couple of things that we had to do in order to take control of that process.

First of all, for those of you that are on the call that are experienced ASP.net developers, you’re familiar with the concept of browser caps in your web.config file. For those of you who aren’t, really what that is about is allowing you to control how the environment is going to behave in the face of certain kinds of browsers or devices. For this example, what we did is take out the logic that ASP.net would automatically have to redirect you based on the kind of device that you are, and instead, replaced it with a home page that had our own redirection logic. Essentially, what we’re doing is sniffing out the kind of browser and the device that it’s running on based on the request that was made, and then redirecting that particular client to the correct place in order for them to get the best possible experience.

Now, how do you deal with devices, and more particularly, how do you deal with the peculiarity of those devices? Well, several things that have come in to play here that you’ll want to use. First of all, if you’re not familiar with this meta-tag named view port, you need to read up on that one, it’s going to be very, very important. This is the infrastructure we use to deal with the fact that different devices have different sizes. In fact, it is the combination of Javascript and this meta-tag that lets us deal with certain pixel height, certain pixel width, and make sure that whatever output we’re producing is going to be appropriate for a particular kind of device.

Another thing in dealing with devices, even if you don’t go through the process of doing a lot of different master pages, at some point you are going to have to have page layouts, particular pages, and style sheets that target certain sized applications. That’s a big part of what we did on this application. We were actually able to go in and categorize things in such a way that phones get a certain set of capabilities from their style sheets and pages, and tablets get another set of capabilities. The third part of that is something that I kind of hinted at earlier. When a mobile browser or, for that matter, when any browser makes a request of a web application, it always passes in something called the user agent string. We can use this in combination with browser caps to make some determination about the capabilities of a particular device.

As an example, if we can detect that it’s Safari and it’s coming from an iPhone, we know certain things then. If we can detect that it’s Chrome and it’s coming from an android phone, or Internet Explorer coming from a Windows phone, any one of those things will let us make some intelligent guesses about what we need to do. Now, I have to emphasize my use of the phrase intelligent guesses. Anybody that’s ever done web programming knows that there’s always some wrinkles here. That’s why I will repeat what I said earlier, it’s super important for you to make sure that you’re ultimately testing this on real hardware so that you know the exact behaviors that you’re going to get.

Some other lessons that we learned, we always want to be cognizant of performance when we’re writing web apps, but when we talk about mobile apps, that is particularly true. In some cases, we may have a person on a phone that needs a critical piece of data and they’ve only got a couple of bars of coverage. Not only that, but there’s also this notion that they’re probably on a data plan where they have some kind of cap. One of the biggest ways that we can address those issues, is to make sure that we’re minifying all of the CSS and all of the Javascript that we’re sending down to the client. Not only minifying those but whenever possible, even combining them into a single file. If you know how a browser works, you know that for every separate thing it has to download, in effect it has to spawn another thread and open another connection. Keeping all of that to a minimum is not only going to please your users because they’re going to have a fast experience, it’s also going to please them because you’re not going to kill them on their data plan.

Some other things, whether you are a lover or a hater of Apple products, you just need to be prepared for the fact that A, you’re probably going to have to support Apple because they have a lot of devices out there, and B, they’re going to be using the Safari browser and it has its quirks. I will say that, even though I like Apple products, I almost exclusively use other browsers just because of that. But, if you truly have to support that, these are solvable problems, you just have to roll up your sleeves and dive into them. Among the things you’ll want to watch out for when you’re doing execute query async, which is a cornerstone to doing Ajax calls, Safari just seems to fail sometimes. Really the best way to address that is just to put yourself on a loop where you retry for a fixed number of times, more often than not, on one of your retries the call will go through and you’ll be able to complete the task.

Another Safari issue that is, in fact, a known defect that Apple has acknowledged is the fact that Safari will incorrectly cache the data that’s in an HTTP post. For those of you that know about the difference between post and get, the whole idea on post was to defend against repudiation or a replay attack. Well, unfortunately, Safari will cache that post, send it with a new timestamp, and to the server, it looks like a new payload of data when in fact it an existing one. There are various band-aids that we can put on that solution. Mainly we just need to be aware that it exists and make sure that our application has a defense mechanism where we look for that duplicate data and we don’t wind up adding it twice.

You can see a lot of the compromises that we had to make on this app had to do with the fact that we were shoehorning it into an existing app. If you’re pursuing a separate solution, what you want to have are dedicated pages that just have the bare minimum SharePoint on them. Then, instead, you’re using the best of breed tools for browser programming, J-Query and KnockOut, and all the other things that will let you bring a really rich user interface and also let you intelligently adapt to the different devices that you may encounter. Hopefully, your carry from that is just, A, if you need some help doing it, ThreeWill has the expertise to get you there, and then, B, if you decide to go it on your own, there’s some resources and some ideas that you’ll want to look at and just be aware of as you move forward.

All right, now we’re going to go to the third and final part of our webinar. That is just talking a little bit about the capabilities of SharePoint 2013. One of the first things that you’ll see right out of the gate, is that Microsoft has done a sensational job of making SharePoint 2013 a more compelling option for mobile devices. The first of those is just being able to browse. Remember we talked about our 2 usage scenarios where you’ve got a user that’s desperate to find a piece of information that’s already on a SharePoint site. Well, you’ll see in the demonstration that I’m about to do that SharePoint 2013 has a really, really compelling solution now for those kinds of devices.

Another thing that we’re going to see here, is I mentioned Office web applications earlier and the fact that I could use that from a PC based browser. SharePoint 2013 brings us higher-level support of those within various devices. Even in some cases, being able to modify content from a handheld device. That’s a pretty big step forward. Now, instead of seeing some kind of questionable text rendering of the document, you’re actually going to see that document in it’s full fidelity.

Beyond that, from a more technical point of view, probably the biggest new capability in the SharePoint universe is this thing called a device channel. You’ll remember the challenge we faced in 2010 where it shows the one size fits all approach with the mobile master. Now, what we can do is actually declare and implement our own device channels, where we set up different master pages, layouts, and style sheets, either for a particular device or groups or categories of devices. If we specifically needed to target an Android tablet, an android phone, an iPhone, a Windows phone, all of those different kinds of things, we can set up exactly what we need in order to target those and give the richest experience possible. Give Microsoft a round of applause there, that is a really big step forward that will allow us, as either SharePoint configuration people or outright developers, to give our users what it is that they really, really want.

Some other things to be aware of, we now have push notification capabilities. If you’re familiar with the concept in SharePoint of doing alerts on a list, where you get an email that notifies when you something changes on a list, you can just think about this as being mobile enable alerts, much like your cell phone knows how to receive an alert when you’ve received a new email on a server. It just gives us an even more interactive way where we can proactively notify people and let them know about what’s happening on our SharePoint server. Another new capability that we have is geo-location, or location-aware. Imagine you’re writing a mobile app on SharePoint 2013 and you have employees that are going to go out to job sites and as a part of their job there, they have to inspect some things and make a record of it. It would be really nice and really convenient for us to be able to record the longitude and latitude of where that job site is so that we could automatically record that.

All right, so let me give you a quick look now at what the world is going to look like in the SharePoint 2013 world from a mobile device. I’ve got another environment here up and running. You can see, I have a SharePoint site here that I’ve built in SharePoint 2013. Again, very typical site in that we’ve got some documents and we’ve got other things. Notice that on the side I’ve got a document here and if I navigate and have a look at that site, it will actually open it inside of Word automatically and let me interact with it. If I come in from an environment where I have another browser, it’ll even let me render that document inside the browser. A pretty compelling way to be able to interact with things there.

Now, having shown that, let’s see what that same kind of site would look like from the mobile world. I’m going to switch back to my emulator once again, and I’m going to put it back in iPhone mode. Then, once it comes up, I’ll bring up Safari. Then, I’ll go ahead and navigate to this SharePoint 2013 site. It’s going to ask me for my credentials here, so I’ll go ahead and enter those. I know that as I type that in, you may be able to read that password, but again, this is a closed environment so I’m not going to worry too much about that.

Now, right off the bat, wow, what a difference. Much more interesting looking, much more compelling. Not only that, a much greater level of functionality. Notice that I’m confronted with the same document, if I click on it it’s actually going to render it with full fidelity right there in the browser and let me look at all of the details of that. That is pretty cool. Not only that, when we begin to look at other things, such as interacting with tasks, I can click on the my tasks link and actually add a task here, and that is a viable thing to do. Again, doing this in the old environment just really wasn’t a practical thing. Let’s give the task a name here, showing the webinar right now and then, once I’m done with it, I can actually scroll down to the bottom here and save my work.

Now, granted, you don’t want to be in a mode where you’re doing a ton of data entry things from a handheld device. But, just the fact that you have this level of functionality from your phone, lets you jot a quick and dirty in to your tasks list and then give you the opportunity to deal with it when you get back to the office and connected. Another thing I want to point out to you here, if we navigate back a little bit, notice that we also have the ability to access all of the content on this site. For those of you that are familiar with apps and how they work, we can actually interact with those apps from this location, run them, do whatever we want to do with them. On its own, that is a pretty compelling vision of what’s possible.

Now, let’s take it one step further. I’m going to close that browser window and once again I’m going to switch myself to an iPad, and then rotate it so we have a nice, landscape view. Then, go back and visit that exact same site. You can see here, it’s prompting me for credentials again. Then, I’ll put in my password and log in. You can see the effect that the device channels actually have here. Where, because we’re on a tablet and because we have a much larger view of the world, it’s actually going to give us a page that’s much closer to what we would experience in a PC browser. Then, obviously, these are out of the box device channels, whether you’re writing an app or just trying to configure a site to give the best look possible for your users, it’s your opportunity to go in and actually create those device channels and configure them the way that you would like.

All right, so we’re in the home stretch here. We’re getting near the top of the hour. I’ve got just a few more points to hit with you and then we’ll try to do a little bit of Q and A time at the end. Then, those of you that have been to some of my previous webinars, you may know a lot about the new SharePoint 2013 app architecture. For those of you that do not, let me spend just a few seconds talking about that. The way that we write applications, and the way that they deploy, and the way that they run, is radically different in SharePoint 2013 when compared with its predecessors.

Now, that’s important for a couple of reasons. If you’re a SharePoint developer, number 1, you’re going to have to learn how to do that. For our conversation here, the second and perhaps most important part of this, is that these new applications are built upon the very same technologies that you might use in the mobile world. In particular, heavy use of Java Script and J-Query and HTML 5. If you’re truly trying to build a SharePoint based app, where it will look good in a browser on a PC, or a browser on a phone, or a browser on a tablet, you have the tools at your disposal to do that right now. Really, the only challenge for you as a developer, or for an IT administrator, is just, you people have got to get up to speed on your J-Query and HTML 5. Once you’ve got those under control, then you’ve got a pretty compelling story on how you can build these apps.

Another thing that’s an innovation here, that I think opens up even more possibility for mobile clients, and that is the commitment that Microsoft has been made to exposing all of their SharePoint functionality via REST in-points. If you’re a developer and you’re familiar with REST, what you know from this is that REST just gives you a simple way to make API calls from virtually any platform. If you are truly in a scenario where you absolutely have to have native look and feel and functionality, you can write natively to android or iOS, or Windows phone 7, and then be able to make calls, in the background, where you retrieve data from SharePoint, or push data in to SharePoint.

Again, I have a lot of experience over the years of working on apps where we try to do portability versus targeting a particular environment. I think it just depends on your user constituency as to whether you would build an HTML 5 based app that would look good on all browsers, or whether you would try to target native applications for certain mobile OS’s. The good news for you, as a consumer of these services from Microsoft, is that you have an open opportunity to do either or both. It really is just a very, very exciting opportunity, going forward, in building these kinds of applications.

As we get ready to wrap up here, what are our takeaways from what we’ve covered today? We probably knew this going in, but it’s certainly true here, that it’s always easier to engineer a particular solution from the start, as opposed to trying to bolt it on or retrofit it. Having said that, I hope you’ve also learned today that it is possible to take an existing SharePoint app and make the necessary tweaks and changes to it, so that it can be extended to a mobile platform. Another takeaway going forward, obviously, if you’re still on SharePoint 2010 and you’re going to be there for some period of time, it’s just going to be harder to extend those applications to your mobile users, but it certainly is possible. It’s going to be important for you to employ your Java Script and J-Query and HTML skills, and not only that, but to be able to intelligently integrate these technologies with a SharePoint 2010 environment that doesn’t necessarily acknowledge or understand those.

Then, at whatever point you’re fortunate enough to move up to SharePoint 2013, the out of box experience is head and shoulders above what we had before. In fact, in some cases, may be all you need in order to meet the needs of your users or customers. Then, as we begin building SharePoint 2013 apps, really the sky’s the limit between the fact that we have great support for J-Query and HTML 5, and the fact that we have a full fledged API that can be called from any platform that supports REST, which is virtually all of them, you just got a really compelling story there on being able to extend these apps to your various constituencies.

Now, as you think about going forward with mobile in your enterprise, just a couple of things to think about from the perspective of ThreeWill. I mentioned earlier, and I’ll bring it up here again, that the showcase app, or the case study that I showed you today, a lot of that was inspired by and based upon something that we did for an actual customer. One of engineers, Guy Lee, actually wrote up a very nice blog post on this talking about what we did and summarizing some lessons learned. You can go to the ThreeWill.com site and navigate to this easily enough, it’s just lesson learned about bringing a SharePoint app to mobile. A very good read and I encourage you, he’s able to get in to a little greater detail there from a technical perspective than we could do in a webinar. It’s a really compelling read.

Another thing you might want to check out, this is a blog post that I actually wrote early last year, just talking about how to add J-Query to SharePoint. Again, there’s no one proper way to do that. There’s just lots of recipes. This particular articles looks at 3 of those recipes and talks about the relative merits of each. If you are going to try to take a 2010 SharePoint app and extend it to the mobile world, you’re almost certainly going to have to employ J-Query to do that. This might help you get on your way.

Then, even though it is somewhat unrelated to SharePoint, it is important to mention that ThreeWill has actually created a new product called Popcorn, that is heavily invested in the mobile world. Really why that’s important is that we’re able to take the lessons that we learn there, and the expertise that we develop there, and bring that to our SharePoint mobile offerings as well. If you haven’t looked at Popcorn, I encourage you to take a look at it, it may be an application that would help you in your daily work, and it certainly will help you see some of the kinds of things that ThreeWill is able to do when it comes to this mobile universe.

Share and Enjoy !

Related Content: