CNBS Software Blog

Building SAP Mobile Applications: An Overview

Jan 28, 2020 28:41 PM / by Dimitar Stefanov

The wide adoption of smartphones for personal use, has generated an increased demand from employees to access operational data from their ERP systems on the go.

From mobile service and sales reps, to supervisors who oversee mobile teams, to C-level executives who need to provide timely approvals, we all expect a convenient access to any data we need, outside the office, where our customers are. Demand for mobile applications is in turn increasing the pressure on IT departments to deliver easy to use, mobile apps that are secured and properly managed across the enterprise.

Developing for mobile devices such as iPhone/iPad or Android is challenging to begin with. Supporting on-line/off-line scenarios, data synchronization, push notifications, location tracking as well as capturing payment information bring some unique challenges. Once you add requirements to connect to SAP and reliably both push and pull data, applications can become very complicated very quickly.

In this blog, I will provide a high-level overview of technologies that are currently available to build Mobile applications for the SAP ecosystem. Understanding and using the right tools and available technologies provides a proven way to build scalable and secure solutions that employees will love to use (...because it will make their life easier).

SAP Solutions

SAP provides a suite of mobility solutions built around SAP Cloud Platform. It is a comprehensive, end-to-end offering that provides a way to expose SAP data as oData web services (either in the cloud or on-premise) as well as device specific development framework to make the use of those services. Solutions are packaged as mobile applications that can be downloaded from the Apple or Google App Stores and follow best practices in enterprise level security and distribution.

Depending on the complexity of the app and what developer skills are available, there are 2 different paths offered by SAP – Cloud Platform Mobile Services and SAP Fiori responsive apps.

SAP Cloud Platform Mobile Services

Cloud Platform Mobile Services is the "marketing" name for a suite of products that provides a standards-based (cloud) platform for mobile application development, configuration, and management. It offers 3 distinct approaches to build mobile apps that can be selected based on the level of complexity of the final solution and the available developer skills.

SAP Mobile Cards

SAP Mobile Cards is an approach that presents SAP data on a mobile device in a form of “cards” that are organized in a virtual “wallet”. Each card presents a (very) simplified view of SAP data. For example, you can have a “Customer” card, “Order” card or “Inventory” card etc.

4 SAP Card examples screenshots

There could be multiple cards in the wallet and every card can contain data in the face and on the back of the card. For example the face of the card could show the customer, date and total amount of the order and the back of the card could list all the items in the order with their prices.

Mobile cards also support simple actions - for example, on an order approval card, the actions could be Accept or Reject. The data for the cards is supplied from an oData service and the actions are calls to oData service. Cards are build using HTML and JavaScript. oData services are hosted from SAP Cloud Platform, but can be hosted elsewhere (for example on-Premise).

Mobile Cards are best suited for simple apps that display one data element per card like (Service Order or Notification) and optionally execute a small set of custom actions from a popup menu. The development environment is provided by SAP in a form of web editor (Web IDE) that allows creating, editing and previewing the cards right in the web browser.

The same web interface is used to manage the cards and provides simple analytics about how cards are used.

To consume the cards, users would need to download SAP Mobile Cards app (available on both Apple and Google app stores) and register for the cards they want to see.

You can find in-depth information about SAP Mobile Cards on the SAP Developer Portal.

SAP Mobile Development Kit

SAP Mobile Development Kit is a solution building complex mobile applications using drag-n-drop approach where screens are built by dragging controls like text boxes, check boxes, buttons etc. on a page. SAP provides web based editor (WebIDE) to adjust the control properties (look and feel).  JavaScript is used to provide any extra logic.

SAP Mobile Screenshots

Different modules can be added to give the app access to the native platform resources like camera, GPS, scanner, etc.

Mobile Development Kit is best suited for small to medium apps. Developers need to be able to work with JavaScript and HTML/Css. No platform (iOS, Android) skills are needed for building the page UI.

Users need to download SAP Mobile Services Client that serves as a container that hosts and runs the code and can be downloaded from Apple or Google App store. More information about SAP Mobile Development Kit is available here and nice blog post about the MDK can be found here.

SAP Cloud Platform SDK for iOS or Android

SAP Cloud Platform SDK for iOS and SAP Cloud Platform SDK for Android are solutions for writing native apps. Native apps are written in the language of the platform – Swift for iOS and Java for Android. They can consume oData services or any other REST data source. Development process is relatively mature and comfortable using xCode or Android Developer Studio.

When starting a new project, a specialized assistant "wizard" walks you through a process of creating a base application shell from one of several app templates. For example for iOS, the assistant generates a Swift project that you then load into xCode. SDK provides libraries to access the services in the SAP Cloud Platform including oData service and with both online and offline support.

Mobile SDK solutions will work well for projects of all size, assuming you have access to engineers that are familiar with native app development on iOS or Android. It is especially suited for bigger and more complex projects that need access to devices functions like battery, GPS, camera, etc.

Contrary to the first two approaches that use a single SAP provided mobile application (downloadable from Google or Apple App store), when using Mobile SDK, apps are created as regular native apps that need to be distributed via your own channels – usually published on the Apple/Google App store (and having to go through Apple's approval process) or using or enterprise publishing channels like MDM.

SAP Cloud Mobile Services also provides some basic features for hosting and managing mobile apps like client-side logging, push notifications, basic analytics about the life of the app, etc. More information about SAP Cloud Platform SDK for iOS is available here and for SAP Cloud Platform SDK for Android is available here.

If you want to explore more about SAP Cloud Platform Mobile services, SAP has provided a free overview course that covers all 3 technologies and provides end-to end example of using them.

SAP Fiori

SAP Fiori is a web-based framework with related tools (Web IDE) that allows you to build applications that can render well (aka “responsive”) on devices with different screen sizes, from desktops to small screen devices like phones and tablets.

SAP Fiori comes with 3 “flavors” optimized for Web, iOS and Android. iOS and Android flavors offer look and feel customizations that make them blend better into iOS or Android platforms.

SAP Mobile devices screenshots

SAP has adopted Fiori as the basis for the User Interface for their latest ERP S/4HANA (instead of SAP GUI), but Fiori is also available for ECC. Fiori framework allows you to take advantage of a wide variety of tools and templates that are designed specifically for writing apps that live in the SAP ecosystem. SAP Fiori apps are built using HTML/CSS/JavaScript inside SAP provided development tools like SAPUI5 Eclipse tools or SAP Web IDE.

On mobile devices, Fiori apps run inside the native web browser of the device. To make it easier to integrate features like push notifications, SAP has also developed native Fiori clients for both iOS and Android. Native clients internally run the same Fiori web application but can be started as a regular App on the device home screen. Native clients provide several enhancements like barcode scanning, camera, or geolocation that are not available if the Fiori application runs in the browser.

More information about SAP Fiori is available here. More information on CNBS Software's Fiori offerings is available here.

Non SAP Solutions

There is a multitude of other technologies for building mobile apps. They are all relevant and should be considered when planning for an SAP mobile solution, especially if your engineering team has experience using them.

One solution that many companies use is Xamarin. It provides a rich platform for developers with C# experience can build cross platform (iOS, Android and Windows) native mobile applications that connect to custom Web Service or REST end points exposed by SAP NetWeaver. This solution takes advantage of a large and mature ecosystem of .NET developers, libraries and tools. It provides a way to build native apps with unrestricted access to all native functionality (e.g. Push Notification, Location Tracking, Accelerometers, Compass etc.). Xamarin solutions are suited for all projects, but especially for large and complex projects that require detailed and specific access to native function exposed by the device.

Another popular application framework is React Native. With React Native, developers can build native mobile apps using only JavaScript. It uses the same design approach used in the popular React.JS Web framework which makes it a preferred way for teams that have good experience building modern web sites using React’s declarative components.

In addition to the “app centric” solutions (e.g. users download an app from an App store), there are multitude of technologies that are based around responsive web applications. Responsive web applications are websites that are built to adapt their screens to different device sizes. Responsive apps detect when they are being requested from a mobile device and react by (… or “respond”) by resizing and rearranging the visual elements on the page to optimize for the available screen size.

Progressive Web Apps are a type of Web Apps that has grown in popularity in the last years. They are applications that look and feel like a native application but are delivered through the web and built using common web technologies including HTML, CSS and JavaScript and work on any platform that uses a standards-compliant browser. Functionality includes working offline, push notifications, and device hardware access. They strive to provide user experiences that are similar to native applications on both desktop and mobile devices.

Since a progressive web app is a type of webpage or website known as a web application, there is no requirement for developers or users to install the web apps via digital distribution systems like Apple App Store or Google Play. A good example of a progressive web application is the Starbucks App.

To get a better idea of how diverse the ecosystem for building mobile apps is take a look at this article that lists 15 different languages used to build mobile apps here, or this one here that list 10 platforms for building mobile apps.

Connectivity to SAP

Regardless of what solution you use, when building mobile or (web) applications, a big challenge is how to access data in SAP in a proper (secure) way over web services.

There are generally 2 ways to do that: use some of public SAP APIs available in SAP API Hub, or build your own using NetWeaver, CDS Views or custom REST or oData services. One approach that is gaining popularity is hosting APIs on SAP Cloud Platform and using SAP Cloud Platform Integration services to connect to ERP (or other enterprise systems) using Cloud Connectors.

What approach you take depends to a large degree if you have to connect to ECC or S/4, or S/4 Cloud, or if you have a team of ABAP developers that can build custom endpoints. SAP Cloud platform and SAP API Hub are usually the first place to start.

Selecting the Proper Tools

As it is always in the world of SAP, there are multiple ways to achieve the same thing. Selecting the right approach depends on multiple factors that can be broadly split into: type of SAP environment (ECC or S4, OnPremise or Cloud), team skills (e.g. access to Web, ABAP, Native developers), and the type of the application being built (mission critical or for an occasional use).

When we work with customers, we usually start our discussions with Fiori. Fiori has matured enough to make it applicable for most scenarios and with many companies transitioning to S4, it will slowly become the default platform for building custom SAP solutions, both for desktop and mobile use.

For organizations where Fiori is not yet the best choice e.g. lack of proper resources or older SAP environment, SAP Cloud Platform Mobile Services provides a relatively painless entry into exposing SAP data to mobile applications (especially when starting with SAP Mobile Cards).

If the requirements call for mobile app that will be used exclusively by mobile personnel on the road (for example mobile Sales or Mobile Service), building native mobile apps using SDK for iOS or Android is usually the right approach. In Those cases, IT department usually standardize the hardware used (e.g. iPhone, iPad or Android) and developers can reach deeply into all platform specific functionality to deliver good performance and a pleasant user experience.

Tags: SAP Mobility Solutions, SAP

Dimitar Stefanov

Written by Dimitar Stefanov