add stuff to gallery

.gitignore

@@ -1,5 +1,6 @@
 *.kra
 *.txt
+*.png~
 blog/md/draft
 media/icons/svg
 projects/*/*.svg

about.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 
@@ -38,7 +38,7 @@
             <div class="column" style="width: 100%;">
                 <h1>About</h1>
                 <h2>About me</h2>
-                <p>I'm Ailyaut (pronounced <span class="italic">ayo</span>), a 24-year-old designer from France.<br>
+                <p>I'm Ailyaut (pronounced <span class="italic">ayo</span>), a 25-year-old designer from France.<br>
                     I've got a bachelor's degree in 3D animation, and I consider myself a primarily visual artist, although I also enjoy writing music and code.<br>
                     In my spare time, I create a mobile game (yet to be announced), make music that I post on YouTube and Bandcamp, and tinker with my Linux server. I'd also like to write a comic book, though I have only two pages so far.
                 </p>

blog.html

@@ -52,6 +52,40 @@
                 <div class="row" style="gap: 2em">
                     <!-- blog -->
                     <div class="column" style="--custom_width: 33%; gap: 1em">
+    <a href="blog/gang_release.html" class="card" style="text-decoration: none;">
+        <img src="projects/gang/thumb.png
+" alt="Release of Gang
+" title="Release of Gang
+" class="card_image"/>
+        <div class="box">
+            <div class="column" style="width: 100%;">
+                <h3 class="card_title">Release of Gang
+</h3>
+                <p class="card_text">
+                    TL;DR: I made a card game, and now I'm releasing all the necessary files so you can print it! You can use them however you like, as long as it's for personal use only. No commercial or AI-related use.
+
+                </p>
+            </div>
+        </div>
+    </a>
+</div><div class="column" style="--custom_width: 33%; gap: 1em">
+    <a href="blog/a_new_dawn.html" class="card" style="text-decoration: none;">
+        <img src="blog/media/2025/website_update.png
+" alt="A new dawn
+" title="A new dawn
+" class="card_image"/>
+        <div class="box">
+            <div class="column" style="width: 100%;">
+                <h3 class="card_title">A new dawn
+</h3>
+                <p class="card_text">
+                    If you’ve been following this blog since its beginnings in 2024, back when the URL was still ailyaut.robotfumeur.fr, then you’ve probably noticed that it hasn’t been updated much in the last year.
+
+                </p>
+            </div>
+        </div>
+    </a>
+</div><div class="column" style="--custom_width: 33%; gap: 1em">
     <a href="blog/202405_moxxy_progress_report.html" class="card" style="text-decoration: none;">
         <img src="blog/media/2024/20240407_moxxy_progress.png
 " alt="Moxxy UI: May 2024 progress report
@@ -64,40 +98,6 @@
                 <p class="card_text">
                     Let's start with a little announcement: from now on, I'll be publishing my .penpot file in the moxxy/design repository on Codeberg on a monthly basis, so that everyone can tinker with the interface to their heart's content! I should have done it from the start, but better late than never! 
 
-                </p>
-            </div>
-        </div>
-    </a>
-</div><div class="column" style="--custom_width: 33%; gap: 1em">
-    <a href="blog/202404_moxxy_progress_report.html" class="card" style="text-decoration: none;">
-        <img src="blog/media/2024/20240407_moxxy_progress.png
-" alt="Moxxy UI: April 2024 progress report
-" title="Moxxy UI: April 2024 progress report
-" class="card_image"/>
-        <div class="box">
-            <div class="column" style="width: 100%;">
-                <h3 class="card_title">Moxxy UI: April 2024 progress report
-</h3>
-                <p class="card_text">
-                    April has been a busy month, partly due to a Windows Defender Trojan alert that gave me a good excuse to wipe my entire disk and switch to Linux. So this post will be short and without any major news. 
-
-                </p>
-            </div>
-        </div>
-    </a>
-</div><div class="column" style="--custom_width: 33%; gap: 1em">
-    <a href="blog/202403_moxxy_progress_report.html" class="card" style="text-decoration: none;">
-        <img src="blog/media/2024/20240407_moxxy_progress.png
-" alt="Moxxy UI: March 2024 progress report
-" title="Moxxy UI: March 2024 progress report
-" class="card_image"/>
-        <div class="box">
-            <div class="column" style="width: 100%;">
-                <h3 class="card_title">Moxxy UI: March 2024 progress report
-</h3>
-                <p class="card_text">
-                    Although I haven't communicated much about it, I've been working on a new interface for Moxxy since October 2023. I created this blog mainly to present my work on this open source project.
-
                 </p>
             </div>
         </div>
@@ -110,7 +110,9 @@
         <div class="box">
             <div class="column" style="width: 100%;">
                 <h2 id="all">All posts</h2>
-                <hr><h3>2024</h3><p class="light">09/06&emsp;<a href="blog/202405_moxxy_progress_report.html">Moxxy UI: May 2024 progress report
+                <hr><h3>2025</h3><p class="light">23/11&emsp;<a href="blog/gang_release.html">Release of Gang
+</a></p><p class="light">01/06&emsp;<a href="blog/a_new_dawn.html">A new dawn
+</a></p><hr><h3>2024</h3><p class="light">09/06&emsp;<a href="blog/202405_moxxy_progress_report.html">Moxxy UI: May 2024 progress report
 </a></p><p class="light">08/05&emsp;<a href="blog/202404_moxxy_progress_report.html">Moxxy UI: April 2024 progress report
 </a></p><p class="light">07/04&emsp;<a href="blog/202403_moxxy_progress_report.html">Moxxy UI: March 2024 progress report
 </a></p><p class="light">13/03&emsp;<a href="blog/hello_world.html">Hello world!

blog/a_new_dawn.html

@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+
+<html lang="en">
+
+<head>
+	<meta charset="utf-8" />
+	<title>A new dawn
+ – Ailyaut's blog</title>
+    <link rel="icon" type="image/png" href="../media/icons/favicon-16x16.png" sizes="16x16">
+	<link rel="stylesheet" href="../style.css" />
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta property="og:title" content="A new dawn
+ – Ailyaut's blog" />
+    <meta property="og:type" content="blog" />
+    <meta property="og:url" content="https://ailyaut.com/" />
+    <meta property="og:image" content="https://ailyaut.com/blog/media/2025/website_update.png
+" />
+    <meta property="og:description" content="If you’ve been following this blog since its beginnings in 2024, back when the URL was still ailyaut.robotfumeur.fr, then you’ve probably noticed that it hasn’t been updated much in the last year.
+" />
+    <meta property="og:locale" content="en_US" />
+</head>
+<body>
+    <header>
+        <div id="header_box">
+            <div>
+                <a href="../index.html" id="header_title">Ailyaut's blog</a>
+            </div>
+            <nav id="header_nav">
+                <a href="../blog.html" class="nav_button_active">Blog</a>
+                <a href="../gallery.html" class="nav_button">Gallery</a>
+                <a href="../projects.html" class="nav_button">Projects</a>
+                <a href="../about.html" class="nav_button">About</a>
+            </nav>
+        </div>
+    </header>
+    <main>
+        <div class="box">
+            <div class="column" style="--custom_width: 60%;">
+                <h1>A new dawn
+</h1><p class="light">01/06/2025 · 2 min</p><div class="spacer" style="--size: 1em"></div><p>If you've been following this blog since its beginnings in 2024, back when the URL was still <a href="https://ailyaut.robotfumeur.fr">ailyaut.robotfumeur.fr</a>, then you've probably noticed that it hasn't been updated much in the last year.<br />
+My intent with this blog was to post at least once a month on Moxxy, but it took so much time to write the blog posts in HTML that I felt it just wasn't worth it.</p>
+<p>So I switched to WordPress.</p>
+<p>Just kidding, I wrote a big Python script that allows me to write the blog posts in Markdown, and then translates everything to HTML and updates all the necessary pages as well as the RSS feed. It might be overcomplicated, and it might be horrendous code, but it works.</p>
+<p>I am therefore starting this blog again, with a new, cleaner (and cooler) URL : <a href="https://ailyaut.com">ailyaut.com</a>.<br />
+I cleaned up the HTML and CSS, changed the colors and fonts (Space Grotesk is a cool font but it just feels overused now), and compressed all images so much that they are now blurry on mobile, all to achieve a &lt;100KB homepage. Which is not that small but I'm an artist so I need images everywhere.<br />
+Oh, and I broke all the previous links. Sorry!</p>
+<p>I'm going to start sharing a lot of my works on this website, including updates on the Moxxy UI of course, and personal projects such as... a ready-to-print card game that I illustrated?? That's right, so stay tuned.</p>
+<p>:^)</p>
+            </div>
+        </div>
+        <div class="spacer" style="--size: 2em"></div>
+        <a href="#" class="btt"><img class="bttimg" src="../media/icons/arrow_upward.png"/></a>
+    </main>
+    <footer>
+        <div id="footer_box">
+            <div class="footer_item">
+                <p>Copyright © 2025 Ailyaut</p>
+            </div>
+            <div class="footer_item">
+                <a target="_blank" href="https://www.websitecarbon.com/website/ailyaut-robotfumeur-fr-index-html/" style="text-decoration: none;">
+                    <p style="color: black; background-color: var(--accent); padding: 0.2em 0.6em 0.2em 0.6em ; border-radius: 1em;">
+                        0.02g of CO₂/view
+                    </p>
+                </a>
+            </div>
+            <div class="footer_item" style="justify-content: flex-end; gap: 1.75em;">
+                <a rel="me" href="https://mastodon.online/@ailyaut" target="_blank"><img src="../media/icons/mastodon.png" class="icon" alt="Mastodon" title="Mastodon"/></a>
+                <a href="https://www.youtube.com/@ailyaut" target="_blank"><img src="../media/icons/youtube.png" class="icon" alt="YouTube" title="YouTube"/></a>
+                <a href="https://ailyaut.bandcamp.com/" target="_blank"><img src="../media/icons/bandcamp.png" class="icon" alt="Bandcamp" title="Bandcamp"/></a>
+                <a href="https://codeberg.org/ailyaut" target="_blank"><img src="../media/icons/git.png" class="icon" alt="Git" title="Git"/></a>
+                <a href="../rss.xml"><img src="../media/icons/rss.png" class="icon" alt="RSS feed" title="RSS feed"/></a>
+            </div>
+        </div>
+    </footer>
+</body>

blog/gang_release.html

@@ -0,0 +1,91 @@
+<!DOCTYPE html>
+
+<html lang="en">
+
+<head>
+	<meta charset="utf-8" />
+	<title>Release of Gang
+ – Ailyaut's blog</title>
+    <link rel="icon" type="image/png" href="../media/icons/favicon-16x16.png" sizes="16x16">
+	<link rel="stylesheet" href="../style.css" />
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta property="og:title" content="Release of Gang
+ – Ailyaut's blog" />
+    <meta property="og:type" content="blog" />
+    <meta property="og:url" content="https://ailyaut.com/" />
+    <meta property="og:image" content="https://ailyaut.com/projects/gang/thumb.png
+" />
+    <meta property="og:description" content="TL;DR: I made a card game, and now I'm releasing all the necessary files so you can print it! You can use them however you like, as long as it's for personal use only. No commercial or AI-related use.
+" />
+    <meta property="og:locale" content="en_US" />
+</head>
+<body>
+    <header>
+        <div id="header_box">
+            <div>
+                <a href="../index.html" id="header_title">Ailyaut's blog</a>
+            </div>
+            <nav id="header_nav">
+                <a href="../blog.html" class="nav_button_active">Blog</a>
+                <a href="../gallery.html" class="nav_button">Gallery</a>
+                <a href="../projects.html" class="nav_button">Projects</a>
+                <a href="../about.html" class="nav_button">About</a>
+            </nav>
+        </div>
+    </header>
+    <main>
+        <div class="box">
+            <div class="column" style="--custom_width: 60%;">
+                <h1>Release of Gang
+</h1><p class="light">23/11/2025 · 2 min</p><div class="spacer" style="--size: 1em"></div><p class="italic">TL;DR: I made a card game, and now I'm releasing all the necessary files so you can print it! You can use them however you like, as long as it's for personal use only. No commercial or AI-related use.</em></p>
+<img src="../projects/gang/media/gang_scene.png" style="margin-bottom: 2em; border-radius: 1em; max-width: 450px;" title="Gang game elements" alt="Realistic 3D view (like a photo) of all the elements of the Gang game arranged on a table. In the foreground, 4 cards are arranged in a disorganized fashion, as if they had simply been thrown onto the table. They are, from left to right, the multicolored 1, the dragon, the yellow phoenix and the green phoenix. A little further on, a pile of face-down cards can be seen, with the highest card at an angle, as well as the game's box, depicting a manga-style Chinese dragon, whose long red body runs around all sides of the box. Finally, in the background, a sheet of paper with the rules of the game printed on it sits on the table." />
+<p>In February, <a target="_blank" href="https://mastodon.online/@ailyaut/114038751290601262">I posted on Mastodon</a> about <span class="bold">Gang</span>, a complete redesign of the famous card game "Gang of Four" in my own style. </p>
+<p>It started as a gift idea for my family and friends, and as for a lot of gift ideas, I took it very seriously and spent 2 month redesigning the game from the ground up and finding suppliers who could print the project as professionally as possible. By the way, finding a good supplier was the hard part, so if you have a project that involves printing cards and you're based in Europe, I highly recommend <a href="https://jeuxdecartes.printeurope.fr/calculateur">Printeurope</a>. They're based in France, and they were very nice and easy to reach by phone. The quality was very good, and the only things I could complain about were my own mistakes.  </p>
+<p>My family and friends loved it, and I am very proud of the result. However, I do not own the rights to the original game, so there's nothing I can do with it except... share it!</p>
+<p>I am releasing today all the necessary PDF files so you can print the game at home. I hope you enjoy it as much as my family and friends do!
+You can, of course, print it professionally with Printeurope, as I mentioned, or with any other service you see fit. <br>
+Just make sure <span class="bold">NOT</span> to sell it or use it for anything AI-related.<br>
+It's not an obligation, but I'd love it if you sent me an email or a message on Mastodon to tell me if you're enjoying Gang!</p>
+<p>In any case, please check the project page below to access all the files.</p>
+<!-- <a href="../projects/gang/index.html" class="button_active" style="width: fit-content">Project page</a> -->
+<div class="column" style="max-width: 376px; gap: 1em">
+    <a href="../projects/gang/index.html" class="card" style="text-decoration: none;">
+        <img src="../projects/gang/thumb.png" alt="Gang" title="Gang" class="card_image"/>
+        <div class="box">
+            <div class="column" style="width: 100%;">
+                <h3 class="card_title">Gang</h3>
+                <p class="card_text">
+                    A complete redesign of the famous card game "Gang of Four" in my own style, with a focus on being clean and accessible to colorblind people. 
+                </p>
+            </div>
+        </div>
+    </a>
+</div>
+<p><br>:^)</p>
+            </div>
+        </div>
+        <div class="spacer" style="--size: 2em"></div>
+        <a href="#" class="btt"><img class="bttimg" src="../media/icons/arrow_upward.png"/></a>
+    </main>
+    <footer>
+        <div id="footer_box">
+            <div class="footer_item">
+                <p>Copyright © 2025 Ailyaut</p>
+            </div>
+            <div class="footer_item">
+                <a target="_blank" href="https://www.websitecarbon.com/website/ailyaut-robotfumeur-fr-index-html/" style="text-decoration: none;">
+                    <p style="color: black; background-color: var(--accent); padding: 0.2em 0.6em 0.2em 0.6em ; border-radius: 1em;">
+                        0.02g of CO₂/view
+                    </p>
+                </a>
+            </div>
+            <div class="footer_item" style="justify-content: flex-end; gap: 1.75em;">
+                <a rel="me" href="https://mastodon.online/@ailyaut" target="_blank"><img src="../media/icons/mastodon.png" class="icon" alt="Mastodon" title="Mastodon"/></a>
+                <a href="https://www.youtube.com/@ailyaut" target="_blank"><img src="../media/icons/youtube.png" class="icon" alt="YouTube" title="YouTube"/></a>
+                <a href="https://ailyaut.bandcamp.com/" target="_blank"><img src="../media/icons/bandcamp.png" class="icon" alt="Bandcamp" title="Bandcamp"/></a>
+                <a href="https://codeberg.org/ailyaut" target="_blank"><img src="../media/icons/git.png" class="icon" alt="Git" title="Git"/></a>
+                <a href="../rss.xml"><img src="../media/icons/rss.png" class="icon" alt="RSS feed" title="RSS feed"/></a>
+            </div>
+        </div>
+    </footer>
+</body>

blog/md/20250601+a_new_dawn.md

@@ -0,0 +1,20 @@
+title = A new dawn
+timestamp = 1748773800
+preview = If you’ve been following this blog since its beginnings in 2024, back when the URL was still ailyaut.robotfumeur.fr, then you’ve probably noticed that it hasn’t been updated much in the last year.
+thumb = blog/media/2025/website_update.png
++++
+
+If you've been following this blog since its beginnings in 2024, back when the URL was still [ailyaut.robotfumeur.fr](https://ailyaut.robotfumeur.fr), then you've probably noticed that it hasn't been updated much in the last year.  
+My intent with this blog was to post at least once a month on Moxxy, but it took so much time to write the blog posts in HTML that I felt it just wasn't worth it.
+
+So I switched to WordPress.
+
+Just kidding, I wrote a big Python script that allows me to write the blog posts in Markdown, and then translates everything to HTML and updates all the necessary pages as well as the RSS feed. It might be overcomplicated, and it might be horrendous code, but it works.
+
+I am therefore starting this blog again, with a new, cleaner (and cooler) URL : [ailyaut.com](https://ailyaut.com).  
+I cleaned up the HTML and CSS, changed the colors and fonts (Space Grotesk is a cool font but it just feels overused now), and compressed all images so much that they are now blurry on mobile, all to achieve a <100KB homepage. Which is not that small but I'm an artist so I need images everywhere.  
+Oh, and I broke all the previous links. Sorry!
+
+I'm going to start sharing a lot of my works on this website, including updates on the Moxxy UI of course, and personal projects such as... a ready-to-print card game that I illustrated?? That's right, so stay tuned.
+
+:^)

blog/md/20251123+gang_release.md

@@ -0,0 +1,21 @@
+title = Release of Gang
+timestamp = 1763915400
+preview = TL;DR: I made a card game, and now I'm releasing all the necessary files so you can print it! You can use them however you like, as long as it's for personal use only. No commercial or AI-related use.
+thumb = projects/gang/thumb.png
++++
+
+_TL;DR: I made a card game, and now I'm releasing all the necessary files so you can print it! You can use them however you like, as long as it's for personal use only. No commercial or AI-related use._
+
+In February, I posted on Mastodon about **Gang**, a complete redesign of the famous card game "Gang of Four" in my own style. 
+
+It started as a gift idea for my family and friends, and as for a lot of gift ideas, I took it very seriously and spent 2 month redesigning the game from the ground up and finding suppliers who could print the project as professionally as possible. By the way, finding a good supplier was the hard part, so if you have a project that involves printing cards and you're based in Europe, I highly recommend [Printeurope](https://jeuxdecartes.printeurope.fr/calculateur). They're based in France, and they were very nice and easy to reach by phone. The quality was very good, and the only things I could complain about were my own mistakes.  
+
+My family and friends loved it, and I am very proud of the result. However, I do not own the rights to the original game, so there's nothing I can do with it except... share it!  
+
+I am releasing today all the necessary PDF files so you can print the game at home. I hope you enjoy it as much as my family and friends do!
+You can, of course, print it professionally with Printeurope, as I mentioned, or with any other service you see fit. 
+Just make sure NOT to sell it or use it for anything AI-related. It's not an obligation, but I'd love it if you sent me an email or a message on Mastodon to tell me if you're enjoying Gang!
+
+In any case, please check the project page below to access all the files.  
+
+:^)

gallery.html

@@ -4,17 +4,17 @@
 
 <head>
 	<meta charset="utf-8" />
-	<title>Gallery – Ailyaut's blog</title>
+	<title>3D / Gallery – Ailyaut's blog</title>
     <link rel="icon" type="image/png" href="media/icons/favicon-16x16.png" sizes="16x16">
 	<link rel="stylesheet" href="style.css" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1">
 
-    <meta property="og:title" content="Gallery – Ailyaut's blog" />
+    <meta property="og:title" content="3D / Gallery – Ailyaut's blog" />
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 
@@ -37,17 +37,15 @@
         <div class="box">
             <div class="column" style="width: 100%;">
                 <h1>Gallery</h1>
-                <p class="light">This page is still under construction.</p>
             </div>
         </div>
         <div class="spacer" style="--size: 1em;"></div>
         <div class="box">
             <div class="row" style="gap: 0.75em;">
-                <div class="button_active">3D</div>
+                <a href="gallery.html" class="button_active">3D</a>
-                <div class="button">Illustration</div>
+                <a href="gallery/illustration.html" class="button">Illustration</a>
-                <div class="button">Graphic design</div>
+                <a href="gallery/animation.html" class="button">Animation</a>
-                <div class="button">UI & webdesign</div>
+                <a href="gallery/music.html" class="button">Music</a>
-                <div class="button">Animation</div>
             </div>
         </div>
         <div class="spacer" style="--size: 2em;"></div>

gallery/animation.html

@@ -0,0 +1,105 @@
+<!DOCTYPE html>
+
+<html lang="en">
+
+<head>
+	<meta charset="utf-8" />
+	<title>Animation / Gallery – Ailyaut's blog</title>
+    <link rel="icon" type="image/png" href="../media/icons/favicon-16x16.png" sizes="16x16">
+	<link rel="stylesheet" href="../style.css" />
+
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+    <meta property="og:title" content="Animation / Gallery – Ailyaut's blog" />
+    <meta property="og:type" content="blog" />
+    <meta property="og:url" content="https://ailyaut.com/" />
+    <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:locale" content="en_US" />
+</head>
+
+<body>
+    <header>
+        <div id="header_box">
+            <div>
+                <a href="../index.html" id="header_title">Ailyaut's blog</a>
+            </div>
+            <nav id="header_nav">
+                <a href="../blog.html" class="nav_button">Blog</a>
+                <a href="../gallery.html" class="nav_button_active">Gallery</a>
+                <a href="../projects.html" class="nav_button">Projects</a>
+                <a href="../about.html" class="nav_button">About</a>
+            </nav>
+        </div>
+    </header>
+
+    <main>
+        <div class="box">
+            <div class="column" style="width: 100%;">
+                <h1>Gallery</h1>
+            </div>
+        </div>
+        <div class="spacer" style="--size: 1em;"></div>
+        <div class="box">
+            <div class="row" style="gap: 0.75em;">
+                <a href="../gallery.html" class="button">3D</a>
+                <a href="illustration.html" class="button">Illustration</a>
+                <a href="animation.html" class="button_active">Animation</a>
+                <a href="music.html" class="button">Music</a>
+            </div>
+        </div>
+        <div class="spacer" style="--size: 2em;"></div>
+        <div class="box">
+            <div class="column" style="width: 100%;">
+                <div class="row" style="gap: 1em;">
+                    <div class="column" style="--custom_width: 50%">
+                        <iframe class="gallery" style="aspect-ratio: 16/9;" src="https://www.youtube-nocookie.com/embed/BWbewoul1n8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
+                    </div>
+                    <div class="column" style="--custom_width: 50%">
+                        <iframe class="gallery" style="aspect-ratio: 16/9;" src="https://www.youtube-nocookie.com/embed/fAEp-mdmtq4" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
+                    </div>
+                </div>
+                <div class="row" style="gap: 1em; margin-top: 1em;">
+                    <div class="column" style="--custom_width: 50%">
+                        <video class="gallery" controls="" autoplay="" muted="" loop=""><source src="animation/bar.mp4" type=video/mp4></video>
+                    </div>
+                    <div class="column" style="--custom_width: 50%">
+                        <video class="gallery" controls="" autoplay="" muted="" loop=""><source src="animation/tententrain.mp4" type=video/mp4></video>
+                    </div>
+                </div>
+                <div class="row" style="gap: 1em; margin-top: 1em;">
+                    <div class="column" style="--custom_width: 50%">
+                        <video class="gallery" controls="" autoplay="" muted="" loop=""><source src="animation/tentensky.mp4" type=video/mp4></video>
+                    </div>
+                    <div class="column" style="--custom_width: 50%">
+                        <video class="gallery" controls="" autoplay="" muted="" loop=""><source src="animation/lettheshowbegin.mp4" type=video/mp4></video>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="spacer" style="--size: 2em"></div>
+        <a href="#" class="btt"><img class="bttimg" src="../media/icons/arrow_upward.png"/></a>
+    </main>
+
+    <footer>
+        <div id="footer_box">
+            <div class="footer_item">
+                <p>Copyright © 2025 Ailyaut</p>
+            </div>
+            <div class="footer_item">
+                <a target="_blank" href="https://www.websitecarbon.com/website/ailyaut-robotfumeur-fr-index-html/" style="text-decoration: none;">
+                    <p style="color: black; background-color: var(--accent); padding: 0.2em 0.6em 0.2em 0.6em ; border-radius: 1em;">
+                        0.02g of CO₂/view
+                    </p>
+                </a>
+            </div>
+            <div class="footer_item" style="justify-content: flex-end; gap: 1.75em;">
+                <a rel="me" href="https://mastodon.online/@ailyaut" target="_blank"><img src="../media/icons/mastodon.png" class="icon" alt="Mastodon" title="Mastodon"/></a>
+                <a href="https://www.youtube.com/@ailyaut" target="_blank"><img src="../media/icons/youtube.png" class="icon" alt="YouTube" title="YouTube"/></a>
+                <a href="https://ailyaut.bandcamp.com/" target="_blank"><img src="../media/icons/bandcamp.png" class="icon" alt="Bandcamp" title="Bandcamp"/></a>
+                <a href="https://codeberg.org/ailyaut" target="_blank"><img src="../media/icons/git.png" class="icon" alt="Git" title="Git"/></a>
+                <a href="rss.xml"><img src="../media/icons/rss.png" class="icon" alt="RSS feed" title="RSS feed"/></a>
+            </div>
+        </div>
+    </footer>
+</body>

gallery/illustration.html

@@ -0,0 +1,106 @@
+<!DOCTYPE html>
+
+<html lang="en">
+
+<head>
+	<meta charset="utf-8" />
+	<title>Illustration / Gallery – Ailyaut's blog</title>
+    <link rel="icon" type="image/png" href="../media/icons/favicon-16x16.png" sizes="16x16">
+	<link rel="stylesheet" href="../style.css" />
+
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+    <meta property="og:title" content="Illustration / Gallery – Ailyaut's blog" />
+    <meta property="og:type" content="blog" />
+    <meta property="og:url" content="https://ailyaut.com/" />
+    <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:locale" content="en_US" />
+</head>
+
+<body>
+    <header>
+        <div id="header_box">
+            <div>
+                <a href="../index.html" id="header_title">Ailyaut's blog</a>
+            </div>
+            <nav id="header_nav">
+                <a href="../blog.html" class="nav_button">Blog</a>
+                <a href="../gallery.html" class="nav_button_active">Gallery</a>
+                <a href="../projects.html" class="nav_button">Projects</a>
+                <a href="../about.html" class="nav_button">About</a>
+            </nav>
+        </div>
+    </header>
+
+    <main>
+        <div class="box">
+            <div class="column" style="width: 100%;">
+                <h1>Gallery</h1>
+            </div>
+        </div>
+        <div class="spacer" style="--size: 1em;"></div>
+        <div class="box">
+            <div class="row" style="gap: 0.75em;">
+                <a href="../gallery.html" class="button">3D</a>
+                <a href="illustration.html" class="button_active">Illustration</a>
+                <a href="animation.html" class="button">Animation</a>
+                <a href="music.html" class="button">Music</a>
+            </div>
+        </div>
+        <div class="spacer" style="--size: 2em;"></div>
+        <div class="box">
+            <div class="column" style="width: 100%;">
+                <div class="row" style="gap: 1em;">
+                    <div class="column" style="--custom_width: 25%">
+                        <img class="gallery" src="illustration/mars.png" title="Mars" />
+                    </div>
+                    <div class="column" style="--custom_width: 25%">
+                        <img class="gallery" src="illustration/jupiter.png" title="Jupiter" />
+                    </div>
+                    <div class="column" style="--custom_width: 25%">
+                        <img class="gallery" src="illustration/uranus.png" title="Uranus" />
+                    </div>
+                    <div class="column" style="--custom_width: 25%">
+                        <img class="gallery" src="illustration/iso.png" title="Iso" />
+                    </div>
+                </div>
+                <div class="row" style="gap: 1em; margin-top: 1em;">
+                    <div class="column" style="--custom_width: 28.5%">
+                        <img class="gallery" src="illustration/canevas_2025.png" title="Canevas" />
+                    </div>
+                    <div class="column" style="--custom_width: 20.1%">
+                        <a target="_blank" href="illustration/leopard.jpg"><img class="gallery" src="illustration/thumb/leopard.png" title="BD Leopard" /></a>
+                    </div>
+                    <div class="column" style="--custom_width: 50.5%">
+                        <a target="_blank" href="illustration/thunderblight.png"><img class="gallery" src="illustration/thumb/thunderblight.png" title="Bassist Thunderblight Ganon" /></a>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="spacer" style="--size: 2em"></div>
+        <a href="#" class="btt"><img class="bttimg" src="../media/icons/arrow_upward.png"/></a>
+    </main>
+
+    <footer>
+        <div id="footer_box">
+            <div class="footer_item">
+                <p>Copyright © 2025 Ailyaut</p>
+            </div>
+            <div class="footer_item">
+                <a target="_blank" href="https://www.websitecarbon.com/website/ailyaut-robotfumeur-fr-index-html/" style="text-decoration: none;">
+                    <p style="color: black; background-color: var(--accent); padding: 0.2em 0.6em 0.2em 0.6em ; border-radius: 1em;">
+                        0.02g of CO₂/view
+                    </p>
+                </a>
+            </div>
+            <div class="footer_item" style="justify-content: flex-end; gap: 1.75em;">
+                <a rel="me" href="https://mastodon.online/@ailyaut" target="_blank"><img src="../media/icons/mastodon.png" class="icon" alt="Mastodon" title="Mastodon"/></a>
+                <a href="https://www.youtube.com/@ailyaut" target="_blank"><img src="../media/icons/youtube.png" class="icon" alt="YouTube" title="YouTube"/></a>
+                <a href="https://ailyaut.bandcamp.com/" target="_blank"><img src="../media/icons/bandcamp.png" class="icon" alt="Bandcamp" title="Bandcamp"/></a>
+                <a href="https://codeberg.org/ailyaut" target="_blank"><img src="../media/icons/git.png" class="icon" alt="Git" title="Git"/></a>
+                <a href="rss.xml"><img src="../media/icons/rss.png" class="icon" alt="RSS feed" title="RSS feed"/></a>
+            </div>
+        </div>
+    </footer>
+</body>

gallery/music.html

@@ -0,0 +1,102 @@
+<!DOCTYPE html>
+
+<html lang="en">
+
+<head>
+	<meta charset="utf-8" />
+	<title>Music / Gallery – Ailyaut's blog</title>
+    <link rel="icon" type="image/png" href="../media/icons/favicon-16x16.png" sizes="16x16">
+	<link rel="stylesheet" href="../style.css" />
+
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+    <meta property="og:title" content="Music / Gallery – Ailyaut's blog" />
+    <meta property="og:type" content="blog" />
+    <meta property="og:url" content="https://ailyaut.com/" />
+    <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:locale" content="en_US" />
+</head>
+
+<body>
+    <header>
+        <div id="header_box">
+            <div>
+                <a href="../index.html" id="header_title">Ailyaut's blog</a>
+            </div>
+            <nav id="header_nav">
+                <a href="../blog.html" class="nav_button">Blog</a>
+                <a href="../gallery.html" class="nav_button_active">Gallery</a>
+                <a href="../projects.html" class="nav_button">Projects</a>
+                <a href="../about.html" class="nav_button">About</a>
+            </nav>
+        </div>
+    </header>
+
+    <main>
+        <div class="box">
+            <div class="column" style="width: 100%;">
+                <h1>Gallery</h1>
+            </div>
+        </div>
+        <div class="spacer" style="--size: 1em;"></div>
+        <div class="box">
+            <div class="row" style="gap: 0.75em;">
+                <a href="../gallery.html" class="button">3D</a>
+                <a href="illustration.html" class="button">Illustration</a>
+                <a href="animation.html" class="button">Animation</a>
+                <a href="music.html" class="button_active">Music</a>
+            </div>
+        </div>
+        <div class="spacer" style="--size: 2em;"></div>
+        <div class="box">
+            <div class="column" style="width: 100%;">
+                <div class="row" style="gap: 1em;">
+                    <div class="column" style="--custom_width: 33%">
+                        <iframe style="border: 0; min-width: 350px; min-height: 550px;" src="https://bandcamp.com/EmbeddedPlayer/track=696183895/size=large/bgcol=ffffff/linkcol=7137dc/tracklist=false/transparent=true/" seamless><a href="https://ailyaut.bandcamp.com/track/camel-by-camel-metal-cover-by-ailyaut-2">Camel by Camel (Metal cover by Ailyaut) by Ailyaut</a></iframe>
+                    </div>
+                    <div class="column" style="--custom_width: 33%">
+                        <iframe style="border: 0; min-width: 350px; min-height: 550px;" src="https://bandcamp.com/EmbeddedPlayer/track=2935215900/size=large/bgcol=ffffff/linkcol=7137dc/tracklist=false/transparent=true/" seamless><a href="https://ailyaut.bandcamp.com/track/oummm-le-dauphin-blanc-metal-cover-by-ailyaut">Oummm le dauphin blanc (Metal cover by Ailyaut) by Ailyaut</a></iframe>
+                    </div>
+                    <div class="column" style="--custom_width: 33%">
+                        <iframe style="border: 0; min-width: 350px; min-height: 550px;" src="https://bandcamp.com/EmbeddedPlayer/track=3370488760/size=large/bgcol=ffffff/linkcol=7137dc/tracklist=false/transparent=true/" seamless><a href="https://ailyaut.bandcamp.com/track/thunderblight-ganon-metal-cover-by-ailyaut">Thunderblight Ganon (Metal cover by Ailyaut) by Ailyaut</a></iframe>
+                    </div>
+                </div>
+                <div class="row" style="gap: 1em;">
+                    <div class="column" style="--custom_width: 33%">
+                        <iframe style="border: 0; min-width: 350px; min-height: 550px;" src="https://bandcamp.com/EmbeddedPlayer/track=1371748336/size=large/bgcol=ffffff/linkcol=7137dc/tracklist=false/transparent=true/" seamless><a href="https://ailyaut.bandcamp.com/track/les-m-nestrels-percussionnistes-metal-cover-by-ailyaut">Les ménestrels percussionnistes (metal cover by Ailyaut) by Ailyaut</a></iframe>
+                    </div>
+                    <div class="column" style="--custom_width: 33%">
+                        <iframe style="border: 0; min-width: 350px; min-height: 550px;" src="https://bandcamp.com/EmbeddedPlayer/track=2098400706/size=large/bgcol=ffffff/linkcol=7137dc/tracklist=false/transparent=true/" seamless><a href="https://ailyaut.bandcamp.com/track/miki-matsubara-stay-with-me-splatoon-cover">Miki Matsubara - Stay With Me (Splatoon cover) by Ailyaut</a></iframe>
+                    </div>
+                    <div class="column" style="--custom_width: 33%">
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="spacer" style="--size: 2em"></div>
+        <a href="#" class="btt"><img class="bttimg" src="../media/icons/arrow_upward.png"/></a>
+    </main>
+
+    <footer>
+        <div id="footer_box">
+            <div class="footer_item">
+                <p>Copyright © 2025 Ailyaut</p>
+            </div>
+            <div class="footer_item">
+                <a target="_blank" href="https://www.websitecarbon.com/website/ailyaut-robotfumeur-fr-index-html/" style="text-decoration: none;">
+                    <p style="color: black; background-color: var(--accent); padding: 0.2em 0.6em 0.2em 0.6em ; border-radius: 1em;">
+                        0.02g of CO₂/view
+                    </p>
+                </a>
+            </div>
+            <div class="footer_item" style="justify-content: flex-end; gap: 1.75em;">
+                <a rel="me" href="https://mastodon.online/@ailyaut" target="_blank"><img src="../media/icons/mastodon.png" class="icon" alt="Mastodon" title="Mastodon"/></a>
+                <a href="https://www.youtube.com/@ailyaut" target="_blank"><img src="../media/icons/youtube.png" class="icon" alt="YouTube" title="YouTube"/></a>
+                <a href="https://ailyaut.bandcamp.com/" target="_blank"><img src="../media/icons/bandcamp.png" class="icon" alt="Bandcamp" title="Bandcamp"/></a>
+                <a href="https://codeberg.org/ailyaut" target="_blank"><img src="../media/icons/git.png" class="icon" alt="Git" title="Git"/></a>
+                <a href="rss.xml"><img src="../media/icons/rss.png" class="icon" alt="RSS feed" title="RSS feed"/></a>
+            </div>
+        </div>
+    </footer>
+</body>

index.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
     <meta property="og:locale:alternate" content="fr_FR" />
 </head>
@@ -46,13 +46,13 @@
             </div>
             <div class="spacer" style="--size: 2em"></div>
             <div class="column" style="--custom_width:75%">
-                <h1>Heyo!</h1>
+                <h1>Heya!</h1>
-                <p>I'm Ailyaut, a 24-year-old everything designer with a particular interest in open source and card games.<br>
+                <p>I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games.<br>
-                    I have studied 3D animation and now work as a UI & product designer. I code sometimes.
+                    I have studied 3D animation and now work as a lead designer, sometimes programmer.
                 </p>
                 <p class="light" style="margin-bottom: 0;">
-                    Je m'appelle Ailyaut, je suis un designer touche-à-tout de 24 ans qui s'intéresse particulièrement à l'open source et aux jeux de carte.
+                    Je m'appelle Ailyaut, je suis un designer touche-à-tout de 25 ans qui s'intéresse particulièrement à l'open source et aux jeux de carte.
-                    J'ai étudié l'animation 3D et je travaille actuellement comme designer UI & produit. Je code même, parfois.
+                    J'ai étudié l'animation 3D et je travaille actuellement comme lead designer, et parfois comme programmeur.
                 </p>
             </div>
         </div>
@@ -98,6 +98,40 @@
                 <div class="row" style="gap: 2em">
                     <!-- blog -->
                     <div class="column" style="--custom_width: 33%; gap: 1em">
+    <a href="blog/gang_release.html" class="card" style="text-decoration: none;">
+        <img src="projects/gang/thumb.png
+" alt="Release of Gang
+" title="Release of Gang
+" class="card_image"/>
+        <div class="box">
+            <div class="column" style="width: 100%;">
+                <h3 class="card_title">Release of Gang
+</h3>
+                <p class="card_text">
+                    TL;DR: I made a card game, and now I'm releasing all the necessary files so you can print it! You can use them however you like, as long as it's for personal use only. No commercial or AI-related use.
+
+                </p>
+            </div>
+        </div>
+    </a>
+</div><div class="column" style="--custom_width: 33%; gap: 1em">
+    <a href="blog/a_new_dawn.html" class="card" style="text-decoration: none;">
+        <img src="blog/media/2025/website_update.png
+" alt="A new dawn
+" title="A new dawn
+" class="card_image"/>
+        <div class="box">
+            <div class="column" style="width: 100%;">
+                <h3 class="card_title">A new dawn
+</h3>
+                <p class="card_text">
+                    If you’ve been following this blog since its beginnings in 2024, back when the URL was still ailyaut.robotfumeur.fr, then you’ve probably noticed that it hasn’t been updated much in the last year.
+
+                </p>
+            </div>
+        </div>
+    </a>
+</div><div class="column" style="--custom_width: 33%; gap: 1em">
     <a href="blog/202405_moxxy_progress_report.html" class="card" style="text-decoration: none;">
         <img src="blog/media/2024/20240407_moxxy_progress.png
 " alt="Moxxy UI: May 2024 progress report
@@ -110,40 +144,6 @@
                 <p class="card_text">
                     Let's start with a little announcement: from now on, I'll be publishing my .penpot file in the moxxy/design repository on Codeberg on a monthly basis, so that everyone can tinker with the interface to their heart's content! I should have done it from the start, but better late than never! 
 
-                </p>
-            </div>
-        </div>
-    </a>
-</div><div class="column" style="--custom_width: 33%; gap: 1em">
-    <a href="blog/202404_moxxy_progress_report.html" class="card" style="text-decoration: none;">
-        <img src="blog/media/2024/20240407_moxxy_progress.png
-" alt="Moxxy UI: April 2024 progress report
-" title="Moxxy UI: April 2024 progress report
-" class="card_image"/>
-        <div class="box">
-            <div class="column" style="width: 100%;">
-                <h3 class="card_title">Moxxy UI: April 2024 progress report
-</h3>
-                <p class="card_text">
-                    April has been a busy month, partly due to a Windows Defender Trojan alert that gave me a good excuse to wipe my entire disk and switch to Linux. So this post will be short and without any major news. 
-
-                </p>
-            </div>
-        </div>
-    </a>
-</div><div class="column" style="--custom_width: 33%; gap: 1em">
-    <a href="blog/202403_moxxy_progress_report.html" class="card" style="text-decoration: none;">
-        <img src="blog/media/2024/20240407_moxxy_progress.png
-" alt="Moxxy UI: March 2024 progress report
-" title="Moxxy UI: March 2024 progress report
-" class="card_image"/>
-        <div class="box">
-            <div class="column" style="width: 100%;">
-                <h3 class="card_title">Moxxy UI: March 2024 progress report
-</h3>
-                <p class="card_text">
-                    Although I haven't communicated much about it, I've been working on a new interface for Moxxy since October 2023. I created this blog mainly to present my work on this open source project.
-
                 </p>
             </div>
         </div>

projects.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 

projects/camel_by_camel/index.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 

projects/chapeau_champion/index.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 

projects/gang/index.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 
@@ -38,18 +38,9 @@
             <div class="column" style="--custom_width: 60%;">
                 <h1>Gang</h1>
                 <p>A complete redesign of the famous card game "Gang of Four" in my own style, with a focus on being clean and accessible to colorblind people. The whole game was made using only open source software and printed by a small company in Alsace (France).</p>
-                <div class="row align_vertical">
-                    <div class="column" style="--custom_width: 33%">
-                        <img src="media/box_3d.png" title="Game box" alt="The game box. The box features a cartoon-style Chinese dragon. Its long, red, scaly body curls across the different sides of the box. On the top of the box, the word “Gang” is written in red." />
-                    </div>
-                    <div class="column" style="--custom_width: 67%">
-                        <img src="media/7_boxes.png" title="7 game boxes" alt="7 boxes of my card game featuring a Chinese dragon whose long body stretches across several sides of the box." />
-                    </div>
-                </div>
                 <div class="spacer" style="--size: 1em"></div>
-                <img src="media/preview_cards.png" style="margin-bottom: 2em;" title="5 cards preview" alt="5 cards of the game. From left to right: a card back, the multicolor 1, the green phoenix, the yellow phoenix, and the red dragon." />
+                <img src="media/gang_scene.png" style="margin-bottom: 2em; border-radius: 1em;" title="Gang game elements" alt="Realistic 3D view (like a photo) of all the elements of the Gang game arranged on a table. In the foreground, 4 cards are arranged in a disorganized fashion, as if they had simply been thrown onto the table. They are, from left to right, the multicolored 1, the dragon, the yellow phoenix and the green phoenix. A little further on, a pile of face-down cards can be seen, with the highest card at an angle, as well as the game's box, depicting a manga-style Chinese dragon, whose long red body runs around all sides of the box. Finally, in the background, a sheet of paper with the rules of the game printed on it sits on the table." />
-                <p>Unfortunately, I do not own the rights to this game, so I cannot sell it.<br>
+                <p>If you want to print a copy of this game, you can use the following PDF files. I can recommend <a target="_blank" href="https://jeuxdecartes.printeurope.fr/calculateur">Printeurope</a> to print the cards. It might cost you more than the official version of the game, but hey, it's fun.</p>
-                    If you want to print a copy of this game, you can use the following PDF files. I can recommend <a target="_blank" href="https://jeuxdecartes.printeurope.fr/calculateur">Printeurope</a> to print the cards. It might cost you more than the official version of the game, but hey, it's fun.</p>
                 <h2>Files</h2>
                 <p>Please note that you are allowed to use these PDF files for personal use only, except for anything related to AI. Commercial use and AI training are not allowed.</p>
                 <a target="_blank" href="media/gang_cards.pdf" class="button" style="gap: 0.5em; width: fit-content; margin-bottom: 0.5em;">
@@ -62,10 +53,18 @@
                     <img class="icon" src="../../media/icons/download.svg" />
                     Box<span class="light">PDF · 4,7MB</span>
                 </a>
+                <a target="_blank" href="media/gang_rules_web_EN.pdf" class="button" style="gap: 0.5em; width: fit-content; margin-bottom: 0.5em;">
+                    <img class="icon" src="../../media/icons/download.svg" />
+                    Game rules (English)<span class="light">PDF · 800KB</span>
+                </a>
                 <a target="_blank" href="media/gang_rules_web_FR.pdf" class="button" style="gap: 0.5em; width: fit-content; margin-bottom: 0.5em;">
                     <img class="icon" src="../../media/icons/download.svg" />
                     Game rules (French)<span class="light">PDF · 800KB</span>
                 </a>
+                <a target="_blank" href="media/gang_score_sheet_EN.pdf" class="button" style="gap: 0.5em; width: fit-content; margin-bottom: 0.5em;">
+                    <img class="icon" src="../../media/icons/download.svg" />
+                    Score sheets (English)<span class="light">PDF · 200KB</span>
+                </a>
                 <a target="_blank" href="media/gang_score_sheet_FR.pdf" class="button" style="gap: 0.5em; width: fit-content; margin-bottom: 1.5em;">
                     <img class="icon" src="../../media/icons/download.svg" />
                     Score sheets (French)<span class="light">PDF · 200KB</span>

projects/hanafuda/index.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 

projects/kaya/index.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 

projects/les_menestrels/index.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 

projects/moxxy/index.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 

projects/oummm/index.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 

projects/patatotapopata/index.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 

projects/pwgen/index.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 

projects/rickroll/index.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 

projects/smoke/index.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 

projects/thunderblight/index.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 

projects/y_download/index.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
 </head>
 

projects/y_download/media/wavy.svg

@@ -1,52 +1,7 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<?xml version="1.0" encoding="UTF-8"?>
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg width="14.614mm" height=".88636mm" version="1.1" viewBox="0 0 14.614 .88636" xmlns="http://www.w3.org/2000/svg">
-
+<g transform="translate(-29.312 -61.906)" fill="none" stroke="#9b9bff" stroke-linecap="round" stroke-miterlimit="1e5" stroke-width=".26458">
-<svg
+<path d="m36.619 62.349c-0.59788 0.59789-1.0089 0.18684-1.1958 0-0.18684-0.18684-0.59788-0.59788-1.1958 0-0.59788 0.59789-1.0089 0.18684-1.1958 0-0.18684-0.18684-0.59788-0.59788-1.1958 0-0.59788 0.59789-1.0089 0.18684-1.1958 0-0.18684-0.18684-0.59788-0.59788-1.1958 0" style="paint-order:stroke markers fill"/>
-   width="14.613843mm"
+<path d="m43.793 62.349c-0.59788 0.59789-1.0089 0.18684-1.1958 0-0.18684-0.18684-0.59788-0.59788-1.1958 0-0.59788 0.59789-1.0089 0.18684-1.1958 0-0.18684-0.18684-0.59788-0.59788-1.1958 0-0.59788 0.59789-1.0089 0.18684-1.1958 0-0.18684-0.18684-0.59788-0.59788-1.1958 0" style="paint-order:stroke markers fill"/>
-   height="0.88636041mm"
+</g>
-   viewBox="0 0 14.613843 0.88636039"
-   version="1.1"
-   id="svg1"
-   sodipodi:docname="wavyframe.svg"
-   inkscape:version="1.4.2 (ebf0e940d0, 2025-05-08)"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
-   xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview1"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     inkscape:zoom="13.799999"
-     inkscape:cx="22.681161"
-     inkscape:cy="13.115943"
-     inkscape:window-width="1920"
-     inkscape:window-height="1011"
-     inkscape:window-x="0"
-     inkscape:window-y="0"
-     inkscape:window-maximized="1"
-     inkscape:current-layer="layer1" />
-  <defs
-     id="defs1" />
-  <g
-     id="layer1"
-     transform="translate(-29.311688,-61.906196)"
-     style="stroke-width:0.0661458;stroke-dasharray:none">
-    <path
-       style="display:inline;fill:none;fill-opacity:1;stroke:#9b9bff;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:100000;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
-       d="m 36.61861,62.349374 c -0.597884,0.59789 -1.00893,0.186844 -1.195774,0 -0.186838,-0.186838 -0.597885,-0.597884 -1.195769,0 -0.597884,0.59789 -1.008931,0.186844 -1.195775,0 -0.186838,-0.186838 -0.597884,-0.597884 -1.195768,0 -0.597885,0.59789 -1.008931,0.186844 -1.195775,0 -0.186838,-0.186838 -0.597884,-0.597884 -1.195769,0"
-       id="path11"
-       sodipodi:nodetypes="cscscsc" />
-    <path
-       style="display:inline;fill:none;fill-opacity:1;stroke:#9b9bff;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:100000;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
-       d="m 43.79324,62.349374 c -0.597884,0.59789 -1.00893,0.186844 -1.195774,0 -0.186838,-0.186838 -0.597885,-0.597884 -1.195769,0 -0.597884,0.59789 -1.008931,0.186844 -1.195775,0 -0.186838,-0.186838 -0.597884,-0.597884 -1.195768,0 -0.597885,0.59789 -1.008931,0.186844 -1.195775,0 -0.186838,-0.186838 -0.597884,-0.597884 -1.195769,0"
-       id="path1"
-       sodipodi:nodetypes="cscscsc" />
-  </g>
 </svg>

rss.xml

@@ -11,6 +11,34 @@
 	</image>
 	<atom:link href="https://ailyaut.com/rss.xml" rel="self" type="application/rss+xml" />
 
+	<item>
+		<title>Release of Gang
+</title>
+		<link>https://ailyaut.com/blog/gang_release.html</link>
+		<description>TL;DR: I made a card game, and now I'm releasing all the necessary files so you can print it! You can use them however you like, as long as it's for personal use only. No commercial or AI-related use.
+</description>
+		<category>posts</category>
+		
+		<guid>https://ailyaut.com/blog/gang_release.html</guid>
+		<dc:creator>Ailyaut</dc:creator>
+		<pubDate>Sun, 23 Nov 2025 17:30:00 +0100</pubDate>
+		<image>https://ailyaut.com/projects/gang/thumb.png
+</image>
+	</item>
+	<item>
+		<title>A new dawn
+</title>
+		<link>https://ailyaut.com/blog/a_new_dawn.html</link>
+		<description>If you’ve been following this blog since its beginnings in 2024, back when the URL was still ailyaut.robotfumeur.fr, then you’ve probably noticed that it hasn’t been updated much in the last year.
+</description>
+		<category>posts</category>
+		
+		<guid>https://ailyaut.com/blog/a_new_dawn.html</guid>
+		<dc:creator>Ailyaut</dc:creator>
+		<pubDate>Sun, 01 Jun 2025 12:30:00 +0200</pubDate>
+		<image>https://ailyaut.com/blog/media/2025/website_update.png
+</image>
+	</item>
 	<item>
 		<title>Moxxy UI: May 2024 progress report
 </title>

scripts/templates/index.html

@@ -14,7 +14,7 @@
     <meta property="og:type" content="blog" />
     <meta property="og:url" content="https://ailyaut.com/" />
     <meta property="og:image" content="https://ailyaut.com/media/preview.png" />
-    <meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
+    <meta property="og:description" content="Hi! I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games." />
     <meta property="og:locale" content="en_US" />
     <meta property="og:locale:alternate" content="fr_FR" />
 </head>
@@ -46,13 +46,13 @@
             </div>
             <div class="spacer" style="--size: 2em"></div>
             <div class="column" style="--custom_width:75%">
-                <h1>Heyo!</h1>
+                <h1>Heya!</h1>
-                <p>I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games.<br>
+                <p>I'm Ailyaut, a 25-year-old everything-designer with a particular interest in open source and card games.<br>
-                    I have studied 3D animation and now work as a UI & product designer, sometimes programmer.
+                    I have studied 3D animation and now work as a lead designer, sometimes programmer.
                 </p>
                 <p class="light" style="margin-bottom: 0;">
-                    Je m'appelle Ailyaut, je suis un designer touche-à-tout de 24 ans qui s'intéresse particulièrement à l'open source et aux jeux de carte.
+                    Je m'appelle Ailyaut, je suis un designer touche-à-tout de 25 ans qui s'intéresse particulièrement à l'open source et aux jeux de carte.
-                    J'ai étudié l'animation 3D et je travaille actuellement comme designer UI & produit, et parfois comme programmeur.
+                    J'ai étudié l'animation 3D et je travaille actuellement comme lead designer, et parfois comme programmeur.
                 </p>
             </div>
         </div>
@@ -64,7 +64,7 @@
                 <div class="row align_vertical" style="justify-content: space-between; height: min-content;">
                     <div class="row align_vertical" style="gap: 0.75em;">
                         <h2 style="margin-bottom: 0; margin-top: 0;">Featured project</h2>
-                        <img class="icon" src="media/icons/verified.png">
+                        <img class="icon" src="media/icons/verified.svg">
                     </div>
                     <p style="min-width: max-content; position: relative; top: 0.75em;"><a href="projects.html" class="light">All projects ></a></p>
                 </div>

style_expanded.css

@@ -292,6 +292,7 @@ hr {
 }
 
 .gallery {
+    background-color: var(--surface);
     max-width: 100%;
     border-radius: 1em;
 }