I made my own gallery

I made my own gallery of demos. You can check them at https://demos.julien-maury.dev/.

I’ve experimented stuff after reading about it. I also use this URL to host demos for GitHub repositories.

Topics are quite random and fun (at least, for me 🤷‍♂️). Be careful though, it’s absolutely not the place to learn best practices!

I may have broken some of them 🤬.

Photo by Alex Kondratiev on Unsplash


Source link

Divtober Day 30: Contrast

Again, I forgot to publish this yesterday, when the word was “Contrast.” I did two drawings:

The first one was a basic “logo” showing the word “contrast” with the contrast symbol (kind of):

The second one was an animated drawing showing the contrast between the summer and winter season on the same landscape (slide right and left to see the changes):

Unfortunately, this last one won’t work for Firefox users, who will only see the static winter landscape and won’t be able to interact with it.


Source link

Divtober Day 24: Smelly

The word of the day for divtober is “smelly.” So here’s a smelly trash can with boxes and bags around it:

Also, childish me did another demo yesterday for divtober #23 (loud) and #24 (smelly) together… it is tongue-in-cheek and inappropriate, and I’d recommend you check your speakers before you click on it 😉

It uses a single element (<audio>) and it plays the sound on click (I had to cheat a little and add some inline JavaScript code: onclick="this.play()"). The controls are hidden on desktop, although some browsers will display them (looking at Safari/Chrome on iOS). Also, it is animated on Chromium providing some movement on focus.

Without further ado, here is an inappropriate demo for divtober #23 and #24:


Source link

Divtober Day 5: Tired – DEV Community

This is my entry for #divtober day 5. The word is “Tired”, so I drew a cartoon of a man with a tired look on his face.

As with the previous drawing, it is animated… but it will only work on Chrome (for now). I don’t fully like the hair. Curly hair looks a bit nicer, but this made it simpler to code 😳

Initially, I thought about making a bicycle because it is “tired”. But in the end, I opted for the easy solution.


Source link

Using a greedy randomized algorithm to create art

The greedy randomized adaptive search procedure (also known as GRASP) is a metaheuristic algorithm commonly applied to combinatorial optimization problems in which each iteration consists basically of two phases: construction and local search. The construction phase builds a feasible solution, whose neighborhood is investigated until a local minimum is found during the local search phase.

First, the darkest pixel is found. Then a number of random lines are drawn through that point, and the pixel values along each line are added together. The line with the darkest average is chosen, and the value of that line is subtracted from the image. Then the whole process is started over again for however many lines we are drawing.

By the nature of the algorithm, the optimal line drawing configuration is probably not achieved, but performance is far superior to the naive method of checking every line.


Source link