Egis Parking Services

Renewed visitor permit app

Every Amsterdam resident may apply for a visitor permit to allow visitors to park their car at a reduced rate. To make visitor parking management easier and more accessible for Amsterdam residents, we developed a customer interface as a Single Page Application (SPA) on behalf of parking manager Egis Parking Services and the City of Amsterdam.

Single-page application for speed

There are seven types of parking permits based on a balance and start-stop system, such as visitor, disabled and carer permits. Since this is a government application, it is important that it meets the WCAG 2.1AA Web accessibility guidelines so that every resident of the city can use the application. Our goal was to develop a new application that meets these guidelines and is easier to use than its predecessor.

The customer interface for the parking permit app is a Single Page Application. This is a Web application where the entire content is loaded on a single Web page, making it fast and efficient. The application can be used on both mobile and desktop, with custom components developed for advanced responsive behavior: on mobile, permits are displayed in a different way than on desktop. For upgrading the parking balance, Rabobank Omnikassa has been implemented for user-friendly check-out.

Mobile first, speed and efficiency

Starting a parking session or topping up balance should be a simple operation. Therefore, a mobile first approach was adopted for both functionality and technology. With more than 90% mobile web traffic, speed was an important aspect. To achieve the best performance, the single page application was built with NextJS, combined with Static Site Generation, Server Side Rendering and Client Side Fetching.

To achieve the best performance, the single page application is built with NextJS. In combination with Static Site Generation (SSG), a technique in which a website is generated once and then stored statically. Server Side Rendering (SSR) where the content of a Web application is generated on the server and then sent to the user and Client Side Fetching where the content of a Web site is fetched in the browser, rather than on the server. With this, content loads faster and there is less load on the server.

Grafiek van bezoekersaantallen van het aanmelden parkeren portaal

Hyperlocal peak load

The Aanmelden Parkeren portal of the City of Amsterdam is a special platform if we look at its use. Scalability is important because the platform must be able to facilitate many simultaneous visitors. On busy days, there are between 12,000 and 17,000 visitors on the platform daily. Sunday parking is free in most of the city, so there are far fewer visitors on the platform. Because the use of the platform is so local (exclusively in Amsterdam) we see many differences in visitor numbers on a daily basis. For example, at night the number of visitors drops almost to zero. This makes autoscaling the platform incredibly important.

By switching to serverless hosting we were able to reduce the hosting costs for Egis Parking Services considerably

Daan de Vries, Senior Frontend developer at Touchtribe
parkeerkaart van Amsterdam met bijbehorende prijslegenda
Plattegrond voor parkeren met checkout in de applicatie

Complex business rules

The different types of visitor permits have their own rules. These rules vary from city district up to even street level, which made implementing all the business rules a complex challenge. The Single Page Application provides support for all permit types, with specific rules for the nine different permit areas such as Centrum, Diemen, Zuid-Oost and Noord.

Within these areas there are also pay areas with different rules for whole days and Sundays, or until 6 p.m. For example, there are areas (like the Albert Cuyp market) where you can only park after 8 p.m. with a visitor's permit, but where a carer's permit is allowed. This makes parking policies vastly more complex. The parking permits app helps users follow the rules correctly.

Results

The old web application was not searchable via Google. Users could only access the application through the City of Amsterdam website. Since the launch of the new Single Page Application, one-third of visitors are direct traffic. This significantly reduces the load on the municipality's website.

We see that of the 71,000 visitors who come to the site per week, 40,000 perform a successful parking action or balance top-up, a conversion rate higher than 50%.

With the launch of the new application, accessibility and usability has increased tremendously. Also, the application is super fast, which enhances the user experience.

  • 0.84

    First Contentful Paint

    Super-fast loading on mobile devices for the best user experience.

  • 10.000

    Visitors

    On average, the visitor permits app is visited by 10,000 Amsterdammers a day.