The age of apps as a service layers

Slide 1

Slide 1 text

The Age Of Apps As Service Layers William El Kaim Oct. 2016 - V 2.0

Slide 2

Slide 2 text

Slide 3

Slide 3 text

Plan The Mobile Revolution • The Age of Apps As Service Layer • Evolution of Mobile Software Architecture • Native vs. Cross-Platform vs. Web • BackEnd As A Service • Mobile Business Models • The Search for the Ultimate User Experience • Mobile App and App Store • Creating a Private App Store • Lessons Learned and Best Practices • Real Examples Copyright © William El Kaim 2016 3

Slide 4

Slide 4 text

Slide 5

Slide 5 text

Slide 6

Slide 6 text

Slide 7

Slide 7 text

Slide 8

Slide 8 text

Slide 9

Slide 9 text

Slide 10

Slide 10 text

Slide 11

Slide 11 text

Slide 12

Slide 12 text

Slide 13

Slide 13 text

Plan • The Mobile Revolution The Age of Apps As Service Layer • Evolution of Mobile Software Architecture • Native vs. Cross-Platform vs. Web • BackEnd As A Service • Mobile Business Models • The Search for the Ultimate User Experience • Mobile App and App Store • Creating a Private App Store • Lessons Learned and Best Practices • Real Examples Copyright © William El Kaim 2016 13

Slide 14

Slide 14 text

From Mobile App to Apps As A Service • First generation: ‘information appliance’ model. • Using software, you transformed your phone into a mostly mono-purpose device just like it said on the tin. Now it’s a phone. Now it’s a calculator. Now it’s a messaging tool. • The second generation: the ‘home screen’ era • The prevailing wisdom was that you had to cram everything your service offered into mobile, using a form of design-driven gavage to stuff your app until it was positively groaning with tabs and gutters and drawers. • Thrid Generation : The Age Of Apps As Service Layers • They aren’t for ‘idle browsing’, they’re purpose built and informed by contextual signals like hardware sensors, location, history of use and predictive computation. • These ‘invisible apps’ are less about the way they look or how many features they cram in and more about maximizing their usefulness to you without monopolizing your attention. Source: TechCrunch Copyright © William El Kaim 2016 14

Slide 15

Slide 15 text

Slide 16

Slide 16 text

Slide 17

Slide 17 text

The Age Of Apps As Service Layers Hailo New Google Now Card • Hailo has teamed up with Google to introduce a Now card that will help make the commute a little bit easier for its customers. • Instead of poking around in apps and web pages to find what you need, Now cards in the Google app can give you the right information at exactly the right time. • For people who have opted in to Google Now and have downloaded the Hailo app, the Hailo Now card will send an alert to anyone who has booked a journey from outer London zones in to Central London between 7-10am in the morning an offer of a cab home if the passenger is still in the same London location after 5pm. https://blog.hailoapp.com/2015/02/02/hailo-google-now/ Copyright © William El Kaim 2016 17

Slide 18

Slide 18 text

Slide 19

Slide 19 text

Slide 20

Slide 20 text

The Age Of Apps As Service Layers From AdWords to AppWords • New technology that lets mobile apps reach outside of their respective walled gardens so that users can search and navigate between specific places within them. • Israel’s Deeplink.me launched AppWords, a mobile search and ad platform that uses keywords to trigger relevant content between one app and another. • Installed Apps will bid for displaying the ads and link to them. • Several Taxi Apps can bid for an ad on an Itinerary http://deeplink.me/appwords Copyright © William El Kaim 2016 20

Slide 21

Slide 21 text

Slide 22

Slide 22 text

Slide 23

Slide 23 text

Plan • The Mobile Revolution • The Age of Apps As Service Layer Evolution of Mobile Software Architecture • Native vs. Cross-Platform vs. Web • BackEnd As A Service • Mobile Business Models • The Search for the Ultimate User Experience • Mobile App and App Store • Creating a Private App Store • Lessons Learned and Best Practices • Real Examples Copyright © William El Kaim 2016 23

Slide 24

Slide 24 text

Slide 25

Slide 25 text

Past Generations (from Mainframe to Web) • Mainframe model (1st Gen) • Everything on the server but the keyboard and [green] screen, which resulted in low user experience but high application access. • Client/Server model (2nd Gen) • Desktop computing became mainstream, • Moving all application logic to the client side, trading application distribution for higher user experience. • This gave birth to the suite of productivity applications we still use today, such as Adobe Photoshop, Microsoft Office, and Autocad. • Web 1.0 (3rd Gen) • As the Web started to be recognized as a new way to publish and share content, it started to get used for application as well, and its usage and enhancement quickly escalated ( Web 1.x, Web 2.0/Ajax) to provide what the Client/Server model was not suited for: instant access and update of a server-driven application with relatively decent interactive user interfaces. Copyright © William El Kaim 2016 25

Slide 26

Slide 26 text

4th Generation: Mobile App Model and Its App Store • Web 2.0 and Mobile (4th Gen) • Though we believed that the Web was going to be the future of application development and distribution, the iPhone popped out • Not only kick-started a new generation of computing devices (i.e., the “touch era”), but also initiated a new way to build, distribute, and monetize applications, referred as the Mobile App model (4th Gen). • Address some of the limitations of its predecessor • by providing a more efficient platform for users to discover, install, update, and pay for their applications or features. • Regarding platform dependency, “going native” means going OS-specific. • However, for most companies this is a very costly approach. • Mashup and API needed to send content to Mobile • Mobile Backend as a service Copyright © William El Kaim 2016 26

Slide 27

Slide 27 text

4th Generation: Mobile App and App Store • The biggest limitations of this new app store model • Come from its client/server heritage, as application updates are still user-initiated (as they should be), which increases the support cost (especially when server API are involved) • Exclusive and over-controlling application store rules such as those maintained by apple and microsoft’s app stores. • Companies need to be able to select and control the mobile app and web site that their users could use. • Need to be able to create a simple and quick way to build an app store and to be able to brand it for our clients. • New role: The app store • Load all Android and (Enterprise only) Iphone apps • Create and add users • Generate the mobile app store application use to access the content of the store Copyright © William El Kaim 2016 27

Slide 28

Slide 28 text

Slide 29

Slide 29 text

Slide 30

Slide 30 text

5th Gen.: HTML5 & Hybrid • As the software market was getting stormed by mini applications, the Web also went through a transformative evolution, under the HTML5 moniker. • During this time, the biggest Internet technology providers such as Mozilla, Google, Apple, and even Microsoft began fiercely competing on compliance and performance of a single spec, HTML5. • The truly disruptive aspect of HTML5 is that, in a world with an ever- increasing number of devices, HTML5 has become the only truly cross- platform application environment of Moore’s law. • HTML5 and JavaScript have never been a better bet for the future, and any software companies, especially enterprise ones, should seriously consider this opportunity to go where the puck will be and lead their respective markets for many years to come. Copyright © William El Kaim 2016 30

Slide 31

Slide 31 text

Slide 32

Slide 32 text

Plan • The Mobile Revolution • The Age of Apps As Service Layer • Evolution of Mobile Software Architecture Native vs. Cross-Platform vs. Web • BackEnd As A Service • Mobile Business Models • The Search for the Ultimate User Experience • Mobile App and App Store • Creating a Private App Store • Lessons Learned and Best Practices • Real Examples Copyright © William El Kaim 2016 32

Slide 33

Slide 33 text

Slide 34

Slide 34 text

Slide 35

Slide 35 text

Plan • The Mobile Revolution • The Age of Apps As Service Layer • Evolution of Mobile Software Architecture Native vs. Cross-Platform vs. Web • Progressive Web Apps • BackEnd As A Service • Mobile Business Models • The Search for the Ultimate User Experience • Mobile App and App Store • Creating a Private App Store • Lessons Learned and Best Practices • Real Examples Copyright © William El Kaim 2016 35

Slide 36

Slide 36 text

New Web Application Architectures Progressive Web Apps Introduction • Progressive Web Apps bring features we expect from native apps to the mobile browser experience in a way that uses standards-based technologies and run in a secure container accessible to anyone on the web. Source: Google Copyright © William El Kaim 2016 36

Slide 37

Slide 37 text

New Web Application Architectures Progressive Web Apps Properties • Progressive • Work for every user, regardless of browser choice because they’re built with progressive enhancement as a core tenet. • Responsive • Fit any form factor, desktop, mobile, tablet, or whatever is next. • Connectivity independent • Enhanced with service workers to work offline or on low quality networks. • App-like • Use the app-shell model to provide app-style navigations and interactions. • Fresh • Always up-to-date thanks to the service worker update process. • Safe • Served via TLS to prevent snooping and ensure content hasn’t been tampered with. • Discoverable • Are identifiable as “applications” thanks to W3C manifests and service worker registration scope allowing search engines to find them. • Re-engageable • Make re-engagement easy through features like push notifications. • Installable • Allow users to “keep” apps they find most useful on their home screen without the hassle of an app store. • Linkable • Easily share via URL and not require complex installation. Copyright © William El Kaim 2016 37

Slide 38

Slide 38 text

New Web Application Architectures Progressive Web Apps: Blazzing Fast Performance Google Plus hit their goal of never downloading more than 60k of HTML, 60k of JavaScript and 60k of CSS at any one time! Source: Eugene Mutai AliExpress (Alibaba’s eBay) saw 82% increase in iOS conversion rate after building a PWA. Copyright © William El Kaim 2016 38

Slide 39

Slide 39 text

New Web Application Architectures Progressive Web Apps: App Shell • An application shell (or app shell) architecture is one way to build a Progressive Web App that reliably and instantly loads on your users' screens, similar to what you see in native applications. • The app "shell" is the minimal HTML, CSS and JavaScript required to power the user interface and when cached offline can ensure instant, reliably good performance to users on repeat visits. • This means the application shell is not loaded from the network every time the user visits. • For single-page applications with JavaScript-heavy architectures, an application shell is a go-to approach. • This approach relies on aggressively caching the shell (using a service worker) to get the application running. • Next, the dynamic content loads for each page using JavaScript. An app shell is useful for getting some initial HTML to the screen fast without a network. Copyright © William El Kaim 2016 39

Slide 40

Slide 40 text

New Web Application Architectures Progressive Web Apps: Service Worker • Under Standardization within W3C • Service Worker is a worker script that works behind the scenes, independent of your app, and runs in response to events like network requests, push notifications, connectivity changes, and more. • Today, they already include features like push notifications and background sync. • Allows to support offline experiences, giving developers complete control over the experience. • Mozilla offers a great reference for service worker recipes and Google also has a slew of Service Worker Samples. • States of Browser support is available at “Is service worker ready?” or at “Can I Use” Copyright © William El Kaim 2016 40

Slide 41

Slide 41 text

Plan • The Mobile Revolution • The Age of Apps As Service Layer • Evolution of Mobile Software Architecture Native vs. Cross-Platform vs. Web • Web Components • BackEnd As A Service • Mobile Business Models • The Search for the Ultimate User Experience • Mobile App and App Store • Creating a Private App Store • Lessons Learned and Best Practices • Real Examples Copyright © William El Kaim 2016 41

Slide 42

Slide 42 text

New Web Application Architectures W3C Web Components • Web components are a collection of specifications that enable developers to create their web applications as a set of reusable components. • Web Components provide a paradigm shift from the traditional approach of web design by fundamentally changing the way we build and conceive web apps. • The promise is to put the power and extensibility necessary to build sophisticated widgets and applications right into core web feature set. • Imagine the capabilities of libraries like Angular, Ember, and Backbone, but as a foundation of the platform, standardized across all browsers. http://webcomponents.org/ Copyright © William El Kaim 2016 42

Slide 43

Slide 43 text

New Web Application Architectures W3C Web Components • A good introduction here and here • Web components are made up of four different specifications: • Custom Elements – These enable developers to create their own elements that are relevant to their design as part of the DOM structure with the ability to style/script them just like any other HTML tag. • HTML Templates – These let you define fragments of markup that stay consistent across web pages with the ability to inject dynamic content using JavaScript. • Shadow DOM – This is designed to abstract all the complexities from the markup by defining functional boundaries between the DOM tree and the subtrees hidden behind a shadow root. • HTML Imports – Similar to import one CSS file into another, these allow you to include and reuse HTML documents in other HTML documents. • Major libraries for working with and extending web components: • X-Tags by Mozilla • Polymer by Google • Bosonic Copyright © William El Kaim 2016 43

Slide 44

Slide 44 text

Slide 45

Slide 45 text

New Web Application Architectures W3C Web Components: Polymer • Polymer library, created by Google, offers to use W3C Web Components features in modern browsers today. • Polymer provides a set of “polyfills” enabling to use web components in non- compliant browsers with an easy-to-use framework. • polyfill, or polyfiller, is a piece of code (or plugin) that provides the technology that you, the developer, expect the browser to provide natively. • Polymer does this by: • Allowing us to create Custom Elements with user-defined naming schemes. These custom elements can then be distributed across the network and used by others with HTML Imports. • Allowing each custom element to have its own template accompanied by styles and behavior required to use that element. • Providing a suite of ready-made UI and non-UI elements to use and extend in your project. http://www.polymer-project.org/ Copyright © William El Kaim 2016 45

Slide 46

Slide 46 text

New Web Application Architectures W3C Web Components: Polyfill • In web development, a polyfill is code that implements a feature on web browsers that do not support the feature. • Most often, it refers to a JavaScript library that implements an HTML5 web standard, either an established standard (supported by some browsers) on older browsers, or a proposed standard (not supported by any browsers) on existing browsers. • Polyfills allow web developers to use an API regardless of whether it is supported by a browser or not, and usually with minimal overhead. • Typically they first check if a browser supports an API, and use it if available, otherwise using their own implementation. • Example: HTML 5 cross-browser Polyfill by Paul Irish. Copyright © William El Kaim 2016 46

Slide 47

Slide 47 text

Plan • The Mobile Revolution • The Age of Apps As Service Layer • Evolution of Mobile Software Architecture Native vs. Cross-Platform vs. Web • Backends For Frontends • BackEnd As A Service • Mobile Business Models • The Search for the Ultimate User Experience • Mobile App and App Store • Creating a Private App Store • Lessons Learned and Best Practices • Real Examples Copyright © William El Kaim 2016 47

Slide 48

Slide 48 text

Backends For Frontends From Thick-client Applications To Interfaces Delivered Via The Web • With the advent and success of the web, the de facto way of delivering user interfaces has shifted from thick-client applications to interfaces delivered via the web, a trend that has also enabled the growth of SAAS-based solutions in general. • The benefits of delivering a user interface over the web were: reduction of the cost of releasing a new functionality and the no more client-side installs. Source: Sam Newman Copyright © William El Kaim 2016 48

Slide 49

Slide 49 text

Backends For Frontends From Thick-client Applications To Interfaces Delivered Via The Web From a Typical Enterprise Web Stack To a Full JavaScript Stack Source: IBM Strongloop Copyright © William El Kaim 2016 49

Slide 50

Slide 50 text

Slide 51

Slide 51 text

Backends For Frontends The Single Server-side API • This simpler world didn't last long though, as the age of the mobile followed shortly afterwards. • With a system that had initially been developed with a desktop-web UI in mind, using server-side approach, we now face a problem in accommodating these new types of user interface, as we have a tight coupling between the desktop web UI and the backend services. • The first step in accommodating more than one type of UI is normally to provide a single, server-side API • And add more functionality as required over time to support new types of mobile interaction Source: Sam Newman Copyright © William El Kaim 2016 51

Slide 52

Slide 52 text

Backends For Frontends Issue With The Single Server-side API • If these different UIs want to make the same or very similar sorts of calls, then it can be easy for this sort of general-purpose API to be successful. • However the nature of a mobile experience often differs drastically from a desktop web experience. • So, an additional layer need to be added to the API backend to support mobile interfaces. • To provide functionality to multiple, user-facing applications. This means that the single API backend can become a bottleneck when rolling out new delivery, as so many changes are trying to be made to the same deployable artifact. • It often results also in a team being created specifically • This can make the problem much worse, as now front-end teams have to interface with a separate team to get changes made Copyright © William El Kaim 2016 52

Slide 53

Slide 53 text

Backends For Frontends The Solution … • One solution to this problem is to have one backend per user experience or as Phil Calçado called it a Backend For Frontend (BFF). • Conceptually, you should think of the user-facing application as being two components: • A client-side application living outside your perimeter, • A server-side component (the BFF) inside your perimeter. • The BFF is tightly coupled to a specific user experience • Typically be maintained by the same team as the user interface, thereby making it easier to define and adapt the API as the UI requires • while also simplifying process of lining up release of both the client and server components. Copyright © William El Kaim 2016 53

Slide 54

Slide 54 text

Backends For Frontends “One Experience, One BFF” • The BFF is tightly focused on a single UI, and just that UI. • That allows it to be focused, and will therefore be smaller. • When it comes to delivering the same (or similar) user experience on different mobile platforms it is better to have a single BFF for each different type of client. Copyright © William El Kaim 2016 54

Slide 55

Slide 55 text

Plan • The Mobile Revolution • The Age of Apps As Service Layer • Evolution of Mobile Software Architecture Native vs. Cross-Platform vs. Web • Tools to Build and Manage Mobile App • BackEnd As A Service • Mobile Business Models • The Search for the Ultimate User Experience • Mobile App and App Store • Creating a Private App Store • Lessons Learned and Best Practices • Real Examples Copyright © William El Kaim 2016 55

Slide 56

Slide 56 text

Slide 57

Slide 57 text

Slide 58

Slide 58 text

Tools Examples • Web to Native • Angular + NativeScript • Apache Cordova and PhoneGap • Electron • Hyperloop (Titanium + JS) • Nativescript • REACT Native • Rubymotion • Language Translation • Equela • J2ObjC is an open source tool created by Google to translate Java code into corrresponding Objective- C code that can be run on iOS • Metismo bought by SoftwareAG • Oxidizer • XmlVM • Cross-platform • Apportable • AppCelerator • Configure.it • Embarcadero • Go Language (+ Gomobile) • Ionic • Silver • Xamarin Copyright © William El Kaim 2016 58

Slide 59

Slide 59 text

Slide 60

Slide 60 text

Slide 61

Slide 61 text

Slide 62

Slide 62 text

Slide 63

Slide 63 text

Slide 64

Slide 64 text

Slide 65

Slide 65 text

Slide 66

Slide 66 text

Slide 67

Slide 67 text

Plan • The Mobile Revolution • The Age of Apps As Service Layer • Evolution of Mobile Software Architecture Native vs. Cross-Platform vs. Web • Decision Tree • BackEnd As A Service • Mobile Business Models • The Search for the Ultimate User Experience • Mobile App and App Store • Creating a Private App Store • Lessons Learned and Best Practices • Real Examples Copyright © William El Kaim 2016 67

Slide 68

Slide 68 text

Native or Cross-Platform? • Go Native if: • You have high levels of usage and engagement in your platform and need the performance that coding native will give you across Android, And IoS. • Companies with large user bases, expected high usage rates, and the need for intensive graphic processing should develop native mobile applications. • It may also benefit you to program natively if you are a mobile first company that will not be going the web route. • Go Mobile Site if: • Your site analytics show you need it! Then choose an HTML5 based solution, responsive design method, or build small format html pages with larger elements for touch. • One of the benefits to doing a mobile site is that it can run on any mobile browser unlike native apps that can only run on specific platforms. • You encounter performance issue, and you want to benefit from SEO and Search Engine. Copyright © William El Kaim 2016 68

Slide 69

Slide 69 text

Native or Cross-Platform? • Go Browser-based (Native wrapper) if: • You want to use a single HTML5 technology such as jquery mobile or sencha touch to work across several platforms with only the native wrapper to control your installation. • When building your project in html5 you simultaneously accomplish your mobile site, as the same code can be run uncached via url. • Go Responsive if: • Your company possesses a significant amount of user experience design and development resources capable of maintaining a great brand experience across all unique screen layouts, targeted device resolutions, and screen orientations. • The notion of having one website that can work well on web, mobile and tablet can be really powerful, especially when you’re talking about seo. • Unfortunately, most current responsive designs dilute the overall user experience to accommodate all use cases. Copyright © William El Kaim 2016 69

Slide 70

Slide 70 text

Native or Cross-Platform? Usage, Context and User Segments • Segmentation could also be based on usage frequency (occasional, regular and intensive) and user experience • Mobiles Sites are for occasional users not willing (knowing how) to search/find/install an app, and to multiply this procedure by the number of devices they have (Smartphone, tablets, feature phones, etc.) • Hybrid Apps for users wanting to have access regularly to a first level of service on all features and content available on smartphones and Tablets • Native App for intensive users, using extremely often a precise feature. • Amazon offers a Mobile web site (for occasional shopper) and Dedicated apps for intensive shoppers. • They even offer now dedicated devices. Copyright © William El Kaim 2016 70

Slide 71

Slide 71 text

Plan • The Mobile Revolution • The Age of Apps As Service Layer • Evolution of Mobile Software Architecture • Native vs. Cross-Platform vs. Web BackEnd As A Service • Mobile Business Models • The Search for the Ultimate User Experience • Mobile App and App Store • Creating a Private App Store • Lessons Learned and Best Practices • Real Examples Copyright © William El Kaim 2016 71

Slide 72

Slide 72 text

Slide 73

Slide 73 text

Backend As A Service (BAAS) • BaaS is an approach for providing web and mobile app developers with a way to connect their applications to backend cloud storage and processing while also providing common features such as user management, push notifications, social networking integration, and other features that mobile users demand from their apps these days. • This new breed of BaaS services are provided via custom software development kits (SDK) and application programming interfaces (APIs). • BaaS is a relatively recent development in cloud computing, with most BaaS start-ups dating from 2011 or later. • The global BaaS market is estimated to grow from $216.5 million in 2012 to $7.7 billion in 2017 from a report published by MarketsandMarkets. Source: API Evangelist Copyright © William El Kaim 2016 73

Slide 74

Slide 74 text

Slide 75

Slide 75 text

How Does BaaS Differ From IaaS and PaaS? • Baas has evolved out of frustration around deployment of IaaS platforms like Amazon Web Services, just to fire up a single new mobile application. • BaaS is about abstracting away the complexities of launching and managing your own infrastructure, then bridging a stack of meaningful resources targeting exactly what developers need to build the next generation of mobile apps. • BaaS, has a lot of the same intent as PaaS, to speed up the application development process, but BaaS is purely a backend • Providing an infrastructure that automatically scales and optimizes, bundled with a set of essential resources developers require Source: API Evangelist Copyright © William El Kaim 2016 75

Slide 76

Slide 76 text

What Are The Benefits of BaaS? • Efficiency Gains • Reducing overhead in all aspects of app devt, increasing efficiency at all stages of development • Faster Times to Market • Reducing the obstacles to take a mobile app from idea to production and overhead with operations once in production • App Delivery With Fewer Resources • Optimize for Mobile and Tablets • providers have put a lot of time and resources into optimization of data and network for mobile apps, and reduce fragmentation problems across multiple platforms and devices. • Secure and Scalable Infrastructure • Stack of Common API resources • BaaS brings common and essential 3rd party API resources into a single stack, preventing developers from having to go gather them separately Source: API Evangelist Copyright © William El Kaim 2016 76

Slide 77

Slide 77 text

Slide 78

Slide 78 text

Slide 79

Slide 79 text

Slide 80

Slide 80 text

Slide 81

Slide 81 text

Slide 82

Slide 82 text

Slide 83

Slide 83 text

Other BAAS Providers • Amazon AWS Mobile Services • Anypresence • Apache Usergrid (open source) • Apigee App Services • Apiomat • APISpark • Appery.io • Build.io • IFFT • Iknode • Kidozen • Kinvey • Oracle Mobile Services • Proxomo • RedHat Mobile App Platform • Verivo Akula Copyright © William El Kaim 2016 83

Slide 84

Slide 84 text

Slide 85

Slide 85 text

Plan • The Mobile Revolution • The Age of Apps As Service Layer • Evolution of Mobile Software Architecture • Native vs. Cross-Platform vs. Web • BackEnd As A Service Mobile Business Models • The Search for the Ultimate User Experience • Mobile App and App Store • Creating a Private App Store • Lessons Learned and Best Practices • Real Examples Copyright © William El Kaim 2016 85

Slide 86

Slide 86 text

Key Business Models for Mobile App • Freemium • Free To Play • Pay per Download • In-app Payment (micro-transaction) • Subscription • M-commerce • Advertising: display • Affiliation (coupons, etc…) Copyright © William El Kaim 2016 86

Slide 87

Slide 87 text

Key Business Models for Mobile App Freemium • Free to download and obtain the basic usage of the App, but if a user wants to have an even better experience, they can pay for more. • Advantages • Get as many users as possible to the pay threshold as quickly as possible, by enticing them to go further with the experience. • Provide enough in the Free Version of the Application to build interest and stickiness for a period of time. • Huge download make you visible in the appstore • Drawbacks • Conversion rate to paid version are very low … Copyright © William El Kaim 2016 87

Slide 88

Slide 88 text

Key Business Models for Mobile App Free to Play • F2P is the hottest new category of direct monetization today! • Advantages • play the game, or use the application for free, but advance more quickly through the game by buying virtual goods. • This monetization model can incorporate other forms of monetization for these virtual goods—in-app payment, offers, or in-app advertising. • Some publishers allow players or users to purchase virtual goods in exchange for watching advertising, and then the publishers get paid directly by the advertisers. • Drawbacks • Mainly Adapted to Games … Copyright © William El Kaim 2016 88

Slide 89

Slide 89 text

Key Business Models for Mobile App Pay per download • The user must pay to download the mobile app. • Advantages • Product is paid immediately (at the source) and revenue are easy to track • Good model for transient hits with big buzz (short-lived) • Drawbacks • Users do not pay an app without testing it. • Android capability to get refund if you’re not satisfied with the app is use to crack app • Prefer creating a “lite” functioning version instead • Price for the most downloaded app is around 1-2 euro • Need high volume. • A costly app is not highly bought and not visible in top 15/50 apps. • No recurring fees (once paid, you’re done …) Copyright © William El Kaim 2016 89

Slide 90

Slide 90 text

Key Business Models for Mobile App In-app Payment (micro-transaction) • Use micro-payment within your application, mainly for digital goods buying. • Charge inside the application itself to unlock more features and capabilities. • Advantages • Recurring fees • Micro payment is simple to use (today mainly on iOS) and favor impulsive buying • Drawbacks • Need to use the specific API of each Appstore • Difficult to add without sacrifying in the App User Experience Copyright © William El Kaim 2016 90

Slide 91

Slide 91 text

Key Business Models for Mobile App Subscription • Users must subscribe to pre-defined set of services (package) leading to a recurring monthly or yearly fee. • Advantages • Couple Mobile/desktop experience. • Recurring Fees • Price is defined freely by app editor (not limited by micropayment). • Drawbacks • You need to offer a great level of service to keep your clients over time • Better adapted to news/publishing genre Copyright © William El Kaim 2016 91

Slide 92

Slide 92 text

Key Business Models for Mobile App M-commerce • Generally users for buying physical goods • Advantages • Very promising approach, not fully used yet • ebay estimates 1.5 B buying's through its mobile app in 2010 • Today lots of app used for shopping phase • Drawbacks • Payment system still the first barrier of adoption • user needs to enter its Credit card information or to use its existing account at the merchant or a standard Paypal, Google Checkout or Amazon one. • Customers not yet fully accustomed with mobile e-commerce • PCI compliance should be ensured Copyright © William El Kaim 2016 92

Slide 93

Slide 93 text

Key Business Models for Mobile App Advertising • Classic model for advertising (CPC, or CPM). The more the ads are displayed and clicked, the more you earn money. • There are several business models to consider for mobile advertising and over 200 companies • Advantages • Easy to setup (need to use an ad agency). • CPM et CPC higher than the ones on the web. • Drawbacks • Requires a huge volume of downloaded apps • Could be intrusive and painful for the user Copyright © William El Kaim 2016 93

Slide 94

Slide 94 text

Key Business Models for Mobile App Mobile Advertising: Blind Networks • On one end of the spectrum is Blind Networks, which work on a CPC basis (cost per click). • These networks serve a high volume of advertising largely from independent mobile app developers and offer self-service tools to help advertisers track and optimize campaigns. • Blind networks include companies like AdMob, InMobi, Madvertise, Adfonic, and BuzzCity. Copyright © William El Kaim 2016 94

Slide 95

Slide 95 text

Key Business Models for Mobile App Mobile Advertising: Premium Ad Networks • On the other end of the spectrum are Premium Ad Networks tend to focus mostly on brand advertising CPM campaigns and therefore use a smaller number of more premium publishers like big-ticket mobile sites, mobile operators, and top-tier publishers. • Premium networks can also offer performance advertising (CPC), but the cost of running these campaigns is typically much more expensive than it would be on a blind ad network. • Sometimes CPA (cost per action/acquisition) is also available through Premium networks. Copyright © William El Kaim 2016 95

Slide 96

Slide 96 text

Key Business Models for Mobile App Mobile Advertising: Premium Blind Networks • Premium blind networks fall somewhere in the middle of Blind networks and Premium networks. • They typically have a higher number of premium publishers than blind networks and attract a higher proportion of brand advertisers. • Premium blind networks usually offer both CPC advertising as well as CPM. • The cost of advertising on these networks varies significantly and is often negotiable. • Premium blind networks include Millennial Media, Greystripe, Jumptap and others. Copyright © William El Kaim 2016 96

Slide 97

Slide 97 text

Key Business Models for Mobile App Mobile Advertising: Ad Exchange • An Ad Exchange enables cross-platform mobile application developers to maximize revenues with one embedded SDK that serves ads from multiple ad providers. • Inneractive, Tapjoy, Mobclix, Smaato and Nexage. • An Ad Exchange partners with global ad networks and local premium agencies to provide developers a global coverage of local-targeted ads. • The exchange provides high fill rates, CTR and eCPM. • An exchange also offers developers and brands to directly buy inventory from publishers to run their own campaigns on. • An App Monetization Exchange is the next generation of Ad Exchanges offering multi-monetization streams on top of Display and Rich Media ads, including Search, Hyper-Local and virtual Currency, all integrated to a single robust SDK, which is offered by companies like Inneractive. Copyright © William El Kaim 2016 97

Slide 98

Slide 98 text

Key Business Models for Mobile App Mobile Advertising: Recommendations • If you plan to manage mobile advertising on your own, don’t put all of your eggs in one basket. • Test different advertising channels to see which work best before making too large of an investment in any one network. • If you invest the time in getting to know folks at mobile ad networks, you should be able to get a few test campaigns for free or at a reduced rate to trial the network. • Focus on the Primary Countries • In terms of geographies, the following locations consistently produce a relatively high CTR, and advertisers recognize the quality of the clicks from the following locations by paying more per click • U.S, UK, Italy, Spain, South Africa, Australia Copyright © William El Kaim 2016 98

Slide 99

Slide 99 text

Key Business Models for Mobile App Affiliation (coupons, etc.) • Like on the web, you earn money through your users actions’ (like bringing new client to a supplier loyalty card web site) • Advantages • High revenue per action • Couponing on mobile web phone seems to have a great future • Drawbacks • Need to have huge downloads volumes, since conversion rates are generally very low (1% to 3% - 3% in Travel). Copyright © William El Kaim 2016 99

Slide 100

Slide 100 text

Plan • The Mobile Revolution • The Age of Apps As Service Layer • Evolution of Mobile Software Architecture • Native vs. Cross-Platform vs. Web • BackEnd As A Service • Mobile Business Models The Search for the Ultimate User Experience • Mobile App and App Store • Creating a Private App Store • Lessons Learned and Best Practices • Real Examples Copyright © William El Kaim 2016 100

Slide 101

Slide 101 text

Slide 102

Slide 102 text

Slide 103

Slide 103 text

Good User Experience Recipes • GoodUI: 75 GoodUI ideas that we are about to show you, are being actively A/B tested by us and others. • User Interface Design patterns: recurring solutions that solve common design problems. • Dark Patterns: fighting user deception worldwide • UX Companion: A handy glossary of user experience (UX) theories, tools and principles. • Service Design Tools: Open Collection of communication tools • Microinteractions: The Secret of Great App Design • Web Design Newsletter • InspireUX: Digital newspaper Copyright © William El Kaim 2016 103

Slide 104

Slide 104 text

Wireframe and Prototyping • JustinMind & Axure: Industry leading tool widely used. • Adobe Experience Design & InDesign: if you can afford them! • inVision, Marvel or UXPin: Focus on prototyping and collaboration • Uxtools:Tools Comparison • Atomic • Basalmiq • Codepen • Framerjs • Origami by Facebook • Sketch and Xcode (tutorial) • Wireframe.cc Copyright © William El Kaim 2016 104

Slide 105

Slide 105 text

Slide 106

Slide 106 text

Slide 107

Slide 107 text

Interesting Tools • Elasticode: Optimize Mobile User Onboarding • Patternry: Build, manage and share living style guides and design systems • VerifyApp: Pre-development A/B Testing, design surveys, etc. • SolidifyApp: Multi-device user testing, behavior analysis, etc. User Testing • MindNode: For paper-less brainstorming of site user flows, etc. • Lucid Chart: For clean and fast process flow creation for digital strategies, and site architecture maps. • Random User Generator: A free, open- source API for generating random user data. Like Lorem Ipsum, but for people • Keynotopia: Transforms Keynote and PowerPoint into mobile, web and desktop app mockups/ • FullStory: lets your company easily record, replay, search, and analyze each user's actual experience with your website • FastLane: Automate build and release of iOS and Android apps Copyright © William El Kaim 2016 107

Slide 108

Slide 108 text

Slide 109

Slide 109 text

Google RAIL Performance Model • Focus on the user • The end goal isn't to make your site perform fast on any specific device. • Respond to users immediately • Acknowledge user input in under 100ms. • Render each frame in under 16ms and aim for consistency • Maximize main thread idle time. • Keep users engaged • Deliver interactive content in under 1000ms. https://developers.google.com/web/fundamentals/performance/rail Copyright © William El Kaim 2016 109

Slide 110

Slide 110 text

Slide 111

Slide 111 text

The House of Cards • Touch screens and, more recently, weareable devices are beginning to change the dynamics of content consumption • While most apps still ask to use fingers and thumbs to scroll down pages of content and poke at buttons, they are now increasingly favoring gestures • swiping, pinching, tapping, and even clawing • With apps like Apple’s Siri and Google Now, developers should be looking to a far more futuristic paradigm: the natural-language, contextually aware human-computer “conversation.” • Move from “applications” to “in context cards” (like Google Now cards or Apple Passbook) • Wearable devices using voice command Copyright © William El Kaim 2016 111

Slide 112

Slide 112 text

Information Pushed To Me In Context • Load contextual content onto the “back” of a card to design a distraction-free front side that well shows off the anchor content. • Many of cards (built in HTML5) will ultimately be portable • They can be transported intact from app to app, platform to platform without losing their design context or in-built architecture. • Examples • Cards are now a major feature of Google+ and Google Maps, complementing the existing experience on Google’s newest and most innovative projects, Glass and Google Now (opening its API …) • Apple Passbook • Twitter cards • Summary Card, Large Image Summary Card, Photo Card, Gallery Card, App Card, Player Card, Product Card Copyright © William El Kaim 2016 112

Slide 113

Slide 113 text

Slide 114

Slide 114 text

Plan • The Mobile Revolution • The Age of Apps As Service Layer • Evolution of Mobile Software Architecture • Native vs. Cross-Platform vs. Web • BackEnd As A Service • Mobile Business Models • The Search for the Ultimate User Experience Mobile App and App Store • Creating a Private App Store • Lessons Learned and Best Practices • Real Examples Copyright © William El Kaim 2016 114

Slide 115

Slide 115 text

Mobile App and App Store: Introduction • App Stores are a great way to reach potential customers and users of your apps • They offer relatively easy reach to a huge range of people, and handle the billing and delivery of your products. • But while they may provide a nice storefront, they don’t do a lot to help market your apps • Submitting an application to an App Store is often times more difficult and time-consuming than you’d expect • This burden, added to the ongoing management of each submission, means it’s likely that you will want to choose a small number of stores to work with, rather trying to hit most of the 120+ that exist. • Some App Stores make difference between B2C store (public), B2B store and B2E (enterprise) • Apple is offering different types of developer subscriptions Copyright © William El Kaim 2016 115

Slide 116

Slide 116 text

Choosing Your App Stores • Major Platform Stores • These remain the most likely place users will go looking for apps, so even if your outside marketing may focus on other stores, it’s worth putting your apps in these. • Apple itunes store, Google Google play, and Microsoft Marketplace • Niche Market Stores • Does your app have a strong draw to a particular market niche, based on geography, type of content, or even device type? • For instance, if you have an app for Android tablets, there are stores that focus on them; local stores such as Yandex in Russia have strong user bases; if your app appeals to bookworms, you might want to check out the Barnes and Noble NOOK store; and so on. • These smaller stores often attract more dedicated users—and offer up a smaller pool of applications and have stronger marketing outreach. Copyright © William El Kaim 2016 116

Slide 117

Slide 117 text

Choosing Your App Stores • Operator Stores • Many mobile operators now support their own App Stores , which can offer a few benefits. • Many of them support carrier billing, which has been shown to have a dramatic increase on app sales. • Others can offer marketing support, such as featured placement, advertising on operator web sites and other collateral, and more. • However, working with these stores and operators can often be a time-consuming and slow-moving process, so it definitely is a risk-reward scenario. • Another good angle here is to look outside your home market: many operators from smaller markets are now actively recruiting applications for their stores, and are willing to help with converting them to local languages and marketing them to their user base. Copyright © William El Kaim 2016 117

Slide 118

Slide 118 text

Slide 119

Slide 119 text

Multi-store vs. Single-Store • Many developers take only a single-store strategy, but • Many successful developers work with multiple stores to maximize their exposure and use different business models (such as ad supported vs. paid download) to maximize their revenues. Copyright © William El Kaim 2016 119

Slide 120

Slide 120 text

Public Marketplace Management Apple • Each Marketplace provides its own legal contracts, payment solutions and way of working. • Apple is by far the most complex. • Guide available here • Two different subscriptions mode exist • Developer for publishing in itunes (cost per year $99) and enterprise for the employees, not in the store (cost per year $299) • https://developer.apple.com/ • Submit an app for the store • Validation time is around one or two weeks, and cost nothing • Payments • Managed by the store Copyright © William El Kaim 2016 120

Slide 121

Slide 121 text

Public Marketplace Management Deploying the App in Itunes Connect • Itunes Connect is used for managing the app in the marketplace once developped • https://itunesconnect.apple.com/WebO bjects/iTunesConnect.woa • Certificates • Are created in the marketplace • Proves that the person or organization uploading the code is the app owner, which has legal and Sales implications • Are used to encrypt the app, to enforce our ownership and forbid piracy Copyright © William El Kaim 2016 121

Slide 122

Slide 122 text

Public Marketplace Management Deploying the App in Itunes Connect • To deploy an app to the marketplace you have to provide • The app Logo • The app category (travel, etc.) • The app keywords • The app version number and Description of features • The app screenshots • The languages supported • Test account for Marketplace to test the app • Link to the company web site owning the app • Link to the company support web site • Its price tiers (you can not put 37,52$, you have to follow a grid of pricing) • Etc. Copyright © William El Kaim 2016 122

Slide 123

Slide 123 text

Slide 124

Slide 124 text

Slide 125

Slide 125 text

Slide 126

Slide 126 text

Slide 127

Slide 127 text

Slide 128

Slide 128 text

Public Marketplace Management Marketing the App • The app is now in marketplaces, so it’s time to do digital and print marketing to • Make people aware of this app • to boost download or in-app purchase • For example • Create a dedicated microsite • Send newsletter • Create ad banner • Acquistion per user is around several dollars Copyright © William El Kaim 2016 128

Slide 129

Slide 129 text

Slide 130

Slide 130 text

Slide 131

Slide 131 text

Lifecycle of an App Supporting the App • The support web site or the dedicated email address for feedback need to be monitored • Bugs need to be found and solved • Every comment put in Marketplace along with a rating could not be commented • Except in Google Play, where owner can now answer comments • 90% of apps downloaded are the ones found in the top 10 visible in the marketplace landing page or featured for a day or a week in marketplace • Several alternative marketplaces exist for Android like Amazon app store, GetJar, Slide Me, Appoke, appbrain • Or make a deal with phone or Telco to pre-install the app Copyright © William El Kaim 2016 131

Slide 132

Slide 132 text

Other Public Marketplaces Management • Android • Very different from previous ones • Requires a gmail address, One time fee =25€ • Recognize only a developer, not an enterprise. • http://support.google.com/googleplay/android-developer/bin/answer.py?hl=en&answer=113474 • Now require usage of Google Pay • Mobile Web Site • No marketplace exit today for mobile web site yet. • Payment • Payment could be done using a credit card payment solution or via a mobile payment company (Boku, Zong, Paypal, Amazon, google, Facecash, Square) Copyright © William El Kaim 2016 132

Slide 133

Slide 133 text

Plan • The Mobile Revolution • Evolution of Mobile Software Architecture • Mobile Business Models • The Search for the Ultimate User Experience • Native vs. Cross-Platform vs. Web • BackEnd As A Service • Mobile App and App Store Creating a Private App Store • Lessons Learned and Best Practices • Real Examples Copyright © William El Kaim 2016 133

Slide 134

Slide 134 text

Corporate Application Store Cornerstone Of Mobile Management Services • The mobile application store is the central source of corporate-approved applications that have been developed internally or by external, third-party resources. • Employees use a self-service approach to download role-specific line-of- business applications, as well as horizontal applications (time capture and expense reporting). • Factors driving the use of internal versus external mobile applications include availability of mobile application development expertise, back-end system interface requirements, security, and need for control. • Providers will vet third-party applications to ensure they meet usability, security, and scalability requirements before they can reside on the corporate mobile app store. • Over time, these corporate application stores will evolve beyond employee focused stores to include applications for customers, partners, and suppliers. Copyright © William El Kaim 2016 134

Slide 135

Slide 135 text

Slide 136

Slide 136 text

Corporate Application Store Pricing Model • Pricing models will evolve away from per-device models toward per-user models • Today many of the pricing models are based on a per-device, per-month model. • This pricing model is appropriate if employees carry one type of mobile device or smartphone. • However, some mobile worker segments such as corporate executives or sales professionals use two or more mobile devices (e.g., smartphones, tablets) to access work-related mobile applications. Copyright © William El Kaim 2016 136

Slide 137

Slide 137 text

Slide 138

Slide 138 text

Slide 139

Slide 139 text

Slide 140

Slide 140 text

Plan • The Mobile Revolution • The Age of Apps As Service Layer • Evolution of Mobile Software Architecture • Native vs. Cross-Platform vs. Web • BackEnd As A Service • Mobile Business Models • The Search for the Ultimate User Experience • Mobile App and App Store • Creating a Private App Store Lessons Learned and Best Practices • Real Examples Copyright © William El Kaim 2016 140

Slide 141

Slide 141 text

Craftsmanship is key • Craftsmanship is key • You need to master and DO some key phases of the building process of your product (get your own mobile developers). • The company publishing the app in the marketplace is the owner of the app • The learning curve for mobile is quite high • We began by app made by suppliers • Then we built our apps, with all content store locally • Now we want to sell app to the world, put advertising and in-app purchase • Not one size fits all • Do not neglect mobile web site for occasional users and SEO. • Native app for “heavy user”. Copyright © William El Kaim 2016 141

Slide 142

Slide 142 text

Make Some Noise … • Bought media • Refers to media/ads that are purchased through either third party ad networks, or platforms like Google Adwords to drive traffic to your app. • The average CPA for this activity is roughly $2–$3 per user! • Owned media • Media properties that YOU own that, if managed well through community outreach, can serve to drive traffic. • These include your website, social media properties, as well as the app description itself, which often determines whether someone will • Earned media • Refers to 3rd party “endorsements” who then act as referral sources for your app. • This could include everything from a popular blog that reviews your app to a top tier media outlet like Mashable covering your app in a roundup or feature story. Copyright © William El Kaim 2016 142

Slide 143

Slide 143 text

Measure Customer Engagement with Key Performance Indicators (KPIs) • Your Key Performance Indicators (KPIs) will be unique to your specific app, but there are six basics that apply to everyone: • New Users: These are the users who have downloaded and launched your app for the first time. • Active Users: A user is defined as “active” if they have launched an app during a specific time frame. Common measures of active users are Daily Active Users (DAUs), Weekly Active Users (WAUs), and Monthly Active Users (WAUs). • Engagement: DAU/MAU is an indication of how sticky an app is. • Retention: Retention measures the percent of new users who come back within a specified period of time. Common measures are 1-day, 3-day, and 7-day retention. • Frequency of Use: show how often users interact with an app. • Session Length: how long a user spends in an app. Copyright © William El Kaim 2016 143

Slide 144

Slide 144 text

Carefully Select and Manage App Stores • Mobile is by essence cross-functional and any group within the company could need to build a mobile app or a mobile web site • New roles and responsibility in the company • Digital • Create your own App Store for Internal app • Use Public store for external app. • Define the process to publish an app • Create plan for app marketing … • Select countries where to launch your app • Internationalize when possible • Business model: Free/freemium/paid/ads Copyright © William El Kaim 2016 144

Slide 145

Slide 145 text

Never Under-Estimate Back Office and API Serving Your App • Mobile is driving the adoption of API/Cloud in the enterprise • Mobile needs access to Internal company systems and services, so Open-up … with API and Backend as a service • Make sure the architecture accounts for cloud-based data delivery, with the flexibility to run on public and private clouds. • Hardware / Platform flexibility • Enterprises need to support new platforms all the time because their employees use all kinds of devices and OS platforms (BYOD trend). • Apps need to run on all those platforms, and therefore, the mobile developer needs the freedom and choice to use the best SDK that fits the app experience required. Don’t lock them in. Copyright © William El Kaim 2016 145

Slide 146

Slide 146 text

Be Strong on Security and Compliance • Enable agility with security • Enterprise mobile developers need to build and launch apps quickly, while IT still needs the solution to be compliant with their governance needs. • Mobilize legacy enterprise data and authentication systems • Securely connect mobile apps with on-premise systems that sit inside enterprise firewalls. • Ensure secure, compliant app use • Monitor data on the network, ensure only authorized users have access to the app, every transaction is recorded for audit, and apps, users and data can be de-provisioned on-demand. • Do not forget Data Protection and Usage License Agreement (terms & conditions) • Can be extremely costly the first time if you involve legal support Copyright © William El Kaim 2016 146

Slide 147

Slide 147 text

What is needed • A clear way of how to use which brand for what kind of apps • look and feel and digital marketing + external/internal communication • A process for approving release of an App internally or publically and the associated steering committee • People in charge of managing market place for all mobile projects • Impact sales and download, legal duty, IP, etc. • A unique Legal Contact – terms of use for apps • Already done, Innovation paid for this several times • An operational support process and team • Later • A Finance/tax contact + bank account + mobile payment solution Copyright © William El Kaim 2016 147

Slide 148

Slide 148 text

Plan • The Mobile Revolution • The Age of Apps As Service Layer • Evolution of Mobile Software Architecture • Native vs. Cross-Platform vs. Web • BackEnd As A Service • Mobile Business Models • The Search for the Ultimate User Experience • Mobile App and App Store • Creating a Private App Store • Lessons Learned and Best Practices Real Examples Copyright © William El Kaim 2016 148

Slide 149

Slide 149 text

CWT Reports TMI Digital Publications App • The CWT Travel Management Institute conducts in-depth research into effective travel management practices to help clients worldwide derive the greatest value from their travel program. • Providing all CWT Travel Management Institute publications on tablets • iPad and Android • Enabling automatic notifications of latest studies • Providing dynamic and immersive digital access to Information • Interactive graphics for quick and better understanding • Videos • Sharing to Social Media Copyright © William El Kaim 2016 149

Slide 150

Slide 150 text

CWT Reports Looking for the Best Solution • Start with Mockup (wireframe) • Then select Technologies • Evaluate the Cost • Launch the development • Test • App marketing Copyright © William El Kaim 2016 150

Slide 151

Slide 151 text

Slide 152

Slide 152 text

CWT Reports Step 2: Creation of The App • Decision taken to in-source the development from the same team doing the “print” version • Use Adobe Digital Publishing Saas Platform • Enable to reuse Adobe Tooling • Some JavaScript to be done to make it more interactive • Better control of cost and delay Copyright © William El Kaim 2016 152

Slide 153

Slide 153 text

Slide 154

Slide 154 text

Slide 155

Slide 155 text

CWT 78BizDays App Objectives • A tool that will help global business executives and personal travelers plan international phone and in place meetings or events more easily. • Makes it easy to find the right day and the right time to schedule your next meeting! • 78BizDays is both available as • A free web site (with advertising), dedicated to assistant and travel / organizer arranger • A free Apple iOS app with 2 months of data free and in-app buying for 3, 6 or 1 year of data. Copyright © William El Kaim 2016 155

Slide 156

Slide 156 text

Slide 157

Slide 157 text

Slide 158

Slide 158 text

Slide 159

Slide 159 text

Slide 160

Slide 160 text

Twitter http://www.twitter.com/welkaim SlideShare http://www.slideshare.net/welkaim EA Digital Codex http://www.eacodex.com/ Linkedin http://fr.linkedin.com/in/williamelkaim Claudine O'Sullivan Copyright © William El Kaim 2016 160