It’s a video, in a single graphic.
This project was inspired by a chance encounter on reddit about “movie barcodes” and thought that it was pretty genius — a movie represented in what’s essentially a series of coloured bars (more examples can be found here). In a subsequent thought, I wanted to try making graphical barcodes on a smaller scale, of videos.
A summary of various approaches to style a webpage to match the user’s system theme using CSS, HTML and native javascript.
The classic method: detect user’s theme preference with CSS media feature prefers-color-scheme
.
While a completely different set of styles can be specified for each theme; using CSS variables allows for less repetition.
/* file: style.css *//* default: light theme colours */
:root {
--bg-colour: #fafafa; /* white */
--font-colour: #212529; /* dark grey*/
--primary-colour: #2196f3; /* blue */
--link-colour: #2962ff; /* blue */
--alt-bg-colour: #fff; /* white */
} /* if system…
Call it a marriage of interests.
It was a long commute and I was reeling from finishing Kimetsu no Yaiba (Demon Slayer) and thought that the coding experience can be explained with the show’s “water breathing techniques” (a combat style in the show) levels.
1st Form: Water Surface Slash → “hello world”, it begins with the shallow cuts — the basic functions, algorithms, the basic satisfaction of getting things to run
2nd Form: Water Wheel → the thrill in the realisation that code is a maker’s medium, that code implement ideas
3rd Form: Flowing Dance → the flow when it’s…
Between the national efforts to control the spread of COVID-19 and delayed job start date, I’ve had a lot of time to look back and graph the past 4 years that I spent getting my degree (FYI: from School of Information Systems (SMU)). In essence, what follows is a representation of my transcript in graphs.
Reading Notes:
In the course of my data exploration adventures, I find myself looking at such plots (below), which is great for observing trend but it makes it difficult to make out where and what each data point is.
Student of tech, working in tech.