Energy Reporting App
Our client is an international company providing professional energy, waste and environment management solutions for sustainable society, including various complex environmental reporting tools and sophisticated systems for measuring and collecting monitoring data.
The company provides several sustainable solutions for environment management and requires modern mobile tool to enable an efficient energy consumption reporting. The application is targeted at energy companies following the goal of CO2 emissions reduction, saving on energy consumption and costs.
The main requirements for the electricity reporting application were:
- Universal application (Android, iOS and Web platforms)
- Code reuse for all supported platforms, cross-platform tools needed
- Interaction with existing customer’s API
- QR-code scanning and Push Notification features for iOS and Android
- REST client written on AngularJS
- A dashboard to check consumption levels by period of time and by certain building
- An embedded map to check energy meters by location.
We made a review of available cross-platform tools at the pre-development phase. PhoneGap and ngCordova created by Ionic Framework maintainers were finally chosen due to relative simplicity and wide community support. ngCordova is a set of essential cross-platform plugins which allows to integrate specific features such as QR-code scanning and Push Notifications with a few lines of code on AngularJS. Backend API had been provided and the development began.
The web application is written on AngularJS and wrapped using PhoneGap in order to support platform-specific plugins. AngularJS allowed us to build an efficient easy-to-use UI without a big effort. The most important feature of the application is energy consumption reporting. Energy meter ID can be entered manually or using QR-code to save time. This option is implemented using BarcodeScanner plugin from ngCordova. We had developed an architecture with an ability to browse consumption levels in the past and compare consumption by building using Dashboard and multiple report templates. Another important customer's requirement was to create a map of energy meters. This was achieved using Google Map component showing markers to provide a quick overview.
The backend integration was done completely using AngularJS as a REST client. We developed a multi-branded application: the customer can supply the product to several partners worldwide and provide customised styling and branding options for their business needs. Backend endpoints can be easily modified in the settings section if changes are required. Mobile applications are enabled to save energy meter readings in offline mode, which is an extra key feature, which allows reporting in the areas with low network penetration, such as basements and ground floors, where meters are usually installed in the building.
The customer got a modern application to manage and control energy consumption levels, supporting several ways to represent information, being simple, but at the same time powerful tool for reporting and retrieving data for analysis.
Using cross-platform approach, the customer got applications for each platform — Android, iOS and web. Mobile applications were developed to support platform-specific features such as QR-code scanning and Push Notifications providing up-to-date information from the server.
Related CasesRead all
Software Usage Intelligence
Development of a brand-new solution for gathering application usage statistics for both web and desktop applications.
UX Audit for a Country Risk Platform
Improving UX for an online platform, bringing new traffic and subscribers from the main product.
Vehicle Traffic Control System
The system intended to control and manage the movement of vehicles between parking areas and show their current position.