See more case studies

CPOT

Sweden / cpot.se

An innovative app digitizing road maintenance in the Nordics. Developed for NCC – one of the leading construction companies in Europe.

2

apps and one codebase thanks to Flutter

15

times faster damage reporting process

3

countries where CPOT revolutionizes road maintenance

How NCC started a road maintenance revolution in the Nordics

Challenge: Time-consuming, inefficient and expensive road maintenance management process based on an ERP system

Our client – NCC – is one of the leading construction companies in the Nordics, specializing in the management of complex construction processes. For years, NCC has struggled with the ineffective process of reporting road damages and ordering materials for their repair. Our client wanted to streamline and automate this process.

Their vision was:

The process of ordering repairs for a damaged road surface or curb should be as simple and friendly as ordering a pizza or buying clothes online.

Why the process was so ineffective so far? Each road inspector, when finding damage on the road, first took notes and then returned to the office, where he/she described the damage and added an order on the computer via the ERP system. The problem was that inspectors couldn’t immediately report the damage and describe it on-site. They also couldn’t precisely determine its location, which was then problematic for the contractors who provided materials for repairing the damage.

To sum up – the road maintenance process was tiring, time-consuming, and burdensome for both the inspectors who reported the damage and the contractors who repaired it.

What’s more:

  • NCC needed an admin panel where they could monitor the budget, as well as the volume and status of all orders.
  • The application should work wherever NCC offers products and services for construction and infrastructure projects, i.e. in Sweden, Norway, and Denmark. We knew that it should be available in several language versions.

Solution: CPOT – a mobile and web app that makes the road maintenance process 15 times faster!

On our client’s order, we’ve developed CPOT – a web and mobile app that simplifies the lives of people responsible for road maintenance in the Nordics. It benefits both road inspectors and suppliers of building materials. The application has completely changed the previous process of reporting and repairing road damages. CPOT guarantees:

  • simplicity – users can take a picture of road damage, choose its position on a map, use their own labels, and order the needed materials directly from their mobile phone;
  • speed – users go through the entire ordering process in just a few clicks on their smartphones;
  • control – they get an overview of their orders (status, quantities, costs), and keep track of their budget;
  • precision – users accurately choose the position of the damage on a map (they can allow the app to use their location), and material suppliers know exactly where to find it.

Short time-to-market thanks to Flutter

According to our client’s needs, the priority was to quickly deliver a working MVP app. We had about 3.5 months. In the second step, the goal was to improve the product and adapt to user feedback. That is why we decided to develop the mobile app for both iOS and Android using Flutter. This framework allowed us to shorten the time-to-market and deliver a product with as many features as possible in the given time.

User flow tailored to the daily work of inspectors responsible for road maintenance

We made sure that the application is as comfortable as possible for inspectors who work in the field. The process of adding an order is adapted to the realities of road maintenance specialists. Therefore, the first step of submitting a new order is adding a photo of the damage, because it’s the first thing the inspector does at the scene. What’s more, some of the data completed by the user is saved in the application to speed up adding the next new order.

Product Owner on site

Marek – the Product Owner from NCC – worked with us directly at our office in Wroclaw for 50% of the app development process. We were able to work hand in hand from one desk and it made our development process especially effective. We got together as one team and it was a pleasure to have such an engaged PO!

Road maintenance revolution

NCC has started a road maintenance revolution in Nordics. We’re happy that we can participate in this process by delivering digital products that bring our client’s ideas to life.

The scope of the project

Product Design Workshop

Thanks to a 3-day workshop with Marek – the Product Owner from NCC – we clarified the vision for CPOT, created clickable wireframes, defined the core features for the MVP, and prioritized the tasks for the first Sprint. It was a fruitful kick-off for our cooperation.

Product Design

Our designer has created completely custom designs for the app. We focused primarily on making the application simple, clear, intuitive, and easy to use for field inspectors. The app’s color range is consistent with the CPOT logo provided by the client.

Mobile App

We have created a mobile app for iOS and Android platforms using the Flutter framework. This choice of technology was dictated by the short deadline. The CPOT app allows users to report and describe new road damages in the field, and order materials needed to repair them. The whole process only takes a few simple clicks!

Web App

We have built a web app that gives inspectors the same possibilities as a mobile app. Additionally, users can view statistics on their orders and monitor their budget. We have also created an admin panel where the administrator adds new users, monitors order list, or controls key order parameters.

Backend

We’ve built a REST API as a layer over the ERP – the system used by the client so far. Thanks to this, frontend apps communicate with the ERP through the REST API in a much more simple and transparent way. This enabled us to speed up the ordering process in the app.

Maintenance

After CPOT’s release, we make sure the app stays up-to-date, attractive to users, and bug-free. We pick any errors right away, thanks to monitoring tools, and quickly repair them. Furthermore, we also introduce changes to the CPOT mobile app in case of Flutter updates, system updates, or when getting feedback from users.

Key features

Browsing the list of orders

View all orders and stay up to date with reported damages.

Viewing orders on the map

You can view orders on the map to see where the reported damages are located and what their statuses are.

Checking order details

Do you want to know more about a chosen order? Click on it and dive into the details.

Filtering orders

Filter orders the way you want. Select order statuses and view only those that meet the selected criteria.

New order – adding a photo

Take photos of the damage and upload them right away to the app.

New order – picking a photo

You can also take pictures first and upload them to the app from your gallery.

New order – adding details

Describe the damage briefly, give it a title, marking, and define the area where you found it.

New order – choosing a location

Picking the location of the damage is very simple. The app itself will mark it on the map using your location. Alternatively, if you prefer, you can also indicate the exact location yourself on the map.

New order – choosing materials

Choose materials needed to repair the damage you’re ordering. Scroll the list or use the search window.

New order – choosing the amount of units

Define exactly what amount of chosen materials you need.

New order – price list 

The price list sums up the materials you’ve chosen and shows the total price of your order.

New order – summary

Make sure your order is complete and the given data is correct.

User profile

Check out your profile information, Terms & Conditions, and log out if needed.

Login

Log in using your e-mail and password.

Welcome screen

A beautiful and colorful welcome view, based on the CPOT logo.

Browsing the list of orders

View all orders and stay up to date with reported damages.

Viewing orders on the map

You can view orders on the map to see where the reported damages are located and what their statuses are.

Checking order details

Do you want to know more about a chosen order? Click on it and dive into the details.

Filtering orders

Filter orders the way you want. Select order statuses and view only those that meet the selected criteria.

New order – adding a photo

Take photos of the damage and upload them right away to the app.

New order – picking a photo

You can also take pictures first and upload them to the app from your gallery.

 

New order – adding details

Describe the damage briefly, give it a title, marking, and define the area where you found it.

New order – choosing a location

Picking the location of the damage is very simple. The app itself will mark it on the map using your location. Alternatively, if you prefer, you can also indicate the exact location yourself on the map.

New order – choosing materials

Choose materials needed to repair the damage you’re ordering. Scroll the list or use the search window.

New order – choosing the amount of units

Define exactly what amount of chosen materials you need.

New order – price list 

The price list sums up the materials you’ve chosen and shows the total price of your order.

New order – summary

Make sure your order is complete and the given data is correct.

User profile

Check out your profile information, Terms & Conditions, and log out if needed.

Login

Log in using your e-mail and password.

Welcome screen

A beautiful and colorful welcome view, based on the CPOT logo.

Monitoring budget status 

In the admin panel, you can monitor your budget, orders’ status, and follow the most important statistics of all the orders.

Viewing and filtering orders (list + map)

View all orders as both a list and on the map.  Stay up to date with reported damages and their statuses. You can also filter orders the way you want. Select order statuses and see only those that meet the selected criteria.

Searching orders

Use the search window to find a concrete order you’re looking for.

Checking order details + edit option

Do you want to know more about a chosen order? Click on it and dive into the details. Edit your order if needed.

Adding a new order

The web app allows you to add a new order, just like in the mobile application.

Choosing the app’s language

Danish, English, Swedish, Norwegian, or Finnish – choose the language you prefer.

Adding new users

If you are a Super User, you can add more users. New users will receive an email with their details and a request to change their password.

User onboarding

Assign user permissions and dedicated individual numbers like project number, subaccount number, or reference number.

App walkthrough video

How we did it

We have built an app for Android and iOS with one codebase, using the Flutter framework and Dart language. We’ve also chosen to use the BLoC architecture pattern.

As a map provider, we used Google Maps. It was a challenge to integrate it into the app, as there was no stable Google Maps support for Flutter at that time. We came to a solution thanks to consultations with the Google team on Github. In the end, we managed to adjust the versions of the Google Maps libraries to work well on both platforms.

Another challenge was the poor performance of loading photos in the app. We used experimental technology to solve this problem, then in the beta phase – FFI.

Thanks to this library, we were able to scale photos natively, rather than in Flutter. This solution sped up the process of scaling and uploading photos tenfold in comparison to Dart code.

Alice – a Flutter tool for monitoring communication with the server from the application level – helped us to optimize manual tests. What’s more, we used Dart DevTools to monitor the network and to verify queries sent to the server.

The designs we implemented were completely custom.

Framework

Flutter

Language

Dart

Architecture

BLoC

Networking

Dio

Maps

Google Maps

Continuous Integration

Bitrise

Testing

Alice

Localization

Easy Localization

We built a web application in the React framework using the Create React App library. It is a proven tool that enables a quick start to development with a working application skeleton. According to our client’s requirements, we chose Azure DevOps as a Continuous Integration platform for the project.

What’s more, we decided on Material UI – a popular React UI framework – to implement app designs. That way, we didn’t have to create the necessary components from scratch. We used Material UI components and adapted them to our needs, which allowed us to save time and speed up the work on the application.

As in the case of the mobile app, implementing maps was a challenge. After testing various options, we chose the Google Map React library, which allowed us to work with Google Maps “dressed” in React components.

Another challenge was the internationalization of the app, which should work in several language versions. For this function, we used the i18next library, which turned out to be the perfect solution.

The app is based on a modular architecture – we have grouped components into modules according to the application’s features. Last, but not least, “Jest” – a JavaScript testing framework used for automated tests – ensured the highest code quality.

Framework

React

Language

TypeScript

Architecture

Modular

Networking

Fetch

Maps

Google Maps, Google Map React

Continuous Integration

Azure DevOps

Unite tests

Jest

Localization

i18next

When it comes to the backend, we build a REST API as a layer over the ERP – the system used by the client so far. Thanks to this, the frontend apps communicate with the ERP through the REST API, which is much simpler and transparent to them.

We wrote the backend application in Azure Functions – it is the Microsoft equivalent of Serverless. Using this tool has a positive impact on our client’s budget because he pays only for the resources when they are actually executed.

What’s more, image conversion was a challenge. ERP accepts small images, while our API permits large ones.

So we had to make sure that the size of the photo would be appropriate for the ERP but still kept legible to app users. We have created a custom algorithm to solve this case.

Most uniquely, we have built our own solutions for automated end-to-end tests, running locally.

API type

REST

Language

TypeScript

Framework

Azure Functions

Database

MySQL

ORM

Sequelize

File storage

Azure Storage

Continuous Integration

Azure DevOps

End-to-end tests

Mocha + Chai

How CPOT app works

What our client says

Droids On Roids’ developers are highly skilled and motivated. I enjoyed their flexibility, customer focus, and personal, transparent communication style. Timelines were kept, which I really appreciate.

Thanks to the Agile methodology, the time-to-market was fast, and we could build additional features after getting feedback from users. The project was a success and our users are praising the apps for their usability and functionality.

Marek Stark
Technical Project Manager, NCC

Team

We were adjusting the team’s size according to our client’s needs

Product Owner

Marek Stark

Scrum Master

Katarzyna Owcarz

Account Manager

Justyna Solarska

UX/ UI Designer

Kamila Figura

Flutter Developer

Marcin Chojnacki

Web & Backend Developer

Bartosz Krajka

QA Engineers

Maciej Jaskulski
Maja Sobierajska

Optimize your business with a mobile app

Let us take the whole app development process off your shoulders

Let's talk ➜ or just write an email
Not ready for an estimate? Write to us and book a Product Design Workshop to clarify your vision and prepare the crucial documentation.

Other case studies

Hoppy – Product Distribution App

Reward-driven product distribution app. Made for Carlsberg Polska

Nice To Fit You – mCommerce Diet Catering App

mCommerce diet catering app

Portfolio

epyGuard™ | IoT App

Connectivity app tracking heat exhaustion levels in non-desk workers

Firm Prospects

Large attorney-only community for in-depth law firm research, job listings and career updates.

GYDER

Easy-to-use event platform that helps visitor to make the most of their time at an event.

See more apps
See more case studies

Frequently Asked Questions

Construction apps are mobile and/or web applications that serve the needs and solve key problems of the construction industry. Mobile technologies can be particularly valuable to professionals in the construction industry. They help construction business owners and contractors to manage their businesses, all the while gathering data and analyzing it to generate valuable insights for improving their decision-making – both in the short and long-run.

Thanks to the advances in mobile technologies, construction companies today use technology to carry out a wide range of tasks right from mobile devices such as smartphones or tablets.

Construction business owners, contractors, service companies, salespeople, and estimators use mobile apps to carry out many different tasks such as:

  • Developing on-site estimates for projects – improves the company’s efficiency, accelerates project estimation.
  • Creating digital data during fieldwork – fieldwork requires paperwork and such notes can be hard to read, making data inconsistent. Construction apps immediately deliver data from the field to the company HQ and store it in the cloud to ensure constant access from any mobile device.
  • Identifying potential cost overruns thanks to monitoring the daily work operations – using data such as like date, time, location, visual maps, images, and signature capture.
  • Collecting real-time workplace safety data to anticipate potential risks and reduce accidents.
  • Streamlining bid operations thanks to instant data capture and report access – this includes drawings, photos, and signatures. Construction companies also use mobile apps for sharing bid information architects, structural/civil engineers, subcontractors, and even local government offices.
  • Keeping all the blueprints and design specifications for multiple projects in the cloud, available from anywhere.
  • Tracking various items such as materials, work and punch lists, supply deliveries, and quality control.
  • Using in-app calculators for both materials (required amounts of paint, concrete, roofing, drywall, steel, etc.) and measurements (from pitch and rise to arcs and circumference).
  • Keeping a comprehensive document library – a digital library can include procedure manuals, QA checklists, safety and commissioning, hazardous material sheets, etc.

  • Easier collaboration between supervisors, engineers, and construction professions.
  • More mobility given to employees and improved operations during fieldwork.
  • Better communication with the construction team allows project managers to manage the workforce and make informed decisions.
  • Single source of truth for the entire team and minimizing potential mistakes from data re-entry thanks to storing all data in one place.
  • Mobile access to data, available from anywhere and at any time.
  • Possibility to streamline activities such as construction estimates, conduct inspections, and sharing records with just a few clicks.

There are 7 crucial stages of the construction app development process from a business point of view:

  1. Clarifying the vision
  2. Choosing a partner
  3. Wireframes & Design
  4. Project Kick-off & Setup
  5. App development
  6. Release Preparation
  7. App Maintenance

Read more about every stage in our guide through the mobile app development process.

In short, according to our 10 years of experience and market knowledge:

  • A basic mobile app for 1 platform costs $25,000 – $50,000
  • A medium-complexity app for 1 platform costs around $50,000 – $100,000
  • A complex app for 1 platform costs more than $100,000

Read this article to understand where these numbers come from, what they mean in practice, and how to reduce your construction app development cost with our battle-tested practices. If you want to know your app development cost more precisely, we can estimate it within 72 hours – fill a short form here.

Building a custom construction app comes with several key advantages:

  • You get exactly the features you need. Out-of-the-box solutions are made to match the requirements of as many potential users as possible. That’s why you often end up paying for a ton of features you’ll never use. When investing in a custom construction app, you get a piece of proprietary software that does exactly what you need it to do – and helps you to solve problems or achieve key business goals.
  • A custom app grows with your business. The team that delivers your tailored app can add new features or change the existing ones based on the evolving needs of your business. You’ll never get stuck with a solution that doesn’t match your requirements anymore. A custom app will always support your business needs.
  • Lower long-term costs. The initial cost of developing a custom solution is usually higher than investing in an off-the-shelf software license. But the long-term cost of implementation is often lower because you get a perfectly matching solution that optimizes your operations and you don’t risk depending on a single provider (that might increase license pricing anytime).

A mobile app for the construction industry takes advantage of many features enabled by mobile devices such as:

  • GPS locations, maps, and tracking
  • Automatic dates and times
  • Updated weather conditions
  • Digital signatures
  • Photos, videos, and audio files support
  • QR and bar codes
  • Text notes
  • Communication features
  • Ability to send data via email, text message, in-app messaging features, or automatically to backend systems
  • Data storage in the cloud for border access

You’ve decided to make an app with a professional construction app development company. The process of choosing the right partner may seem challenging for businesses or entrepreneurs, especially if you are doing it for the first time.

If you want to pick the best mobile app development company for your contractor app development, you’re probably wondering how to do that. We recommend you verify a few factors. Here’s a checklist:

  • Check out their portfolio. Have they built products similar to yours? Do they have experience in working with companies from your industry?
  • Check their profile and clients’ reviews on Clutch.co
  • Ask for detailed information about the code. Will you have full ownership of the code created by the company? Will the code be hosted in code repositories like Bitbucket or Github? Make sure the code will be written in English.
  • Learn how they organize the process of construction app development. What tools do they use? Do they work in Scrum or other Agile frameworks?
  • Consult the Independent Contractor Agreement with a lawyer before signing it.
  • Compare the estimation you get with the estimation from another company.

If you want to learn more about each of the above points, read our guide for businesses on how to choose the best mobile app development company.

These are a few examples of the best construction apps that improve productivity within the construction industry:

Building Calculator

A free construction calculator app for Android, Building Calculator helps contractors to calculate the amount of materials required by their projects. The calculator works offline and includes a wide range of material options, from bricks and lumber to flooring and paint. Contractors can also use it to calculate armatures weight, concrete volume, and the required wall blocks.

PlanGrid

One of the most popular free construction apps, PlanGrid works on both Android and iOS. This collaborative tool renders paper blueprints a thing of the past by synchronizing all the key data in the cloud. Construction business owners can use it to view and share many materials: blueprints, notes, and drawings but also issue tracking, field markups, and progress photos. The application includes a version control function to keep everything in order.

CPOT

This innovative app aims to digitally transform road maintenance in the Nordic countries. Offered by NCC – one of the leading construction companies in Europe – the application changes the entire process of reporting and repairing road damages. Users can take a picture of road damage, indicate its position on a map, use a label, and order the required materials directly from their smartphone. The entire ordering process now takes just a few clicks. App users also get an overview of their orders and can easily keep track of their budgets.

Fieldwire

Fieldwire is a free task management construction app available for both Android and iOS. Thanks to this app, field workers can check up-to-date files, blueprints, and tasks on their mobile devices while on site. And contractors can use it to add tasks, link them to locations and blueprints, set specific deadlines for assigned workers, and add various priority levels for clarity. You can create a punch list, share drawings with other workers, add attachments, and create comprehensive reports.

The process of ordering repairs for damaged curb or road surface or curb may be very ineffective. Most of the time, a road inspector needs to take notes, return to the office, describe the damage once more, and finally make an order using an ERP system. Reporting and describing the damage immediately on-site is now possible with construction software solutions. Thanks to a specialized mobile app, the inspector can determine damage location precisely, send a picture of road damage, add custom labels to organize work, and order the needed materials directly from their smartphone.