How we made buying a ticket within 60s possible in the new RET app

Last week we achieved a big milestone, we sold our first ticket ever after we ‘soft launched’ the new RET app, i.e. we made the app publicly available without starting a marketing campaign for it. RET is the operator of trams, buses and metros in the region of Rotterdam. One of the main new features in the new RET app is buying tickets. This feature is specifically targeted to people that normally don’t use public transport (for example Tourists) and don’t own an OV-chipkaart. In this blog I would like to share how we developed this functionality. 

Start of process

Most of the time our designer (Hans) and I start the design process together. Based on the requirements of our client, documentation of the third party api’s and good and bad experiences with other public transportation apps (within the Netherlands and abroad) we sketch a wireframe design for the flow of the new functionality. During this process we challenge ourselves to make it as easy and clear as possible for the user of our application. This sounds simpler than it is. In this case we did 4-5 iterations to simplify the wireframe flow further and further. Based on this flow our designer starts making the real designs and shares those with the team and with the customer. 

Making things simple

In the past the RET had a separate app for selling barcodes, in that app it was required to create an account and fill in a lot of personal information like your address etc. In our opinion that was way too much hassle for an incidental traveler. We wanted to make it possible for a traveler that doesn’t have the RET app installed on his phone to get a valid ticket within 60s. Therefore we decided that we want to use anonymous accounts (we use firebase authentication) within our app that don’t require any manual registering. Another requirement we had for ourselves is that the functionality should work super reliably, nothing is more annoying than a service where you are paying for is not working as expected. We therefore did have extra attention for the non-happy user flows, to communicate as clearly as possible to the traveler what is going on. 

For this feature we had to implement both the backend and integration in the app. The nice thing about that is that before we start developing, we can decide for ourselves what functionality should be in the backend and what functionality should be in the frontend. That makes really tight vertical integration possible and reduces the amount of development effort. The technical details about the backend may be a topic for another blog post in the future.

User experience

Enough about the process, let’s have a look at what it looks like in reality. This is what the user experiences the first time the app is opened. A user can multiple tickets at the same time, so with one phone it’s possible to travel with multiple persons. 

When the user is returning to the app, we check the status of the payment, when successful the tickets are added to the wallet and the user can activate the tickets from there. 

The user needs the barcode to check-in when a bus, tram or metro is entered. To make that process as flawless as possible we had to fulfill some challenging non everyday requirements. When we show a barcode we make the screen as bright as possible, suppress Apple Pay (we had to request a special permission from Apple to be allowed to do so) / NFC to prevent interfering with the NFC readers and to make it more difficult to fraud we had to make it impossible to take a screenshot from the barcode. Besides that we implemented some methods for doing visual inspection by conductors.

These were the insights I would like to share with you. What I liked during the process is that every team member made suggestions for refining the UX more and we were able to include many into the app. I truly believe that we developed as a team something to be proud of, and the first data is also supporting that. We sold way more tickets than expected in the first week without receiving any questions or complaints. 

For now please test the new RET apps and share with us your experiences. Besides the ticket functionality we also have a great planner, functionality to easily check departures from nearby stops and a map that shows all the available shared mobility options around you. All those functionalities work everywhere in the Netherlands and are not limited to Rotterdam.  

iOS: https://apps.apple.com/nl/app/ret/id1619325571

Android: https://play.google.com/store/apps/details?id=nl.infoplazamob.ret