River navigation

an app for people who love kayaking.

Introduction

River navigation app for people who love kayaking

App is devoted to kayak lovers who enjoy kayaking on one of the biggest rivers in France, it gives them the ability to create, edit, and keep track of their routes in the real time.

Technologies

To get this thing going, we used such technologies as:

  • React Native
  • Redux (thunk)
  • Google maps & react-native-maps
  • React-navigation library

Challenge

The main challenge for us was the fact that Google maps service can’t find a route when users are on rivers, as itt only works with roads. This is where we had to work to find another solution.

The only data we could rely on were positions of river locks, and average travel time from one to the other. So, we decided to use this time and calculate the current kayak position using the Pythagorean theorem. Sounds easy, but it wasn’t really like that 🙂

kayak positioning via Pythagorean theorem

Development Process

To make a long story short, we’ll say that we divided the development process into three phases.

Phase 1: MVP. This first version of the app didn’t contain much. We’d made a loading screen, a home page with a map that didn’t contain directions, main menu, a “Lock details” screen, and a tutorial with a video that can be played even if there’s no Internet connection.

MVP of river navigation app

Phase 2: News management and alerts. Throughout this phase we added some alert messages, an “Information” screen, and an “Alerts and news details” screen.

News management and alerts of river navigation app

Phase 3: Route management. This phase was complex and really time-consuming, because it involved route management logic implementation. While working on this phase we added a kayak current position tracking logic, “Route details” screen, “Add route” screen, and updated the Home page with a map which also contained the route.

Route management and alerts of river navigation app