mentormate.com | 3036 Hennepin Avenue, Minneapolis, MN 55408 | 855-577-1671

How Xamarin Is Revolutionizing Mobile Development

A Look at the Business Case and Strategies for Building Cross-Platform Software

The business case for Xamarin 1 Solving the impossible development equation 2

Introducing Xamarin 3

The promise of Xamarin 4

Xamarin's impressive playbook 5

What is Xamarin? 6

Exploring the Xamarin suite 8

Choosing a Xamarin approach 9

Comparing Xamarin.Forms and Xamarin.iOS & Xamarin.Android 10

Actual vs. perceived cost savings in cross-platform development 11

Developing with Xamarin 12 Structuring development with Xamarin.Forms 13

Visualizing Xamarin.Forms development 14

Elements of Xamarin.Forms 15

What makes Xamarin development unique 16

Developing using the Model View Viewmodel approach 17

Table of Contents

Designing with Xamarin.Forms 18What the Model View ViewModel approach means for design 19

Xamarin.Forms design principles 20

The Great (Design) Compromise 21

Building the right cross-functional team 22

Benefits of Xamarin development 23 Reduce your total cost of cross-platform mobile app ownership 24

Decrease the cost and size of your development team 25

Rapidly create a fluid user experience 26

Test smarter 27

The business case for Xamarin

1

Startups and enterprise companies differ in many ways — manpower, capital, risk-tolerance. But, they can agree on one thing. They all want to develop mobile apps launching across multiple platforms with a smaller team, in less time and for fewer dollars spent. Solving this equation represents the holy grail for product owners and development teams alike. And, it may sound impossible. It’s not.

Cross-platform development with Xamarin allows teams to create fully native apps using the same code base, Visual C#. Depending on the Xamarin platform, teams can reach as high as 90% code reuse in developing mobile apps for iOS, Android and Windows. Writing code once and drawing from the same library saves on code redundancy, upkeep and time.

Solving the impossible development equation

2

Xamarin first arrived on the scene in 2011, invented by the engineers who created Mono, Mono for Android and MonoTouch. Mono itself dates back to 2001 as an open source effort to allow applications built on .NET to run on the Linux operating system.

Since it’s launch, Xamarin has continued to climb in popularity. Over 1 million developers and 15,000 top brands use Xamarin from Dow Jones to Kimberly Clark, Kellogg to JetBlue. In fact, JetBlue’s Xamarin app is what allows the progressive airline to accept Apple Pay in the first place.

Introducing Xamarin

3

With the potential to run Xamarin on 2.6 billion devices globally, the opportunity for businesses to develop once and release multiple outputs is a compelling one — especially for companies with an eye toward internal software development.

Unlike direct-to-consumer development, line of business apps are built to be efficiently and economically maintained. According to one article published this year, 90% of enterprise businesses plan to increase mobile development, following a survey of 200 IT decision makers in the U.S. and Europe.

The promise of Xamarin

4

Xamarin’s impressive playbook

$82 million Funding raised to date

$54 million Raised in Series C funding

Investment firms include Floodgate, Ignition Partners, Lead Edge Capital, Insight

Venture Partners and Charles River Ventures

5

The acquisition of the San Francisco startup by Microsoft as a means to expand its mobile relevance beyond phones running Windows belies just how much clout Xamarin has in the business community.

What Xamarin is:

• A fully-featured cross-platform mobile development tool able to share business logic and code to deliver fully native apps

• A means to leverage Microsoft’s Visual C# programming language with the powerful capabilities of the .NET framework

What is Xamarin?

What Xamarin is not:

• A programming language in and of itself• A software framework

6

What’s so great about C#?

Anything being considered for development with Java, Objective-C and Swift can be accomplished with the Xamarin platform, C# and .NET, allowing for the reuse of any existing .NET libraries and interfaces. Using Xamarin a few lines of code allows developers to add over 300 integrations to an

app — from backend systems to cloud services.

7

Exploring the Xamarin suite

Xamarin.Forms: API used to design an experience across the iOS, Android and Windows platforms leveraging native controls (Considered by many a cross-platform UI toolkit)

Xamarin.iOS & Xamarin.Android: Development environments used to build and deploy platform-specific C# code

Xamarin Test Cloud: Used to automate mobile application testing .NET Mobility Scanner: Used to identify how much of your existing code can run on all three mobile platforms. >> Watch demonstration

Xamarin Studio & Xamarin for Visual Studio: Integrated development environments where the C# code base is developed

8

There are two ways to approach development with Xamarin: 1) Using Xamarin.Forms or 2) Using Xamarin.iOS and Xamarin.Android

Choosing a Xamarin approach

The approach chosen significantly impacts the amount of code reuse that can be accomplished and the associated cost savings.

Xamarin.Forms is an API and associated UI toolkit that allows the creation of a complete user experience which computes on iOS, Android and Windows phones. Choosing from a library of over 40 interactions and controls with the possibility for customization, the UI/UX is built once and mapped to all devices.

For more complex workflows or more intensive data entry, use of peripheral devices or technologies and a user experience consistent with other native apps on their OS of choice, Xamarin.Forms may not be a good choice. Xamarin.iOS and Xamarin.Android allow for much deeper platform-specific customization, though code reuse and cost savings are limited. Instead with this option, the software team continues to develop in C#, but code must be rewritten to accommodate all platform specifications.

9

Xamarin.forms

• Can reuse 80-90% of the code• Code is built in Xamarin Studio or Visual Studio• Code applies and universally computes across iOS,

Android and Windows mobile platforms• Data transfer objects (DTOs), business logic and all

user experience assets can be reused• Built with C# and .NET framework

Xamarin.iOS / Xamarin.Android

• Can reuse roughly 30% of the code• Code is built in Xamarin.iOS or Xamarin.Android for

Visual Studio • Developers build multiple platform-specific experiences• Only data transfer objects and business logic can be

reused• Built with platform-specific C# and .NET framework

Limitations: Controls in Xamarin.Forms only support the functionalitythat is present on all three platforms — functionality ismore limited compared to a standalone native app Choose if: Code sharing and cost savings outweigh need for UI control

Comparing Xamarin.Forms and Xamarin.iOS / Xamarin.Android

Limitations: Code reuse and cost savings are limited compared to Xamarin.Forms Choose if: UI and experience can’t be compromised, and there are many specialized experiences

10

Actual vs. perceived cost savings in cross-platform developmentBuilding native user interfaces with Xamarin.iOS and Xamarin.Android still allows project teams to reuse some code, business logic and the portable class library. Though for cash-strapped or agile-minded organizations, the prospect of redeveloping 70% of an app to release it on a secondary platform is often less than ideal.

Beyond that, teams choosing to customize the UX for each platform are saving some labor costs by limiting the development languages. Though, they are still developing the same type of team used to build a native app. Members with platform-specific expertise are needed to interpret the C# code, rebuild the UI, flow, layouts and apply it to any platform-specific APIs. The project continues to be bound by a “learning curve.”

Comparatively, using Xamarin.Forms, the same developer would be able to build the experience for iOS, Android and Windows with the same C# code base — no adjustments required. Xamarin.Forms then abstracts that experience automatically. Choosing to build the experience in Xamarin.Forms could save as much as 2.5x cost savings.

11

Developing with Xamarin

12

Structuring development with Xamarin.Forms

Structuring development with Xamarin.Forms begins at the most fundamental level with storage. Next comes an API to provide data access and business logic for the app. This is where your portable class library is defined and data handed back and forth from the server to the client.

The user experience for apps created with Xamarin.Forms is structured using Model View ViewModel.

Model ViewViewModel explained The software architecture whereby data is bound two ways within views allowing the state and behavior to be abstracted for increased flexibility accommodating user interface platform changes.

Portable class libraryA portable class library (PCL) is a common library for functionality like business rules, network, cryptopgraphy and storage that can be compiled once and used on any operating system.

13

UI Flow Layout MVVM

iOS

Android

Windows

API

What makes an app “native”? If the UI feels native, it performs like a native app (even when offline) and affords access to all device APIs — the app can be considered native. Native also means that the app is compiled to byte code that runs directly on the processor of the device. This gives the highest performance possible on that device. According to these definitions, Xamarin is the only cross-platform tool that creates fully-native apps.

Visualizing Xamarin.Forms development

Each page in Xamarin.Forms is developed as a single screen then applied across all three platforms. These include labels, lists, buttons and layouts (that when linked with the backend) constitute a fully-native app.

Model View ViewModel - Xamarin.Forms

80% - 90%

DTO's & Business

Logic

14

Elements of Xamarin.Forms

Examples of pages• ContentPage• NavigationPage• Tabbed Page• CarouselPage

Examples of layouts• StackLayout• AbsoluteLayout• RelativeLayout• GridLayout

Control examples• TableView• TimePicker• Slider• SearchBar

Custom controlXamarin.Forms also allows you to customize and define your own controls. Some of the examples MentorMate has created include: Carousel control with paging and swipe gestures; circular image control which is clickable, checkable and bindable; custom date/time pickers and image buttons.

View more.

15

What makes Xamarin development unique

Without a cross-platform development tool, teams developing mobile applications for Android and iOS used to create and maintain different DTOs in different programming languages and would have to keep them in sync with the backend system by hand. They would be created in Java for the Android app, Objective-C for iOS apps — and on. With Xamarin.Forms and Xamarin.iOS/Xamarin.Android development, PCL is created and defined only once in .NET serving as a single source for all DTOs on the clients. If the backend system is also .NET, then the same PCL can be used there as well.

Effort optimized

With Xamarin, code works harder for your team. Using an API to pull DTOs may seem like a lot of upfront work, especially for development teams who lament the days when a data field could be called directly from the server and displayed on the page. Maintaining four sets of DTO definitions isn’t excessive — they might say. That is, unless they maintain multiple server versions running for different customers and until a mistake makes it into the field. New clients need to be tested against all old server versions. Suddenly the ROI of an API pulling from a singular PCL becomes apparent.

Using a single PCL accounts for approximately 10% of the code reuse that can be realized with Xamarin.

16

Developing using the Model View ViewModel

Using this software architecture approach, a viewmodel is defined once. Associated graphic entities and text fields are then bound to it. That way when the viewmodel changes (depending on the screen size or operating system) the assets on the screen respond accordingly. Defining a viewmodel in Xamarin is much like its definition with Angular.JS.

Unlike developing design screen-by-screen for each device. Once a change is made to a page in Xamarin.Forms, it is reflected across screens on all operating systems alleviating teams from the burden of updating the logic for each screen.

Benefits of MVVM

Using the Model View ViewModel approach UI and business logic can be separated when delivering data representations across platforms.

Using this architecture, your solution can run dozens of operations asynchronously (in parallel) vastly speeding data load times within your experience. The alternative is a waiting game no user wants to play.

17

Designing with Xamarin.Forms

18

When designers approach creating a mobile experience with Xamarin.Forms, they must begin by thinking about the universal thread. What elements and functionality are consistent across all experiences? How can this be cleanly represented?

It’s a more disciplined process requiring deep knowledge of interaction patterns across all three operating systems. Design decisions must be based on universal patterns rather than interactions that might delight an Android user and confuse an iOS user. Designing with Xamarin.Forms to define the user experience including the UI, layout, flow and graphic entities once is where the real benefit of code reuse becomes clear — up to 80-90%.

Though some platform-specific behavior can be defined using Xamarin.Forms with DependencyService.

What the Model View ViewModel means for design

19

Xamarin.Forms design principles

Strive to create a universal understanding.1. Study the limitations

of each platform.4.Think across platforms. Just like your development will be.2. Synthesize first.

Design second.5.Don’t assume functionality across platforms is apples to apples in applying the C# to the SDK.

3. Avoid the temptation to abandon familiar interaction patterns.

6.

20

There’s a classic tension between designers and developers — designers delivering UX/UI that can’t be implemented technically, and developers pushing back and failing to creatively implement solutions to realize the experience. Aligning developers and designers is critical to achieving elegant UI with Xamarin.Forms.

Rather than leading with UX/UI, understand the limitations of the platform and craft beautifully within those bounds. Granted, the concessions made to achieve cost savings with Xamarin.Forms will not make or break the experience. It’s much like considering the control of nonresponsive design compared to the slightly less control responsive design affords creative teams. Though (worth noting) if more specificity is needed, developers can build a custom renderer.

The Great (Design) Compromise

Letting goIn the old world, designs were needed for every page on every form factor. In the new world, Xamarin.Forms offers the chance to create a universal experience that can be applied and scaled regardless of the form factor and operating system. Embrace it.

21

Working with Xamarin.Forms requires a shift in approach and process for developers and designers. Cost savings starts with conceding the control native development affords. It starts with building the right team.

Appoint a cross-platform champion on your team or work with one.

Many designers are reticent to give up control or aren’t well-versed in the intricacies and limitations of Xamarin.Forms development. Before the experience of a solution can be elevated, teams must invest in understanding the technologies first.

Building the right cross-functional team

22

Benefits of Xamarin development

23

A minute saved is a minute earned — and potentially hundreds of dollars. A solution written in one language (C#) or a universal code base applied over iOS, Android and Windows phones enables agility and ultimately reduces the amount of code needed.

Xamarin implicitly facilitates the sharing of business logic, saving even more time. Using Xamarin, other components can also be recycled including third-party libraries and even interface design. Xamarin for the enterprise

Xamarin makes a ton of sense when function is more important than aesthetic quality and where total cost of ownership is a primary concern for the IT team who will be responsible for the long term costs of supporting a cross-platform solution. Expanding the knowledge of an existing IT team with Xamarin (C#) represents a great way to extend capabilities without an extensive investment in time or resources.

Reduce your total cost of cross-platform mobile app ownership

Practical uses for Xamarin apps• Industries with mobile

field personnel• Home healthcare• Utilities industries

24

There’s no “i” in team. But, there is a lot of money. Platform-specific development teams are more expensive. Before, when building a cross-platform app, it would require developers with Android, iOS and Windows experience. When working with Xamarin, teams can be leaner, albeit with a comparatively deep C# knowledge pool.

Especially for line-of-business apps, Xamarin development strikes a compromise between usability and affordability investment-wise enterprises would be remiss to ignore.

Decrease the cost and size of your development team

Recycle existing development skillsWith Xamarin, IT departments can recycle any existing C#/.NET skills and redirect them toward mobile development.

25

Rapidly create a fluid user experience

Async With Xamarin, developers don’t need unique code to write asynchronous programming.

Controls The Xamarin.Forms UI toolkit allows for the rapid selection of controls to perform select and rapidly “code” app functionality. Extended capabilitiesAdditionally, using Xamarin app developers also don’t need unique code for LINQ and extension methods.

26

Test smarter

Xamarin allows software quality teams to write-UI-based test scripts. Paired with Xamarin Test Cloud, this is a powerful combination. Within Test Cloud, more than 24,000 unique Android device types and 20 iOS hardware and OS configurations exist. No device cabinet in the world is that big.

Xamarin Test Cloud gives you the confidence that you are truly testing for every user scenario — efficiently. UI test scripts can be generated following your interactions, edited and uploaded to the Test Cloud for wide-scale execution.

View our demo of Xamarin Test Cloud.

27

mentormate.com | 3036 Hennepin Avenue, Minneapolis, MN 55408 | 855-577-1671

Talk with an expert Ready to innovate. Contact us to learn more about our Xamarin practice.

Contact us at (855) 577-1671 or info@mentormate.com

MobCon developed by MentorMate MentorMate has designed, delivered and staffed digital experiences since 2001. Alongthe way we’ve learned a lot. Now it’s time to share. That’s why we founded MobCon in2012 and MobCon Digital Health in 2015. Each year we host conferences for the topminds in mobile and digital strategy to do just that. Be part of what’s next and divedeep into the trends and technologies revolutionizing engagement in today’s businesslandscape. Register for our next event at mobcon.com.