180 lines
9.0 KiB
HTML
180 lines
9.0 KiB
HTML
<!DOCTYPE html>
|
||
|
||
<html lang="en">
|
||
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<title>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="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" />
|
||
<meta property="og:locale:alternate" content="fr_FR" />
|
||
</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">Gallery</a>
|
||
<a href="projects.html" class="nav_button">Projects</a>
|
||
<a href="about.html" class="nav_button">About</a>
|
||
</nav>
|
||
</div>
|
||
</header>
|
||
|
||
<main>
|
||
<!-- intro -->
|
||
<div class="box">
|
||
<div class="column" style="--custom_width:25%">
|
||
<div class="align_vertical">
|
||
<div class="align_horizontal">
|
||
<img src="media/ailyaut.png" alt="Ailyaut" title="Ailyaut" id="portrait"/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="spacer" style="--size: 2em"></div>
|
||
<div class="column" style="--custom_width:75%">
|
||
<h1>Heya!</h1>
|
||
<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 lead designer, sometimes programmer.
|
||
</p>
|
||
<p class="light" style="margin-bottom: 0;">
|
||
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 lead designer, et parfois comme programmeur.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Featured project -->
|
||
<div class="spacer" style="--size: 6em"></div>
|
||
<div class="box">
|
||
<div class="column" style="width: 100%;">
|
||
<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.svg">
|
||
</div>
|
||
<p style="min-width: max-content; position: relative; top: 0.75em;"><a href="projects.html" class="light">All projects ></a></p>
|
||
</div>
|
||
<div class="spacer" style="--size: 1em"></div>
|
||
<div class="row" style="background-color: var(--surface); border-radius: 2em; padding: 1.25em; gap: 2em; border: 1px solid var(--outline);">
|
||
<div class="column" style="max-width: 400px; width: 100%;">
|
||
<img src="projects/gang/thumb.png" style="border-radius: 1.5em;" title="Gang" alt="A red chinese dragon drawn in a manga style";/>
|
||
</div>
|
||
<div class="column">
|
||
<h2 style="margin-top: 0;">Gang</h2>
|
||
<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). The PDF files are available for free printing.</p>
|
||
<p><a href="projects/gang/index.html">Learn more ></a></p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Blog -->
|
||
<div class="spacer" style="--size: 4em"></div>
|
||
<div class="box">
|
||
<div class="column" style="width: 100%;">
|
||
<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;">Blog</h2>
|
||
<a href="rss.xml" style="position: relative; top: 0.2em;"><img class="icon" src="media/icons/rss.png"></a>
|
||
</div>
|
||
<p style="min-width: max-content; position: relative; top: 0.75em;"><a href="blog.html" class="light">All posts ></a></p>
|
||
</div>
|
||
<div class="spacer" style="--size: 1em"></div>
|
||
<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
|
||
" title="Moxxy UI: May 2024 progress report
|
||
" class="card_image"/>
|
||
<div class="box">
|
||
<div class="column" style="width: 100%;">
|
||
<h3 class="card_title">Moxxy UI: May 2024 progress report
|
||
</h3>
|
||
<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>
|
||
</div>
|
||
</div>
|
||
<div class="spacer" style="--size: 4em"></div>
|
||
</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>
|