Radek Dobrovolný

Šuplík

2026-02-07T00:00:00Z

Drawer: Digital drawer for ideas

suplik.hippou.cz

It was just after eight in the evening and I felt like creating something. I fooled around with ChatGPT for a while, asking if it could suggest a topic for a two-hour project, but nothing seemed interesting. However, it led me to realize that I often come up with ideas, nice little things, and then forget about them.

So I thought of creating a digital drawer where I could toss that idea (and probably never return to it). Sure, it would certainly be enough to create a page for it in Notion, notes on my phone, or a document on Drive. But I liked the idea that it would be hanging publicly and that anyone could toss an idea into the drawer. It's not about practicality, it's about the feeling.

It was a bit more diverse on the technical side, where I wanted to try new things. I wanted to solve it as a simple web app that stores data. I was looking for whether there are online hosted databases where you can store data for free for mini-projects. I then wanted to host the web app itself as usual on GitHub Pages.

Supabase

I found Supabase, Postgres hosting for developers, where you get a database, API, and authentication and all this is available in the free tier. Cool. Registered and created a table for ideas. It actually had just one meaningful column with text and then only ID and creation time. Then it was necessary to set what operations could be done via the API (load records, add new).

Then I coded the web app with Claude: connection to the database, data loading, output to web, and CSS styles. I was surprised that the entire website was created practically with one prompt and then we just fine-tuned. In the configuration, it was necessary to set the URL of the remote database and API token.

Finally, I had a deploy manifest generated for GitHub and went live. The whole project was done in less than two hours, which was my intention. Joy.

PocketBase

About two weeks later, however, the database in Supabase paused due to inactivity. Honestly, I don't really know what exactly that "inactivity" means – every other day I added some idea to the Drawer or at least viewed them, so there was some minimal traffic there. OK. The database could be unpaused and the free tier could continue without problems.

But at that time I was playing with my home server, so I decided to try to redo it. I came across the PocketBase project, which is a really cute wrapper over SQLite that turns it into an instant backend. PocketBase is still very much in development, so I'm curious what features will be added. However, it doesn't have an official Docker image yet. Fortunately, the documentation describes how to write a Dockerfile and build the image yourself, which I did.

The installation wasn't completely smooth, but it worked and I got PocketBase running on my server.

Then it was easy. Export data from Supabase, upload it to PocketBase (actually, the import didn't work for me, so I copied those eight rows manually), set public access, adjust the database connection in the code (one prompt for Claude) and deploy. It works. Joy again.

Enjoy

So if you ever get an idea that you want to put in a drawer, feel free to use Drawer. And if you're bored and looking for inspiration, you can look into the Drawer and maybe start something.

You can find the project repository on GitHub.

Happy creating!

Crossing Boundaries

2025-03-24T00:00:00Z

Digital Artifact: Workshop at KISK Winter School

At the KISK Winter School, I led a workshop where we attempted to create a shared digital artifact – a memory that would survive both physical time and space. Did it work? And what happened during one intense hour and a half at Nová Cvernovka?

Ideation

In mid-February 2025, I attended an event organized by KISK students – the first Winter School, a community event entirely realized by students, with content brought by participants themselves.

main hall

The event took place in Bratislava at the creative and cultural center Nová Cvernovka. I was eager to soak up the atmosphere of this environment, take a trip, meet new people, and get a glimpse into the current mood and topics of students. And in the end, it was really great.

During registration, you had to immediately say what you wanted to contribute to the program. The options were lectures, workshops, and similar formats. I wrote a somewhat general answer because I didn't know what the initial conditions would be – mainly time and number of people. Eventually, we agreed that I would do a workshop. Specifically: we would try to create a digital artifact together.

We ended up agreeing on quite challenging parameters. Time allocation of an hour and a half, about 15 participants. Phew. My ideal scenario was half the number of people and more than two hours. Oh well – it would be a challenge and it would be intense.

Theme and Anchoring

I really liked the claim of the whole event: crossing boundaries. My goal was to create some digital work during the workshop – a memory of this event – that all participants would contribute to.

Physical artifact

But first, a bit of theory. I tried to introduce what digital artifacts actually are and show a few examples. We talked about how we're operating at the intersection of digital creation, art, programming, and generative art – and that the boundaries between these areas are often quite blurred. I didn't want to get bogged down in debates about whether it's art or not. That wasn't important to me at that moment. I perceive digital artifacts as a tool for self-expression.

I mentioned the Genuary challenge, the aggregator The Useless Web, and introduced some creators on Instagram. We had about 15 minutes for the theoretical introduction – I tried to convey as much as possible, but in this time it might have seemed a bit convoluted.

Roles and Division

Then I presented what we could try to create. I wanted to work with the p5.js library, which I briefly introduced: we have a canvas on which we can create, and then place the output on the web. The goal was to try to express the atmosphere of the winter school and preserve it in the digital world – something that might evoke a feeling even in five years.

vegetables

I had prepared small subgroups that participants divided into.

The first group was tasked with collecting visual impressions – walking around the space and taking some photos.

The second group collected sounds – noises, phrases, or even short messages.

The third focused on texts – excerpts from lectures, materials, inscriptions, and other text fragments that affected them somehow.

The penultimate group was in charge of visual style – fonts, colors, graphic elements.

The last group were interaction designers – their task was to come up with how the page would behave, what would be displayed, how the interaction would look.

Disco

Participants chose their own group and went off to collect. We had about half an hour for data collection. I sat down with the designers' group and helped determine the boundaries between what we were capable of implementing and what would be too demanding.

Let Them Cook

The main idea was working with the theme of "crossing boundaries". Two contrasting text messages should be displayed in the middle of the screen. The screen is divided by a fluid vertical boundary. And graphic objects move around the screen, which change when crossing the boundary. On touch, they stop and play a random sound. Ok, we had ideas. On paper, it looked feasible – although I honestly had no idea how quickly it could be put together.

Half an hour passed, participants returned, and we started presenting the collected materials. Each group added context about why they chose this particular thing. It was rich, diverse. There was enough material – but not so much that it overwhelmed us. I was pleased.

At this stage, we still fine-tuned the interaction plan and overall concept. And with that, we reached the end of the workshop's time frame.

Implementation

I then collected all the materials and went to dinner. And in the evening, I started the implementation. I had a web template with a p5.js canvas prepared. I inserted the background, created a panel for displaying texts, wrote a function for random selection and display. I added movement to the images. I was a bit worried about the "fluid boundary" in the middle of the screen. I heavily used ChatGPT to generate code, and then I put it together like a puzzle and fine-tuned the details. Finally, I added sounds and touch interaction. In about an hour and a half, the result was ready – and I could present it to others.

Valentín

Then I just fine-tuned the display on mobile phones and fixed sound playback. I was really pleased with the result. I liked how quickly such an artifact can be created – when you have materials, vision, and help from AI.

Cooked

I uploaded the result to a GitHub repository, where I also use GitHub Pages for hosting. You can view the digital artifact here: radekdobrovolny.github.io/zimni_skola_2025.

I was glad that the workshop's goal was fulfilled. That everyone contributed their part to the shared, community result. And now we'll see – whether someone will return to that artifact in a few years, or it will fall into oblivion.

I would like to repeat this workshop sometime. Ideally in a less wild form, when there will be more time, with a smaller group and greater participant involvement in creating with p5.js. To show how to transform ideas into code with ChatGPT's help and animate them in digital space.

What is love?

2024-06-28T00:00:00Z

What is love? KISK Summer School 2022

The theme of digital memory and capturing emotions is somehow important to me. I use digital artifacts for this. They're easy to share, simple to revisit, and I have this feeling that they won't get lost as easily as a photo or a sketchbook.

This is a description of a micro-project that isn't particularly interesting from a technical standpoint, but it's a sweet little thing.

At KISK Summer School, Lea decided to go around to all the participants and ask them quite simply: "What is love?" I'm still not entirely sure what her intention was. But I'm convinced that the environment in which it took place lent itself to a light magic.

Summer is beginning, the semester is ending, you're in beautiful nature, somewhat cut off from the world. Around you are forests and high cliffs, a river murmurs. There are friends here, or at least people with whom you share a few common interests. And you're spending a whole week here. I wouldn't dare claim whether some kind of self-reflection happens here, but relaxation certainly does. And then someone asks you: "What is love?"

The collected answers are cheerful, funny, a bit philosophical, loving, brief and extensive, some perhaps slightly bitter. I don't remember exactly how it all happened and who approached whom, but Lea and I agreed to create a digital artifact and immortalize the answers by releasing them into the internet.

Technology

Now for the less poetic part. Lea prepared graphics in Canva, and I put together a simple website where you can view the answers. Nicely one after another, similar to when you walk around to individual people. Just a bit of HTML, CSS, and simple JavaScript. We added chirping birds to the background. And that's it.

The project is available on GitHub and is also hosted on GitHub Pages. Happy browsing.

Personal Website

2024-06-09T00:00:00Z

🇨🇿 This blog post is currently in Czech. Thanks for your patience—English version coming soon!

Webovky

Na jaře letošního roku jsem hledal nové pracovní místo. Komunikoval jsem s mnoha recruitery a procházel dlouhou sérií pohovorů. Jako svůj životopis používám profil na LinkedIn. Je v něm shrnutí kde jsem pracoval, jaké jsem tam používal technologie, jak vypadaly projekty a podobné informace, které zajímají lidi z HR.

Pak ale začnete komunikovat s teamleady vývojářských týmů, seniorními programátory a ti se začnou ptát na detailní otázky ohledně programovacích jazyků, frameworků a vůbec technologí. Cítil jsem potřebu mít svůje CV rozdělené na jakousi business verzi a pak detailní technickou, kterou bych mohl posílat právě lidem na techničtějších pozicích.

Portfolio

K technickému résumé by bylo dobré mít i ukázky svojí práce. Tohle byla úplně automatická myšlenka. Vzpomněl jsem si, jak současní studenti KISKu jsou vedeni k tomu, aby si během studia začali utvářet svoje portfolio, formou webové stránky. Většinou si vytvoří web na Wordpressu anebo Google Sites a píšou tam shrnutí svých semestrů, čemu se věnují a co nového se naučili. Vždycky se mi ta idea líbila a tak jsem se rozhodl se po této cestě vydat taky. Mít malý web, kde bude něco o mně a o tom, co zrovna dělám. Résumé, portfolio a blog.

Technologický stack

Tak záměr by byl. Teď vymyslet, jak jej zrealizovat. Chtěl jsem se vyhnout složitým redakčním systémům, takže automaticky vypadává Wordpress a podobné. Myšlenka, že budu muset vybírat pluginy a kontrolovat jejich updatování a věnovat velkou péči údržbě, se mi nelíbila. Chtěl jsem jednoduchý, statický web, kde budu mít plnou kontrolu nad kódem. Přemýšlel jsem i nad čistým HTML + CSS kódem. Ale nakonec jsem se rozhodl, že použiju generátor statického webu. Nabídka není úplně malá, kdysi jsem se setkal s Hugo (napsaný v Golangu), zalíbilo se mi Astro (js) a nakonec jsem vybral 11ty (také js), které mi doporučil Honzík Martinek, protože má sympatického tvůrce. Cílem bylo také naučit se něco nového, tak proč ne.

Také jsem se rozhodl, že si napíšu sám celé CSS, což jsem udělal asi poprvé v životě. Na frontend jsem vždy používal nějaké šablony, anebo knihovny kompoment. Měl jsem z toho trochu obavy, ale nakonec mě psaní CSS vlastně bavilo nejvíce. Velkou výhodou a pomocníkem je dneska ChatGPT. Mám takovou zkušenost, že nevyřeší problémy za mě, ale je to jako kdyby vedle mě seděl seniorní vývojář a ochotně mi odpovídal na všechny moje dotazy a validoval moje nápady.

Design

Další krok bylo vymyslet, jak web bude vypadat.