Industry: FinTech, B2B Payment Services
Technologies: Flutter, Dart, Ruby on Rails, RESTful APIs, NativeScript, CI/CD Automation, Google Maps SDK, iOS/Android
Services: Mobile App Modernization, Cross-Platform Development, Backend API Enhancements, DevOps Integration
Overview
A leading enterprise in the B2B payment services sector—serving fuel management operations in highly regulated environments—engaged Keyhole Software to modernize a legacy mobile application that had become outdated both technologically and functionally.
Originally built using NativeScript and Ruby on Rails, the app allowed users to approve, dispute, and view fuel orders while accessing critical port location data. However, the application had not received significant updates since its 2019 launch, and the client needed a future-ready, maintainable solution to meet today’s user expectations and compliance standards across both Android and iOS platforms.
The Challenge
The existing mobile solution was falling short in several areas:
- Outdated UI/UX: Built on NativeScript, the mobile UI lacked responsiveness and polish, impacting user satisfaction.
- Technical Debt: The app’s framework and backend stack were no longer aligned with current development standards.
- Limited Features: Users were unable to leave notes or comments on fuel order workflows, reducing team communication and traceability.
- Deployment Hurdles: CI/CD pipelines were missing, and the app required significant updates before re-publishing to public app stores.
The client needed a robust mobile modernization strategy to:
- Improve UI/UX with a modern framework
- Ensure backend security and extensibility
- Add new features for fuel order tracking
- Re-deploy a performant app on iOS and Android
- Align the codebase with current development best practices
Our Approach: Full-Scale Mobile Modernization & Backend Enhancement
Keyhole Software provided a senior consultant to lead the modernization effort. As the sole mobile developer on the project, this consultant worked closely with the client’s internal development, QA, and product teams to deliver an end-to-end solution.
Rewriting the Mobile App with Flutter
The legacy NativeScript codebase was replaced with Flutter—a modern, open-source UI toolkit maintained by Google—enabling fast, native-like performance across both iOS and Android from a single codebase.
Key features implemented in Flutter and Dart included:
- Cross-Platform UI/UX: A responsive, modern interface designed for real-time fuel order visibility and interaction
- JWT Authentication: Secure user authentication using JSON Web Tokens with encrypted storage via
flutter_secure_storage - State Management: Provider pattern used for centralized state management across authenticated user sessions
- Environmental Switching:
.envfile configurations for QA, staging, and production environments to streamline testing and deployment
Upgrading the Backend: Ruby on Rails 5.0.7 → 7.1
The backend Rails API was upgraded to a current supported version to:
- Ensure security and performance
- Enable support for new mobile features
- Simplify maintenance and developer onboarding
Additional enhancements included:
- New API Endpoints: Created to support user comments tied to order actions (e.g., approve, dispute, reverse)
- Real-Time Sync: RESTful APIs ensured real-time status updates between the app and the enterprise system
- Order Context Features: Extended APIs to allow contextual user input, enhancing transparency in team workflows
CI/CD Deployment
To streamline mobile release processes, CI/CD pipelines were configured, enabling:
- Automated build and release processes for both Android and iOS
- Version management tied to GitLab pipelines
- Simplified app store submissions and over-the-air distribution for internal testing
Mapping with Google Maps Flutter SDK
Interactive maps were built using Google Maps SDK, optimized for performance with custom logic to display port markers and zoom behaviors, enhancing field usability for fuel operations personnel.
Project Outcomes
- Modernized Cross-Platform App: The Flutter rewrite delivered a performant, responsive, and scalable app experience deployed across both iOS and Android.
- Improved UI/UX: A redesigned interface offered better usability for fuel order workflows, built with modern design principles.
- Expanded User Capabilities: Support for in-app comments improved communication, collaboration, and transparency among operational teams.
- Backend Modernization: Rails 7.1 upgrade improved backend reliability, security, and extensibility—supporting both current and future feature sets.
- Deployment Automation: CI/CD integration with Fastlane improved release efficiency, reduced manual errors, and enabled faster updates.
- Future-Proof Architecture: Both the mobile front-end and backend were modernized to reduce technical debt and support long-term maintenance and enhancements.
Technical Summary
| Category | Details |
|---|---|
| Mobile Framework | Flutter (Dart) |
| Legacy Framework Replaced | NativeScript |
| Backend Framework | Ruby on Rails (upgraded from 5.0.7 to 7.1) |
| Authentication | JWT with secure token storage |
| State Management | Provider |
| Mapping | Google Maps Flutter SDK |
| CI/CD | GitLab |
| API Integration | RESTful APIs, comment tracking endpoints |
| Deployment Targets | Apple App Store, Google Play Store |
Key Takeaways
This project highlights Keyhole Software’s strength in modernizing legacy mobile applications and enhancing enterprise backend systems. By leveraging Flutter and the latest Ruby on Rails version, we helped this enterprise FinTech client revitalize a mission-critical fuel management tool—ensuring performance, maintainability, and improved user collaboration across platforms.
Whether you’re dealing with legacy mobile frameworks, outdated backend APIs, or preparing a product for future scalability, Keyhole Software provides expert consulting and hands-on development to transform your software solutions.
