I recently moved to Trento to begin my master in Mathematics and I got to catch a few trains to move back and forth to Firenze. A single way trip is close to 3 hours and it would quickly become boring without an internet access.
Unfortunately the railway path is not mobile friendly, Italy is definitely not flat and the train have to transit under a bunch of mountains so no mobile signal under there. Goodbye Reddit :(
Trenitalia is the operator of the high speed railway and in partnership with Telecom Italia provide internet access on the high speed trains trough a WiFi network and God knows what something that can reach a train going 300 Km/h under a mountain.
There is no fee in using this service and even if it limited in brandwith it is still a good way to save on my monthly plan limited internet.
One of the main drawbacks of the service is authentication, it has been thought for screens wider than 7” and in this world of smartphone is pretty much unusable.
The process is:
- request your credentials via a web interface, recieve via SMS
- enter your credentials via a web interface
This should be simple enough right? Unfortunately the process is more like this:
- load the page
http://portalefrecciargento.it, there won’t be automatic redirection from other urls you may type
- follow the link tied to your authentication method, text message for TIM, text message for other providers, credit card (seriously?)
- enter your phone number
- receive your text message, your credentials are like this
smsDDDDDDD@telecomitalia.it(D is a digit) and a four digits password, valid for 24 hours. You can request your credentials three times, after that they won’t provide them and remind you that you run out of chance to retrieve them
- enter the credentials in the form
- accept privacy, terms and conditions
- surf all the web!
This process is so difficult on a smartphone that it drove me so much crazy that I switched to my laptop and did not look back at my phone for 3 hours!
There must be a simpler way to do this, the web is simple when thought and done right!
The best chance at fixing this terrible user experience for my phone is providing my own authentication page, as a OpenWeb App!
The idea is simple, study the authentication procedure from my laptop and reverse engineer the steps needed to request credentials and to autenticate.
Starting is really simple, I need a index.html file, a manifest.webapp file and maybe a CSS and a JS.
This skeleton is a good starting point!
Let’s study how we can request the credentials.
http://portalefrecciargento.it follow the link to request your credentials, once there fill the form and open the developer tools, focus the network tab and submit the form, a request will be logged and you can peek and analyse it.
I saved the request as a .har file and opened it in a text editor, there were all the details of the previous request.
The important part of the request is this:
From this info we can see that there are a few parameters that we should pass with our request but only one is provided by the user, mobile.
Knowing this we can model a form that will make the request on our behalf with only one input, the phone number.
Doing the very same process for the login request we can model another form
This very poor interface result in this screenshot on the simulator
Using this webapp to request my credentials and login make it so easy and speeds up the process so much that I specifically run a Firefox OS simulator on my laptop to stay away from the official (and cluncky) interface.
This project is a simple hack to enhance user experience, many passenger on the train use their devices during their trip and many of them surely struggle with a process that is so stupidly simple but so poorly implemented, this was a very low hanging fruit with a pretty big benefit and it’s a shame that no one came up with a better solution.
What I have rediscovered, and that fascinates me, is that the web is very simple, so simple that you can hack your way out of madness while you are on a train isolated from the internet in less than ten minutes.
I moved the project to a specific webpage, agnostic to the browser but you can still install it as a OpenWeb App.
Here you can see a screenshot
And the updated code, more accessibility friendly; some examples