Development blog

MétEX has undergone several radical structural changes since its inception. Not a single line of code from the original version exists in the current version. I've always used MétEX as a way of experimenting with new frameworks and techniques I like the look of, and although the old versions of the site are no longer accessible, I would still like to document them and reflect on their design.

University Version (Flash)

The original version of MétEX, made in 2004-2005 for my final-year project in my Multimedia Design & Technology course, focused mainly on the front-end. My original intention for MétEX was to create a framework for virtual tours, which could easily be reskinned and the content replaced. The front-end for this version was created in (then) Macromedia Flash, with colours coming from a CSS file. The station and line information was stored in a Microsoft Access database. Flash was fairly capable at the time, but it wasn't able to read directly from a database. To get around this issue, the Flash front-end would request an ASP.net script, which would query the database and return the data to Flash as XML.

This worked fairly well, even though there was no caching so a new request was made for every single Line and Station change. The structure of the database was also quite rigid, with Stations linking directly to each other, meaning loops (such as on line 7bis and 10) were not properly represented.

The University Version had 2 features which never made it to future versions (yet!) - Journeys, and Points Of Interest. Journeys were short audiovisual experiences - I recorded short journeys between stations on my MiniDisc recorder, then synched up a slideshow along with a textual description of what was happening in the audio. I thought it was a very atmospheric feature, and one I would like to reintroduce back into the site soon.

Points Of Interest were the response to my tutor's criticism that there was little commercial value in the site. POIs could be attached to stations and could be theoretically be sponsored, so a shop could be listed as being close to a particular station. This feature was never fully fleshed out, and eventually became the Places feature.

First Public Version (PHP)

After I graduated from University, I lost access to the server the site was hosted on and decided to upload it onto my own server. I took this opportunity to modify the backend slightly. I moved the data from Access into a MySQL database, and did a straight conversion of the ASP scripts into PHP. The front-end remained otherwise unchanged.

Second Public Version (CakePHP)

In 2014, I decided to bring MétEX into the 21st century so to speak, and replace the Flash front-end with HTML. I was also learning about MVC frameworks, so I decided to rebuild MétEX from the ground up in CakePHP. I was learning many new tools and concepts in this version, such as Bootstrap for the UI, Cucumber for testing, and Sass for CSS compilation.

I also took the opportunity to modify the data structure of the database, trying to fix the issue with non-linear Lines. I added the concept of a Movement, representing a section of track between stations. This way I could keep a clear relationship between stations, allowing for more complex Line layouts (and paving the way for adding branched Lines in the future).

I also added Interchanges into the mix, allowing users to quickly hop from one Line to another and grouping the same station on different Lines in a logical way in the database. The Points Of Interest feature also became Places in this version, allowing me to show off more of the Paris Métro network than just the stations.

Third Public Version (Ruby on Rails)

After picking up Behaviour-Driven Development in the CakePHP version, I wanted to take a closer look at the Ruby language, and really started liking the look of Rails. The 2015 version was essentially a refactor of the CakePHP version into Ruby on Rails, with no new features or real interface changes. I did, however, migrate the database onto PostgreSQL.

A second post goes into the design decisions and architecture of the current version of the site.