Posts Tagged 'Mobile App'

March 28, 2012

SoftLayer Mobile on WP7 - Live Tiles and Notifications

In the past couple of months we've added some really cool Windows Phone 7.1 (Mango) features to the Softlayer Mobile application, including Lives Tiles and Notifications. While a basic Live Tile implementation is relatively easy, there's a fair amount of coding and architecture requirements to facilitate cooler Live Tile functionality and Notifications ... And we're all about doing things cooler.

Live Tiles is a such great feature of Windows Phone 7 largely because it gives the developer much more control over the device's user experience when compared to other mobile OSes. Live Tile functionality in its simplest form can be just 'Pinning' the Tile to the Start Menu with a deep link to a specific location within the application so that when clicked the user is taken to that location within the app. This can save the user a lot of time in having to navigate deep into an app if they know where they want to go. More advanced features of Live Tiles include programmatically giving the Tile a custom background image and displaying a notification message on the background when the Tile flips.

Adding a Live Tile

To add a Live Tile, a user simply clicks and holds the module they'd like to pin to the start menu. When the context menu appears, the user can select 'pin as tile,' and he or she will be taken to the Start page where the new Tile is displayed:

SoftLayer on Windows Phone 7

The Magic Behind Sending Notifications

We really wanted to be able to notify a user when a notable event happens on his or her account (new ticket is created/updated, when a bill is overdue, etc.), and Windows Phone 7 provides some pretty phenomenal functionality in that area ... I wouldn't be surprised if other big mobile OSes copy Windows Phone 7's notifications in the future. When it comes to implementing notifications in SoftLayer Mobile, we needed to handle a few things:

  1. Get a Unique App+User Channel URI from Windows Push Notification Server
  2. Register URI & Channel Name with the Softlayer Registration Service (WCF we created)
  3. Store this URI, Channel Name and the user's Account in a DB
  4. Periodically poll for new tickets or updates (since we don't have a mechanism yet that can 'push' this alert when any notification event is triggered)
  5. Send Notification (whether it's a Toast or Tile notification) to device via the unique URI & Channel name.

I was going to include the architecture diagram here showing this relationship and process, but the designer sitting next to me told that nobody wants to see that.

What do the Numbers on the Tiles Mean?

We wanted to make our Tiles show information that the user would find useful, so we send the account's total unread ticket count to the main app's Tile, and we display the account's unread ticket update count on the "Ticket" Tile we pinned to the Start screen:

SoftLayer on Windows Phone 7

Why is the Tile Flipping?

We also have the ability to have the Tiles flip over and show an image or text on the TileBack, so we use that to explain the number shown on the Tile (so you don't have to remember):

SoftLayer on Windows Phone 7

What is a Toast Notification?

A Toast Notification is a message that pops up on the screen for 10 seconds. If the user clicks on it, he or she is taken to the application, but if the notification is not clicked, it will disappear. Here is the Toast Notification that is sent to a user when a ticket is updated if they subscribe to Toast Notifications:

SoftLayer on Windows Phone 7

How do I Enable Notifications in SoftLayer Mobile?

To enable Live Tiles, all you have to do is turn on the 'Use Push Notifications' option on the Settings view.

SoftLayer on Windows Phone 7

You'll be asked if you'd like to receive Toast Notifications, and if you click 'OK,' you'll start getting them:

SoftLayer on Windows Phone 7

We Love Feedback and Requests!

Now that you have Live Tiles & Notifications in Softlayer Mobile for WP7 (and coming soon for iPhone & Android), what else would you like to see in the mobile clients?

-Erik

November 29, 2011

SoftLayer Mobile v. 1.1 on Windows Phone: New Features

I was on a Caribbean cruise during the second week of November, and I kept telling myself that the first thing I needed to taste was a delicious mango. Even though I knew it's out of season, I still had hopes. I had a chance to indulge in that tropical fruit, and I couldn't help but think about a mango that gets tastier with every day: the new Windows Phone OS 7.1, codenamed "Mango."

I'm not going to talk about Mango or its new sensational features, but I do want to share a few of the changes that we pushed out to the Windows Phone Marketplace as a version 1.1 of SoftLayer Mobile. While I could ramble for pages about all of the updates and our strategy in building out and improving the mobile platform, but I'll try to be brief and only share four of the biggest new features the team included in this release.

Verisign Authentication
The first update you'll notice when you fire up SoftLayer Mobile 1.1 on Windows Phone is the security-rich inclusion of VeriSign authentication. You are able to activate an additional layer of security by requiring that users confirm their identity with a trusted third party tool before they get access to your account. In this case, the third party vendor is VeriSign. Every customer looking to bake in additional security on their account will appreciate this addition.

SoftLayer Mobile WP

VeriSign authentication in SoftLayer Mobile on WP7

Device-Based Bandwidth
The next big addition to this Windows Phone app release is the inclusion of device-based bandwidth for two billing cycles – your current cycle and the previous cycle. In v. 1.0 of SoftLayer Mobile, users were only able to see bandwidth data for the current billing cycle ... It's useful, but you don't have a frame of reference immediately available. This release provides that frame of reference. One of the coolest parts is the aesthetically pleasing presentation: our metro-style container, "pivot control." Just slide through and see your billing cycles in one long view!

SoftLayer Mobile WP

Billing cycle view along with a button to view graph for that cycle

Bandwidth Graphs
If you didn't notice from the picture, its caption or the heading of this section, the next big update is the inclusion of bandwidth graphs! The bandwidth graph page gives you a bird's eye view of your bandwidth activity for any selected billing cycle. You'll see the max "Inbound," "Outbound" and "Total" values. Those different marks are very useful if you're tracking which days your device uses the most bandwidth and when those surges subside. The application uses the built-in charting functionality that comes with Silverlight libraries. Since we're taking advantage of those goodies, you can bet it looks beautiful. No, it's not a bitmap image ... it's a real bandwidth chart. As with the other bandwidth update, the graphs are available for both the current and the previous billing cycle.

SoftLayer Mobile WP

Bandwidth chart for a previous billing cycle

Ticket Updates
The next addition to the family is a new way to visually distinguish your unread updates on tickets while viewing a ticket list page. The "toast" notification for the ticket list view gives flags unread ticket updates, and the ticket list will feature bold text on the ticket's subject if that ticket is marked with an "unread update" *ndash; meaning an employee or someone has an update to that ticket which you haven't seen yet. This is very much Outlook-y style and very native to Windows Phone.

SoftLayer Mobile WP

Toast notification along with Outlook-style unread ticket

What's Next?
With this release, we're not resting on our laurels, so what are we doing in our labs? Right now we're working on OS migration to move our existing app from OS 7.0 to the new Mango-flavored Windows Phone 7 version I mentioned a little earlier. Now you see why I was so fixated on mangoes while I was on vacation. The migrated mango app will only be available to devices that are mango-licious (Upgraded to 7.1).

Stay tuned, and you'll see some of the other new features we're working on very soon. If you have a Windows Phone, you need to download SoftLayer Mobile, rate it and give us your feedback!

-Imran

Subscribe to mobile-app