Kotlin Multiplatform – A New Kid On The Block

A little bit of history

FIVE’s been in mobile app development for some time. In all the years we’ve been at it, we’ve seen mobile development evolve dramatically — we’re excited to always keep up with and pioneer any new tech that comes our way!

Today, you have lots of options if you want to build a mobile app. The first thing that probably comes to your mind is building iOS and Android apps separately. This is still our primary approach. If you’re building a complex app and want complete control of every aspect of it, this is probably the best approach. However, you always need to be wary of building costs and time constraints.

Over the years, we’ve incorporated a more flexible technology for building mobile apps for our clients using React Native, an open-source mobile app framework created by Facebook. If clients need a simple app, don’t have a large budget, or want to ship their product quickly, we’ll often build with React Native. Because a large number of developers at FIVE use React, it was logical to utilize the technology and show off their skills. Our React/React Native team is going strong and is one of the largest teams in our company.

Now, there’s a new kid on the block. You probably guessed it already — it’s Kotlin Multiplatform Mobile (KMM).

What is KMM?

KMM is an SDK for multiplatform mobile development. With KMM, you can develop multiplatform mobile applications and share parts of your apps between Android and iOS, such as core layers, business logic, presentation logic, and more. It reduces time spent writing and maintaining the same code for different platforms while retaining the flexibility and benefits of native programming.

A basic KMM project consists of three components:

1. Shared module – this Kotlin module contains common logic for both Android and iOS applications. It builds into Android libraries and iOS frameworks. A shared module uses Gradle as a build system.
2. Android application – a Kotlin module that builds into the Android application — it uses Gradle as a build system.
3. iOS application – an Xcode project that builds into the iOS application.

The most important takeaway is that you decide how much code you want to put into each bucket. In the shared module, you can go from sharing simple logic (parsing, mapping, etc.) to sharing everything below the view layer (models, business logic, presentation logic). This can vary from project to project.

This is all possible through Kotlin/Native. Kotlin/Native is a technology for compiling Kotlin code to native binaries, which can run without a virtual machine. It is primarily designed to allow compilation for platforms where virtual machines are not desirable or possible, such as with embedded devices and iOS. It is particularly suitable for situations when the developer needs to produce a self-contained program that doesn’t require additional runtime or a virtual machine, which is precisely the case with iOS development.

Shared code written in Kotlin compiles to JVM bytecode for Android with Kotlin/JVM and to native binaries for iOS with Kotlin/Native — making the integration with KMM seamless on both platforms.

Above, you can see that besides Kotlin/JVM and Kotlin/Native, there is a third pillar — Kotlin/JS. These three pillars make Kotlin Multiplatform. Notice the difference between Kotlin Multiplatform Mobile (KMM) and Kotlin Multiplatform (KMP) terms (the former is the subpart of the latter).

Why are we using KMM?

Why did we try KMP and KMM? In 2019, we started experimenting with it, but the tipping point was KotlinConf in Copenhagen that year, where we noticed a fundamental shift in KMP direction. We saw that certain companies were searching for KMP specialists and successfully building apps using KMM.

Until then, we offered our clients native Android/iOS development along with React Native for simple or less expensive apps. KMM allowed us to create a third approach. If our clients preferred native apps that we thought we could build faster and cheaper with KMM, we offered it as a solution. So far, KMM has been a great success, and we want to share two success stories with you next.

Success stories with KMM

Rosetta Stone – Progress Tracking

First, we want to share a success story about our long-term client, Rosetta Stone. We’ve been working with them for almost five years, and in that time, we built Android and iOS apps while getting familiar with the rest of their ecosystem. 

We mentioned that we had some experience in KMP, and we were looking for opportunities to use that knowledge and improve their system. It turned out that they had the perfect project for us. 

Rosetta Stone offers mobile and web applications for language learning if you’re not familiar with their product. Every app like this should have a way to track users’ progress while learning. Maybe you can guess what we did next. 

As Rosetta Stone’s apps grew over time, its use cases became complicated, and some of the progress logic had to be implemented client side. Each platform implemented progress tracking slightly differently, and that caused the users to see somewhat different progress depending on the platform they used.

We decided to unify progress tracking with Kotlin and KMP.

Doing so not only solved the progress problem, but it brought other benefits too. Maintenance costs became lower because only one team, the KMP team, maintains the code instead of three different teams.

This is also an excellent example of how an existing, fully functional system could be migrated to KMP.

There are other similar opportunities with Rosetta Stone that we explored as well. Sometime in the future, we might use this approach for log-in functionality.

MeCycle – Mobile App

Our second success story comes from our work on an app for MeCycle. MeCycle helps you recycle responsibly. You can use the app to scan UPC codes of plastic and glass bottles or aluminum cans. If you’re recycling in an area with monetary incentives, like bottle deposits, the app credits you the deposited amount. 

MeCycle wanted an app with a native look and feel, but their budget was limited. They needed an app with a polished UI, and they planned to use the app to get additional funding — in other words, the stakes were high.

By using KMM, we implemented an app where we shared everything below the UI layer. We used two KMM developers and one developer from each platform that focused only on UI. Doing this allowed us to polish the UI because, with KMM, we saved time and budget on all the layers below.

The app was built from scratch, so we also learned a lot about KMM app architecture. It was also our first step in a direction where almost any app can be implemented with KMM architecture in mind.

KMP is still a relatively new technology and there aren’t many companies that are using it. We want to be the leader in that space. This year, we had a chance to share some knowledge with the community.

How we used code challenges to get people interested in KMM

In June, we were part of the largest developer conference in Zagreb, called .debug. Two weeks before the conference, we brainstormed about how to represent our company. We decided that it would be cool to teach the community about KMM.

We wanted to set a coding challenge but make it easy enough to get people from different technical backgrounds and non-tech people to participate and learn something — the prize for participating was a t-shirt designed especially for the event.

We created a small mobile app with a simple UI. The UI contained five minor bugs (check the image and see if you see them). The goal was to solve a couple of algorithmic challenges in the shared part of the code to show how you can influence both Android and iOS apps. Each successfully solved challenge removed one bug from the screen on both apps.

In the end, the challenge was a great success! There was a line of people wanting to solve the challenge out and win t-shirts.

You can check out the challenge on this GitHub link.

We’re excited about KMP and hope you are too

We’re really excited about KMP and KMM. The tech has room to grow, and we are watching it closely. This post will be the first in the KMP series, and in the future, we plan on sharing more success stories, some technical challenges we encountered, and all the other things that we’ve learned. If you have some experience with KMP and KMM and you want to work with us or maybe brag about it, let us know here.