Dataviz & API project

Project overview

The objective of this project was to fetch data from an API and dynamically display the results on a webpage. We decided to use the SNCF's API to show the amount of lost and found items on their network. The SNCF API is updated three times a day, which worked great for our project. I focused on the front-end of the website, recreating the SNCF's design language, going as far as researching and finding the font they use on signs in stations.

Tech stack and tools

• Figma
• HTML, CSS, Javascript

Teammates

• Tianhong Huang
• Fabienne Lis

What I learned

I learned to use auto layout in Figma, as well as the dev mode to quickly go from mockup to code. This considerably sped up my work. I also learned about APIs and how they work.

Screenshots

Iterations