Originally, the frontend of this dashboard was created in 2019 as my graduation project as Licenced Mediamatician (EFZ). It was designed using HTML5, CSS3 and ES6 JavaScript (using some jQuery and chart.js for the graphs). In the final product, the backend was developed using node.js, providing the data in CSV format to be parsed by the frontend.

All visual elements used in the frontend were created using Adobe Photoshop or Illustrator, except for the space background video which was provided by Relaxing Site under the Creative Commons license.

The tiles show the various teams involved in the automation project and the value they generate. They show how many working hours they were able to reduce by automating various processes as well as the number of automation processes or ‘bots’ involved for the various tasks. Clicking on the tiles provides some more details, including a short text introducing the team and a list of bots that are currently in development.

The main purpose of this dashboard was to be presented on large displays in the team’s office rooms or during trade fairs. It was non-interactive; instead of clicking on the tiles, the views would change automatically every 30 seconds. Also, it is only minimally responsive and provides no practical mobile view.

As it served somewhat as an eye-catcher, a flashy retro-futuristic design was used. This design is inspired by mid-20th century science fiction designs, as the automation project used the classic image of humanoid robots for its visual identity.

Expanding the science fiction image, a light-hearted quote display was added at the lower right corner, addressing the impact automation has on society through various points of view both today and in past decades.

This is a sample to showcase the dashboard’s frontend design. All names and data are entirely fictional.

© Dominik Nussbaum