Lessons learned from a Jetpack Compose-based chess app

A sneak peek at what this two-part article series is about

Chesso is a Jetpack Compose-based chess app with animated visualisation layers on top of the board: https://github.com/zsoltk/chesso

In this two-part article we explore the principles on which it was built:

  • Part I (previous article): fundamentals of the game and UI
  • Part II (this article): animations and visualisations

Piece animations — running into troubles

We left off at the end of the first article with having finished the core elements of the app. Now it’s time to start adding some fancy bits!

One of the visually appealing features of chess apps is when piece moves are animated —…


Lessons learned from a Jetpack Compose-based chess app

A sneak peek at what this two-part article series is about

Here at Bumble — the parent company that operates Badoo and Bumble apps — we’re in the middle of adopting Compose, so a lot of us play around doing pet projects to improve our skills and then we share some best practices.

I’ve created a chess app: https://github.com/zsoltk/chesso

Chesso is an animated, Jetpack Compose-based app aimed at beginners and intermediate players — its distinctive key feature is the ability to show visualisation layers on top of the board:

In this two-part article we explore the principles on which it was built:


Inspiration

Earlier on, I got inspired by the Kotlin-Pokedex project and its Flutter counterpart: flutter_pokedex, and started experimenting with a Compose-based solution for it, out of which compose-pokedex was born.

All these projects are based on the beautiful original design done by Saepul Nahwan:


Declarative routing, back stacks, and back navigation

Motivation and disclaimer

Pressing the back button in your Compose app at the time of writing this article will result in your app closing. Compose is currently at 0.1.0-dev03, and my understanding is that back press handling is further down the roadmap (please do correct this if you know otherwise).

But as I was playing around with it, it occurred to me that I already fought this battle once when implementing a Fragments-style back stack functionality in RIBs, and it’s not that much magic: back stack manipulation is in essence list operations. The magical part is…


DroidconUK 2019 Lightning Talk

Abstract of the talk:

Maintaining a large project and not going insane — in practice:

– Causes of everyday development pain, frustration and slowdown less frequently talked about

– Breaking down the complexity of screens instead of a classical layering approach

– Keeping code easy-to-understand, decoupled and maintainable even in highly complex projects

– A plug-and-play component architecture where individual pieces don’t require a deep understanding or careful wiring and can be reused in a few minutes

We now have over millions of users across a growing portfolio of apps, including Badoo and Bumble.

A…


This is the third part in a series of articles on Android architecture at Badoo. Here are links to the first two:

  1. MVI beyond state reducers
  2. Building a system of reactive components with Kotlin

Don’t stop at loose coupling

It’s pretty much generally recognised that loose coupling is better than tight coupling. If you are relying only on interfaces rather than on concrete implementations, you make your components easier to replace. It’s easier to switch to a different implementation without having to rewrite bigger parts of your code, and it makes unit testing easier as well.

And that’s pretty much where we usually call it…


A talk presented at the Londroid meetup about the architectural journey of Android development at Badoo.

The abstract:

At Badoo, we have a long history when it comes to Android development. Since the beginning, the product has experienced huge growth, and our codebase and our team have grown with it. We now have over millions registrations, as well as several new apps to support. In this talk we’ll go on an architectural journey and discuss some of the major problems we needed to find solutions for in the last few years, before ending on what is ahead of us.

Slides are available here: https://speakerdeck.com/zsoltkocsi/badoo-dot-problems-dot-take-5-dot-map-solve-it


A Lightning talk introducing architectural principles of MVICore and demonstrating the generic Time Travel Debugger tool that comes with it.

Abstract of the talk was:

Time travel debugging is awesome!

Remember that obscure bug that QA stumbled across but you could never reproduce?

What if you could record and replay events in the app, to see step-by-step how the data changes and why certain actions are executed?

At Badoo, not only do we have a working time travel debugger for our MVI architecture, but we went one step further: our debugger allows you to record and replay interactions everywhere across your reactive subscriptions. No more QA headaches for us!

Slides are available at: https://speakerdeck.com/zsoltkocsi/time-travel-debug-everything


This is the second part in a series of articles on Android architecture in Badoo. Check out the first one if you missed it:

Part I — MVI beyond state reducers

What we want and how we’re gonna get there

In the first article of this series we looked at Features, the centerpiece of MVICore, which allow you to create reusable components of business logic. They can be as simple as having a single Reducer, with the option to go full-featured to handle asynchronous tasks, events, and much more.

Every Feature is observable, so you can subscribe to its state changes for automatic updates. Likewise, it can be subscribed…


This is the first part in a series of articles on Android architecture in Badoo. You can find the next one here:

Part II — Building a system of reactive components with Kotlin

Story time: problems of state

Your application has a state at any given time that determines its behaviour and what the user sees on the UI. If you focus on just a couple of classes, this state consists of all the values stored in your variables, be they a simple boolean flag or an instance of an object. All those variables have a life of their own, changed at will by different…

Zsolt Kocsi

Android Engineer @ Bumble

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store