In ELI5 terms, natur.digital is an Android/iOS application with a web version.
Planning a hike through the forests of Bavaria? Prepare in advance to discover landmarks, animals, plants or landscapes along your route.
Download the area of your choice with an Internet connection and enjoy the content and nature later offline. Given the limited Internet coverage outside of urban areas in Germany, this feature is crucial.
Best of all? "Geofencing" technology alerts you when you approach a marked route feature or enter a restricted area.
It was an honor to work on a project for the Bavarian Ministry of the Environment, Germany.
Here's an app (mobile/web) for nature lovers in this region.
Over 10,000 hours of initial development went into communication, design and programming.
As project manager, leading a team of 12, with an additional six from the client side, I gained immense experience. More about these challenges later.
This trust was built on a previous year's collaboration to develop and enhance a CMS as a central database and editing portal (Drupal headless).
The Department of the Environment has excellent experts. I am talking about PhDs in biology, geography, history...
They've spent 3 years painstakingly collecting data on
- places
- fauna
- flora
- fungi
- habitats...
You can now listen to the call of the grass frog and watch a video. See when a fruit blooms or ripens on a monthly calendar.
Is an animal or species in danger of extinction? See pictures.
These details are invaluable, but mean little if access is restricted to staff.
So the next logical step was to open up this encyclopaedic archive to the project's funders - the taxpaying citizens of Bavaria and beyond.
The app can now be used dynamically and engagingly at home or on site.
During the promotional reception of the app, we particularly appreciated the comment:
"This app doesn't feel like a government project at all; it's totally modern and user-friendly!"
One sentence was enough to strengthen our partnership.
Every state institution that requires a digital service, in our case hosting, must work with the State Computing Centre IT-DLZ.
Group 1.
They provide the "machine", bandwidth and support, but they don't take care of installing services on these servers.
For this, the ministry must hire a private DevOps agency.
Group 2.
We have the contractors - the ministry.
Group 3.
The marketing agency, also contracted by the Ministry. They take care of graphics, sound, copyright, promotion...
Group 4.
The PEN-TEST agency.
Group 5.
Finally, our team.
Managing this external communication wouldn't be possible without specialised software for discussions and correspondence. Whether with one client or several agencies, we use the local Active Collab - kudos to Ilija and the team ;)
To escape the endless CC and BCC email torture, people sign in and tag discussions or tasks as needed.
On long projects like this, it's vital to have a tool where you can revisit history and read what someone, somewhere, sometime said.
This approach to communication was an eye-opener for the clients. They literally saw the light and realised how much "bureaucratic ironing" - classic email correspondence - was bogging them down.
React Native
The app was built using React Native. Native components were written specifically for each system using specialised libraries.
The advantage of this development method is that there is only one code base for the interface.
Maps, layers
For the base map we used the state map of Bavaria - their GIS centre. For this we had to develop our mapProxy to avoid constant communication with their API and to preserve performance.
As some of the routes cross the borders of Bavaria on their way back, and the Bavarian GIS map is limited, we wanted to show the map of these areas as well. To do this, a new background layer was added - OpenStreetMap.
We have a layer with topographical details, elevations, then a layer with cycling routes and a layer with walking routes.
We used the well-known Leafletjs to display geographical content on the map.
Caching
A lot of time was spent understanding the system and user needs - what needed to be available quickly and immediately, and what could be loaded on demand. One tool to address these needs was Recoil. Alongside React, another open source project from Facebook in our arsenal.
Two databases
The Drupal CMS handles the content and stores the data in MariaDB. This data is transferred to MongoDB, which feeds the application and website. Fields that need to be transferred to Mongo were carefully mapped, as not all data from the Drupal database is needed by the end user.
Geofencing
This project was our serious dive into geofencing technology. For those who don't know, it's a phone service that can trigger an event based on your current location.
We used it to notify users when they were approaching a key location, or when they needed to stop because they'd entered a restricted area - temporary or permanent access restrictions.
The client was so specific that there are areas where you can't go during part of the year because bears are mating, and when that's over, access is free 🙂 .
The biggest challenge here was to find a good balance between timely system notifications and saving as much battery as possible.
In the end, we managed to optimise the settings to a 300-second interval and 250m. These are now the official values for triggering alerts. This covers standard walking and slow cycling.
Offline mode
Everything above works in offline mode, when there's no data on the phone. We literally copied Google's Offline Maps option, but went a step further by allowing users to see the entire content, not just parts of it. Users can choose which region of the map they want to download to their phone, or download individual content from the lexicon.
Searching
Elastic Search helped us define 20 indexed entities. We then worked with the client to prioritise which to display. Some of the elements that the search works on are the title, the category, the Latin name, the short description, the reference name... Each one gets its "score" based on the priority, and that's how the results are displayed.
For example, if we search for "frog" - "frog", those frogs with the word "frog" in their title will be displayed first because the priority of the title is 10.
Fastlane
To round off the whole process and get any updates out to the end user quickly, we have implemented Fastlane to automatically submit apps for review. This Google service works well for both platforms.
This saves about 2-3 hours with each new release! No more manual uploading of APK and IPA files.
Every project is like a marriage. They say that in a marriage there is a crisis every 7 years; in agile development it's every 70 days 🙂. So it was here. There have been crises in understanding how things should work. Crises in delaying decisions about which direction to go and when to cut things, and so on...
I'm proud that an agency from Subotica, with a branch in Germany, managed to create an app and a website for a state institution. I think we've used the budget well, offering something useful to nature lovers and giving biologists and geographers a new wind to be even prouder of their work.
Our people from Subotica worked for the region of Bavaria, which is no mean feat.
With this example we support the IT SUBOTICA 2030 project, because it's nice to live here and work for any part of the world at the same time!
Ćuković Miloš, COO,
Subotica 11.08.2023.
