Category Archives: HTML5

IBM MobileFirst & Remote Client Side Logging in Mobile Apps

One of the many popular feature of IBM MobileFirst SDK is the ability to capture client-side logs from mobile devices out in the wild in a central location (on the server).  That means you can capture information from devices *after* you have deployed your app into production.  If you are trying to track down or recreate bugs, this can be incredibly helpful. Let’s say that users on iOS 7.0, specifically on iPhone 4 models are having an issue.  You can capture device logs at this level of granularity (or at a much broader scope, if you choose).

The logging classes in the MobileFirst Platform Foundation are similar in concept to Log4J.  You have logging classes that you can use to write out trace, debug, info, log, warn, fatal, or error messages.  You can also optionally specify a package name, which is used to identify which code module the debug statements are coming from.  With the package name, you’ll be able to see if the log message is coming from a user authentication manager, a data receiver, a user interface view, or any other class based upon how you setup your loggers.  Once the log file reaches the specified buffer size, it will automatically be sent to the server.

On the server you can setup log profiles that determine the level of granularity of messages that are captured on the server.  Let’s say you have 100,000 devices consuming your app.  You can configure the profiles to collect error or fatal messages for every app instance.  However, you probably don’t want to capture complete device logs for every app instance; You can setup the log profiles to only capture complete logs for a specific set of devices.

As an example, take a look at the screenshot below to see how you can setup log collection profiles:

Configuring Log Profiles on the MobileFirst Server
Configuring Log Profiles on the MobileFirst Server

When writing your code, you just need to create a logger instance, then write to the log.

If you’re curious when you might want a trace statement, vs. a log statement, vs. a debug statement, etc… Here is the usage level guidance from the docs:

  • Use TRACE for method entry and exit points.
  • Use DEBUG for method result output.
  • Use LOG for class instantiation.
  • Use INFO for initialization reporting.
  • Use WARN to log deprecated usage warnings.
  • Use ERROR for unexpected exceptions or unexpected network protocol errors.
  • Use FATAL for unrecoverable crashes or hangs.

For hybrid apps, you use the WL.Logger class in JavaScript:

var logger = WL.Logger.create({pkg: 'mynamespace.mymodule'});

logger.trace('trace', 'another mesage');
logger.debug('debug', [1,2,3], {hello: 'world'});
logger.log('log', 'another message');
logger.info('info', 1, 2, 3);
logger.warn('warn', undefined);
logger.error('error', new Error('oh no'));
logger.fatal('fatal', 'another message');

For native iOS apps, you will use the OCLogger class:

OCLogger *logger = [OCLogger getInstanceWithPackage:@"UserManager"];

[logger trace:@"this is a trace message"];
[logger debug:@"this is a debug message"];
[logger log:@"this is a log message"];
[logger info:@"this is an info message"];
[logger warn:@"this is a warning message"];
[logger error:@"this is an error message"];
[logger fatal:@"this is a fatal message"];

For native Android apps, you will use the com.worklight.common.Logger class:

private final static Logger logger = Logger.getLogger(MyClass.class.getName());

logger.trace('trace mesage');
logger.debug('debug message');
logger.log('log message');
logger.info('info message');
logger.warn('warn message');
logger.error('error - OH NOES!');
logger.fatal('fatal - Oops, you broke it');

Then on the server, you can go into the analytics dashboard and access complete logs for a device, or search through all client-side logs with the ability to filter on application name, app versions, log levels, package name, environment, device models, and OS versions within an optional date range, and with the ability to search for keywords in the log message.

Log Search Results within the MobileFirst Analytics Dashboard
Log Search Results within the MobileFirst Analytics Dashboard

For a complete reference and additional detail, be sure to check out the latest docs on client side logging with the MobileFirst platform.

IBM MobileFirst – Powering the IBM & Apple Partnership

Back in July, Apple and IBM announced a global strategic partnership to redefine how enterprises use mobile applications. Well, last week IBM and Apple announced the first set of apps developed from this partnership.

ibm-apple

The first set of applications include industry-specific applications designed to “redefine how work gets done”. The first set includes apps for air travel, banking and finance, insurance, government, retail, and telecom industries, and are just the beginning of the IBM/Apple parnership. Check out the press release for full details on the apps.

Apple’s VP of Worldwide Marketing, Phil Schiller is quoted saying: “The business world has gone mobile, and Apple and IBM are bringing together the world’s best technology with the smartest data and analytics to help businesses redefine how work gets done.”

So what is powering this transformation?  

The IBM MobileFirst Platform. That’s what.

MobileFirst-Logo

From the press release:


To supplement the IBM MobileFirst for iOS apps, the partnership between Apple and IBM offers business customers additional levels of capability integrated for enterprise mobility, including:

  • Mobile Platform and Enterprise Integration – Leveraging IBM’s global industry consulting expertise, client experience design and enterprise systems integration from analytics, workflow and cloud storage, to fleet-scale device management, security and integration. Enhanced mobile management includes a private app catalog, data and transaction security services, and productivity suite for all IBM MobileFirst for iOS solutions. In addition to on-premise software solutions, all these services will be available on Bluemix—IBM’s development platform on the IBM Cloud Marketplace.
  • Supply, activate and manage – Streamlined end-to-end procurement, deployment and lifecycle management — at scale; along with cloud solutions for enterprise security, device management, and data and process integration. IBM Global Financing leasing options and services to allow organizations to keep pace with latest device releases.
  • AppleCare for the Enterprise  – Providing IT departments and end users with 24/7 assistance for their devices from Apple’s award-winning customer support group, with on-site service delivered by IBM.

So, what does this mean from a more detailed/technical perspective?

MobileFirst Platform Foundation

Let’s look at the MobileFirst Platform Foundation, which consists of MobileFirst Platform Server (console and app management), client-side SDKs for native or hybrid apps, the MobileFirst Studio & CLI tools, and the MobileFirst Application Center.

mobilefirst-architecture
MobileFirst High-level System Architecture

The MobileFirst Platform Server and Client-side SDKs deliver security features, data integration features, app management features, unified push notifications, and analytics. From the security perspective, the MobileFirst server and SDK provide user authentication and can integrate with virtually any single-sign-on or identity management provider, and can maintain user authentication across multiple applications.

mfp-sso
Multi-app Single Sign On

The MobileFirst SDK also enables encrypted on-device storage, which can be synched with MobileFirst data adapters (used to expose data to the mobile applications).

For application management, the MobileFirst platform enables you to track versions of an app that are live out in production. From the server console, you can send messages to specific versions of an application, or remotely lock down specific versions of an app. This could be used to force compliance using the latest version of an app, or could be used to lock down an app due to some sort of security issue. You can read more about strategies for managing app versions on the MobileFirst platform here.

Application Management Console
Application Management Console

For data integration, the MobileFirst platform enables developers to leverage data adapters, which are lightweight server-side functions to data in a mobile-friendly format. They can automatically generate JSON objects from database information, leverage server-side compression to reduce network latency, perform object translation to compress large structures into smaller, less verbose packages (IE: SOAP to JSON, etc…).

worklight-adapters
MobileFirst Data Adapters

 

Usage of these data adapters is automatically audited, and is governed by the SDK’s authentication and app management. Server-side developers will be happy to know that data adapters are easy to develop using server-side JavaScript. Client-side developers will be happy to know that the MobileFirst SDK has a consisent client-side API to call any backend system.

The MobileFirst Platform server automatically exposes operational analytics for every app and data adapter managed through the platform. This provides insight into devices/platforms/OS versions that are consuming your applications, server-side collection of client-side app logs, and data adapter usage, all enabled “out of the box”.

MobileFirst Platform Analytics
MobileFirst Platform Analytics

MobileFirst Application Center

The MobileFirst Application Center is reposity of mobile applications that enables an “out of the box” app store for your enterprise. If facilitates the sharing of mobile applications, and enables sharing of feedback and rating information. It also uses access control lists to limit who might be able to install specific applications. If your enterprise has numerous mobile apps, and you need a way to manage distribution of your enterprise-signed iOS apps, then this is the solution for you.

mf-application-center
MobileFirst Application Center

MobileFirst Platform Application Scanning

MobileFirst Platform Application Scanning is set of tools that can scan your JavaScript, HTML, Objective-C, or Java code for security vulnerabilities and coding best practices. Think of it as a security layer in your software development lifecycle.

MobileFirst Quality Assurance

MobileFirst Quality Assurance is a set of tools and features to help provide quality assurance to your mobile applications. It includes automated crash analytics, user feedback and sentiment analysis, in-app bug reporting, over-the-air build distribution to testers, test/bug prioritization, and more.

MobileFirst Protect

MobileFirst Protect is a comprehensive suite of tools that enables an enterprise to manage, virtualize and optimize devices, networks, and apps. This includes Mobile Application Management (MAM), Mobile Device Management (MDM), and Mobile Network Performance Management (MNPM). Take a look at the quick video to see how MobileFirst Protect can help you secure the devices connecting to your enterprise.

 MobileFirst Engage

MobileFirst Engage is a platform that enables you to add analytics to your mobile applications. This can help you identify and understand how users are interacting with your enterprise. You can track mobile engagement, process the data, and provide a contextually relevant experience to your users in realtime.

The IBM MobileFirst Platform provides unparalleled tools to build, manage and monitor reliable and secure applications, manage and secure devices, monitor usage and drive engagement, and bring your enterprise to a mobile reality.

IBM Bluemix Cloud Services

Of course, let’s not forget IBM Bluemix, IBM’s suite of cloud services.  Bluemix covers everything from mobile app integration, business process & workflow, security services, cloud storage, analytics, and even the IBM Watson cognitive platform.  This post is long enough already, so I’ll go into more detail on Bluemix at a later date, but definitely go check it out.  There’s everything from basic node.js or Java server hosting, to app boilerplates/templates, and more.

IBM BlueMix Services
IBM BlueMix Services

 

UX & Mobile Apps Leveraging the IBM MobileFirst Platform

When you are developing a mobile app (or website, or mobile web, or TV app, etc..) you should always ask yourself “What kind of an impact does this have on the end user?” It doesn’t matter whether you are creating enterprise apps or games, or anything in between. Every development decision that you make should be weighed upon it’s impact to the overall impact it has on the end user. Simply put: if your app sucks, nobody is going to want to use it.

When building mobile apps using IBM MobileFirst you have two options for a user interface layer; you can write a native app, or you can write a hybrid app using HTML, CSS, & JavaScript.

Native VS HTML Hybrid

So, what kind of an impact does the addition of IBM MobileFirst have on the app?

NONE, granted the app’s UX can vary depending upon whether you are developing a native app or a hybrid app.

IBM MobileFirst Platform Foundation is a platform that consists of a server tier and client-side SDK. If you are developing a native app, the SDK/API provides access to MobileFirst platform features, like user authentication, app version management, data access through adapters, encrypted storage, unified push notification, remote log collection, and more. If you are developing a hybrid app, the app’s UX must be developed complete inside of the web view container. The MobileFirst Foundation SDK provides additional functionality just like mentioned above for the native SDK, plus a few classes that enable native dialogs and a few native UI elements, but for the most part, there is very, very minimal impact on the user’s experience.

When building any kind of mobile app, regardless of whether it is native or hybrid, you need to pay attention to what the user experiences. Are you following human interaction or design guidelines for the platform? Are you forcing your user to go through unnecessary or redundant steps? Are you making forms more complex than they need to be? Are you forcing multiple taps for a simple interaction? Can things be simplified?

The IBM MobileFirst Platform does not add any additional overhead for UX processes.

The IBM MobileFirst platform can be used to develop native apps on iOS, Android, Windows Phone, or Java ME platforms. Follow native coding conventions and UX guidelines for each individual platform. Make sure you follow these guidelines, otherwise your app may feel alien within the ecosystem, or may be rejected from app store approval altogether.

What should you think about when building a hybrid app leveraging IBM MobileFirst?

First, it depends on your hybrid approach. If you are using the for Xamarin hybrid approach for MobileFirst apps, then your considerations will be much like writing a native app.

If you are using the HTML/CSS/JavaScript approach (leveraging the Apache Cordova container), then you really want to focus on the user’s experience inside of the HTML container. You want to make sure the UI feels like “an app”, not like “a web page”. There are many client-side frameworks that help address this need. Feel free to use any of them, or roll your own – just keep the UX/human interaction guidelines in mind.

(this is by no means an exhaustive list, there are more out there)

Make sure you’re building for touch interactivity, addressing animations correctly to minimize browser reflow operations, and more… Read this post on Dzone that I wrote last year for a lot more detail on performance considerations for hybrid or mobile web apps.

If you are using any of these (or none of these), also don’t forget an architectural pattern/framework for helping keep your code organized and consistent. Read this post on hybrid/web app architectural patterns and considerations for even more detail.

For both native and hybrid approaches, you also want to consider impacts of perceived performance vs actual raw processing  power. These techniques deliver the appearance that the app is fast and responsive, instead of sluggish or locked while waiting to perform an action. Perceived performance improvements can be achieved simply by providing instant feedback, performing animations during an asynchronous request, or preemptive tasking. Don’t miss this post, where I go into perceived performance in mobile apps in great detail.

 

IBM Watson, Cognitive Computing & Speech APIs

IBM Watson is a cognitive computing platform that you can use to add intelligence and natural language analysis to your own applications.  Watson employs natural language processing, hypothesis generation, and dynamic learning to deliver solutions for natural language question and answer services, sentiment analysis, relationship extration, concept expansion, and language/translation services. ..and, it is available for you to check out with IBM Bluemix cloud services.

Watson won Jeopardy, tackles genetics,  creates recipes, and so much more.  It is breaking new ground on a daily basis.

The IBM Watson™ Question Answer (QA) service provides an API that give you the power of the IBM Watson cognitive computing system. With this service, you can connect to Watson, pose questions in natural language, and receive responses that you can use within your application.

In this post, I’ve hooked the Watson QA node.js starter project to the Web Speech API speech recognition and speech synthesis APIs. Using these APIs, you can now have a conversation with Watson. Ask any question about healthcare, and see what watson has to say. Check out the video below to see it in action.

You can check out a live demo at:

Just click on the microphone button, allow access to the system mic, and start talking.  Just a warning, lots of background noise might interfere with the API’s ability to recognize & generate a meaningful transcript.

This demo only supports Google Chrome only at the time of writing. You can check out where Web Speech is supported at caniuse.com.

You can check out the full source code for this sample on IBM Jazz Hub (git):

I basically just took the Watson QA Sample Application for Node.js and started playing around with it to see what I could do…

This demo uses the Watson For Healthcare data set, which contains information from HealthFinder.gov, the CDC, National Hear Lung, and Blood Institute, National Institute of Arthritis and Musculoskeletal and Skin Diseases, National Institute of Diabetes and Digestive and Kidney Diseases, National Institute of Neurological Disorders and Stroke, and Cancer.gov.  Just know that this is a beta service/data set – implementing Watson for your own enterprise solutions requires system training and algorithm development for Watson to be able to understand your data.

Using Watson with this dataset, you can ask conditional questions, like:

  • What is X?
  • What causes X?
  • What is the treatment for X?
  • What are the symptoms of X?
  • Am I at risk of X?

Procedure questions, like:

  • What should I expect before X?
  • What should I expect after X?

General health auestions, like:

  • What are the benefits of taking aspirin daily?
  • Why do I need to get shots?
  • How do I know if I have food poisoning?

Or, action-related questions, like:

  • How can I quit smoking?
  • What should I do if my child is obese?
  • What can I do to get more calcium?

Watson services are exposed through a RESTful API, and can easily be integrated into an existing application.  For example, here’s a snippet demonstrating how you can consume the Watson QA service inside of a Node.js app:

var parts = url.parse(service_url +'/v1/question/healthcare');
var options = {
host: parts.hostname,
port: parts.port,
path: parts.pathname,
method: 'POST',
headers: {
  'Content-Type'  :'application/json',
  'Accept':'application/json',
  'X-synctimeout' : '30',
  'Authorization' :  auth
}
};

// Create a request to POST to Watson
var watson_req = https.request(options, function(result) {
  result.setEncoding('utf-8');
  var response_string = '';

  result.on('data', function(chunk) {
    response_string += chunk;
  });

  result.on('end', function() {
    var answers = JSON.parse(response_string)[0];
    var response = extend({ 'answers': answers },req.body);
    return res.render('response', response);
  });
});

Hooking into the Web Speech API is just as easy (assuming you’re using a browser that implements the Web Speech API – I built this demo using Chrome on OS X). On the client side, you just need need to create a SpeechRecognition instance, and add the appropriate event handlers.

var recognition = new webkitSpeechRecognition();
 recognition.continuous = true;
 recognition.interimResults = true;

 recognition.onstart = function() { ... }
 recognition.onresult = function(event) {

   var result = event.results[event.results.length-1];
   var transcript = result[0].transcript;

   // then do something with the transcript
   search( transcript );
 };
 recognition.onerror = function(event) { ... }
 recognition.onend = function() { ... }

To make your app talk back to you (synthesize speech), you just need to create a new SpeechSynthesisUtterance object, and pass it into the window.speechSynthesis.speak() function. You can add event listeners to handle speech events, if needed.

var msg = new SpeechSynthesisUtterance( tokens[i] ); 

msg.onstart = function (event) {
    console.log('started speaking');
};

msg.onend = function (event) {
    console.log('stopped speaking');
};

window.speechSynthesis.speak(msg);

Check out these articles on HTML5Rocks.com for more detail on Speech Recognition and Speech Synthesis.

Here are those links again…

You can get started with Watson services for Bluemix at https://console.ng.bluemix.net/#/store/cloudOEPaneId=store

So, What is IBM MobileFirst?

I’m still “the new guy” on the MobileFirst team here at IBM, and right away I’ve been asked by peers outside of IBM: “So, what exactly is MobileFirst/Worklight?  Is it just for hybrid apps?”

In this post I’ll try to shed some light on IBM MobileFirst, and for starters, it is a lot more than just hybrid apps.

MobileFirst-Logo

IBM MobileFirst Platform is a suite of products that enable you to efficiently build and deliver mobile applications for your enterprise, and is composed of three parts:

IBM MobileFirst Platform Foundation

IBM MobileFirst Platform Foundation (formerly known as Worklight Foundation) is a platform for building mobile applications for the enterprise.  It is a suite of tools and services available either on-premise or in the cloud, which enable you to rapidly build, administer, and monitor secure applications.

The MobileFirst Platform Foundation consists of:

  1. MobileFirst Server – the middleware tier that provides a gateway between back-end systems and services and the mobile client applications.  The server enables application authentication, data endpoints/services, data optimization and transformation, push notification management (streamlined API for all platforms), consolidated logging, and app/services analytics. For development purposes, the MobileFirst server is available as either part of the MobileFirst Studio (discussed below), or as command line tools.

  2. MobileFirst API - both client and server-side APIs for developing and managing your enterprise mobile applications.
    • The server-side API enables you to expose data adapters to your mobile applications – these adapters could be consuming data from SQL databases, REST or SOAP Services, or JMS data sources. The Server side API also provides a built-in security framework, unified push notifications (across multiple platforms), and data translation/transformation services. You can leverage the server-side API in JavaScript, or dig deeper and use the Java implementation.
    • The client-side API is available for native iOS (Objective-C), native Android (Java), J2ME, C# native Windows Phone (C#), and JavaScript for cross-platform hybrid OR mobile-web applications. For the native implementations, this includes user authentication, encrypted storage, push notifications, logging, geo-notifications, data access, and more.  For hybrid applications, it includes everything from the native API, plus cross-platform native UI components and platform specific application skinning.  With the hybrid development approach, you can even push updates to your applications that are live, out on devices, without having to push an update through an app store.  Does the hybrid approach leverage Apache Cordova?  YES.

  3. MobileFirst Studio - an optional all-inclusive development environment for developing enterprise apps on the MobileFirst platform.  This is based on the Eclipse platform, and includes an integrated server, development environment, facilities to create and test all data adapters/services, a browser-based hybrid app simulator, and the ability to generate platform-specific applications for deployment.  However, using the studio is not required! Try to convince a native iOS (Xcode) developer that they have to use Eclipse, and tell me how that goes for you… :)  If you don’t want to use the all-inclusive studio, no problem.  You can use the command line tools (CLI).  The CLI provides a command line interface for managing the MobileFirst server, creating data adapters, creating the encrypted JSON store, and more.

  4. MobileFirst Console – the console provides a dashboard and management portal for everything happening within your MobileFirst applications.  You can view which APIs and adapters have been deployed, set app notifications, manage or disable your apps, report on connected devices and platforms, monitor push notifications, view analytics information for all services and adapters exposed through the MobileFirst server, and manage remote collection of client app logs.  All together, an extremely powerful set of features for monitoring and managing your applications.

  5. MobileFirst Application Center - a tool to make sharing mobile apps easier within an organization.  Basically, it’s an app store for your enterprise.

MobileFirst Platform Application Scanning

MobileFirst Platform Application Scanning is set of tools that can scan your JavaScript, HTML, Objective-C, or Java code for security vulnerabilities and coding best practices.  Think of it as a security layer in your software development lifecycle.


MobileFirst Quality Assurance

MobileFirst Quality Assurance is a set of tools and features to help provide quality assurance to your mobile applications.  It includes automated crash analytics, user feedback and sentiment analysis, in-app bug reporting, over-the-air build distribution to testers, test/bug prioritization, and more.


So, is MobileFirst/Worklight just for hybrid (HTML/JS) apps? You tell me… if you need clarification more information, please re-read this post and follow all the links.  ;)