This is my portfolio website / playground.
It is a love letter to the internet of the old, the era of the naïve (web) art, the era of the romantic amateur, the era of Geocities. I first experienced the magical world of the world wide web in the 90's and I hope I managed to capture a glimpse of that time. I was also influenced by print publication design and by 90's MTV on-screen graphics.
I call this style frivobrutalism, placing emphasis on the blend of the playfulness frivolity of the design/experience with the brutalist aesthetic.
Visitors can move things around and customize the colors of all colorful elements: clicking on an element generates a new color, from the predefined color palette. The rubber duck responds to mouse movement.
Most of the elements are part of microinteractions and hovering over them or interacting with them in other ways triggers some animation (and in one case it also triggers sound).
The website is responsive for desktop and mobile.
Since the website is quite colorful and full of animations, it might be difficult for people with disabilities to navigate through it. That's why I decided to create a minimal version as well, to assist people with color blindness and/or other disabilities with their experience. The minimal version can be accessed from the website's footer, which points to https://michaelkolesidis.com/minimal/.
February 2023
Awarded by One Page Love, a One Page website design gallery showcasing the best Single Page websites, templates and resources.
February 2023
Awarded by CSS Winner, a unique global platform awarding and showcasing the best websites and promoting innovative web designers, developers and agencies.
March 2023
Awarded by Best CSS, a web platform that discovers, recognizes and promotes the talent and effort of web designers, developers and agencies who create unique digital experiences that are useful, innovative, intuitive and beautiful.
The project uses the following npm packages:
- Vite
- TypeScript
- Sass
- DOM Window Manager (created by me)
This library is imported using CDN:
- Visual Studio Code
- Google Chrome
- Chromium
- Mozilla Firefox
- GNOME Web
- Microsoft Edge
- Blender
- Inkscape
- Krita
- Audacity
- GNOME Screenshot
- KDE Spectacle
- GNOME Terminal
| HEX | RGB |
|---|---|
| #ff90e8 | 255, 144, 232 |
| #ffc900 | 255, 201, 0 |
| #ff7051 | 255, 112, 81 |
| #3ecfc1 | 62, 207, 193 |
| #90a8ed | 144, 168, 237 |
| #ffffff | 255, 255, 255 |
| #0a0a0a | 10, 10, 10 |
For the minimal version of my website I tried to replicate the styling of my printed CV!
A huge thanks to everyone (from friends and colleagues to the anonymous people of the internet) who supported me and provided me with valuable feedback throughout the development process.
Thank you so much for your interest in my project! If you want to go a step further and support my work, buy me a coffee:
Copyright (c) 2023 Michael Kolesidis
Licensed under the GNU Affero General Public License v3.0.