<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet href="/feeds/styles/atom.xsl" type="text/xsl"?>

<feed xmlns="http://www.w3.org/2005/Atom" xmlns:webfeeds="http://webfeeds.org/rss/1.0">
    <title>The Yonic Corner</title>
    <subtitle><![CDATA[ A blog about games, technology, and my hobbies ]]></subtitle>
    <link rel="self" href="https://www.yonic.blog/feeds/atom-full.xml" />
    <link rel="alternate" type="text/html" href="https://www.yonic.blog" />
    <id>urn:uid:66464add-9b6b-5a43-baca-0d5e9a0558c7</id>
    <updated>2026-04-19T12:09:02.220Z</updated>
    <icon>https://www.yonic.blog/favicon-32x32.png</icon>
    <webfeeds:icon>https://www.yonic.blog/favicon.svg</webfeeds:icon>
    <webfeeds:wordmark>https://www.yonic.blog/wordmark.png</webfeeds:wordmark>
    <image>
        <url>https://www.yonic.blog/favicon.svg</url>
        <title>The Yonic Corner</title>
        <link>https://www.yonic.blog</link>
    </image>
        <entry>
            <title>Testing Weserv imagess</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2025/11/weserv</id>
            <link href="https://www.yonic.blog/blog/article/2025/11/weserv" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2025/11/weserv" />
            <summary><![CDATA[ For a game series that is known for being always joyful, this game for the Wii is particularly somber. But it also shows how to move past from the bad moments and overcome grief. ]]></summary>
            <published>2025-07-09T15:30:04.563Z</published>
            <updated>2025-07-09T15:30:04.563Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Faasnova.org%2Fwp-content%2Fuploads%2F2022%2F07%2Fsig09-004.jpg&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam sem urna, ornare non lacus et, interdum laoreet nunc. Fusce pellentesque est elementum vestibulum vulputate. Maecenas non ullamcorper nulla, a laoreet mi. Fusce blandit neque sed egestas tincidunt. Vivamus eget nibh malesuada, tempus lacus eu, aliquam enim. Etiam vehicula aliquam neque, vitae consectetur nisi dignissim et. Morbi ut diam tempus, hendrerit eros mollis, tincidunt tortor.</p>
<p>Curabitur suscipit dolor in erat congue feugiat. Donec a erat eget dui accumsan volutpat. In lobortis laoreet nunc, non malesuada ex dictum sit amet. Duis interdum sagittis urna ac aliquet. Aenean suscipit condimentum gravida. Quisque in mi ultrices leo posuere blandit quis id augue. Morbi non metus odio. Proin consectetur ligula in lectus finibus, vel aliquam enim ullamcorper. Aliquam erat volutpat. Cras ipsum quam, consequat in felis quis, ornare viverra erat. Sed dictum justo non lobortis pharetra.</p>
<p>Donec fringilla ligula id iaculis auctor. Etiam ac mattis diam, molestie ullamcorper quam. Maecenas purus erat, bibendum eget velit ut, ornare ornare tortor. Pellentesque quis porttitor metus, ac feugiat orci. Aenean luctus ante vel porta pellentesque. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nunc sed laoreet velit. Vestibulum ante ligula, fermentum a hendrerit at, tempor ut sem. Duis quis auctor enim, quis malesuada ipsum. Nullam pharetra, ligula nec finibus aliquet, odio mi pharetra nisl, id faucibus nisi lacus eu quam. Duis ultricies consectetur nulla quis sagittis. Donec venenatis nunc diam, eu eleifend turpis interdum sit amet.</p>
<p>Pellentesque fermentum luctus libero, quis cursus nulla iaculis eget. Suspendisse eleifend ornare neque, vel ornare ipsum vulputate id. Vivamus diam urna, mattis in sagittis ac, faucibus ac diam. Nunc mattis mauris eget efficitur tristique. Duis eu magna et dui porttitor cursus vel non ex. Pellentesque maximus nunc at risus aliquet laoreet. Suspendisse tortor lacus, porta in fermentum ac, commodo in ante.</p>
<p>Curabitur maximus porttitor nisi sed scelerisque. Cras scelerisque egestas erat, at viverra ex ultricies at. Vivamus lobortis sapien in egestas vestibulum. Donec pharetra sodales molestie. Maecenas vulputate mauris eget nibh aliquet fermentum. Vestibulum imperdiet, dolor ac tempor pretium, est ipsum porttitor augue, eu tincidunt risus erat id nibh. Vestibulum lacus sapien, sagittis nec mollis pulvinar, malesuada sed est. Sed faucibus luctus orci, vitae pulvinar eros aliquam sed. Maecenas ut euismod mauris, id facilisis purus. Phasellus molestie convallis mi non tempus. Donec lectus urna, dictum ac felis at, facilisis vehicula urna.</p>
<center> <div style="width:600px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fwww.galacticsights.ch%2Fimages%2F20160929_Andromeda_Galaxy_M31.jpg&amp;w=600&amp;h=338&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="600" height="338" alt="Testing Weserv images!" style="width:100%;height:auto" loading="lazy" decoding="async"> jhdskfhjkdshf </div> </center>]]></content>
    </entry>
        <entry>
            <title>How Super Mario Galaxy shows coming to terms with separation anxiety</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2025/08/super-mario-galaxy-separation</id>
            <link href="https://www.yonic.blog/blog/article/2025/08/super-mario-galaxy-separation" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2025/08/super-mario-galaxy-separation" />
            <summary><![CDATA[ For a game series that is known for being always joyful, this game for the Wii is particularly somber. But it also shows how to move past from the bad moments and overcome grief. ]]></summary>
            <published>2025-07-09T15:30:04.563Z</published>
            <updated>2025-07-09T15:30:04.563Z</updated>
            <content type="xhtml"><![CDATA[<div class="feed-preview"><p>The <em>Super Mario</em> series of games is well known for how joyful it is usually portrayed. On most installments, an Italian plumber from Brooklyn goes to the rescue of a princess from the hands of a huge turtle. And it does this by jumping and running and wa-hooing along his way. Even on situations that seem dramatic, scary or hopeless, Mario remains persistent and joyful through his quest.</p><p>But <em>Super Mario Galaxy</em> for the Wii is a notorious exception to this. Even though <em>Super Mario Sunshine</em> was the first game of the series with a clear theme around the game world, <em>Galaxy</em> and <em>Galaxy 2</em> are the games that fully embraced this concept, particularly the first game.</p><p>The stories of both of these two games is very similar: They tell the story of becoming separated from a loved one. However, the first one portrays this in a much more somber and straight to the point than the second, and in my opinion, in a better way.</p></div>
<h2 id="rosalinas-story">Rosalina’s story</h2>
<p>At the beginning of <em>Galaxy</em>, you meet a space lady called <strong>Rosalina</strong>, the central figure behind a massive spaceship, the Comet Observatory, which can soar space like a comet. As you progress through the game, you can enter the observatory’s library and listen to Rosalina reading a storybook to her “children”, some star shaped fellows called Luma.</p>
<p>In actuality, this storybook is a telling of her past. One night, she encountered a small Baby Luma, who was waiting for his mama to come for him. He tells the child Rosalina that she would come on a comet. This will become an important detail later.</p>
<p>Rosalina suggest him to go on his search, and so they soared through the stars in search for comets. Eventually, they reached several comets, but they couldn’t find her mama. When the pair began to think that the Baby Luma wouldn’t see her mother ever again, Rosalina promised to take care of him as if it was his mother, and decided to settle in on a comet.</p>
<p>But the story continues: Eventually, they found many other Luma and built a home on the comet. But they still waited for the little Luma’s mother. After seeing the 100th comet pass, she thought about checking up on home from the telescope, only to grow homesick, wishing to go back.</p>
<p>You see, prior to the beginning of the story, Rosalina’s mother passed away, and she once dreamt that should she leave, she would turn herself into a star to watch over her. But Rosalina was fully aware that she was being delusional. She knew that she was buried under the tree of a hill close to her home. She was dreaming that as a way to cope with the grief.</p>
<p>The next chapter after this can be quite confusing to some. The Baby Luma gets an idea, that he’d transform into a comet so that he could carry her to go back to her planet.</p>
<h2 id="galaxys-storytelling-and-marios-quest"><em>Galaxy</em>’s storytelling and Mario’s quest</h2>]]></content>
    </entry>
        <entry>
            <title>A real computer bug</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2025/07/inked-computer-bug</id>
            <link href="https://www.yonic.blog/blog/article/2025/07/inked-computer-bug" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2025/07/inked-computer-bug" />
            <summary><![CDATA[ Based on an actual experience I had last night. ]]></summary>
            <published>2025-07-09T15:30:04.563Z</published>
            <updated>2025-07-09T15:30:04.563Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2025%2F07%2Finked-computer-bug%2Fhero.png&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><div class="feed-preview"><a href="https://yonic.blog/file/img/blog/art/comics/inked-thoughts/computer-bug.png" target="_blank" rel="noreferrer">Click here for full image</a><center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2Fart%2Fcomics%2Finked-thoughts%2Fcomputer-bug.png&amp;w=700&amp;h=1275&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="1275" alt="Comic page" style="width:100%;height:auto" loading="lazy" decoding="async"> But no worries! They’ll probably starve before they find anything edible
under the keys. </div> </center></div>]]></content>
    </entry>
        <entry>
            <title>Apple's Liquid Glass is a design disaster: Here's why</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2025/06/apple-liquid-glass</id>
            <link href="https://www.yonic.blog/blog/article/2025/06/apple-liquid-glass" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2025/06/apple-liquid-glass" />
            <summary><![CDATA[ Just when we thought mobile UI couldn't get any worse, Apple throws the ball and reaches out of the park. ]]></summary>
            <published>2025-06-16T08:43:36.526Z</published>
            <updated>2025-06-16T08:43:36.526Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2025%2F06%2Fapple-liquid-glass%2Fhero.jpg&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><p class="astro-gicio36m"> <a href="/player/style-savvy-trendsetters/salsa" target="_blank" class="astro-gicio36m">Music: Store music: Salsa A</a> <i class="astro-gicio36m">(Nintendo Presents: New Style Boutique)</i></p> <script type="module" src="/app/apps/modern/src/components/PlayerLink.astro?astro&amp;type=script&amp;index=0&amp;lang.ts"></script> 
<div class="feed-preview"><p>Normally I wouldn’t care much about Apple’s announcements at their keynotes and other events, but this one has brought me many concerns about what they were thinking when they came up with this.</p></div>
<h2 id="just-what-is-liquid-glass">Just what is Liquid Glass?</h2>
<p>It is Apple’s <strong>new design language</strong> introduced in all software for Apple devices: iOS 26, TvOS 26, watchOS… You name it. This design language was meant to unify UI elements across all of their devices, which despite being fairly similar all around, have had their differences when you got specific in their functionality.</p>
<p>They managed to do this by using <strong>glassmorphism</strong> and crank it up to 11. When I hear that term, which reflects the look of glass to everything in the UI of an app, I usually retort with “I bet it looks worse than Aero Glass”.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2025%2F06%2Fapple-liquid-glass%2Faero.jpg&amp;w=700&amp;h=525&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="525" alt="Screenshot of Windows 7, featuring Aero Glass" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center>
<p>Aero was first introduced in Windows Vista all the way back in 2007 and further refined in Windows 7 two years later, by turning borders of windows into translucent, frosted glass.</p>
<p>And from there, it just went worse, except for that time with the Wii U, which I believe it was the best iteration of that aesthetic. The “web” iteration that you can pull off with <code>backdrop-filter</code> <strong>often lacks contrast</strong>, and in some cases, the edges are too fuzzy to figure out the bounds of an UI element.</p>
<div style="display:flex;flex-direction:column;gap:1em;align-items:center;justify-content:center;margin:0 auto;position:relative;background-size:contain;padding:1em;background-image:url('https://s3.eu-central-003.backblazeb2.com/yonic-corner-public/img/blog/2023/05/first-post/hugo-version.png');color:black;background-repeat:no-repeat repeat"><div style="border-radius:5px;padding:0 1em;background-color:rgba(194, 236, 255, 0.4);text-align:center;backdrop-filter:saturate(300%) blur(10px)"><p>This is a transparent window as it’s usually done on the web.</p></div><div style="border:1px solid silver;box-shadow:2px 5px 10px rgba(0,0,0,0.333),0px 0px 4px rgba(0,0,0,0.5),inset 0px 0px 5px rgba(255,255,255,0.75),inset 0px 0px 50px rgba(255,255,255,0.4),inset 0px 0px 6px rgba(0,0,0,0.3);font-family:system-ui;font-size:12px;border-radius:5px;padding:0 6px;background-color:rgba(135, 217, 255, 0.5);text-align:center;backdrop-filter:blur(5px);"><p style="text-shadow:0px 0px 10px white,0px 0px 3px white, 0px 0px 2px white, 0px 0px 1px white, 0px 0px 15px white;margin:0;padding:8px 0">This is a transparent window recreated as it was on Windows Vista and 7.</p><p style="background-color:white;border:1px solid rgba(0, 43, 59, 0.45);box-shadow:0px 0px 2px white;0px 0px 1px white;padding:1em 0;margin:0;margin-bottom:8px">Mind you that its content was usually not transparent.</p></div><div style="border-radius:20px;box-shadow:inset 0px -2px 8px rgba(10, 145, 155, 0.5),inset 0px 0px 5px rgba(10, 145, 155, 0.75);padding:0 1em;background-color:rgba(41, 217, 248, 0.5);text-align:center;backdrop-filter:blur(5px)"><p style="-webkit-text-stroke:4px rgb(10, 145, 155);paint-order:stroke fill; color:white;">This is a transparent colored window as it was done on Wii U.</p></div><div style="border-radius:20px;padding:0 1em;text-align:center;backdrop-filter:blur(10px) brightness(95%);box-shadow:inset -2px 2px 15px rgba(255,255,255,0.1),inset -1px 1px 2px rgba(255,255,255,0.45);color:white"><p>And this is Apple Liquid Glass on iOS.</p></div></div>
<p>Which one do you see more clearly? I assume that the <strong>iOS one isn’t very clear</strong>. Aero and the Wii U have implemented certain techniques such as text shadows and outlines to increase the text contrast of their transparent elements.</p>
<p>At least, Apple seems to have tried to add some volume and edges to the design, but it’s clearly inconsistent between platforms and even between parts of the same operating system. Apple Liquid Glass seems to completely forget this and instead it changes from dark to light depending on what’s underneath. Impressive, but there are simpler ways of achieving universal contrast.</p>
<div><p>&lt;Yonic&gt;</p><p>As far as I’m aware, macOS and maybe iOS have some pseudo “global illumination” feature that allows windows to light up with the colors of the surrounding windows. Pretty and —again— impressive, sure, but how many resources would that consume on their dedicated GPU of their system on a chip?</p><p>At least they seem sensible enough to have coded it in their native platforms, unlike <a href="https://winaero.com/windows-11-start-menu-revealed-as-resource-heavy-react-native-app-sparks-performance-concerns/">Windows 11’s React Native start menu</a>…</p><p>&lt;/Yonic&gt;</p></div>
 
<h3 id="gestalt-breaking-content">Gestalt-breaking content</h3>
<p>Also, it doesn’t really help much that reflections and refractions tend to get a lot in the way of the content that you’re viewing, despite Apple marketing it as “putting content first”. I assume they refer to that as making everything more transparent and reducing everything to a bunch of windows, and removing divisions from sections altogether, which is fine for reducing clutter, but it may also introduce other problems.</p>
<p>The <strong>principles of the Gestalt</strong> list how human vision tends to follow certain patterns. These things include grouping elements by how similar they are and how spaced they are relative to each other, and it even knows how to keep continuity of things even though they’ve been broken apart on purpose. Usually, UI designers rely on these to intentionally direct the attention of the user or to instruct them what things do what, and how related they are to each other, and <strong>Apple is definitely making use of them, even on this iteration</strong>. But what they haven’t seem to have considered is <strong>how these principle can also work <em>against</em> you</strong>.</p>
<p>By removing closure on some things, not only they’re removing one way to clearly add a separation between what some elements do and what don’t, they’re also adding new visual patterns that can disrupt the user’s attention. This has the effect when the bottom bar and its tabs were pulled apart in iOS 26, they started to behave like buttons now, which implies that they sort of work like “one-time actions” instead of “tabs to switch from one context to another”, in some cases.</p>
<p>But there’s something within this system that I just find truly hideous.</p>
<h2 id="the-clear-theme">The “clear” theme</h2>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2025%2F06%2Fapple-liquid-glass%2Fios-clear-theme.jpg&amp;w=700&amp;h=393&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="393" alt="Comparison of themes in iOS 26" style="width:100%;height:auto" loading="lazy" decoding="async"> <a href="https://www.youtube.com/watch?v=tMe_5gVeRno">Whose idea was this!?</a> </div> </center>
<p>The clear theme on iOS clears out all the colors of app icons and turns them all into this odd, grayscale opacity cacophony. <strong>This is accessibility hell</strong>, and there’s nothing that reads loud and clear in this home screen. You can’t just remove the color information from an UI; it’s a key factor in its design that’s as fundamental as things like contrast, flow, shapes and hierarchy. Here, color has been sacrificed for uniform looks, allowing you to color the backgrounds of app icons as you please. But this trades out readability immensely.</p>
<p>White gradients are also sources of light, so if implemented incorrectly, the <strong>apparent 3D shape of an icon may change</strong>, which affects its shape. The Photos and Safari app icons have been seriously affected by this. Let alone the terrible contrast ratio that you could get in some icons. It almost feels like a personal attack to accessibility guidelines.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2025%2F06%2Fapple-liquid-glass%2Fandroid.webp&amp;w=700&amp;h=511&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="511" alt="Comparison of themed icons in Android 13" style="width:100%;height:auto" loading="lazy" decoding="async"> This is even worse than the already terrible themed icons on Android. At least
those have clear contrast. </div> </center>
<p>This is a big deal because, even for tech savvy people like me, sometimes I struggle finding the application I want to use because of the clutter of the home screens. I can easily tell them apart by their discrepancies between their looks, but with that being gone in these interfaces, <strong>the times I twiddle my finger trying to find the right app are going to increase</strong>. And if someone like me is already feeling like that’s a difficulty, imagine people who aren’t as tech savvy as me.</p>
<p>And even without the clear theme, there are certain UI elements that still try to emulate that look regardless, like the clock display (extremely important for watchOS, which by the way, has clearly shied itself away from the glassmorphism) and other widgets such as the quick controls panel.</p>
<h2 id="why-am-i-so-upset-about-this">Why am I so upset about this?</h2>
<p>Normally I would just cringe when I see a design that I find it provides a bad user experience. But this is Apple we’re talking about here, a company who has always been a trendsetter when it comes to UI design.</p>
<p>In the mid 2000s, the Californian company brought skeumorphism to the world by designing icons and UI elements as if they were actual objects, from sliders and buttons taking the shape and even texture of their real counterparts, all the way up to imitating the color and texture of a notepad and a calendar, and designers from all parts of the world liked it so much that they wanted to emulate that photorealistic realism imitating real objects (among others) into their products and UI designs.</p>
<p>But when iOS 7 came out in 2013, a radical redesign changed everything for simpler, abstract designs. While controversial at its time, it quickly grew up with everybody, and it influenced other companies to do the same minimalistic makeover.</p>
<div><p><b>Yonic:</b> This has spurred on a <a href="https://knowyourmeme.com/memes/oversimplified-logo">meme about oversimplifying the logos of many brands</a> to the point of removing their character and soul. Though I think it all started with Firefox, and even that was a misunderstanding.</p></div>
 
<p>While Microsoft has brought several contributions to the new skeumorphism wave of the present with their Fluent design language, nobody really caught on it as much because they aren’t exactly known for setting trends. But <strong>Apple has embraced this trend of uniform looks and all transparency, so glassmorphism might start to spread in all places</strong>.</p>
<p>I don’t really have a problem with glassmorphism. And I’m aware that I’m mostly criticizing the iOS part of the design. From what I’ve seen, <strong>Apple TV seems to have the best iteration of this design</strong>, but that’s mostly because it hardly needs to have an UI at all times. As for Apple Vision and macOS, I still have my doubts, but I haven’t gotten in my hands neither of the hardware to make an opinion about it. Besides, <strong>there’s way more iPhones than Macs or Apple TVs</strong> in the market, so iOS is definitely the flagship of all of the new features from Apple.</p>
<p>Hopefully, <strong>it <em>does</em> seem like it might not live on to become a huge trend.</strong> Lately, Apple hasn’t been delivering a lot of enticing features and it’s clearly failing to both follow red hot trends such as AI, and trying to set themselves up in a niche where nobody is competing with VR and their horrendously expensive Apple Vision. But then again, I wouldn’t say it’s too much of a farfetched claim that design changes can be piggybacked by the coming of new features. In the case of the “modern skeumorphism”, it was VR at first, and then became more abstract with AI. So it may be that “glass” is the new face of AI. Who knows.</p>]]></content>
    </entry>
        <entry>
            <title>Testing 3D videos!</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2025/02/3d-video-test</id>
            <link href="https://www.yonic.blog/blog/article/2025/02/3d-video-test" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2025/02/3d-video-test" />
            <summary><![CDATA[ Do you have your 3D glasses ready? Or your New 3DS? I'm doing some experiments with anaglyph video that you may be able to try. ]]></summary>
            <published>2025-02-27T13:18:27.236Z</published>
            <updated>2025-02-27T13:18:27.236Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2025%2F02%2F3d-video-test%2Fhero.png&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><p>While I was adding a video player functionality to my blog, I came across the idea of making a stereoscopic 3D video to test on the Nintendo 3DS, since the <a href="http://legacy.yonic.blog/blog/article/2025/02/3d-video-test"> Legacy version of this blog</a> is compatible with the Nintendo Wii and 3DS.</p>
<p>So here are two 3D videos for you to check out! Both versions will work on the <em>New</em> Nintendo 3DS. Regular, older models of the console don’t support any way for video playback with its built-in Internet Browser.</p>
<p><b>Video:</b> <a href="https://yonic.blog/static/video/kirby3d.mp4">Kirby 3D test (side-by-side version)</a></p>
<p><b>Video:</b> <a href="https://yonic.blog/static/video/kirby3d_L.mp4">Kirby 3D test (anaglyph version)</a></p>
<h2 id="how-did-i-make-them">How did I make them?</h2>
<p>Basically, I made use of the stereoscopy features from Blender cameras. I seemed to have achieved better results when setting both cameras parallel to each other —this can be easily configured in Blender without fiddling with the cameras.</p>
<div><p>&lt;Yonic&gt;</p><p>I haven’t done much experimenting with this, though. But it’s really fun!</p><p>I think I might do a few more 3D videos like this in the future.</p><p>&lt;/Yonic&gt;</p></div>
 ]]></content>
    </entry>
        <entry>
            <title>Anti-cheat demystified: What's the big deal about kernel-mode anti-cheat?</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2024/11/anticheat-demistifyed</id>
            <link href="https://www.yonic.blog/blog/article/2024/11/anticheat-demistifyed" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2024/11/anticheat-demistifyed" />
            <summary><![CDATA[ Many games have something like Riot's Valorant or Denuvo's anti-cheat programs, which have sparked a lot of controversy. Here's a simple explanation. ]]></summary>
            <published>2024-11-12T15:11:20.354Z</published>
            <updated>2024-11-12T15:11:20.354Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F11%2Fanticheat-demistifyed%2Fhero.png&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><p class="astro-gicio36m"> <a href="/player/cod/bo2/multiplayer" target="_blank" class="astro-gicio36m">Music: Multiplayer Mode</a> <i class="astro-gicio36m">(Call of Duty: Black Ops II | Jack Wall)</i></p>  
<div class="feed-preview"><p>If you’ve been recently playing online games, you may have noticed that a bunch of games have switched to what’s called “<strong>kernel mode anti-cheat software</strong>” for catching cheaters: <a href="https://www.msn.com/en-us/news/technology/will-vanguard-kill-league-of-legends/ar-AA1oFimn">League of Legends switched to Riot’s Vanguard AntiCheat</a>, and most notoriously, <a href="https://rockstarintel.com/new-gta-online-update-adds-anti-cheat-for-11th-anniversary-with-battleye/">GTA Online also switched to BattlEye</a>.</p><p>These updates, while they do bring a lot of major improvements to anti-cheating, they also bring with them a lot of controversy: From tech experts showing a lot of concern over them, to people <a href="https://www.gamesradar.com/games/grand-theft-auto/gta-5-and-red-dead-redemption-2-online-services-suffer-outages-in-apparent-ddos-attack-over-gta-onlines-new-anti-cheat-tech/">DDoS’ing GTA V Online services</a> in protest for this change. But why make such a fuss about something that should, in theory, make things fair for all players? Or is there a danger lurking around?</p><p>As it turns out, kernel mode anti-cheat is a powerful tool, but it may be <em>too</em> powerful. In this post I want to give a layman explanation without the technical mumbo jumbo.</p></div>
<h2 id="a-simple-case-of-anti-cheating">A simple case of anti-cheating</h2>
<p>Let’s say you want to buy the most powerful weapon you can get at a shop in an MMO game. An interaction without any anti-cheating would work like this:</p>
<div><p><b>Player:</b> Hi, I’d like to buy the Ultima Laser.</p></div>
<div><p><b>Shopkeeper:</b> That’ll be 100,000 gold. How much do you have?</p></div>
<div><p><b>Player:</b> A billion.</p></div>
<div><p><b>Shopkeeper:</b> Alright, here you go! Have fun!</p></div>
<p>This is just a simple example of an interaction between the client (the player) and the server (the shopkeeper). In practice, a lot of other metrics are considered for other situations, such as checking for speeding or performing abilities that could only be done in higher levels.</p>
<p>Now, it may be actually possible for a player to get that amount of gold in a legitimate manner. Regardless, the oblivious shopkeeper will think you can pay for it and the purchase goes through. But do <em>you</em> think the player really did get the gold fair and square?</p>
<p>An anti-cheat is basically a <strong>lie detector</strong>, and it scans for something coming from the player to detect if they are answering truthfully or not. In some cases it may choose to just reject the purchases, and in others it may ban the player. The key of the fuss, however, is in <strong>how the lie detector works by design</strong>.</p>
<p>There are three kinds of anti-cheat, depending on how their work, and each have their own pros and cons.</p>
<h2 id="the-doing-the-detective-work-approach">The “doing the detective work” approach</h2>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F11%2Fanticheat-demistifyed%2Fla-noire.jpeg&amp;w=700&amp;h=394&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="394" alt="Questioning in L.A. Noire" style="width:100%;height:auto" loading="lazy" decoding="async"> Press <em>X or □</em> to doubt. </div> </center>
<p>A lie detector doesn’t have to be a machine. A human can also detect cues on when a person is lying or not, such as voice and nervous ticks, and they can also refer to evidence to prove someone is lying. Detectives do this in all kinds of criminal investigations.</p>
<p>This is what <strong>server-side anti-cheats</strong> are doing: Corroborating records of the game with the player’s actions and using the intended game rules as a way of detecting whether they are cheating or playing legitimately.</p>
<p>But they aren’t very reliable, because they rely on intuition and the evidence gathered, and they may often get too biased with false positives or, worse, false negatives when detecting a cheater. It all depends on how capable it is, and how good is the player at concealing their tactics.</p>
<p>But if there’s one thing in which they shine is that  they are the <strong>least invasive</strong> anti-cheat software. If the anti-cheat gets compromised in any way, it doesn’t pose a threat to the player —at least not directly— resulting in merely a ruined game experience.</p>
<h2 id="the-scanner-approach">The scanner approach</h2>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F11%2Fanticheat-demistifyed%2Fsimpsons.jpg&amp;w=700&amp;h=525&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="525" alt="Lie detector in The Simpsons" style="width:100%;height:auto" loading="lazy" decoding="async"> I’ll ask you a few yes or no questions and you just answer truthfully. </div> </center>
<p>When people think of a lie detector, they usually think of a device that scans brainwaves or checks the heartbeat of a person. When it comes to detecting a cheater in a game, this is what’s called <strong>client-side anti-cheat</strong>.</p>
<p>You see, when you download an online multiplayer game, you’ll often get what’s called a <strong>client</strong> of the game, which is the program that sort of handles the game from a player’s perspective; the game master has the <strong>server</strong> version, and depending on the type of game, you may be able to download it and make your own server on your own computer. This is a bit of a simplification, of course, but it gets the gist of it.</p>
<p>Inside the client, there may be some code that will check what’s happening within the game client, a bit like checking your heartbeat when you’re being questioned. This can give a <strong>more accurate reading</strong> of what the player’s doing at any given moment while you run the game.</p>
<p>However, you trade off a bit of <strong>security</strong>. If the lie detector is compromised, <strong>it could be harmful to the person being questioned</strong>, but because it’s not directly connected to an organ, the worst they can get is a bad burn on their skin. Likewise, hackers can’t do much harm on your computer by hacking the anti-cheat. In fact, the actions that can be done are so little that it’s generally used for bypassing the anti-cheat and not much else.</p>
<p>Still, this is much better, but it’s not infallible, either. This kind of anti-cheat is very regional; just as how a brainwave probe can’t check for a heartbeat or if the person started sweating, <strong>an anti-cheat of this type can’t reliably check what’s happening outside the game</strong>. This allows for people to run external programs to bypass the anti-cheat, simply because the anti-cheat is overlooking those things.</p>
<p>But what if we could be able to check <em><strong>everything</strong></em>?</p>
<h2 id="the-implant-approach">The implant approach</h2>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F11%2Fanticheat-demistifyed%2Fneuralink.jpg&amp;w=700&amp;h=359&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="359" alt="Neuralink" style="width:100%;height:auto" loading="lazy" decoding="async"> Now you can have advertisements in your dreams! </div> </center>
<p><strong>Kernel-level anti-cheat</strong> is a hyper-strengthened version of the client-side anti-cheat. Instead of putting on a lie detector, <strong>you get an implant into your brain that works as a lie detector</strong>.</p>
<p>When you install a game with this kind of anti-cheat, you give full consent for the installer to place a <strong>driver</strong> in the kernel of your operating system. This is the “brain implant”.</p>
<p>A kernel driver grants <strong>full access</strong> to what’s going on in your computer, <em>even things that you, as an user, can’t normally have control of</em>, regardless of whether you’re playing the game or not. In brain implant terms, it allows for it to check your memories and thoughts, <em>and also body functions like your hormonal balance and digestion</em>.</p>
<p>Giving access to everything that’s happening on the player’s computer makes for this type of anti-cheat to be the most effective: <strong>Nothing can be overlooked</strong>. But this also brings <em>a lot</em> of security concerns. The operating system (your brain) <em>trusts</em> that the driver will work perfectly. But if it starts failing and the operating system (Windows, Linux, Mac OS, etc) doesn’t know how to or simply can’t fix the errors, it will panic and proceed to reboot the system. <a href="https://en.wikipedia.org/wiki/2024_CrowdStrike-related_IT_outages">Something like this was the cause behind the CrowdStrike outage that caused millions of computers across the world to go Blue Screen of Death</a> in July of this year.</p>
<div><p>&lt;Yonic&gt;</p><p>There’s a good reason why the kernel is usually reserved for the most critical stuff, such as power management (blood pressure balance) and input/output handling (nervous system). In the case of CrowdStrike, it was necessary for cybersecurity purposes in businesses, so it sort of acted like a “vaccine” or an aid for your immune system, following the human body analogy.</p><p>But detecting whether someone is cheating in one particular game is not critical in the least.</p><p>Would you risk frying your brain with a faulty implant just to play a game?</p><p>&lt;/Yonic&gt;</p></div>
 
<p>The driver itself could have its own security vulnerabilities. If hackers do find one, <strong>they can get unprecedented access to your computer</strong>, and not even a privileged user such as “administrator” users in Windows could possibly have clearance to fix this.</p>
<p>Once a hacker breaches to the kernel of your PC, they can literally do whatever they want, from stealing all your personal and sensitive information, to putting a program that sends screenshots of your screen to the hacker, or a keylogger that makes a log of what keys you press in your keyboard, allowing the hacker to see what you’re typing. <strong>And you would probably have no way of knowing this.</strong> So once they gain control of the kernel, they essentially hold your PC hostage.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F11%2Fanticheat-demistifyed%2Fpuke.png&amp;w=700&amp;h=394&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="394" alt="Neuralink" style="width:100%;height:auto" loading="lazy" decoding="async"> If a brain implant were to be hacked, someone could install a function
in it to, for instance, make you puke anytime they wanted with the press of
a button. </div> </center>
<p>And we’re not even taking into account that the game developers themselves could use that anti-cheat software to do things that you weren’t expecting it to do, even if those things show up in the game’s EULA. For example, <strong>it could turn your installed game into actual spyware</strong>.</p>
<p>Worst of all, uninstalling the game that has an anti-cheat of this kind will not be enough to prevent hackers nor undo their effects. MiHoYo had a lot of controversy for a critical security vulnerability in Genshin Impact’s anti-cheat and <a href="https://hackaday.com/2022/08/29/genshin-security-impact/">leaving behind Honkai Star Rail’s anti-cheat even if the game was uninstalled</a>, one that had a <a href="https://www.kaspersky.com/blog/genshin-driver-attack/45494/">history of critical security vulnerabilities</a>, even.</p>
<p>Another drawback of kernel-mode anti-cheat is that <strong>not every computer has the same kernel</strong>. Although most gaming computers use Windows NT for its kernel, a notable minority uses Linux kernel, the latter of which, being open source, can have some fine-tuned customizations.</p>
<p>Anti-cheat developers may choose to support whichever kernels they wish, and the vast majority will add support for Windows, while Linux doesn’t have as much widespread support. But even if the anti-cheat supports Linux, it’s ultimately up to the developers themselves to enable that support into their game. For example, EA —despite supporting Linux for 3 years— <a href="https://answers.ea.com/t5/News-Game-Updates/Dev-Team-Update-Linux-amp-Anti-Cheat/td-p/14217740">made a u-turn and dropped support for Apex Legends on Linux a few weeks ago</a>.</p>
<div><p>&lt;Yonic&gt;</p><p>EA claims that “Linux kernels can be so different with each other that cheating is made easy if you use a niche version of Linux”, but this is highly debated. I personally see it as an excuse to cut corners on software and technical support.</p><p>But apart from that, this increase in anti-cheat protectionism constitutes a serious determent on gaming on Linux, which includes the Steam Deck.</p><p>&lt;/Yonic&gt;</p></div>
 
<p>Due to their extremely powerful capabilities, Windows and Mac OS kernel drivers/extensions have to be signed by Microsoft and Apple themselves, while Linux kernel modules have to be signed through a different but secure process. Passing the tests to get that signed driver should mean that these drivers won’t compromise the integrity of the operating system, and are also safe for the user. However, it’s not perfect; MiHoYo’s anti-cheat was bypassed and even exploited to disable any anti-virus the user may have on their computer.</p>
<p>Personally, I find kernel-mode anti-cheat too powerful for what it’s worth. If there are lots of cheaters, I can quit the game and move on to something else, hoping that things turn a bit fairer in a few hours. But if I get hacked because of an anti-cheat, that would pose a serious compromise to my security.</p>
<p>Valve has recently raised concerns about this kind of anti-cheats, and <a href="https://steamcommunity.com/groups/steamworks/announcements/detail/4547038620960934857?snr=2___">now they are enforcing game developers to disclose what anti-cheat they are using</a> on all their games on Steam that are using a kernel-mode one, and heavily recommend to do so even if it’s not.</p>
<p>This is a very welcoming change, and one that I hope other games and app stores end up copying from Valve. I still think a user-mode client-side anti-cheat (the scanner lie detector ones) are probably the best anti-cheat software in terms of balancing reliability, performance, privacy and security, so if you are making an online game, I hope you choose this kind of anti-cheat solutions.</p>]]></content>
    </entry>
        <entry>
            <title>The ultimate guide for installing East Asian languages support for legacy Windows and Mac OS Classic</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2024/02/legacy-asian-language-support</id>
            <link href="https://www.yonic.blog/blog/article/2024/02/legacy-asian-language-support" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2024/02/legacy-asian-language-support" />
            <summary><![CDATA[ This is a guide for installing support for East Asian languages for Windows 9x, Windows NT, and Mac OS Classic. ]]></summary>
            <published>2024-02-26T16:26:22.190Z</published>
            <updated>2024-11-01T16:09:58.617Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F02%2Flegacy-asian-language-support%2Fhero.png&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><div class="feed-preview"><p>Sometimes, my blog will have some texts displayed in east Asian languages (mostly Japanese).</p><p>In the <a href="http://legacy.yonic.blog/blog/article/2024/02/legacy-asian-language-support">Legacy version</a>, said posts will display an alert box, warning that if you’re browsing the site with an old operating system, strange text may appear. But <strong>if you can browse this version without any issue, you have nothing to worry about</strong>, since your browser has full support for East Asian languages already.</p><p>This post will continue assuming you’re running an old operating system (e.g. Windows 9x, Windows XP, or Mac OS Classic).</p><p>Once you’ve installed support for these languages, check the <a href="#about-ruby-text">About ruby text</a> section of this post to check if the text is displayed correctly.</p></div>
<h2 id="windows">Windows</h2>
<p>This covers the following versions:</p>
<ul>
<li>Windows 9x: Windows 95, 98 and Me.</li>
<li>Windows NT: 4.0, 2000 and XP.</li>
</ul>
<h3 id="windows-9x-and-nt40-online">Windows 9x and NT4.0 (online)</h3>
<p>Although currently in a very early state, it is possible to add support for East Asian languages through the archival project called <a href="http://www.windowsupdaterestored.com">Windows Update Restored</a>. These are updated versions of the offline installers provided below, and are applied in nearly the same way as the days when the Windows Update feature was first introduced with Windows 98.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F02%2Flegacy-asian-language-support%2Fnt-update.png&amp;w=700&amp;h=525&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" width="700" height="525" alt="Windows Update Version 3.1 on Windows NT 4.0" style="width:100%;height:auto" loading="lazy" decoding="async"> Windows Update Restored running under Windows NT 4.0, with the East Asian language support installed </div> </center>
<p>Note that there are many versions of Windows Update, each compatible with a set of different versions of Windows, and only Internet Explorer 4 through 6 will work. You will have more luck finding the language installation files in the English versions of Windows.</p>
<h3 id="windows-9x-and-nt40-semi-offline-recommended">Windows 9x and NT4.0 (semi-offline, recommended)</h3>
<p><a href="//www.yonic.blog/file/static/downloads/legacy-windows/IE55.EXE">This customized installer of Internet Explorer 5.5</a> comes with a copy of the updated versions of the language packs as shown above.</p>
<ol>
<li><strong>Mount the ISO image</strong> in your system and extract the files on
the specified path. <strong>Do not change this</strong>.</li>
<li>If prompted to remove the current language version, ignore it
and press <strong>“Yes”</strong> to continue.</li>
<li>Select <strong>“Minimum installation, or customize your browser…”</strong> and click on <strong>Next</strong>.</li>
<li>Scroll all the way down and check the boxes for <strong>Display support</strong> for <strong>Japanese</strong>, <strong>Korean</strong> and <strong>Chinese (Traditional) and (Simplified)</strong>. <strong>Do not tick on anything that is in bold text</strong>
other than the language support.</li>
</ol>
<h3 id="windows-9x-and-nt40-offline">Windows 9x and NT4.0 (offline)</h3>
<p>If the method above doesn’t work, I have uploaded an archived version of the <a href="https://archive.org/details/langpacks_202402">East Asian language installers for Windows 9x and NT 4.0</a>, although I only tested it with Windows 98, it should also work on 95 and NT.</p>
<ol>
<li><strong>Mount the ISO image</strong> in your system</li>
<li><strong>Run the installers one by one</strong>.</li>
<li><strong>Restart</strong> the system.</li>
</ol>
<p>These aren’t as updated as the other online methods</p>
<h3 id="windows-xp">Windows XP</h3>
<ol>
<li>Insert the <strong>Windows XP installation disc</strong> in your system.</li>
<li>Head to <strong>Control Panel &gt; Date, Time, Language and Regional options</strong> and select the <strong>Regional and Language settings</strong>. In the classic view, look for the latter.</li>
<li>In the <strong>Languages</strong> tab, check the <strong>Install files for East Asian languages</strong>.</li>
<li><strong>Reboot</strong>.</li>
</ol>
<h2 id="mac-os-9">Mac OS 9</h2>
<p>This guide is taken from Nisus.com, so that you can check it from your legacy OS. This should also be possible in Mac OS 8, but I haven’t tested it.</p>
<ol>
<li>Double click the Mac OS Install icon on the Mac OS 9 CD.</li>
</ol>
<center><center> <div style="width:400px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F02%2Flegacy-asian-language-support%2FlanguagekitsOS91.gif&amp;w=400&amp;h=257&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" width="400" height="257" alt="Step 1" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center></center>
<ol start="2">
<li>You will see a “Welcome” window. Click “<strong>Continue</strong>”.</li>
</ol>
<center><center> <div style="width:400px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F02%2Flegacy-asian-language-support%2FlanguagekitsOS92.gif&amp;w=400&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" width="400" height="252" alt="Step 2" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center></center>
<ol start="3">
<li>Choose the hard drive on which you want to add the Language Kits. <strong>Make sure you uncheck “Perform Clean installation” in the “Options…” menu</strong>!</li>
</ol>
<center><center> <div style="width:400px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F02%2Flegacy-asian-language-support%2FlanguagekitsOS93.gif&amp;w=400&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" width="400" height="252" alt="Step 3" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center></center>
<center><center> <div style="width:400px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F02%2Flegacy-asian-language-support%2FlanguagekitsOS94.gif&amp;w=400&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" width="400" height="252" alt="Step 4" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center></center>
<ol start="4">
<li>Then click “<strong>Select</strong>”.</li>
</ol>
<center><center> <div style="width:400px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F02%2Flegacy-asian-language-support%2FlanguagekitsOS95.gif&amp;w=400&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" width="400" height="252" alt="Step 5" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center></center>
<p>You see, the installer has checked and found that you already have Mac OS 9 on the system. You want to add software features to your System.</p>
<ol start="5">
<li>Therefore, you click: “<strong>Add/Remove</strong>”. Now you see the “Custom Installation and Removal” window.</li>
</ol>
<center><center> <div style="width:400px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F02%2Flegacy-asian-language-support%2FlanguagekitsOS96.gif&amp;w=400&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=gif" width="400" height="252" alt="Step 6" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center></center>
<p>You have a lot of options here. But, all you want (now, for our purposes) is to scroll to near the bottom of the list where you’ll see “Language Kits”.</p>
<ol start="6">
<li>Check <strong>“Language Kits”</strong> and notice that the pop-up menu to its right becomes enabled:</li>
</ol>
<center><center> <div style="width:400px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F02%2Flegacy-asian-language-support%2FlanguagekitsOS97.gif&amp;w=400&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=gif" width="400" height="252" alt="Step 7" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center></center>
<ol start="7">
<li>Click the pop-up menu and choose “<strong>Customized Installation…</strong>”:</li>
</ol>
<center><center> <div style="width:400px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F02%2Flegacy-asian-language-support%2FlanguagekitsOS98.gif&amp;w=400&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=gif" width="400" height="252" alt="Step 8" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center></center>
<p>A new window opens in which you can check off the specific language kits you want to install (in this case, Japanese, Korean, Chinese using simplified characters and Chinese using traditional characters):</p>
<center><center> <div style="width:400px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F02%2Flegacy-asian-language-support%2FlanguagekitsOS99.gif&amp;w=400&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=gif" width="400" height="252" alt="Step 9" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center></center>
<ol start="8">
<li>After you check off the ones you want, click <strong>OK</strong> and then you’re ready to install the software.</li>
</ol>
<h2 id="about-ruby-text">About ruby text</h2>
<p>Ruby text are annotations that are placed on top of Chinese, Japanese and Korean (CJK) characters to aid in reading them. However, among the browsers that support the legacy OSes mentioned above, <strong>only Internet Explorer 5.5</strong> supports ruby text.</p>
<p>If your browser does not support ruby text, it will appear in this blog to the side of the CJK text.</p>
<p>Here are a couple of examples:</p>
<ul>
<li><span style="font-size: 16pt"><ruby> 東京<rp>(</rp><rt>Tōkyō</rt><rp>)</rp> </ruby></span> is how Tokyo is written in Japanese.</li>
<li><span style="font-size: 16pt"><ruby> 北京<rp>(</rp><rt>Běijīng</rt><rp>)</rp> </ruby></span> is how Beijing is written in Simplified Chinese.</li>
<li><span style="font-size: 16pt"><ruby> 臺北<rp>(</rp><rt>Táiběi</rt><rp>)</rp> </ruby></span> is how Taipei is written in Traditional Chinese.</li>
<li><span style="font-size: 16pt"><ruby> 서울<rp>(</rp><rt>Seoul</rt><rp>)</rp> </ruby></span> is how Seoul is written in Korean.</li>
</ul>]]></content>
    </entry>
        <entry>
            <title>The Internet Archive attacks: A crime against humanity</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2024/10/internet-archive-attacks</id>
            <link href="https://www.yonic.blog/blog/article/2024/10/internet-archive-attacks" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2024/10/internet-archive-attacks" />
            <summary><![CDATA[ Hackers hit the lowest point of bad things they could've done. ]]></summary>
            <published>2024-10-21T15:39:32.718Z</published>
            <updated>2024-10-21T15:39:32.718Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F10%2Finternet-archive-attacks%2Fhero.png&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><p class="astro-gicio36m"> <a href="/player/harry-potter/ea-games/diagon-alley" target="_blank" class="astro-gicio36m">Music: Diagon Alley</a> <i class="astro-gicio36m">(Harry Potter EA Games | Jeremy Soule)</i></p>  
<div class="feed-preview"><p>Throughout October, <a href="http://archive.org">archive.org</a> has been the target of numerous DoS attacks, and the data of roughly 31 million users has been exposed.</p><p>At the time of writing this post, even though the Archive has been reportedly restored in a read-only manner, some of its main features still have connection timeouts, meaning they are still having some unresolved outages.</p><p>Worse still, it’s been reported that some of its content has been erased, although we still don’t know the scope of the damages.</p><p>Being one of the largest digital libraries in existence, its recent history has been a close parallel to the Great Library of Alexandria, with this event being probably the counterpart of the fire that burnt a large part of the library, although not completely.</p><p>Hopefully, it will soon be restored and remain relevant for years to come. Still, this should serve as a lesson for the future to prevent history from repeating.</p></div>
<p>Internet Archive has seen better days. Last month, they lost a case against Hachette Book Group (and others) that was around since May of last year. The printing companies alleged that Internet Archive was allowing people to infringe copyright when they lifted borrowing restrictions during the COVID-19 pandemic, and will have to pay several millions of dollars in damages, maybe up to $400 million.</p>
<p>And on May of this year, they were the target of another DoS attack, albeit to a much lesser degree than this one. While I’m not well informed in digital security to discuss about how they got hacked and if the security measures they had in place were good enough or not, the fact that this has been going on for nearly a month now goes to show that the hackers are not planning on stopping for the time being.</p>
<div><p>&lt;Yonic&gt;</p><p>Now, I’d generally wait a few days when events like these occur to write my opinions about this matter as we get more information on who is responsible for these hacks and under what motivations, but this event seems like it’s going to take quite a bit longer before things return to full normality.</p><p>But seeing as certain parts of the site have been tentatively brought back online, I thought it would be a good time to talk about some insights on this.</p><p>Still, I would heed caution when hearing news about this, at least until all Internet Archive services return back to normal and they’re done investigating the causes and finished making an assessment of the damages. I’ve found a lot of misinformation about the topic; which is y’know, the usual in developing big stories.</p><p>&lt;/Yonic&gt;</p></div>
 
<p>The Internet Archive is mostly known for its <strong>WayBack Machine</strong>, a comprehensive archive of over 866 billion webpages since 1996, and while to some people it’s just a way to reminisce how websites used to look like in the past, it does have its usage as a very valuable resource for legitimate use cases such as documenting about legacy software, or retrieving data that no longer exists in the present —sort of like a preventive solution to link rot.</p>
<p>However, archive.org also has a repository of many types of media, mostly digitized books, but also music, movies and software. This is also part of the rationale behind the debate of copyright infringement, as the borrowing system is only applicable to books. Still, the Internet Archive does accept takedown of personal data if someone wishes it rather not appear in the archive.</p>
<div><p><b>Yonic:</b> I have relied on this archival service for many years and I even contributed to it a few times. It’s such a pleasure that it’s a non-profit organization, so everything there is free to the public.</p></div>
 
<p>My take on this is that attacking a public project of this scale equates to a crime against humanity itself. Let me explain why with a bit of history.</p>
<p class="astro-gicio36m"> <a href="/player/harry-potter/ea-games/happy-hogwarts" target="_blank" class="astro-gicio36m">Music: Happy Hogwarts (casual variation)</a> <i class="astro-gicio36m">(Harry Potter EA Games | Jeremy Soule)</i></p>  
<p>The concept of a digital archive represents our most recent level of advancements in storing knowledge. Throughout history, texts had been etched and written onto many kinds of surfaces. Some are durable, while others are reusable, but all of them are subject to being defaced, altered, or destroyed by both natural and humane causes because they are physical objects.</p>
<p>Plus, before the printing press was invented, scribes had to be employed to make copies of documents of any kind and medium, and were very predominant in many cultures from all parts of the world. There’s even a branch of science that studies how writing systems have contributed in shaping other aspects of culture, among other things.</p>
<p>The ability of representing knowledge using concepts such as numbers like 0s and 1s allows people to store it in a more abstract way, protecting them from most of the natural causes. And as it turns out, computers turn out to be very good at copying information flawlessly. In order words, <strong>digital information grants people with the ability to share knowledge easier than ever before</strong>.</p>
<p>However, knowledge still is —and will always be— susceptible to human damages. And we’ve seen this with attacks and boycotts to libraries and museums alike. Not even the digital repositories are safe from this.</p>
<p>And this is where the similarities between the incidents of the Internet Archive and the Library of Alexandria start to run out. To provide some historic context, the Ptolemaic library wasn’t destroyed by the infamous fire. In fact, the Museion, a somewhat independent institution but in which the library belonged to, still remained active centuries later. Historians still argue about several contradicting details, but what’s clear to most historians is that it didn’t disappear all of a sudden, rather, the library had a slower and steady decline.</p>
<p>The Library of Alexandria wasn’t the only large library of its time, either. The Library of Pergamum was claimed to have over 200 thousand volumes, and it has been rumored that Mark Anthony offered the entire collection to Cleopatra to restock the library, damaged by the fire 5 years prior. And its decline was not that much of a big deal anyway, as historians believe that most of the material within the library actually survived the demise, thanks not to other cultural centers such as the Library of Baghdad, but the many copies of the stored scrolls made by scribes over the centuries.</p>
<p>The Internet Archive, however, is probably the only archive of its kind when it comes to “archiving web pages in their entirety”, holding nearly 100 petabytes of data as of September 2024, and many other archiving initiatives are backed by their technology. In other words, <strong>it’s a centralized source of information</strong>.</p>
<div><p>&lt;Yonic&gt;</p><p>As a matter of fact, Google was using their own infrastructure to cache pages when they couldn’t reliably load due to server outages and the like. But as of last month, they have removed this feature and <a href="https://blog.archive.org/2024/09/11/new-feature-alert-access-archived-webpages-directly-through-google-search/">integrated their cache functionality with WayBack Machine instead</a>.</p><p>A bit funny considering it happened right before the attacks.</p><p>&lt;/Yonic&gt;</p></div>
 
<p>This is why these attacks are actually a much bigger deal than other historic examples: We’re dealing with <strong>a totally new form of knowledge</strong>, one that we’re still figuring out how to effectively archive, despite modern advancements; I don’t know about any examples of “digital copyists” of old websites, for that matter. And there’s <em>a lot</em> in that archive, so if an outage and data loss does occur, it must rely on volunteers who have kept their own personal copies to restore it. Sure, we have a lot of people in this planet, but <a href="https://lostmediawiki.com/Home">lost media</a> is still a thing.</p>
<p>Regardless of their intentions and motives, it should be taken as fact that these hackers have proven that the current model of archiving the web is far from being “permanent”, and it can easily be brought down by factors such as hackers, or maybe even lack of funding (some historians argue that’s what brought the Alexandrian Library to its final demise). If we want to truly keep it that way, I believe we should try to <strong>decentralize our archives more</strong>, just like scribes used to do by copying tablets, scrolls and books in the past. Of course, this would imply a lot of backup copies and maybe even using decentralized networks such as <a href="https://ipfs.tech/">IPFS</a>, which will anger copyright holders, but further defining fair use and hopefully some court rulings in favor for archival could help in making this feat much easier to do.</p>
<blockquote>
<p>Every man has two deaths, when he is buried in the ground and the last time someone says his name. In some ways men can be immortal. — Ernest Hemingway</p>
</blockquote>]]></content>
    </entry>
        <entry>
            <title>Making The Yonic Corner Legacy: The layout</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2024/09/making-legacy-2</id>
            <link href="https://www.yonic.blog/blog/article/2024/09/making-legacy-2" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2024/09/making-legacy-2" />
            <summary><![CDATA[ Part two of how I made my blog compatible for old browsers, this time it's about how I put the design in practice. ]]></summary>
            <published>2024-09-24T12:21:23.470Z</published>
            <updated>2024-09-24T12:21:23.470Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F09%2Fmaking-legacy-2%2Fhero.png&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><p class="astro-gicio36m"> <a href="/player/windowsy/jive-xg" target="_blank" class="astro-gicio36m">Music: JIVE.MID (Microsoft GS Wavetable)</a> <i class="astro-gicio36m">(Yamaha XG Sample MIDI | Sam Cardon)</i></p>  
<div class="feed-preview"><p>Whoa, it’s been nearly a year since I promised part two of how I made the Legacy version of The Yonic Corner! The thing is, I wanted to complete the majority of the features of the version in order to fully cover the whole story.</p><p>And now that it’s finally feature complete, here’s the long awaited second part!</p><p>In <a href="/blog/2023/10/making-legacy-1">part 1</a>, I discussed about what visual style I wanted to use for the Legacy version of this blog. This part goes through the technicalities of making the design a reality.</p></div>
<h2 id="selecting-the-supported-versions">Selecting the supported versions</h2>
<p>This was a simple yet very hard choice to make. Ideally, I wanted to support as many operating systems as possible, but I knew this would be a very difficult task.</p>
<p>At the very least, I wanted to support the Windows 9x family of OSes, which meant that <strong>Internet Explorer 5</strong> would probably be my target browser. The main problem with that it’s that IE5 <strong>came out at the very beginning of the standardization of the web</strong>. Which meant that whatever worked on this version would probably break in older versions. I ended up settling on IE5.5, which comes with Windows 98 Second Edition, and hopefully port to IE5. Of course, I also wanted to support other browsers from that epoch such as Mozilla and Opera —the latter of which is used quite often by retro web users.</p>
<p>Another motivator for supporting Internet Explorer 5 was that there was a version specifically made for some UNIX operating systems. But after researching on how to install the browser on Solaris, I quickly gave up because of the lack of expertise I had on Solaris to install it properly without resulting in system failures. To my knowledge, there is no script to do this automatically. I still have to figure out what to do about adding support to UNIX/Linux operating systems, as there were many distros with their own browsers. Konqueror and Galeon seem to come to mind, but there may be others that were used more (excluding Firefox).</p>
<p>I was also interested in supporting Mac Classic, which I have rarely used, but after not much research I quickly settled with Mac OS 9. I’m pretty sure Mac OS 8 also works, but version 9 was what I could get a hold of. I settled with <a href="https://www.floodgap.com/software/classilla/">Classilla</a> as the target browser for this OS, but with how deeply disappointing and similar it seemed to be compared to Netscape 7 in functionalities, I also threw in the latter browser as one of my potential targets. Internet Explorer for Mac was a tempting possibility, but it was prone to crashing the Mac emulator I was using, so I set it aside for the time being.</p>
<p>Then there was <strong>Flash Player</strong>. If I wanted the music player in the Legacy blog while remaining cross platform, this was the only way to do so. Internet Explorer has a way to embed audio to a page, but it was non-standard and quickly deprecated in favor of HTML5 audio. Supporting Windows 95 and NT 4.0 meant that I had to stick with version 7 and ActionScript 2.0. I didn’t know it at the time, but this would be the source of a lot of headaches later on.</p>
<h2 id="understanding-the-fundamentals-once-again">Understanding the fundamentals, once again</h2>
<p>The Yonic Corner Legacy Version targets browsers that came about at a time where the <abbr title="World Wide Web Consortium" span="World Wide Web Consortium">W3C</abbr> was just about 5 years old. To understand what that meant, we need to go back to that time, when Internet just started catering home consumers in the United States.</p>
<p>In the early 1990s, the World Wide Web was a wild place: Everyone had their own way of displaying websites and doing things in them. Even if standards for communicating such as hypertext and its transfer protocol (HTTP) were being used, those standards weren’t yet fully completed. One of the most notable examples was JScript: Microsoft’s implementation of JavaScript for Internet Explorer, which, in an effort to gain influence over its competitors, added features that were totally incompatible with other browsers, a development stunt that was infamously named “Embrace, Extend, Extinguish”.</p>
<div><p>&lt;Yonic&gt;</p><p>In fact, you could use other script languages in Internet Explorer. The <code>type</code> attribute of script tags could actually accept <code>text/vbs</code> for Internet Explorer to use VBScript. And I think it also had support for Perl and Lua, as well?</p><p>For the longest time, JavaScript became the only way to use client-side scripting on the web, so the <code>type</code> attribute was not considered necessary. But with ECMAScript modules and WebAssembly, other types began showing up, such as <code>module</code>, and now that property has become useful again!</p><p>What’s really nice about this is that browsers that don’t support ES Modules (or any specified language for that matter) will safely disregard any script tag with <code>module</code> as their type, allowing me to preview my blog in development mode without any hiccups! I’d still have to refresh to see the changes and inline any script I might want to add, but that’s way better than having to make a production build every time I change something.</p><p>&lt;/Yonic&gt;</p></div>
 
<p>This is how I got introduced to the infamous <em><strong>Internet Explorer box model bug</strong></em>. The box model in HTML is a W3C specification which defines that every HTML element can be represented as rectangular boxes, which can have content, padding around that content, a surrounding border at the edges, and margins to separate elements around. In CSS, you can control the overall sizing of the element with the <code>width</code> property, and the “bug” is caused by how Internet Explorer (and also Netscape, by the way) determined how to compute that <code>width</code>.</p>
<center> <div style="width:347px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F09%2Fmaking-legacy-2%2Fbox-model.png&amp;w=347&amp;h=480&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="347" height="480" alt="Box model diagram" style="width:100%;height:auto" loading="lazy" decoding="async"> The traditional model used by Internet Explorer computed the <code>width</code> of an element as the sum of the widths of the content, its padding and border thickness to the left and right sides of the box. However, the W3C standard computed it to be <em>only</em> the content without the paddings and borders. </div> </center>
<p>This meant that Internet Explorer and Netscape rendered the elements <em>smaller</em> than they should’ve been according to W3C. And here’s where my rant against W3C begins: The thing is, <strong>the W3C was wrong</strong>. When Internet Explorer 6 came out, many layouts potentially broke all over the web. The reason? <strong>IE6 switched to the W3C box model</strong>.</p>
<p>Take a look at this CSS code:</p>
<div class="code-block astro-jgrc2lfe" data-button-label="Copy code">  <div class="astro-jgrc2lfe"> <pre class="astro-code min-light astro-jgrc2lfe" style="background-color:#ffffff;color:#24292eff; overflow-x: auto;" tabindex="0" data-language="css"><code><span class="line"><span style="color:#6F42C1">.one</span><span style="color:#24292EFF"> {</span></span>
<span class="line"><span style="color:#1976D2">  width</span><span style="color:#D32F2F">:</span><span style="color:#1976D2"> 600</span><span style="color:#D32F2F">px</span><span style="color:#24292EFF">;</span></span>
<span class="line"><span style="color:#1976D2">  border</span><span style="color:#D32F2F">:</span><span style="color:#1976D2"> 2</span><span style="color:#D32F2F">px</span><span style="color:#1976D2"> solid black</span><span style="color:#24292EFF">;</span></span>
<span class="line"><span style="color:#1976D2">  padding</span><span style="color:#D32F2F">:</span><span style="color:#1976D2"> 10</span><span style="color:#D32F2F">px</span><span style="color:#24292EFF">;</span></span>
<span class="line"><span style="color:#24292EFF">}</span></span></code></pre> </div> </div> <div class="code-block dark astro-jgrc2lfe" data-button-label="Copy code">  <div class="astro-jgrc2lfe"> <pre class="astro-code poimandres astro-jgrc2lfe" style="background-color:#1b1e28;color:#a6accd; overflow-x: auto;" tabindex="0" data-language="css"><code><span class="line"><span style="color:#E4F0FBD0;font-style:italic">.</span><span style="color:#5FB3A1;font-style:italic">one</span><span style="color:#A6ACCD"> {</span></span>
<span class="line"><span style="color:#ADD7FF">  width</span><span style="color:#A6ACCD">: </span><span style="color:#5DE4C7">600px</span><span style="color:#A6ACCD">;</span></span>
<span class="line"><span style="color:#ADD7FF">  border</span><span style="color:#A6ACCD">: </span><span style="color:#5DE4C7">2px</span><span style="color:#ADD7FF"> solid</span><span style="color:#ADD7FF"> black</span><span style="color:#A6ACCD">;</span></span>
<span class="line"><span style="color:#ADD7FF">  padding</span><span style="color:#A6ACCD">: </span><span style="color:#5DE4C7">10px</span><span style="color:#A6ACCD">;</span></span>
<span class="line"><span style="color:#A6ACCD">}</span></span></code></pre> </div> </div> <div class="code-block legacy astro-jgrc2lfe" data-button-label="Copy code">  <div class="astro-jgrc2lfe"> <pre class="astro-code min-dark astro-jgrc2lfe" style="background-color:#1f1f1f;color:#b392f0; overflow-x: auto;" tabindex="0" data-language="css"><code><span class="line"><span style="color:#B392F0">.one {</span></span>
<span class="line"><span style="color:#79B8FF">  width</span><span style="color:#F97583">:</span><span style="color:#F8F8F8"> 600px</span><span style="color:#B392F0">;</span></span>
<span class="line"><span style="color:#79B8FF">  border</span><span style="color:#F97583">:</span><span style="color:#F8F8F8"> 2px </span><span style="color:#79B8FF">solid</span><span style="color:#79B8FF"> black</span><span style="color:#B392F0">;</span></span>
<span class="line"><span style="color:#79B8FF">  padding</span><span style="color:#F97583">:</span><span style="color:#F8F8F8"> 10px</span><span style="color:#B392F0">;</span></span>
<span class="line"><span style="color:#B392F0">}</span></span></code></pre> </div> </div>  <script type="module" src="/app/apps/modern/src/components/CodeBlock.astro?astro&amp;type=script&amp;index=0&amp;lang.ts"></script>
<p>In versions of Internet Explorer before 6, the actual width of the element would be set to 600 pixels, and other elements would be laid out considering that size. But in IE6 onward, the content box is set to 600 pixels, and the padding and border are added afterwards; resulting in a width that would actually be <strong>624 pixels</strong>! This may not be what the web designers intended in the first place. In order to truly make it 600 pixels wide, you’d have to subtract the extra 24 pixels to the <code>width</code> property.</p>
<p>The worst side effect that this had was that <strong>this change made flexible layouts almost impossible to make</strong>:</p>
<div class="code-block astro-jgrc2lfe" data-button-label="Copy code">  <div class="astro-jgrc2lfe"> <pre class="astro-code min-light astro-jgrc2lfe" style="background-color:#ffffff;color:#24292eff; overflow-x: auto;" tabindex="0" data-language="css"><code><span class="line"><span style="color:#6F42C1">.two</span><span style="color:#24292EFF"> {</span></span>
<span class="line"><span style="color:#1976D2">  width</span><span style="color:#D32F2F">:</span><span style="color:#1976D2"> 75</span><span style="color:#D32F2F">%</span><span style="color:#24292EFF">;</span></span>
<span class="line"><span style="color:#1976D2">  padding</span><span style="color:#D32F2F">:</span><span style="color:#1976D2"> 10</span><span style="color:#D32F2F">px</span><span style="color:#24292EFF">;</span></span>
<span class="line"><span style="color:#24292EFF">}</span></span></code></pre> </div> </div> <div class="code-block dark astro-jgrc2lfe" data-button-label="Copy code">  <div class="astro-jgrc2lfe"> <pre class="astro-code poimandres astro-jgrc2lfe" style="background-color:#1b1e28;color:#a6accd; overflow-x: auto;" tabindex="0" data-language="css"><code><span class="line"><span style="color:#E4F0FBD0;font-style:italic">.</span><span style="color:#5FB3A1;font-style:italic">two</span><span style="color:#A6ACCD"> {</span></span>
<span class="line"><span style="color:#ADD7FF">  width</span><span style="color:#A6ACCD">: </span><span style="color:#5DE4C7">75%</span><span style="color:#A6ACCD">;</span></span>
<span class="line"><span style="color:#ADD7FF">  padding</span><span style="color:#A6ACCD">: </span><span style="color:#5DE4C7">10px</span><span style="color:#A6ACCD">;</span></span>
<span class="line"><span style="color:#A6ACCD">}</span></span></code></pre> </div> </div> <div class="code-block legacy astro-jgrc2lfe" data-button-label="Copy code">  <div class="astro-jgrc2lfe"> <pre class="astro-code min-dark astro-jgrc2lfe" style="background-color:#1f1f1f;color:#b392f0; overflow-x: auto;" tabindex="0" data-language="css"><code><span class="line"><span style="color:#B392F0">.two {</span></span>
<span class="line"><span style="color:#79B8FF">  width</span><span style="color:#F97583">:</span><span style="color:#F8F8F8"> 75%</span><span style="color:#B392F0">;</span></span>
<span class="line"><span style="color:#79B8FF">  padding</span><span style="color:#F97583">:</span><span style="color:#F8F8F8"> 10px</span><span style="color:#B392F0">;</span></span>
<span class="line"><span style="color:#B392F0">}</span></span></code></pre> </div> </div>  
<p>When setting <code>width</code> to a percentage, it takes on the percentage of the content width of the parent container, so regardless of the box model, a percentage width less than 100% will keep it nicely tucked inside the container. <strong>But this breaks when you introduce padding or borders</strong>, because the W3C model will grow the <code>two</code> element beyond that width; if it’s set to a 100% with either a border or a padding, <strong>it will always overflow</strong> its container. Meanwhile, the traditional model keeps the correct size and no overflows occur! And what’s worse, the only way to fix this with CSS alone is with the <code>calc()</code> function, something that Internet Explorer did not support until version 9, which was already too late for reasons I will discuss later.</p>
<p>Thankfully Microsoft saw through this problem and introduced a concept called <strong>quirks mode</strong>. By using the <code>DOCTYPE</code> special tag at the beginning of the HTML document, you could instruct Internet Explorer to render the page in either <strong>standards mode</strong>, which would attain to the W3C box model; or <strong>quirks mode</strong>, which maintains backwards compatibility with Internet Explorer 5 and older. Other browsers would quickly follow suit with this behavior, and eventually became a standard across nearly all HTML versions. I won’t go into detail about which settings for <code>DOCTYPE</code> triggers which mode according to each browser, but <a href="https://en.wikipedia.org/wiki/Quirks_mode#Comparison_of_document_types">this Wikipedia article has a nice table</a> with some possible combinations.</p>
<p>Unfortunately for me, however, Astro always generates pages with the <code>DOCTYPE</code> that suits HTML5 documents, forcing the browser to use <strong>standards mode</strong> or <strong>almost standards mode</strong>, meaning that I would have to deal with the layout issues introduced by W3C standards.</p>
<div><p>&lt;Yonic&gt;</p><p>Although Astro later introduced a way to render Astro pages on demand, allowing me to hack my way through that behavior, that feature was introduced way after I finished the layout.</p><p>I don’t have any motivations for going through the hard work of trying to hack my way to have quirks mode enabled and make sure it works with all browsers again. The only one I can think of would be adding support for Internet Explorer 4. But that’s a huuuge “if”.</p><p>Besides, quirks mode also triggers some other non-standard behaviors; the box model is just one of the more notorious —and nagging— ones.</p><p>&lt;/Yonic&gt;</p></div>
 
<p>People would later realize that the new standard behavior by the W3C was prone to many problems, so in 2006, Mozilla introduced the <code>box-sizing</code> property, which controls what should count as the <code>width</code> of an element.</p>
<p>By setting it like this in CSS, you could sort of opt back in to the old behavior from quirks mode while remaining in standards mode:</p>
<div class="code-block astro-jgrc2lfe" data-button-label="Copy code">  <div class="astro-jgrc2lfe"> <pre class="astro-code min-light astro-jgrc2lfe" style="background-color:#ffffff;color:#24292eff; overflow-x: auto;" tabindex="0" data-language="css"><code><span class="line"><span style="color:#22863A">*</span><span style="color:#24292EFF"> {</span></span>
<span class="line"><span style="color:#1976D2">  box-sizing</span><span style="color:#D32F2F">:</span><span style="color:#1976D2"> border-box</span><span style="color:#24292EFF">;</span></span>
<span class="line"><span style="color:#24292EFF">}</span></span></code></pre> </div> </div> <div class="code-block dark astro-jgrc2lfe" data-button-label="Copy code">  <div class="astro-jgrc2lfe"> <pre class="astro-code poimandres astro-jgrc2lfe" style="background-color:#1b1e28;color:#a6accd; overflow-x: auto;" tabindex="0" data-language="css"><code><span class="line"><span style="color:#5DE4C7">*</span><span style="color:#A6ACCD"> {</span></span>
<span class="line"><span style="color:#ADD7FF">  box-sizing</span><span style="color:#A6ACCD">: </span><span style="color:#ADD7FF">border-box</span><span style="color:#A6ACCD">;</span></span>
<span class="line"><span style="color:#A6ACCD">}</span></span></code></pre> </div> </div> <div class="code-block legacy astro-jgrc2lfe" data-button-label="Copy code">  <div class="astro-jgrc2lfe"> <pre class="astro-code min-dark astro-jgrc2lfe" style="background-color:#1f1f1f;color:#b392f0; overflow-x: auto;" tabindex="0" data-language="css"><code><span class="line"><span style="color:#FFAB70">*</span><span style="color:#B392F0"> {</span></span>
<span class="line"><span style="color:#79B8FF">  box-sizing</span><span style="color:#F97583">:</span><span style="color:#79B8FF"> border-box</span><span style="color:#B392F0">;</span></span>
<span class="line"><span style="color:#B392F0">}</span></span></code></pre> </div> </div>  
<p>This new property was so well received that even the W3C would end up capitulating and turn this property into a standard. I might be wrong on this, but we take the code above for granted so much that now it might be something that many web designers teach very nonchalantly: “Don’t forget to put this, it’ll make things work properly.” or something of the sort, without actually understanding the reason behind it.</p>
<p>But this is of no use to me! Remember, this was introduced in the mid-to-late 2000s and didn’t become a standard until several years later, and Internet Explorer only began supporting this with version 8. Like I said before, it was all too late. So with no other options, <strong>I’d have to deal with the quirks of the standard rendering mode</strong>.</p>
<h2 id="getting-to-work">Getting to work</h2>
<p>Now that I was somewhat familiar with the basics, my first step was to create potentially suitable designs.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F09%2Fmaking-legacy-2%2Fdesign-beta.png&amp;w=700&amp;h=394&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="394" alt="Beta design" style="width:100%;height:auto" loading="lazy" decoding="async"> This is the first design that I came up with. At first I didn’t like it, but I still liked the layout so I might rescue it in the future for a possible feature I might add sometime. </div> </center>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F09%2Fmaking-legacy-2%2Fdesign-final.png&amp;w=700&amp;h=394&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" width="700" height="394" alt="Final design mockup" style="width:100%;height:auto" loading="lazy" decoding="async"> This is the mockup of the final design (except for the player). I don’t remember how I came up with the “Stardom” name, but I ended up changing it to “Pixarcade” design later on. </div> </center>
<p>Knowing that responsive 3-column layout was probably not going to be feasible, I went with a static, table based layout; an old-fashioned technique, but I am making a site for old browsers, right?</p>
<p>My game plan was to first cater the quirky browsers, and then apply CSS patches that would work for browsers that follow the standards. Normally, one would focus on the standard browsers and then patch up the quirks from older browsers, but I found this process to be much simpler the other way around. Although later on I would add specific patches for browsers that have a very quirky behavior and I don’t see any other way to fix it without compromising the other browsers’ stability.</p>
<p>Internet Explorer also has an incredibly handy feature to selectively apply patches across most of its versions (5 through 9) through <strong>conditional comments</strong>:</p>
<div class="code-block astro-jgrc2lfe" data-button-label="Copy code">  <div class="astro-jgrc2lfe"> <pre class="astro-code min-light astro-jgrc2lfe" style="background-color:#ffffff;color:#24292eff; overflow-x: auto;" tabindex="0" data-language="html"><code><span class="line"><span style="color:#1f3d95;background-color:rgba(121, 173, 227, 0.285)">&lt;!-- Anything inside here will be skipped by IE6 and above.--&gt;</span></span>
<span class="line"><span style="color:#C2C3C5">&lt;!--[if gte IE 6]&gt;&lt;!--&gt;</span></span>
<span class="line"><span style="color:#24292EFF">&lt;</span><span style="color:#22863A">link</span><span style="color:#6F42C1"> href</span><span style="color:#D32F2F">=</span><span style="color:#22863A">"standard_layout.css"</span><span style="color:#6F42C1"> rel</span><span style="color:#D32F2F">=</span><span style="color:#22863A">"stylesheet"</span><span style="color:#24292EFF">&gt;</span></span>
<span class="line"><span style="color:#C2C3C5">&lt;!--&lt;![endif]--&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color:#1f3d95;background-color:rgba(121, 173, 227, 0.285)">&lt;!-- Anything inside here will be run by IE5 and IE 5.5 only --&gt;</span></span>
<span class="line"><span style="color:#C2C3C5">&lt;!--[if lt IE 6]&gt;</span></span>
<span class="line"><span style="color:#C2C3C5">&lt;link href="ie5only.css" rel="stylesheet"&gt;</span></span>
<span class="line"><span style="color:#C2C3C5">&lt;![endif]--&gt;</span></span></code></pre> </div> </div> <div class="code-block dark astro-jgrc2lfe" data-button-label="Copy code">  <div class="astro-jgrc2lfe"> <pre class="astro-code poimandres astro-jgrc2lfe" style="background-color:#1b1e28;color:#a6accd; overflow-x: auto;" tabindex="0" data-language="html"><code><span class="line"><span style="color:#b3cdff;background-color:rgba(113,176,255, 0.5)">&lt;!-- Anything inside here will be skipped by IE6 and above.--&gt;</span></span>
<span class="line"><span style="color:#767C9DB0;font-style:italic">&lt;!--[if gte IE 6]&gt;&lt;!--&gt;</span></span>
<span class="line"><span style="color:#E4F0FB">&lt;</span><span style="color:#5DE4C7">link</span><span style="color:#5FB3A1;font-style:italic"> href</span><span style="color:#A6ACCD">=</span><span style="color:#A6ACCD">"</span><span style="color:#5DE4C7">standard_layout.css</span><span style="color:#A6ACCD">"</span><span style="color:#5FB3A1;font-style:italic"> rel</span><span style="color:#A6ACCD">=</span><span style="color:#A6ACCD">"</span><span style="color:#5DE4C7">stylesheet</span><span style="color:#A6ACCD">"</span><span style="color:#E4F0FB">&gt;</span></span>
<span class="line"><span style="color:#767C9DB0;font-style:italic">&lt;!--&lt;![endif]--&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color:#b3cdff;background-color:rgba(113,176,255, 0.5)">&lt;!-- Anything inside here will be run by IE5 and IE 5.5 only --&gt;</span></span>
<span class="line"><span style="color:#767C9DB0;font-style:italic">&lt;!--[if lt IE 6]&gt;</span></span>
<span class="line"><span style="color:#767C9DB0;font-style:italic">&lt;link href="ie5only.css" rel="stylesheet"&gt;</span></span>
<span class="line"><span style="color:#767C9DB0;font-style:italic">&lt;![endif]--&gt;</span></span></code></pre> </div> </div> <div class="code-block legacy astro-jgrc2lfe" data-button-label="Copy code">  <div class="astro-jgrc2lfe"> <pre class="astro-code min-dark astro-jgrc2lfe" style="background-color:#1f1f1f;color:#b392f0; overflow-x: auto;" tabindex="0" data-language="html"><code><span class="line"><span style="color:azure;background-color:royalblue">&lt;!-- Anything inside here will be skipped by IE6 and above.--&gt;</span></span>
<span class="line"><span style="color:#6B737C">&lt;!--[if gte IE 6]&gt;&lt;!--&gt;</span></span>
<span class="line"><span style="color:#B392F0">&lt;</span><span style="color:#FFAB70">link</span><span style="color:#B392F0"> href</span><span style="color:#F97583">=</span><span style="color:#FFAB70">"standard_layout.css"</span><span style="color:#B392F0"> rel</span><span style="color:#F97583">=</span><span style="color:#FFAB70">"stylesheet"</span><span style="color:#B392F0">&gt;</span></span>
<span class="line"><span style="color:#6B737C">&lt;!--&lt;![endif]--&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color:azure;background-color:royalblue">&lt;!-- Anything inside here will be run by IE5 and IE 5.5 only --&gt;</span></span>
<span class="line"><span style="color:#6B737C">&lt;!--[if lt IE 6]&gt;</span></span>
<span class="line"><span style="color:#6B737C">&lt;link href="ie5only.css" rel="stylesheet"&gt;</span></span>
<span class="line"><span style="color:#6B737C">&lt;![endif]--&gt;</span></span></code></pre> </div> </div>  
<p>Since most other browsers would play by the standards, I needed the standard CSS patches to be available for them as well, and this code above will certainly do the trick.</p>
<p>I also had the power of modern enhancements to CSS thanks to both SASS and, later on, PostCSS, to convert modern features such as <code>calc()</code> into hardcoded supported values by these browsers.</p>
<p>Slowly the elements of the website would carefully be integrated, one by one. Some were trivially easy to make. Others, not so much. <strong>9-slice elements</strong> such as the text bubbles and the code windows were very painstakingly crafted with tables, but I think I may have put the browsers to their limit when developing these, because they seem to have some transient issues when displaying them sometimes. In situations which CSS couldn’t cover some of the edge cases, I could rely on jQuery as a last resort.</p>
<p>Once I finished porting the majority of the post components from the Modern version —and showing a warning for those that couldn’t be ported due to web limitations— I ended up with two different versions of the blog, even though the data and posts were mostly the same. Although not an easy conundrum, I was able to merge the data of both versions together, so that I only need to write a post in one place, and both the Modern and Legacy versions could fetch and display the new post on their own.</p>
<p>All in all, I’ve learnt quite a lot about some of the most obscure elements of CSS and HTML, and particularly even more quirks related to each browser and operating system, and despite the many, <em>many</em>, shortcomings and problems, I had a lot of fun making the Legacy Version of The Yonic Corner.</p>
<p>Here’s a list of some of the things I’ve learnt:</p>
<ul>
<li>You can adjust the position of the marker of lists with <code>list-style-position</code>.</li>
<li>HTML4 properties have fallbacks in modern browsers using CSS, at least for the most part.</li>
<li>Now I fully understand the concept of <strong>web safe colors</strong>, as not only they could change drastically in screens with limited color depth, but they also can have flashes of colors when switching between applications —a quirk of the process graphics cards and software do called “palette realization”.</li>
<li>Despite not supporting it, jQuery <strong>does work on IE5.5</strong>. Although only like the very first handful of releases, and only a very limited set of functions, but it was still good enough to do the things I wanted it to do.</li>
<li>Tables have two ways of being rendered depending on how you set the property <code>table-layout</code>: <code>fixed</code> and <code>auto</code>. I still don’t get how they work exactly, but <code>auto</code> seems to be the option that can come closest to a flexbox —although it’s also the most unpredictable and the most prone to layout breakdowns.</li>
<li>Although all of my target browsers support PNG, the vast majority has only 1-bit transparency support (such as with PNG8), so they can only be either totally opaque or totally transparent. The only one that does seem to have a more robust support for partial transparency is IE5 for Mac… *sigh*.</li>
<li>When an element overflows in IE5, it actually makes its container bigger than it should be, instead of the element just popping off the container.</li>
<li>Flash Player 7 sucks. But that’s a story for another time.</li>
</ul>
<p>I’ve also came up with a really elegant hack for overcoming the problem regarding elements getting wider with padding. <strong>The key is that the enlargement only happens when you’re setting a padding or a border to an element with an explicit size</strong>. But if the size remains intrinsic —that is to say, it takes on its natural sizing— <strong>it will behave like in quirks mode or <code>border-box</code> sizing</strong>.</p>
<p>By default, <code>block</code> elements such as <code>div</code> will take all the available horizontal space. So why not use one intrinsically sized container as a padding box for the content?</p>
<div class="code-block astro-jgrc2lfe" data-button-label="Copy code"> <span class="filename astro-jgrc2lfe"> <img width="16" height="16" alt="html" src="/img/icons/filetypes/file_type_html.svg" class="icon astro-jgrc2lfe"> hack.html </span> <div class="astro-jgrc2lfe"> <pre class="astro-code min-light astro-jgrc2lfe" style="background-color:#ffffff;color:#24292eff; overflow-x: auto;" tabindex="0" data-language="html"><code><span class="line"><span style="color:#24292EFF">&lt;</span><span style="color:#22863A">div</span><span style="color:#6F42C1"> class</span><span style="color:#D32F2F">=</span><span style="color:#22863A">"container"</span><span style="color:#24292EFF">&gt;</span></span>
<span class="line"><span style="color:#24292EFF">  &lt;</span><span style="color:#22863A">div</span><span style="color:#6F42C1"> class</span><span style="color:#D32F2F">=</span><span style="color:#22863A">"padding-box"</span><span style="color:#24292EFF">&gt;</span></span>
<span class="line"><span style="color:#24292EFF">    &lt;</span><span style="color:#22863A">div</span><span style="color:#6F42C1"> class</span><span style="color:#D32F2F">=</span><span style="color:#22863A">"content"</span><span style="color:#24292EFF">&gt;</span></span>
<span class="line"><span style="color:#24292EFF">      This will measure 500px exactly!</span></span>
<span class="line"><span style="color:#24292EFF">    &lt;/</span><span style="color:#22863A">div</span><span style="color:#24292EFF">&gt;</span></span>
<span class="line"><span style="color:#24292EFF">  &lt;/</span><span style="color:#22863A">div</span><span style="color:#24292EFF">&gt;</span></span>
<span class="line"><span style="color:#24292EFF">&lt;/</span><span style="color:#22863A">div</span><span style="color:#24292EFF">&gt;</span></span></code></pre> </div> </div> <div class="code-block dark astro-jgrc2lfe" data-button-label="Copy code"> <span class="filename astro-jgrc2lfe"> <img width="16" height="16" alt="html" src="/img/icons/filetypes/file_type_html.svg" class="icon astro-jgrc2lfe"> hack.html </span> <div class="astro-jgrc2lfe"> <pre class="astro-code poimandres astro-jgrc2lfe" style="background-color:#1b1e28;color:#a6accd; overflow-x: auto;" tabindex="0" data-language="html"><code><span class="line"><span style="color:#E4F0FB">&lt;</span><span style="color:#5DE4C7">div</span><span style="color:#5FB3A1;font-style:italic"> class</span><span style="color:#A6ACCD">=</span><span style="color:#A6ACCD">"</span><span style="color:#5DE4C7">container</span><span style="color:#A6ACCD">"</span><span style="color:#E4F0FB">&gt;</span></span>
<span class="line"><span style="color:#E4F0FB">  &lt;</span><span style="color:#5DE4C7">div</span><span style="color:#5FB3A1;font-style:italic"> class</span><span style="color:#A6ACCD">=</span><span style="color:#A6ACCD">"</span><span style="color:#5DE4C7">padding-box</span><span style="color:#A6ACCD">"</span><span style="color:#E4F0FB">&gt;</span></span>
<span class="line"><span style="color:#E4F0FB">    &lt;</span><span style="color:#5DE4C7">div</span><span style="color:#5FB3A1;font-style:italic"> class</span><span style="color:#A6ACCD">=</span><span style="color:#A6ACCD">"</span><span style="color:#5DE4C7">content</span><span style="color:#A6ACCD">"</span><span style="color:#E4F0FB">&gt;</span></span>
<span class="line"><span style="color:#A6ACCD">      This will measure 500px exactly!</span></span>
<span class="line"><span style="color:#E4F0FB">    &lt;/</span><span style="color:#5DE4C7">div</span><span style="color:#E4F0FB">&gt;</span></span>
<span class="line"><span style="color:#E4F0FB">  &lt;/</span><span style="color:#5DE4C7">div</span><span style="color:#E4F0FB">&gt;</span></span>
<span class="line"><span style="color:#E4F0FB">&lt;/</span><span style="color:#5DE4C7">div</span><span style="color:#E4F0FB">&gt;</span></span></code></pre> </div> </div> <div class="code-block legacy astro-jgrc2lfe" data-button-label="Copy code"> <span class="filename astro-jgrc2lfe"> <img width="16" height="16" alt="html" src="/img/icons/filetypes/file_type_html.svg" class="icon astro-jgrc2lfe"> hack.html </span> <div class="astro-jgrc2lfe"> <pre class="astro-code min-dark astro-jgrc2lfe" style="background-color:#1f1f1f;color:#b392f0; overflow-x: auto;" tabindex="0" data-language="html"><code><span class="line"><span style="color:#B392F0">&lt;</span><span style="color:#FFAB70">div</span><span style="color:#B392F0"> class</span><span style="color:#F97583">=</span><span style="color:#FFAB70">"container"</span><span style="color:#B392F0">&gt;</span></span>
<span class="line"><span style="color:#B392F0">  &lt;</span><span style="color:#FFAB70">div</span><span style="color:#B392F0"> class</span><span style="color:#F97583">=</span><span style="color:#FFAB70">"padding-box"</span><span style="color:#B392F0">&gt;</span></span>
<span class="line"><span style="color:#B392F0">    &lt;</span><span style="color:#FFAB70">div</span><span style="color:#B392F0"> class</span><span style="color:#F97583">=</span><span style="color:#FFAB70">"content"</span><span style="color:#B392F0">&gt;</span></span>
<span class="line"><span style="color:#B392F0">      This will measure 500px exactly!</span></span>
<span class="line"><span style="color:#B392F0">    &lt;/</span><span style="color:#FFAB70">div</span><span style="color:#B392F0">&gt;</span></span>
<span class="line"><span style="color:#B392F0">  &lt;/</span><span style="color:#FFAB70">div</span><span style="color:#B392F0">&gt;</span></span>
<span class="line"><span style="color:#B392F0">&lt;/</span><span style="color:#FFAB70">div</span><span style="color:#B392F0">&gt;</span></span></code></pre> </div> </div>  
<div class="code-block astro-jgrc2lfe" data-button-label="Copy code"> <span class="filename astro-jgrc2lfe"> <img width="16" height="16" alt="css" src="/img/icons/filetypes/file_type_css.svg" class="icon astro-jgrc2lfe"> hack.css </span> <div class="astro-jgrc2lfe"> <pre class="astro-code min-light astro-jgrc2lfe" style="background-color:#ffffff;color:#24292eff; overflow-x: auto;" tabindex="0" mark="4-11" data-language="css"><code><span class="line"><span style="color:#22863A">*</span><span style="color:#24292EFF"> {</span></span>
<span class="line"><span style="color:#1976D2">  box-sizing</span><span style="color:#D32F2F">:</span><span style="color:#1976D2"> content-box</span><span style="color:#24292EFF">;</span></span>
<span class="line"><span style="color:#24292EFF">}</span></span>
<span class="line marked"><span style="color:#6F42C1">.container</span><span style="color:#24292EFF"> {</span></span>
<span class="line marked"><span style="color:#1976D2">  width</span><span style="color:#D32F2F">:</span><span style="color:#1976D2"> 500</span><span style="color:#D32F2F">px</span><span style="color:#24292EFF">;</span></span>
<span class="line marked"><span style="color:#1976D2">  background</span><span style="color:#D32F2F">:</span><span style="color:#1976D2"> black</span><span style="color:#24292EFF">;</span></span>
<span class="line marked"><span style="color:#24292EFF">}</span></span>
<span class="line marked"><span style="color:#6F42C1">.padding-box</span><span style="color:#24292EFF"> {</span></span>
<span class="line marked"><span style="color:#1976D2">  padding</span><span style="color:#D32F2F">:</span><span style="color:#1976D2"> 10</span><span style="color:#D32F2F">px</span><span style="color:#24292EFF">;</span></span>
<span class="line marked"><span style="color:#1976D2">  border</span><span style="color:#D32F2F">:</span><span style="color:#1976D2"> 2</span><span style="color:#D32F2F">px</span><span style="color:#1976D2"> solid black</span><span style="color:#24292EFF">;</span></span>
<span class="line marked"><span style="color:#24292EFF">}</span></span>
<span class="line"><span style="color:#6F42C1">.content</span><span style="color:#24292EFF"> {</span></span>
<span class="line"><span style="color:#1976D2">  color</span><span style="color:#D32F2F">:</span><span style="color:#1976D2"> white</span><span style="color:#24292EFF">;</span></span>
<span class="line"><span style="color:#24292EFF">}</span></span></code></pre> </div> </div> <div class="code-block dark astro-jgrc2lfe" data-button-label="Copy code"> <span class="filename astro-jgrc2lfe"> <img width="16" height="16" alt="css" src="/img/icons/filetypes/file_type_css.svg" class="icon astro-jgrc2lfe"> hack.css </span> <div class="astro-jgrc2lfe"> <pre class="astro-code poimandres astro-jgrc2lfe" style="background-color:#1b1e28;color:#a6accd; overflow-x: auto;" tabindex="0" mark="4-11" data-language="css"><code><span class="line"><span style="color:#5DE4C7">*</span><span style="color:#A6ACCD"> {</span></span>
<span class="line"><span style="color:#ADD7FF">  box-sizing</span><span style="color:#A6ACCD">: </span><span style="color:#ADD7FF">content-box</span><span style="color:#A6ACCD">;</span></span>
<span class="line"><span style="color:#A6ACCD">}</span></span>
<span class="line marked"><span style="color:#E4F0FBD0;font-style:italic">.</span><span style="color:#5FB3A1;font-style:italic">container</span><span style="color:#A6ACCD"> {</span></span>
<span class="line marked"><span style="color:#ADD7FF">  width</span><span style="color:#A6ACCD">: </span><span style="color:#5DE4C7">500px</span><span style="color:#A6ACCD">;</span></span>
<span class="line marked"><span style="color:#ADD7FF">  background</span><span style="color:#A6ACCD">: </span><span style="color:#ADD7FF">black</span><span style="color:#A6ACCD">;</span></span>
<span class="line marked"><span style="color:#A6ACCD">}</span></span>
<span class="line marked"><span style="color:#E4F0FBD0;font-style:italic">.</span><span style="color:#5FB3A1;font-style:italic">padding-box</span><span style="color:#A6ACCD"> {</span></span>
<span class="line marked"><span style="color:#ADD7FF">  padding</span><span style="color:#A6ACCD">: </span><span style="color:#5DE4C7">10px</span><span style="color:#A6ACCD">;</span></span>
<span class="line marked"><span style="color:#ADD7FF">  border</span><span style="color:#A6ACCD">: </span><span style="color:#5DE4C7">2px</span><span style="color:#ADD7FF"> solid</span><span style="color:#ADD7FF"> black</span><span style="color:#A6ACCD">;</span></span>
<span class="line marked"><span style="color:#A6ACCD">}</span></span>
<span class="line"><span style="color:#E4F0FBD0;font-style:italic">.</span><span style="color:#5FB3A1;font-style:italic">content</span><span style="color:#A6ACCD"> {</span></span>
<span class="line"><span style="color:#ADD7FF">  color</span><span style="color:#A6ACCD">: </span><span style="color:#ADD7FF">white</span><span style="color:#A6ACCD">;</span></span>
<span class="line"><span style="color:#A6ACCD">}</span></span></code></pre> </div> </div> <div class="code-block legacy astro-jgrc2lfe" data-button-label="Copy code"> <span class="filename astro-jgrc2lfe"> <img width="16" height="16" alt="css" src="/img/icons/filetypes/file_type_css.svg" class="icon astro-jgrc2lfe"> hack.css </span> <div class="astro-jgrc2lfe"> <pre class="astro-code min-dark astro-jgrc2lfe" style="background-color:#1f1f1f;color:#b392f0; overflow-x: auto;" tabindex="0" mark="4-11" data-language="css"><code><span class="line"><span style="color:#FFAB70">*</span><span style="color:#B392F0"> {</span></span>
<span class="line"><span style="color:#79B8FF">  box-sizing</span><span style="color:#F97583">:</span><span style="color:#79B8FF"> content-box</span><span style="color:#B392F0">;</span></span>
<span class="line"><span style="color:#B392F0">}</span></span>
<span class="line marked"><span style="color:#B392F0">.container {</span></span>
<span class="line marked"><span style="color:#79B8FF">  width</span><span style="color:#F97583">:</span><span style="color:#F8F8F8"> 500px</span><span style="color:#B392F0">;</span></span>
<span class="line marked"><span style="color:#79B8FF">  background</span><span style="color:#F97583">:</span><span style="color:#79B8FF"> black</span><span style="color:#B392F0">;</span></span>
<span class="line marked"><span style="color:#B392F0">}</span></span>
<span class="line marked"><span style="color:#B392F0">.padding-box {</span></span>
<span class="line marked"><span style="color:#79B8FF">  padding</span><span style="color:#F97583">:</span><span style="color:#F8F8F8"> 10px</span><span style="color:#B392F0">;</span></span>
<span class="line marked"><span style="color:#79B8FF">  border</span><span style="color:#F97583">:</span><span style="color:#F8F8F8"> 2px </span><span style="color:#79B8FF">solid</span><span style="color:#79B8FF"> black</span><span style="color:#B392F0">;</span></span>
<span class="line marked"><span style="color:#B392F0">}</span></span>
<span class="line"><span style="color:#B392F0">.content {</span></span>
<span class="line"><span style="color:#79B8FF">  color</span><span style="color:#F97583">:</span><span style="color:#79B8FF"> white</span><span style="color:#B392F0">;</span></span>
<span class="line"><span style="color:#B392F0">}</span></span></code></pre> </div> </div>  
<p>Set the width of the <code>container</code>-class elements to percentages and you could potentially have something like a rudimentary responsive element!</p>
<p>But I’ve learnt one more thing about the box model, which is the kicker. All the time I’ve mentioned the box model, I’ve been talking about the <code>width</code> of an element. But what about the <code>height</code>? It turns out that the height of an element is computed in an entirely different way, and <strong>there is no mention of padding nor border in <code>height</code> calculation.</strong> And older browsers seem to calculate it in the same way regardless of the rendering mode! So, unless you set the <code>box-sizing: border-box</code> rule in CSS, <strong>padding and borders will <em>always</em> make the element taller than specified</strong>.</p>
<div><p>&lt;Yonic&gt;</p><p>Alright, I can see this not being as much of a deal as with <code>width</code>, because web elements tend to flow in rows: Horizontal first, vertically when they run out of horizontal space.</p><p>The horizontal axis being more sensitive to the vertical one is sort of a valid reason not to care. But in a world where fullscreen web apps exist, that’s <em>still</em> going to be the source of problems if you don’t know about that behavior! And also the padding and container hack I just mentioned would not work with heights!</p><p>Seriously! Whose minds came up with this crappy design!? Did they think web elements should behave like files because of the “padding”?</p><p>&lt;/Yonic&gt;</p></div>
 
<p>I think the last part of this series is going to be the most fun one. I want to address and laugh —and roar in anger— at the many issues and weird stuff that happened since I started working on this project. Hopefully it won’t take a year to post it!</p>]]></content>
    </entry>
        <entry>
            <title>Webcore Bliss</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2024/09/bliss-90s</id>
            <link href="https://www.yonic.blog/blog/article/2024/09/bliss-90s" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2024/09/bliss-90s" />
            <summary><![CDATA[ What if the famous Windows XP wallpaper was made in the 1990s? ]]></summary>
            <published>2024-09-19T21:27:47.400Z</published>
            <updated>2024-09-19T21:27:47.400Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F09%2Fbliss-90s%2Fhero.png&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><div class="feed-preview"><a href="https://yonic.blog/file/img/blog/art/renders/bliss-90s.png" target="_blank" rel="noreferrer">Click here for full image</a><center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2Fart%2Frenders%2Fbliss-90s.png&amp;w=700&amp;h=394&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" width="700" height="394" alt="Bliss wallpaper in a 90s style" style="width:100%;height:auto" loading="lazy" decoding="async"> What if the famous Windows XP wallpaper was made in the 1990s? </div> </center><p>Lately I’ve been getting myself into making retro-styled renders from the 1980s to the early 2000s. This is a recreation of the famous wallpaper for Windows XP made with Blender 4.3 with the Cycles renderer.</p><p><a href="http://yonic.blog/file/img/blog/art/renders/bliss-90s-1024.png">I also have a 1024x768 standard wallpaper for old computers to use.</a></p></div>
<div><p>&lt;Yonic&gt;</p><p>Now that I see the finished product, it does remind a bit of the intro to the Amazing Digital Circus, and I’m glad it resembles the world a slightly bit!</p><center><center> <div style="width:400px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F09%2Fbliss-90s%2Ftadc.png&amp;w=400&amp;h=278&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="400" height="278" alt="The Amazing Digital Circus logo in the intro" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center></center><p>That series does drive a lot into several graphical styles of the 90s, mainly webcore, which I also designed this blog after.</p><p>&lt;/Yonic&gt;</p></div>
 ]]></content>
    </entry>
        <entry>
            <title>Gaming isn't crashing: It's stagnating, but it's still going to be very painful.</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2024/08/games-aaa-stagnation</id>
            <link href="https://www.yonic.blog/blog/article/2024/08/games-aaa-stagnation" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2024/08/games-aaa-stagnation" />
            <summary><![CDATA[ Instead of the promised raytracing generation, darkness awaits us. But this is normal. ]]></summary>
            <published>2024-08-23T15:58:03.761Z</published>
            <updated>2024-09-02T13:19:44.102Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F08%2Fgames-aaa-stagnation%2Fhero.jpg&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><div class="feed-preview"><p>On <a href="/blog/article/2023/12/gamedev-summary">last year’s retrospective on game development</a>, I predicted that the gaming industry layoffs wouldn’t stop this year. Sadly, I was right on the money: <strong>We’ve surpassed the amount of layoffs from 2023 back in June</strong>.</p><p>And it’s not just the big studios that are suffering. The indie industry is struggling with a completely different kind of situation.</p></div>
<h2 id="the-aaa-corporate-greed-game-development-as-slavery">The AAA corporate greed: Game development as slavery?</h2>
<p class="astro-gicio36m"> <a href="/player/sims2/busy-sim" target="_blank" class="astro-gicio36m">Music: Busy Sim</a> <i class="astro-gicio36m">(The Sims 2 | Mark Mothersbaugh)</i></p>  
<p>A bit of a flippant title, but it’s seems to be becoming ever increasingly truer with time in big studios with an economic model that’s based on the model of tech giants from the United States.</p>
<p>I’m not going to delve deep into US economics, but the gist of it is that it’s mostly growth driven: “The more reach you can obtain, the happier the investors become. We’ll see the actual earnings later.”</p>
<p>This is one of the reasons big publishing firms spend so much money on marketing: It’s one of the main drives for potential growth, which gives them <em>a lot</em> of leverage.</p>
<p>In their desire to achieve more growth, studios are pressured to hire more staff than they actually need, because having more jobs tends to <em>look good</em> on investors. This often results on a troubled situation in which management is found being incapable of coordinating a team of such size, which will probably have an impact on why the development won’t get anywhere. And once the project doesn’t seem to be delivering what it’s been promised, companies resort to cutting costs by axing jobs that they knew beforehand shouldn’t have hired in the first place, and attempt to “try to look good and responsible” by applying damage control to their best.</p>
<p>This is especially true in companies that go public in the stock market, as there is a constant pressure for exponential growth; since other companies are doing this, stockholders may consider that your company might be stagnating if the stock value doesn’t keep increasing, even if it’s being inflated. <a href="https://www.shacknews.com/article/139799/electronic-arts-share-buyback-2024">Game companies even resort to buying back stock</a> just to do this.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F08%2Fgames-aaa-stagnation%2Fgraph.jpg&amp;w=700&amp;h=483&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" width="700" height="483" alt="A graph showing how game companies from the United States act like" style="width:100%;height:auto" loading="lazy" decoding="async"> This is a (comedic) depiction of a graph explaining how this cycle of the game development progresses over time. This applies to large companies, not just indie game studios. </div> </center>
<p>And if that wasn’t enough, some publishers have also found an exploit: The <strong>early access rug pull</strong>. This really shady practice consists on releasing a game as an early access game, hoping to gain traction. But the game will be full price while in this phase. If the game eventually flops during development, since they’ve already gotten some earnings, they pull the rug, stop development altogether, and run away with the cash while at the same time leaving just a handful of programmers for fixing bugs only. <strong>This is fraud and punishable by law</strong>.</p>
<p>This is exactly what happened with <a href="https://www.ign.com/articles/take-two-shutters-kerbal-space-program-2-studio-amid-layoffs">Take-Two when they shut down Intercept Games</a>, putting the final nail in the coffin of <em>Kerbal Space Program 2</em>’s troubled development. And last year we also had the <a href="https://www.forbes.com/sites/paultassi/2023/12/12/the-day-before-disaster-mass-refunds-developer-ghosting-scam-accusations/">Fntastic’s <em>The Day Before</em> incident</a>.</p>
<div><p>&lt;Yonic&gt;</p><p>And this is why now I don’t preorder games anymore, even if it comes with bonuses. Ever since downloadable patches became a thing, I’ve became very cynical for how a game is going to come out.</p><p>Although <em>maybe</em> I will consider preordering something I might want at all costs in a physical format and I think there won’t be many physical units in supply. It used to be the case with <em>Metroid</em> games, but nowadays the supply has been pretty hefty enough to make me wait for the release.</p><p>&lt;/Yonic&gt;</p></div>
 
<h2 id="indies-and-the-lack-of-funding">Indies and the lack of funding</h2>
<p class="astro-gicio36m"> <a href="/player/last-window/neon-lights" target="_blank" class="astro-gicio36m">Music: Neon Lights</a> <i class="astro-gicio36m">(Last Window: The Secret of Cape West | Satoshi Okubo)</i></p>  
<p>This is something that has been happening more often than not in studios all over Europe, a region where most of the game throughput come from indie studios, which normally don’t have much capital to embark themselves onto making videogames.</p>
<p>Ever since the worldwide lockdown due to the pandemic period ended, things have gotten for the worse for indie studios. During the pandemic, investors were able to read the tea leaves and figure out that <strong>games were going to be extremely valuable during lockdown</strong>, from a convenient way to cope with having to stay indoors, to a collectible commodity. Roblox is the textbook example of this: It exploded in popularity during the 2020s, and <a href="https://venturebeat.com/games/roblox-goes-public-at-42-2-billion-valuation-in-direct-listing/">went public at an astronomically high market value of over 7 times the value of Ubisoft</a>, but fell victim to the 2022 bust and <a href="https://www.bloomberg.com/news/articles/2022-02-16/roblox-shopify-show-covid-19-boon-also-has-a-bust">quickly devalued as restrictions went down</a>.</p>
<p>The Web3 fiasco further exacerbated the damages, because it fostered a lot of interest on game projects that had blockchain-like features, but these were simply terrible investments that could be considered a downright scam. Their failure caused a lot of devaluation of a lot of startups, and many tech investors grew extremely wary of investing.</p>
<p> <b>YouTube video: </b> <a class="anchor" href="https://www.youtube.com/watch?v=g-_hVXzkn0o" target="_blank" rel="noreferrer noopener">Tech bust of 2022 explained</a> (3:05) </p>
<p>However, game studios started with their massive layoffs a year after the bust because videogames are generally more of a long-term investment and it took some time to see that they weren’t as profitable anymore.</p>
<p>Investors in Europe face similar concerns, and are being now <a href="https://www.gamesindustry.biz/how-are-investors-feeling-about-video-games-today">more conservative and risk aware</a> because game European studios are increasingly being handled like tech companies from the United States.</p>
<p>And if that wasn’t enough, the tech industry did eventually find something that seemed promising: <strong>Generative “AI”</strong>, a field in which videogame development seems to have have yet to find anything to take advantage of —let alone that its usage is deemed unethical within the industry— and with nothing else seemingly equally promising in tech, investors have flocked in herds to those greener pastures.</p>
<div><p><b>Yonic:</b> We’ll see how that “AI” biz goes in the next few 5 years or so.</p></div>
 
<p><a href="https://www.pcgamer.com/kickstarter-pledges-in-decline-as-crowdfunding-makes-way-for-early-access/">Crowdfunding isn’t what it used to be</a> 10 years ago, and it has become very stagnant with no hopes of improving. Early access used to provide a lot more confidence that a game would eventually be completed, but also the increased awareness of scam-like or development going wrong has made people very wary of putting their own money on a game. And if your game failed to meet expectations, it’s <strong>game over</strong>; your now forever ruined public image would seriously affect sales of future projects you would be involved in.</p>
<h2 id="hardware-development-from-now-might-be-having-diminishing-returns">Hardware development from now might be having diminishing returns</h2>
<p>Do you feel like something is happening to next-gen games as of lately? Like, despite the technological advances of the latest in console gaming hardware, the games themselves are failing to live up to their expectations? Like it’s all ports of the previous generation? If you’ve answered “yes” to any of the questions above, you’re not alone.</p>
<p>I think there’s now enough room to start worrying about the fact that gaming hardware has become “too powerful”. <a href="./comic-tower-scope" target="_blank">Moore’s law applies to hardware, not software</a>. And it is my belief that we’ve reached the point where despite computers are becoming increasingly more powerful, <strong>it is no longer possible to come within grasping distance to the limit on what consoles are capable of</strong>. At least, not unless you have humongous resources and even still resort to unethical development environments.</p>
<p>However, expectations of players increase with each new generation of hardware. And unfortunately, their expectations have reached a hard glass ceiling with this current generation.</p>
<div><p><b>Yonic:</b> On that metric, the <strong>PlayStation 4 and Xbox One lie <em>very</em> close to the line of diminishing returns</strong>. I would personally not go beyond this.</p></div>
 
<p>But even still! This is precisely where I see a ray of hope within the darkness.</p>
<h2 id="konnichiwa-baby-japan-is-back">Konnichiwa, baby! Japan is back!</h2>
<p class="astro-gicio36m"> <a href="/player/pokemon/bw2/route-4-spring" target="_blank" class="astro-gicio36m">Music: Route 4 (Spring)</a> <i class="astro-gicio36m">(Pokémon Black &amp; White: Super Music Collection | Shota Kageyama)</i></p>  
<p>The Eastern game industry hasn’t been affected as much in this wave of decline, because their economics work in a more conservative way than those from tech in the United States.</p>
<p>Take a look at Nintendo, for example. Instead of laying off employees, they resorted to <a href="https://www.gamesindustry.biz/nintendo-to-increase-wages-10-despite-lowered-forecast">actually increasing their salaries by 10%</a>. Japanese —and I think Korean companies as well— tend to operate very differently than those from the United States, and to a lesser extent European companies. Instead of valuing growth over anything else, they value <strong>resilience and a long-term but sustained growth</strong>, and one of the key factors for that resilience is workforce.</p>
<p>Whether it’s a sociocultural or a business managing aspect, it’s a fact that in Japan, workers are a vital part of any company, people consider the workplace “their second home”, and the actual legal action of firing people is massively restricted. This drives companies and game studios alike to keep the workers that they have, even at a loss.</p>
<div><p>&lt;Yonic&gt;</p><p>It’s worth noting, however, that Japanese companies <em>do</em> mass hiring of people, but these are usually students scheduled to graduate in spring in order to replace their oldest, retiring workers.</p><p>Due to the aging of Japanese population, young workers have become so valuable that most Japanese companies will primarily or almost exclusively hire people from the pile of new graduates, and compete <em>very</em> hard to recruit the most academically successful candidates.</p><p>Unfortunately this has the very nasty effect that once your “freshly graduate card” expires, you are incredibly less likely to find a job, which adds a lot to the importance of keeping your employees. Some black companies excuse their practices by reminding their workers that <em>they probably won’t find a job anywhere else</em>, too.</p><p>Because of the social problems that this century-old custom has brought (and especially after its mass use after the post-war Japanese economic miracle), the Japan Business Federation, with some of the largest companies in the country, said that they are “no longer required to practice this custom” in 2020.</p><p>But this isn’t an order nor law. <a href="https://www.hitachi.co.jp/recruit/en/newgraduate/select/info/index.html">Do you really think they’re gonna stop?</a></p><p>&lt;/Yonic&gt;</p></div>
 
<p>Instead of panicking and minimizing losses by panicking with damage controls, Japanese companies will generally accept the fact that hard times are coming, and prepare themselves in order to “at least not make it that hard” to be able to get up and kick off when times get better. This hardening-based culture generally makes companies less prone to collapsing, and instead have simply a flatter overall productivity.</p>
<p>Japanese studios also <strong>have it much easier to secure funding</strong> than studios in Western countries because they have other ways to get funding that aren’t as prominent in the West.</p>
<h3 id="method-1-trans-media-projects-and-the-production-committee">Method 1: Trans-media projects and the production committee</h3>
<p>A very large amount of games are actually <strong>trans-media projects</strong> handled by a <strong>production committee</strong>. This method of funding is also fairly common in Europe, but Japanese production committees tend to treat projects from the same IP equally, and get a more fair share of funds than with an European “main project and accompanying projects” model. In anime circles, production committees are seen rather controversial, but it’s still a major source of funding for many entertainment and merchandising industries alike.</p>
<p>While games aren’t a common sight in these committees, if a game publisher does become part of one, it would allow the studio working on the game to get piggybacked by this system, and not only get easy funding, but also obtain protections against losses should the project fail commercially, even if it means a more equal share of profits with the rest of projects —again, Japanese companies focusing on resilience rather than growth. Game studios themselves joining are way less common since they generally don’t have the capital to make a contribution in the committee.</p>
<p>In Europe, games aren’t usually the main project and the overall trans-media project tends to have a more limited funding and reach, so they typically tend to be of smaller scope and of less quality than Japanese ones.</p>
<h3 id="method-2-licensed-games-and-publishers">Method 2: Licensed games and publishers</h3>
<p>Other projects are usually <strong>licensed games commissioned by a publisher</strong>.</p>
<p>Licensed games were particularly notable in the United States industry until the 2000s, but publishers would outsource games for as many platforms as possible to other developers with minimal funding and tight deadlines, baking on the fact that brand recognition alone would sell the game. But this resulted in a huge amount of terrible quality games and their eventual demise in the 2010s, as game development became costlier and consumers became more informed on the industry as a whole.</p>
<p> <b>YouTube video: </b> <a class="anchor" href="https://www.youtube.com/watch?v=E7lD97BxMN0" target="_blank" rel="noreferrer noopener">Extra Credits on licensed games in the United States</a> (8:09) </p>
<p>Japanese publishers, on the other hand, act in a similar way to Spanish licensed game publishers during its silver age with mobile games in the 2000s: Focusing on a single game and platform (or leveraging cross-platform if possible) and having a more respectful budget. Japanese developers also earn their trust with publishers through these commissions, allowing them to secure funding on their projects based on the developers’ own IPs.</p>
<div><p><b>Yonic:</b> It’s worth noting that this has nothing to do with where the original IP comes from, but rather where the publisher is based. Capcom —a Japanese company and publisher— has published many Disney titles that were significantly better in quality than other Disney licensed games.</p></div>
 
<h3 id="method-3-self-funding">Method 3: Self-funding</h3>
<p>Smaller and indie studios are also capable of funding their own projects because they tend to focus on games that are much smaller in technical scope: <strong>Visual novels</strong>. This allows them to make games with much less funding, while remaining somewhat able to generate a small profit.</p>
<p>However, not every visual novel developer seeks that: A particular category of games, “doujin software”, involves games that are based on existing IPs and made as a hobby rather than for profit. Most of these projects are made at a loss, but thanks to the strong market of fan-based projects, developers may expect to grow up to be successful later on.</p>
<p>While visual novels aren’t as notorious as they did in the early 2000s, they still account for a significant portion of the Japanese game market, and thanks to opening up to English and Chinese speaking markets, the visual novel industry is still holding on strong.</p>
<h3 id="the-dawn-of-new-hardware">The dawn of new hardware</h3>
<p>A promising prospect is that the Japanese economy seems to have been rebounding since the past couple of years (<a href="https://www.euronews.com/business/2024/08/23/trading-mixed-as-bank-of-japan-governor-warns-markets-are-unstable">although the Bank of Japan did make a cautionary warning for trade markets due to unstable foreign markets</a>) so it’s possible that the Japanese game industry could boost itself up again despite the hardships.</p>
<p>Unfortunately I don’t know about the Chinese and Korean game industries enough to provide more information about them, but it does seem like they may be going through good times as well.</p>
<p>For now, it all comes down to Nintendo’s next console. One of the reasons why I have bet for a <a href="../03/switch2-2025">powerful home console</a> as Nintendo Switch’s successor (and short-time companion) is partly because Nintendo needs to compete with Microsoft and Sony with their Xbox Series and PlayStation 5, and the economy of Japan seems to be at a very adequate time to strike hard with a powerful system.</p>
<p>But this is <strong>absolutely not what I want!</strong> This would place the bar for AAA games <em>above the diminishing returns point</em>, and both AAA and even AA studios would feel pressured to scale up their scope in projects to meet up with hype and expectations. In other words — this spells an unsustainable hell.</p>
<p>Rather, I’d prefer Nintendo to go another route, and actually release a <strong>Switch 2</strong>, and be something comparable to a PlayStation 4 Pro or an Xbox One. This would make them leave the <strong>overly engineered home console market</strong> and dive deep into the <strong>affordable hybrids</strong> market such as the Steam Deck and Asus ROG Ally. I wouldn’t ask for more. The fact that they plan to flood the market with the gaming system in order to fight with scalpers makes me think a little bit that they could be taking this strategy, but as I discussed in <a href="../03/switch2-2025">a previous post</a>, there are several reasons that make me think otherwise…</p>
<center> <div style="width:400px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F08%2Fgames-aaa-stagnation%2Fmy_tweet.png&amp;w=400&amp;h=165&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="400" height="165" alt="A post I made on X about the current situation of gaming" style="width:100%;height:auto" loading="lazy" decoding="async"> This second half of the year and the first quarter of 2025 are by far going to be of upmost importance in the gaming industry ever since the beginning of the HD era! </div> </center>]]></content>
    </entry>
        <entry>
            <title>Inked thoughts: The Tower of Scope</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2024/08/comic-tower-scope</id>
            <link href="https://www.yonic.blog/blog/article/2024/08/comic-tower-scope" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2024/08/comic-tower-scope" />
            <summary><![CDATA[ Games were easier to make in the past. ]]></summary>
            <published>2024-08-23T15:58:03.761Z</published>
            <updated>2024-08-23T15:58:03.761Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F08%2Fcomic-tower-scope%2Fhero.png&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><div class="feed-preview"><a href="https://yonic.blog/file/img/blog/art/comics/inked-thoughts/tower-scope.png" target="_blank" rel="noreferrer">Click here for full image</a><center> <div style="width:400px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2Fart%2Fcomics%2Finked-thoughts%2Ftower-scope.png&amp;w=400&amp;h=1120&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="400" height="1120" alt="Comic page" style="width:100%;height:auto" loading="lazy" decoding="async"> My game projects are all located at 100 parsecs away. </div> </center></div>]]></content>
    </entry>
        <entry>
            <title>The rise and fall of web profile customization</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2024/08/web-profile-customization</id>
            <link href="https://www.yonic.blog/blog/article/2024/08/web-profile-customization" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2024/08/web-profile-customization" />
            <summary><![CDATA[ Before the 2010s, you were able to customize your profile pages however you pleased. Not anymore. ]]></summary>
            <published>2024-08-15T08:40:09.129Z</published>
            <updated>2024-08-15T08:40:09.129Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F08%2Fweb-profile-customization%2Fhero.png&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><div class="feed-preview"><p>If you were to browse the Internet in its early days, you will encounter it <em>very</em> different from what it is today. Several websites would offer the possibility to customize parts of your own profile, allowing you to express yourself in the way you wanted and be creative in your personal web space.</p><p>But that is now a shadow of the past: Standardization and a “more corporate look” are seemingly now the norm. But why is this? I will explain it in depth in this post.</p></div>
<p>In short, there are several reasons why the Internet began its transition to what it is now, and despite what many people may think, the big player is not actually because of “corporate greed”.</p>
<h2 id="how-customization-is-achieved-in-the-first-place">How customization is achieved in the first place</h2>
<p class="astro-gicio36m"> <a href="/player/kirby/64/pop-star" target="_blank" class="astro-gicio36m">Music: Pop Star</a> <i class="astro-gicio36m">(Kirby 64 | Jun Ishikawa)</i></p>  
<p>Before we can begin outlining the reasons, we need to understand how making the look of a webpage is achieved in the first place.</p>
<p>Back when the World Wide Web started taking its first steps, we already had one of its corner stones already settled: HTML, a markup language that allowed your browser to display content from the web in a rather standardized way. This allowed you to create simple layouts for your pages, and a bit later, allowed you to make certain customizations such as changing the text color or the background images.</p>
<p>Customization would evolve to the next level with the introduction of CSS, which allowed to further customize HTML elements, their layout, and eventually, even make custom cursors and animations.</p>
<p>But these would remain static pages with no changes whatsoever, unless you used PHP or something similar to generate personalized HTML on demand, and even still, it wouldn’t be interactive apart from links to other pages. But during the 2000s, JavaScript eventually came into play to provide interactivity to websites by modifying the HTML and CSS of a page.</p>
<div><p>&lt;Yonic&gt;</p><p>The conjunction of all of these technologies was given the name of <strong>Dynamic HTML (DHTML)</strong>, and it was somewhat feared by novice developers because in the early days browsers had their own ways of implementing JavaScript and CSS.</p><p>Nowadays websites are pretty much expected to have HTML, CSS and JavaScript, and all of these have become standardized for the most part, so the DHTML term has fallen out of use.</p><p>&lt;/Yonic&gt;</p></div>
 
<p>By adding the possibility to add your own HTML, CSS and JavaScript, you could essentially change the style and outlook of the page, especially with the latter two.</p>
<h2 id="custom-scripting-is-dangerous">Custom scripting is dangerous</h2>
<p>Very early on, one of the first restrictions that were put in place when adding customization capabilities is the <strong>automatic removal of <code>&lt;script&gt;</code> HTML tags</strong>. These tags are the main way for you to place JavaScript code on a page —and depending on the point in time, you could use some other scripting languages too— in your page.</p>
<p>There’s a whole plethora of vulnerabilities that revolve around tricking the servers into injecting your own code, because any opportunity of doing this opens floodgates for malicious code to be run. When you can just outright add your own scripts because the tag is not filtered out, there’s nothing stopping you from putting in malicious code to do some treachery on your visitors, so it’s like having no floodgates at all.</p>
<p>At first, MySpace didn’t have this restriction when they accidentally added the ability for you to add your custom HTML. While most pages would be really creatively put together, some of them could be crafted with harmful code to say, install a virus or <a href="https://www.youtube.com/watch?v=SJFe9AxFR3k">wreck havoc on your screen</a>.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F08%2Fweb-profile-customization%2Fneopets_site.png&amp;w=700&amp;h=442&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="442" alt="Custom HTML in Neopets" style="width:100%;height:auto" loading="lazy" decoding="async"> Websites like Neopets quickly started filtering out potentially malicious HTML, mainly <code>&lt;script&gt;</code> tags. </div> </center>
<p>Thankfully CSS was able to give you some slack, because you could add some “interactivity” with <strong>pseudo-classes such as <code>:hover</code> and <code>:active</code></strong>, so you didn’t need JavaScript to make interactive UI. In fact, The Yonic Corner remains somewhat interactive even with JavaScript disabled.</p>
<h2 id="the-rise-of-responsive-layouts">The rise of responsive layouts</h2>
<p>The main limitation that HTML had in its starting days was the fact that it was <strong>very rigid</strong>. It would look the same no matter how the size of the browser window was. This created a problem in which content would spill over the window if it was small enough, requiring you to scroll the window. This was okay for vertical scrolling, but horizontal scrolling was more obnoxious.</p>
<p>At first, it wasn’t much of a problem because the web was mostly browsed from a computer screen, and they had roughly the same size, aspect ratio and pixel density, so screen resolutions were mostly the same. However, it was still relevant enough that some websites would display messages like “looks best on a 1024 x 768 resolution”.</p>
<p>It became a more notorious problem once phones became capable of browsing the web, and especially with the rise of smartphones, since they would have way more different aspect ratios, display sizes and eventually even pixel densities.</p>
<div><p><b>Yonic:</b> Thank you, Apple. Your Retina display started all this.</p></div>
 
<p>This led to the creation of solutions to create <strong>responsive layouts</strong>. CSS first started with <code>@media</code> queries that allowed different layouts depending on the screen size. Later on, intrinsically flexible layouts would become much easier and way better to make with CSS’s flexbox and grids, among other things, which would become quintessential to make layouts that could work at any resolution.</p>
<p>However, because these CSS features are a late addition, this is not the default behavior of HTML. This was done in order to maintain backwards compatibility with older websites. If the user who wanted to customize something was not aware of the responsive layouts, whatever layout they would create would most likely be not flexible by default, so if one were to add their own HTML and CSS, they could very easily be set in a way that would either conflict with, or completely break the already set up layout.</p>
<p>This caused websites to begin following a “mobile-first” approach to their design, one that would be friendly to smartphones at first, and then gracefully change the layout as the viewport of the browser got wider. Standardizing the layout severely limited the way one could add, move, replace and remove HTML elements.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F08%2Fweb-profile-customization%2Fyoutube_2010.png&amp;w=700&amp;h=679&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=90&amp;output=jpg" width="700" height="679" alt="YouTube in 2010" style="width:100%;height:auto" loading="lazy" decoding="async"> YouTube channels in the late 2000s could still be customized, but only certain stuff could, such as the background base color and images and the position of certain sections, but you couldn’t add your own stuff in. And even this particular layout was not responsive! </div> </center>
<h2 id="scalability-issues">Scalability issues</h2>
<p>Although this was a smaller issue, it’s still relevant to this day. All of these customizations had to be stored somewhere and loaded in apart from the core website’s design. Depending on the infrastructure, this could make pages prone to undesirable effects such as flashes of unstyled content, <span style="background:white;font-family:serif;color:black;">where layouts will break, everything is on a white background and the text is black with an ugly serif font.</span></p>
<p>Images were also a big problem. They usually were hosted on an image hosting service such as ImageShack and were usually left unprocessed. If they were large, they could severely affect the bandwidth and cause loading issues. Also, most image hosting services would remove the images if not accessed after some time, leading to broken images if they were not used a lot.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F08%2Fweb-profile-customization%2Ftinypic.png&amp;w=700&amp;h=427&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="427" alt="Images hosted on TinyPic were removed" style="width:100%;height:auto" loading="lazy" decoding="async"> Some image hosting sites would infamously show a generic placeholder image for those images that have been automatically removed. </div> </center>
<p>Nowadays images are preprocessed to modern, more lightweight formats and optimized, and cached so that the load isn’t as heavy. While this in itself makes no limitations on what kind of images can you use, they do have their own shortcomings that limit the number of how many images can you upload.</p>
<h2 id="the-rise-of-web-apps">The rise of web apps</h2>
<p class="astro-gicio36m"> <a href="/player/gt4/gt-mode-2" target="_blank" class="astro-gicio36m">Music: GT Mode 2</a> <i class="astro-gicio36m">(Gran Turismo 4 | Isamu Ohira)</i></p>  
<p>Since Flash and HTML5, websites have become way more interactive than ever, and with that, browsers have become the second most versatile pieces of software apart from a full fledged operating system.</p>
<p>This has given browsers the potential to run websites as if they were real applications, which developers found <em>very</em> attractive thanks to the fact that websites could be displayed anywhere, regardless of the operating system or device you were using.</p>
<p>The culmination of such process became true with the rollout of Progressive Web Apps, which allowed websites to behave much like a native application on your PC or phone. You could also throw in UI frameworks for highly interactive user interfaces that would make your website come close to the performance of a native app.</p>
<p>But this clashed with customization in two ways:</p>
<ul>
<li>If you added custom HTML and CSS, it would most likely be unable to interact with whatever reactive components you had with your UI framework unless the web developer added a functionality for that, <strong>which comes at the hefty cost of being way less secure.</strong></li>
<li>Apps generally have a UI that is mostly consistent with a design idea and tries to provide a good user experience; allowing for custom CSS to change this could alter these in a harmful way.</li>
</ul>
<p>It also didn’t help that at this time accessibility guidelines were starting to be set in place, which discouraged taking certain “creative approaches”.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F08%2Fweb-profile-customization%2Fblissos.png&amp;w=700&amp;h=355&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="355" alt="BLISS OS blog screenshot" style="width:100%;height:auto" loading="lazy" decoding="async"> Sure, this site screams “pink kawaii glitter” which I found a bit endearing, but this is also accessibility hell. Even a non-colorblind person such as myself can struggle to make out the sidebar. </div> </center>
<p>CSS libraries would also begin showing up, first with Bootstrap, and later on with Tailwind CSS, that helped making websites look and act like apps, albeit with the cost of having to remain somewhat consistent.</p>
<h2 id="addressing-the-ads-problem">Addressing the ads problem</h2>
<p>Lastly, let’s discuss the elephant in the room: Why do people say that advertisers prefer a more “corporate” looking website?</p>
<p>One of the common remarks is that having a set layout allows advertisers to get a good idea where their ads will go, how much space will it take, etc. And yes, that is a valid point. One can easily hide away them with CSS or disable altogether with JavaScript, like this:</p>
<div class="code-block astro-jgrc2lfe" data-button-label="Copy code"> <span class="filename astro-jgrc2lfe"> <img width="16" height="16" alt="css" src="/img/icons/filetypes/file_type_css.svg" class="icon astro-jgrc2lfe"> adRemoval.css </span> <div class="astro-jgrc2lfe"> <pre class="astro-code min-light astro-jgrc2lfe" style="background-color:#ffffff;color:#24292eff; overflow-x: auto;" tabindex="0" data-language="css"><code><span class="line"><span style="color:#6F42C1">.ad</span><span style="color:#24292EFF"> {</span></span>
<span class="line"><span style="color:#1976D2">    display</span><span style="color:#D32F2F">:</span><span style="color:#1976D2"> none</span><span style="color:#24292EFF">;</span></span>
<span class="line"><span style="color:#1976D2">    visibility</span><span style="color:#D32F2F">:</span><span style="color:#1976D2"> hidden</span><span style="color:#24292EFF">; </span><span style="color:#C2C3C5">/* A bit overkill. */</span></span>
<span class="line"><span style="color:#24292EFF">}</span></span></code></pre> </div> </div> <div class="code-block dark astro-jgrc2lfe" data-button-label="Copy code"> <span class="filename astro-jgrc2lfe"> <img width="16" height="16" alt="css" src="/img/icons/filetypes/file_type_css.svg" class="icon astro-jgrc2lfe"> adRemoval.css </span> <div class="astro-jgrc2lfe"> <pre class="astro-code poimandres astro-jgrc2lfe" style="background-color:#1b1e28;color:#a6accd; overflow-x: auto;" tabindex="0" data-language="css"><code><span class="line"><span style="color:#E4F0FBD0;font-style:italic">.</span><span style="color:#5FB3A1;font-style:italic">ad</span><span style="color:#A6ACCD"> {</span></span>
<span class="line"><span style="color:#ADD7FF">    display</span><span style="color:#A6ACCD">: </span><span style="color:#ADD7FF">none</span><span style="color:#A6ACCD">;</span></span>
<span class="line"><span style="color:#ADD7FF">    visibility</span><span style="color:#A6ACCD">: </span><span style="color:#ADD7FF">hidden</span><span style="color:#A6ACCD">; </span><span style="color:#767C9DB0;font-style:italic">/* A bit overkill. */</span></span>
<span class="line"><span style="color:#A6ACCD">}</span></span></code></pre> </div> </div> <div class="code-block legacy astro-jgrc2lfe" data-button-label="Copy code"> <span class="filename astro-jgrc2lfe"> <img width="16" height="16" alt="css" src="/img/icons/filetypes/file_type_css.svg" class="icon astro-jgrc2lfe"> adRemoval.css </span> <div class="astro-jgrc2lfe"> <pre class="astro-code min-dark astro-jgrc2lfe" style="background-color:#1f1f1f;color:#b392f0; overflow-x: auto;" tabindex="0" data-language="css"><code><span class="line"><span style="color:#B392F0">.ad {</span></span>
<span class="line"><span style="color:#79B8FF">    display</span><span style="color:#F97583">:</span><span style="color:#79B8FF"> none</span><span style="color:#B392F0">;</span></span>
<span class="line"><span style="color:#79B8FF">    visibility</span><span style="color:#F97583">:</span><span style="color:#79B8FF"> hidden</span><span style="color:#B392F0">; </span><span style="color:#6B737C">/* A bit overkill. */</span></span>
<span class="line"><span style="color:#B392F0">}</span></span></code></pre> </div> </div>  
<div class="code-block astro-jgrc2lfe" data-button-label="Copy code"> <span class="filename astro-jgrc2lfe"> <img width="16" height="16" alt="js" src="/img/icons/filetypes/file_type_light_js.svg" class="icon astro-jgrc2lfe"> adDisabling.js </span> <div class="astro-jgrc2lfe"> <pre class="astro-code min-light astro-jgrc2lfe" style="background-color:#ffffff;color:#24292eff; overflow-x: auto;" tabindex="0" data-language="js"><code><span class="line"><span style="color:#D32F2F">const</span><span style="color:#1976D2"> ads</span><span style="color:#D32F2F"> =</span><span style="color:#24292EFF"> [</span><span style="color:#D32F2F">...</span><span style="color:#1976D2">document</span><span style="color:#6F42C1">.querySelectorAll</span><span style="color:#24292EFF">(</span><span style="color:#22863A">'.ad'</span><span style="color:#24292EFF">)];</span></span>
<span class="line"><span style="color:#D32F2F">for</span><span style="color:#24292EFF">(</span><span style="color:#D32F2F">const</span><span style="color:#1976D2"> ad</span><span style="color:#D32F2F"> of</span><span style="color:#24292EFF"> ads) {</span></span>
<span class="line"><span style="color:#1976D2">    ad</span><span style="color:#6F42C1">.remove</span><span style="color:#24292EFF">();</span></span>
<span class="line"><span style="color:#24292EFF">}</span></span></code></pre> </div> </div> <div class="code-block dark astro-jgrc2lfe" data-button-label="Copy code"> <span class="filename astro-jgrc2lfe"> <img width="16" height="16" alt="js" src="/img/icons/filetypes/file_type_light_js.svg" class="icon astro-jgrc2lfe"> adDisabling.js </span> <div class="astro-jgrc2lfe"> <pre class="astro-code poimandres astro-jgrc2lfe" style="background-color:#1b1e28;color:#a6accd; overflow-x: auto;" tabindex="0" data-language="js"><code><span class="line"><span style="color:#91B4D5">const</span><span style="color:#E4F0FB"> ads</span><span style="color:#91B4D5"> =</span><span style="color:#A6ACCD"> [</span><span style="color:#91B4D5">...</span><span style="color:#E4F0FB">document</span><span style="color:#A6ACCD">.</span><span style="color:#E4F0FBD0">querySelectorAll</span><span style="color:#A6ACCD">(</span><span style="color:#A6ACCD">'</span><span style="color:#5DE4C7">.ad</span><span style="color:#A6ACCD">'</span><span style="color:#A6ACCD">)];</span></span>
<span class="line"><span style="color:#A6ACCD">for(</span><span style="color:#91B4D5">const</span><span style="color:#E4F0FB"> ad</span><span style="color:#91B4D5"> of</span><span style="color:#E4F0FB"> ads</span><span style="color:#A6ACCD">) {</span></span>
<span class="line"><span style="color:#E4F0FB">    ad</span><span style="color:#A6ACCD">.</span><span style="color:#E4F0FBD0">remove</span><span style="color:#A6ACCD">();</span></span>
<span class="line"><span style="color:#A6ACCD">}</span></span></code></pre> </div> </div> <div class="code-block legacy astro-jgrc2lfe" data-button-label="Copy code"> <span class="filename astro-jgrc2lfe"> <img width="16" height="16" alt="js" src="/img/icons/filetypes/file_type_light_js.svg" class="icon astro-jgrc2lfe"> adDisabling.js </span> <div class="astro-jgrc2lfe"> <pre class="astro-code min-dark astro-jgrc2lfe" style="background-color:#1f1f1f;color:#b392f0; overflow-x: auto;" tabindex="0" data-language="js"><code><span class="line"><span style="color:#F97583">const</span><span style="color:#79B8FF"> ads</span><span style="color:#F97583"> =</span><span style="color:#B392F0"> [</span><span style="color:#F97583">...</span><span style="color:#79B8FF">document</span><span style="color:#B392F0">.querySelectorAll(</span><span style="color:#FFAB70">'.ad'</span><span style="color:#B392F0">)];</span></span>
<span class="line"><span style="color:#F97583">for</span><span style="color:#B392F0">(</span><span style="color:#F97583">const</span><span style="color:#79B8FF"> ad</span><span style="color:#F97583"> of</span><span style="color:#B392F0"> ads) {</span></span>
<span class="line"><span style="color:#79B8FF">    ad</span><span style="color:#B392F0">.remove();</span></span>
<span class="line"><span style="color:#B392F0">}</span></span></code></pre> </div> </div>  
<div><p><b>Yonic:</b> This is basically what ad blockers do, by the way!</p></div>
 
<p>This is the most straightforward way, although there are more creative ways to hide them. But alas, this isn’t the main reason. <strong>There is no such thing about websites becoming more “corporate”.</strong> It’s a bit of a misnomer.</p>
<p>What’s actually happening is <strong>standardization of a design language</strong>. Now we treat parts of a page with common lingo such as “hero”, “call to action”, “statistics” or “feature”. Now it’s all about <strong>consistency</strong>, which is something that’s typical from an application: You want its features and user interface to behave in a consistent manner.</p>
<p>On July 2024, of the top 25 most visited sites (source: <a href="https://www.similarweb.com/top-websites/">Similarweb</a>), 15 of them are web apps. This goes to show how important consistency has become in the past few years. Google’s search engine also tends to favor sites with a consistent semantic design (the HTML has all of that lingo mentioned above), so everyone tends to follow very similar design patterns because of search engine optimization (SEO).</p>
<p>But that doesn’t mean you can still be artsy! However, it’s a fact that your SEO will get harmed this way because these designs tend to be more “niche” and “out of the norm”.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F08%2Fweb-profile-customization%2Fbreak-away.webp&amp;w=700&amp;h=450&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="450" alt="Redesign of a website done by a student" style="width:100%;height:auto" loading="lazy" decoding="async"> Several modern websites break away from the “corporate aesthetic” by not going with the standards. Some look really original, even if it sacrifices legibility. </div> </center>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F08%2Fweb-profile-customization%2Fzara.png&amp;w=700&amp;h=352&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="352" alt="Zara's new website" style="width:100%;height:auto" loading="lazy" decoding="async"> In a more recent example on the other hand, some who try to be more “avant garde” can end up with horrible results. What were they thinking here!? It’s almost as if we’ve forgotten how to do things out of the norm. </div> </center>
<p>But if there’s one thing that’s become obvious is that we’re far from that moment where the Web was still figuring itself out. Companies would do their best to fit their branding on the web, while there was still room for customization. As Internet became a new way to do commerce, <strong>consistency became more important than the flexibility of customization</strong>, and since they go hand in hand, <strong>the overall branding favored over the individual expression</strong>.</p>
<p>I can understand how these phenomena can be confused with “corporate greed”. But in an objective sense, I do think the pros of lack of customization outweigh the cons, especially in times where new web features come and go really quickly. While people tend to follow standards even if you do provide customization, not everyone does, and those intrusive designs can hinder your experience on a website.</p>
<p>And yes, I also understand that this also hampers freedom of self-expression. <strong>Tumblr was probably the best example of all time in terms of web customization</strong>: Restricted yet flexible enough to do almost whatever you wanted. But I’m a hard advocate that freedom of expression should end where the freedom of someone else begins, something that the current Internet doesn’t seem to understand. <strong>Be mindful of what you’re making!</strong></p>
<p>But nevertheless, I still wish for customization to make somewhat of a graceful return. It’s cool that graphic and web designers can have their own way of self-expression for their portfolios and all, but I also would love to see the resurging of being able to do it in a more casual basis.</p>]]></content>
    </entry>
        <entry>
            <title>The Yonic Corner is now self-hosted</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2024/08/self-hosted-blog</id>
            <link href="https://www.yonic.blog/blog/article/2024/08/self-hosted-blog" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2024/08/self-hosted-blog" />
            <summary><![CDATA[ Away from the cloud we go! ]]></summary>
            <published>2024-08-07T11:11:36.703Z</published>
            <updated>2024-08-07T11:11:36.703Z</updated>
            <content type="xhtml"><![CDATA[<p class="astro-gicio36m"> <a href="/player/paper-mario-ttyd/chara" target="_blank" class="astro-gicio36m">Music: Teaching new stuff!</a> <i class="astro-gicio36m">(Paper Mario: The Thousand-Year Door)</i></p>  
<div class="feed-preview"><p>Previously, The Yonic Corner was being hosted on Netlify —and Github Pages in the case of the Legacy version. It used to be pretty convenient to write content and deploy it there, but as I was approaching certain limitations, I decided to make the switch back to a self-hosted environment.</p><p>The performance of the blog might not be on par with when it was on the cloud, but I’ll be working on optimizing it little by little.</p></div>
<h2 id="running-out-of-space">Running out of space</h2>
<div><p><b>Yonic:</b> Lately I’ve just been worried about running out of space altogether on any digital storage I own, honestly…</p></div>
 
<p>The main problem that I had was that GitHub Pages has a hard limit of 1 GB in storage. For most small scoped sites, this shouldn’t be much of a problem. But in my case, it was my personal blog, and while text is pretty easy to compress and make thousands of pages without even coming close to that limit, <strong>media could potentially do that</strong>.</p>
<p>Especially if we’re dealing with optimized responsive images! Most images in the modern version of my site come in multiple sizes for PC and mobile screens, and multiple formats for backwards compatibility. Add that to the fact that Astro keeps a copy of the original image, and it’s a recipe for a bloated image cache, some of which wouldn’t be used at all.</p>
<p>An image CDN could work marvels for this situation, but I was a bit skeptical on those to work well, especially because of the reason below.</p>
<h2 id="watch-out-for-https">Watch out for HTTPS!</h2>
<p>In a previous post, <a href="/blog/article/2024/02/legacy-death">I talked about how pages have begun breaking because HTTPS support for legacy systems is being dropped</a>. I’m expecting that GitHub Pages may be doing the same thing in the near future should they begin enforcing mandatory HTTPS on all their pages. <strong>This would render the Legacy Version of this blog useless</strong>. It was designed with old operating systems in mind, after all!</p>
<p>And this also applies to what I was talking about before: Normally I would be okay with just using an image CDN, but all of these networks work under HTTPS in a way that only modern systems can understand.</p>
<p>This has eventually forced my hand: I needed to self-host my own blog. That way, I’d have full control over what I want to do. I could even set up a cipher suite specifically for the legacy blog, so you could browse the legacy blog in HTTPS while in an old system!</p>
<div><p>&lt;Yonic&gt;</p><p>But is HTTPS really that necessary here? This blog is nothing but a static site. You’re not really sending anything to the server other than plain GET requests, and the contents of this site aren’t the slightest sensitive nor illegal.</p><p>If privacy is of concern, you could just set up a Tor network connection and be done with it. But again: Static pages can’t even use cookies nor session tokens, at least not directly; if the request doesn’t come with anything regarding authentication you won’t be able to learn that much about your readers anyway.</p><p>&lt;/Yonic&gt;</p></div>
 
<p>The blog also works as a reverse proxy server to another program that optimizes and caches images on demand, so I can show the images regardless of whether you’re using regular HTTP or HTTPS. Plus, I can shove in a storage bucket to have virtually limitless —and cheap— storage space for my blog.</p>
<p>However, this is not without its drawbacks. Since I’m hosting it myself, all maintenance tasks are on me as well. I still have work to be done to optimize the server, to automatize updating the blog, and to tidy up the API for remote images, which is a total mess right now, let alone a rudimentary solution. So until then, do expect some slowdowns!</p>]]></content>
    </entry>
        <entry>
            <title>What does the Moon look like at the equator?</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2024/07/moon-shapes</id>
            <link href="https://www.yonic.blog/blog/article/2024/07/moon-shapes" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2024/07/moon-shapes" />
            <summary><![CDATA[ The Moon looks upside down in the southern hemisphere compared to the northern one. But what about the equator? ]]></summary>
            <published>2024-07-14T16:55:08.130Z</published>
            <updated>2024-07-14T16:55:08.130Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F07%2Fmoon-shapes%2Fhero.png&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><p class="astro-gicio36m"> <a href="/player/space-engine/moon" target="_blank" class="astro-gicio36m">Music: The Moon</a> <i class="astro-gicio36m">(Space Engine | Ashterra)</i></p>  
<div class="feed-preview"><p>If you’ve seen books about astronomy, you may have come with a passage similar to this: The Moon looks upside down in the southern hemisphere compared to the northern one. But what about the equator? Clearly there must be something in between if it’s in the middle of the two hemispheres, right?</p></div>
<p>But if you search for this question on the Internet, you won’t find much detailed information about it. So I decided to provide a detailed explanation as to what it looks like and why.</p>
<div><p><b>Yonic:</b> Just a disclaimer: I don’t want to run into hot debates about the shape of the Earth, so I’ll just say that this takes into consideration the nearly universally accepted round model in which the Earth is a sphere.</p></div>
 
<p>To lay the groundwork, many people are aware of the <strong>phases of the Moon</strong>, which are caused by how the half of the Moon lit by the Sun changes as it orbits the Earth. If one were in space above the orbital plane of the Earth while its northern hemisphere faces up, <strong>the Moon would look as if it were to be orbiting the Earth in a counter-clockwise motion</strong>.</p>
<p>Because of this, the <em>waxing crescent</em> and its following quarter (the 1st), in the northern hemisphere will look like the letter D, while in the southern hemisphere it will look like a letter C. If the orbit were to be clockwise, it would be the other way around.</p>
<p>In Spanish there is a really interesting mnemonic for this:</p>
<ul>
<li>In the northern hemisphere, the Moon is a liar. This is because the 1st quarter is called <strong>cuarto <u>c</u>reciente</strong> (quarter increasing in size to full moon), but it will have a D shape. When it has a C shape, it’s called <strong>cuarto <u>d</u>ecreciente</strong> (quarter decreasing in size to new moon).</li>
<li>In the southern hemisphere, the Moon always tells the truth, because an upside down <strong>cuarto <u>c</u>reciente</strong> looks like a C, and an upside down <strong>cuarto <u>d</u>ecreciente</strong> looks like a D.</li>
</ul>
<p>Since the Moon is just rotating 180° when we change hemispheres, it’s safe to assume that in the equator it’d make a 90° turn, right?</p>
<p>But that rises the question: <strong>Which way?</strong> It could be a clockwise rotation, in which case a waxing crescent would look like a smile; or a counter-clockwise one, where it would look like a frown. So which one is it?</p>
<div><p><b>Yonic:</b> The short answer is… <em><strong>Both!</strong></em> It depends on <em>when</em> you’re looking at the waxing crescent Moon while it moves across the sky. At moonrise, it looks like a frown. At moonset, it looks like a smile.</p></div>
 
<p>The long answer doesn’t require understanding orbital dynamics or any other kind of complicated physics: <strong>It’s just geometry</strong>.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F07%2Fmoon-shapes%2Fmoonrise.png&amp;w=700&amp;h=394&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=png" width="700" height="394" alt="Moonrise and moonset with waxing crescent" style="width:100%;height:auto" loading="lazy" decoding="async"> One of the key facts is that no matter where you’re at along the equator line, the Moon will always rise and set in nearly the same opposing orientations. </div> </center>
<p>Why? Because <strong>the Earth rotates counter-clockwise</strong> around a stable axis, from west to east. The axis <em>does</em> drift, but this motion is so slow and tiny that it doesn’t have much of an effect in our day to day lives —it’d take hundreds to thousands of years for it to have made a significant change.</p>
<p>From Earth, we see objects in the sky rising from the east and setting at the west, making a clockwise motion as they scour it. The reason the direction of movement is the opposite is because when moving alongside the Earth’s surface, from our perspective the surface remains static, while the sky moves. A bit like when riding a car, bus or train and the background outside the vehicle seems to be moving backward, while it’s the vehicle that moves forward.</p>
<p>If one were to be constantly looking at the Moon from the equator as it moved towards the sky (for clearance’s sake, let’s call this Earth observer), at one point it’d make a sharp 180° turn once it passes above the Earth observer’s head. This is because from someone outside the Earth’s perspective (let’s call them the space observer), the Earth observer would’ve flown past the Moon, and unless they’d have impressive limbo skills, the Earth observer would have to turn around to continue seeing the moon, flipping the picture as a result.</p>
<center> <div style="width:700px"> <img src="http://yonic-corner.vulpes.life/static/img/moon-shapes/moon-track-opt.gif" width="700" height="391" alt="Moonrise and moonset with waxing crescent" style="width:100%;height:auto" loading="lazy" decoding="async"> A visualization of how the Moon sharply turns as it goes above the Earth observer’s head, in this case a Yoshi. The Moon is never turning around, <strong>Yoshi does</strong>. The red and blue arms represent the North and South directions from Yoshi’s perspective, respectively. (The apparent libration is due to the diagram not being at scale) </div> </center>
<p>This effect remains visible in places away from the equator, but it’s more of a gradual change and not a very sharp turn. This is because at the equator, the Moon will pass by really close to the zenith —the point in the sky directly above an Earth observer’s head— but as you go closer to one of the Earth’s poles, the Moon won’t reach as high in the sky since you’d be looking at it at an angle and not directly perpendicular to the ground, and it will go past your head at a slower pace.</p>
<div><p><b>Yonic:</b> Plus, the Moon will drift slightly towards the north or south, depending on the latitude and the phase it’s currently at. Calculating how far did the Moon and Sun rise from the horizon at a given time of the year is how people used to figure out the latitude they were at before GPS was a thing!</p></div>
 
<p>Add the fact that near the poles the axis of rotation of the Earth will get closer to the zenith, so things closer to the horizon will hardly experience any rotation; and you get an explanation of why the Moon hardly rotates as you move further away from the equator.</p>
<p>But as I was researching this, another question surfaced my mind: <strong>How does the Moon rotate as you get closer to the equator?</strong> If one were to look at the orientations of the Moon from different latitudes, one would assume that it’d be rotating counter clockwise as the latitude decreases, and clockwise as it increases. <strong>But this is not completely correct.</strong></p>
<p>The actual answer is a bit more complicated. Essentially, when we move strictly south or north, the entire celestial sphere will rotate in the East-West axis. Looking directly eastward, the sky will appear to rotate counter-clockwise, and clockwise if you look to the west. But <strong>the cardinal directions are points on the Earth’s surface, not the sky</strong>. This means that as the Earth rotates, the cardinal directions will remain in the same place, while anything in the celestial sphere —like the Moon— will move from east to west. When the Moon is close to the East, it will rotate counter-clockwise as latitude decreases, and clockwise as it increases, as stated above. <strong>But if it’s on the West, this motion is flipped</strong>.</p>
<p>If you were to change your latitude and eventually cross one of the poles, your longitude would rotate 180°, switching the opposing cardinal directions. Once you cross the pole you can further increase or decrease your latitude and move the sky in the same axis of rotation, but what was on the west is now on the east, essentially flipping the way they rotate.</p>
<p>All of this “it’s the opposite, actually” being repeated over and over again might confuse you quite a bit, so I recommend simulating how the Moon changes in <a href="http://stellarium.org/">Stellarium</a> whilst changing the latitude. But ultimately, all of these motion dynamics work in unison so that no matter where in the equator and at which day of the year you look at, <strong>the waxing crescent moon looks like a frown at moonrise, and a smile at moonset</strong>, and the opposite when it’s a waning crescent.</p>]]></content>
    </entry>
        <entry>
            <title>Overly analyzing Metroid Prime 4's reveal trailer</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2024/07/metroid-prime-4-trailer-analysis</id>
            <link href="https://www.yonic.blog/blog/article/2024/07/metroid-prime-4-trailer-analysis" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2024/07/metroid-prime-4-trailer-analysis" />
            <summary><![CDATA[ Metroid Prime 4 has managed to stay in the game. ]]></summary>
            <published>2024-07-01T18:25:44.348Z</published>
            <updated>2024-07-01T18:25:44.348Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F07%2Fmetroid-prime-4-trailer-analysis%2Fhero.png&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><p class="astro-gicio36m"> <a href="/player/metroid-prime/tallon-overworld" target="_blank" class="astro-gicio36m">Music: Tallon Overworld</a> <i class="astro-gicio36m">(Metroid Prime | Kenji Yamamoto)</i></p>  
<div class="feed-preview"><p>Against my predictions, <em>Metroid Prime 4: Beyond</em> was officially announced at the June 2024’s Nintendo Direct, and is slated to be released sometime in 2025.</p><p>While in my head I promised myself not to spoil myself by watching further trailers for this game, I also took the chance to scrutinize the reveal trailer and speculate over the details of both this game and the successor of the Nintendo Switch.</p></div>
<h2 id="revealed-at-the-very-last-possible-moment">Revealed at the very last possible moment</h2>
<p>After the October 2023’s Nintendo Direct, I predicted a 30% chance that <em>Metroid Prime 4</em> would be revealed in June of 2024 with a “2025” release date, and a 10% for “late 2025” release date. The remaining 60% had a more pessimistic outcome: <strong>That the game would have been benched</strong> much like <em>Metroid Dread</em> did in the past.</p>
<p>This is because I predicted that <a href="../03/switch2-2025/">we would’ve heard news of the new console sometime in 2025</a>, which, as it’s been revealed that it will be formally announced sometime in this fiscal year spanning until March 2025, <strong>has all the odds in favor to be spot on</strong>. If this game were to be released for the Nintendo Switch, <strong>the June 2024 Direct was the last possible time</strong> for it to be announced before the successor’s announcement.</p>
<center> <div style="width:400px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F07%2Fmetroid-prime-4-trailer-analysis%2Fnintendo-tweet.png&amp;w=400&amp;h=376&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="400" height="376" alt="Official Nintendo tweet about the successor" style="width:100%;height:auto" loading="lazy" decoding="async"> Screenshot of the announcement of the Switch’s successor. </div> </center>
<p>Some people consider that <em>Metroid Prime 4</em> being revealed this late implies an imminent announcement regarding Nintendo’s new console, but I still firmly believe we’ll learn its name somewhere within this autumn or winter.</p>
<p>The Nintendo Switch was officially revealed in October 2016, and formally presented in January of the following year, and now that they are fully unshackled from the schedules of events like E3, it does seem likely that the Big N could follow this pattern for this console as well.</p>
<h2 id="things-that-ive-noticed">Things that I’ve noticed</h2>
<p class="astro-gicio36m"> <a href="/player/metroid-prime-2/space-pirates-ambience" target="_blank" class="astro-gicio36m">Music: Space Pirates Ambience</a> <i class="astro-gicio36m">(Metroid Prime 2: Echoes | Kenji Yamamoto)</i></p>  
<p>It seems that one of the most prominent features of <em>Metroid Prime 4: Beyond</em> will be the reintroduction of <strong>parallel worlds</strong>, but unlike their appearance in <em>Metroid Prime 2: Echoes</em> where there was a light and a dark version of the same world, it seems like these are <strong>completely distinct worlds, connected by portals</strong>, or far more likely, <strong>versions of the same world across different points in time</strong>.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F07%2Fmetroid-prime-4-trailer-analysis%2Fblack-hole.png&amp;w=700&amp;h=660&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="660" alt="Hints of portals in Prime 4" style="width:100%;height:auto" loading="lazy" decoding="async"> This is heavily hinted at with the presence of what seems to be a portal vortex, and how the now official logo resembles a black hole. </div> </center>
<div><p><b>Yonic:</b> Funny… Having parallel worlds is the same concept we had for <em><a href="https://wiki.yonicstudios.com/wiki/Deep_Nebula:_Karine_Star">Karine Star</a></em>, the game we were planning on developing after my research project, a port of <em>Metroid Prime</em> for VR.</p></div>
 
<p>The producer of the <em>Prime</em> series, Kensuke Tanabe, <a href="https://www.eurogamer.net/next-proper-metroid-prime-would-likely-now-be-on-nx">has stated in an interview that time-shifting was an interesting idea in his mind</a> for a next installment, so it does seem like the setting of <em>Prime 4</em> will be a single planet, but with the ability to travel through time and potentially change things across the timelines. Many fans expect this to be the case.</p>
<p>Analyzing the HUD, I’ve noticed several improvements over the previous <em>Trilogy</em> games, and a few missing things.</p>
<ul>
<li>The map now has a compass feature that shows in which cardinal direction you’re facing.</li>
<li>The radar has been <strong>overhauled</strong> quite a lot. Now you have different types of markers: Red for enemies, green for allies, and orange for the target you’re locking on. It makes me think that you’ll encounter many people from the Federation on this game, much like <em>3: Corruption</em>.</li>
<li>There is also a hazard indicator like in <em>Prime 1</em> and <em>Echoes</em> but it’s now a metered indicator instead of a gauge.</li>
<li>The visor selector is missing, despite the fact that there are visors featured in the trailer. Instead, there is a selector with a missile launcher selected, so I assume it’s meant for auxiliary ammo. I wonder if this will be the same with the beams, or it will be a tiered beam like in <em>Corruption</em>. I’m willing to consider the latter.</li>
<li>There doesn’t seem to be any space for energy tanks in the HUD, at least none that I was able to see. There are Morph Ball bombs, though.</li>
</ul>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F07%2Fmetroid-prime-4-trailer-analysis%2Fshameless.png&amp;w=700&amp;h=366&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="366" alt="HUD in Prime 4" style="width:100%;height:auto" loading="lazy" decoding="async"> Also, despite clearly shown that Samus got hit here, her energy meter remains unchanged at 99, meaning the one who recorded this had an infinite health cheat code on. </div> </center>
<div><p><b>Yonic:</b> Shameless! You can’t just do that when presenting your game.</p></div>
 
<p>A surprising yet expected thing —or rather, person— is <strong>Sylux</strong>, making his first appearance in the mainline <em>Prime</em> series. I was expecting a <em>Metroid Prime: Hunters</em> remake to flesh the bounty hunters from that game a bit more, but I guess we’ll be going towards this route.</p>
<center> <div style="width:500px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F07%2Fmetroid-prime-4-trailer-analysis%2Fconfusing.png&amp;w=500&amp;h=445&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="500" height="445" alt="Someone's comments on Sylux" style="width:100%;height:auto" loading="lazy" decoding="async"> Some comments on how Sylux’s sudden appearance in a new title could make it unwelcoming towards newcomers. </div> </center>
<div><p><b>Yonic:</b> Not that it’s a fundamental problem in the story. Maybe Sylux was just meant to be a character always shrouded in mystery…</p></div>
 
<p>A few more things that are noteworthy include the extremely satisfyingly seamless transition between the Samus entrance cutscene and the gameplay —although the fanfare and the music seems to have gone a noticeable downgrade to be honest.</p>
<p><strong>The design of the Varia Suit is really beautiful</strong>. It’s pretty much the same design from <em>Prime 2: Echoes</em>, but they’ve obviously taken some pages out of <em>Metroid Dread</em>’s design book, as her shoulder pads are noticeably smaller and lie at a slightly lower height. It also looks much leaner and more humanistic. I can confidently say this is the best rendition of Samus in the <em>Prime</em> series. In terms of animation for cutscenes, I can assume this is the best one to work with as well.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F07%2Fmetroid-prime-4-trailer-analysis%2Fsylux.png&amp;w=700&amp;h=394&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="394" alt="Sylux in Metroid Prime 4" style="width:100%;height:auto" loading="lazy" decoding="async"> Sylux has a much more sleek look than in <em>Hunters</em> and I’m really impressed by the design, although it’s way less polished than Samus’s model. But one thing that nags me is the design of the Metroids around him. They seem to look more like <a href="https://metroid.fandom.com/wiki/Mochtroid">Mochtroids</a> to me. </div> </center>
<div><p>&lt;Yonic&gt;</p><p>Now, while the relative placement of the games in the timeline is quite clear, the exact placement of events across the <em>Metroid</em> franchise is very inconsistent across sources. But so far, we know that in the Cosmic Year 20X5, the events leading up to <em>Zero Mission</em> happened. Soon after <em>Zero Mission</em>, all of the <em>Prime</em> games so far followed.</p><p>The trailer shows that <em>Metroid Prime 4: Beyond</em> takes place in the <strong>Cosmic Year 20X9</strong>. Taking into account the <em>Prime</em> series alone, this would take place about 3 years after <em>Metroid Prime: Federation Force</em>, the last entry of the series until now.</p><p>However, if we consider the overall <em>Metroid</em> timeline, this would place <em>Metroid Prime 4: Beyond</em> <strong>after</strong> <em>Super Metroid</em>, which according to some promotional material, takes place in 20X7. <em>Super</em> is also the only canon appearance of the Mochtroids so far, so it’s possible that these two games are pretty close together in the timeline, possibly with <em>Beyond</em> being sometime after <em>Super</em>.</p><p>Then again, the 20X7 dating for <em>Super Metroid</em> was only shown in a single promotional material in Japan, so the evidence is not very conclusive. Also, <em>Other M</em> takes place weeks after <em>Super Metroid</em>. This all suggests two possible placements:</p><ul>
<li><strong>Between <em>Federation Force</em> and <em>Metroid II</em>/<em>Samus Returns</em></strong>, ignoring the 20X7 dating.</li>
<li><strong>Between <em>Other M</em> and <em>Metroid Fusion</em></strong>, a bit unlikely due to the implications of the events in <em>Other M</em>.</li>
</ul><p>&lt;/Yonic&gt;</p></div>
 
<p>One thing I can say with some confidence is that the Space Pirates we’re dealing with here seem to be the same ones from <em>Prime 3: Corruption</em>; although their design departs a bit from the ones from that game, some of the ships seen in the trailer share a striking resemblance, hinting that they could come from the same tribe.</p>
<p>I’d delve more into this, but I’d rather discover these things for myself once I get my hands on the game.</p>
<p>But I <em>can</em> talk about what we’ve been shown means for the future successor of the Nintendo Switch.</p>
<h2 id="what-does-this-trailer-tell-us-about-the-successor-of-the-switch">What does this trailer tell us about the successor of the Switch?</h2>
<p class="astro-gicio36m"> <a href="/player/metroid-prime-3/norion" target="_blank" class="astro-gicio36m">Music: Tensions in Norion</a> <i class="astro-gicio36m">(Metroid Prime 3: Corruption | Kenji Yamamoto)</i></p>  
<p>The honest truth is that <em>Metroid Prime 4</em> tells us very little about the capabilities of the successor of the Switch, or so called “Switch 2” by many.</p>
<p>We don’t even know as of the time of writing this that <em>Metroid Prime 4</em> will be set for release on the new console. There are three possibilities, ordered by likelihood according to my expectations:</p>
<ol>
<li><strong><em>Prime 4: Beyond</em> will be a Switch exclusive,</strong> assuming the successor won’t be software compatible with the Switch and there won’t be a version that runs it.</li>
<li><strong>There will be two versions of the game: One for Switch and another for the new console.</strong> Again, implying that the successor will not be compatible with Switch’s games. We’ve seen this cross-generational release pattern happen with <em>The Legend of Zelda: Breath of the Wild</em> with the Switch.</li>
<li><strong>The new console will be backwards compatible with Switch games.</strong> In this situation, a single Switch version may be released. While the possibility of having two versions is also in the air, I pretty much discard this.</li>
</ol>
<p>Some people have argued that the reveal trailer “looks too good to be on Switch”, but it’s <a href="https://www.tweaktown.com/news/98916/metroid-prime-4-will-run-at-720p-on-the-current-switch-it-be-4k-2/index.html">already been confirmed</a> <a href="https://gameranx.com/updates/id/501896/article/digital-foundry-is-certain-metroid-prime-4-beyond-is-running-on-the-switch-heres-why/">by several sources</a> that it is rendered on Switch docked mode. Although there is debate as to whether the game will run at 720p or 900p in docked mode, they confidently say —myself included— that the <em>Beyond</em> we saw in the trailer was running in docked mode.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F07%2Fmetroid-prime-4-trailer-analysis%2Fcomparison.png&amp;w=700&amp;h=333&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="333" alt="Metroid Prime 4 compared to Metroid Prime Remastered" style="width:100%;height:auto" loading="lazy" decoding="async"> <em>Metroid Prime Remastered</em> and <em>Metroid Dread</em> provide a reference for the graphics with <em>Beyond</em>, but in short, while I can definitely say that while the latter is visually much more striking, I don’t really think it veers off in terms of graphical performance compared to <em>Prime 1 Remastered</em>, and it’s more due to the result of <strong>years of polishing</strong> and taking what was learnt from <em>Remastered</em>. </div> </center>
<p>Which brings me to the question: <em>How would the game look on the successor?</em> This one has an easy answer: <strong>Expect it to look much like the one on the Switch</strong>, only in higher resolution and possibly with some visual fidelity enhancements added in, while being probably a bit more performant and have a more stable 60 frames per second framerate.</p>
<p>We’ve seen in both first-party ports and cross-generational titles throughout Nintendo history that they generally look the same between consoles, just with a slightly higher visual fidelity on the more modern one. And I wouldn’t discard this should <em>Prime 4</em> have the same kind of release.</p>
<p>But this would not bode well for the new hardware’s competitiveness. The <em>Metroid</em> series has been one of the two main Nintendo’s first-party series which put visual finesse first, alongside <em>Zelda</em>. However, <em>The Legend of Zelda: Tears of the Kingdom</em> was released last year, and <em>Echoes of Wisdom</em> is already on its way, so <strong>the possibilities for flagship titles are running out</strong>. If <em>Metroid Prime 4</em> is really meant to be the flagship title for the Switch’s successor, Nintendo would lose all competitive grounds against Sony and Microsoft. In other words: <strong>Nintendo could be leaving the next gen market</strong>.</p>
<div><p>&lt;Yonic&gt;</p><p>At this rate, only a minor IP surging with a flagship title could bring competition back into the table. I’m willing to bet for a <em>Luigi’s Mansion 4</em> (with the first one being a launch title for the GameCube), <em>Star Fox</em> or heck, maybe even <em>F-Zero</em> or <em>Mario Kart</em>.</p><p>Although I wouldn’t be surprised if there will be new IPs as well.</p><p>&lt;/Yonic&gt;</p></div>
 
<p>One can speculate so much with so little information, so I think I’ll leave at this for now. I’m still very surprised that <em>Metroid Prime 4: Beyond</em> has managed to stay around at the start of the sunset for the Switch’s lifetime, as the outcome I found most likely was that it was benched for the next system, or worse, cancelled, and now I’ve begun to look forward for the game seriously, although I’m not hyped up about it —nowadays one can be easily disappointed when you highly expect a game, after all.</p>
<p>I will try to keep myself as uninformed as possible, though. I want to discover everything by playing the game and I’m very eager to see if my predictions (and expectations) are met.</p>]]></content>
    </entry>
        <entry>
            <title>My trip to Japan 2023: Days 4 to 6</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2024/05/my-trip-to-japan-2023-days-4-to-6</id>
            <link href="https://www.yonic.blog/blog/article/2024/05/my-trip-to-japan-2023-days-4-to-6" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2024/05/my-trip-to-japan-2023-days-4-to-6" />
            <summary><![CDATA[ These three days me and my friend focus on visiting Tokyo and the neighboring city of Yokohama. And more Gundam. ]]></summary>
            <published>2024-05-16T22:32:30.413Z</published>
            <updated>2024-05-16T22:32:30.413Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fhero.png&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><div class="feed-preview"><p>I originally wanted to cover a week per part of this series, but I realize now that writing these posts can be quite the ordeal, so I’m going to keep them about 3 to 4 days long.</p><p>Aside from the 6th day, these days were probably some of the most full of activity, moving around and doing all sorts of stuff in the whole trip.</p></div>
<h2 id="day-4-akihabara">Day 4: Akihabara</h2>
<p class="astro-gicio36m"> <a href="/player/pokemon/gs/game-corner" target="_blank" class="astro-gicio36m">Music: Game Corner</a> <i class="astro-gicio36m">(Pokémon Gold &amp; Silver: Super Music Collection | Go Ichinose)</i></p>  
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fakiba.jpg&amp;w=700&amp;h=525&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="525" alt="Akihabara" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center>
<p>It was Christmas Eve. The electric city of Akihabara (or Akiba for short) was a must stop, both for me as a game developer and Raxki as an anime and hobby craftsman, so we decided to go there and do some shopping.</p>
<div><p><b>Yonic:</b> There was so much to do, we’ve been here twice during the whole trip.</p></div>
<div><p><b>Raxki:</b> I asked Yonic if we could go for a second time later on.</p></div>
<table style="table-layout: fixed; width: 100%;"><tbody><tr><td> </td><td></td><td> </td></tr></tbody></table>
<p>I wasn’t just for the games though. I knew about its roots as a general electronics store district —especially cameras. <a href="/blog/article/2024/02/trip-japan-2023-week1#day-0-travel-shenanigans">While I didn’t have my camera in my possession during the trip</a>, I still wanted to check what they were offering at Yodobashi Akiba and Bic Camera. Though we’ve been so drawn in by other stores that we didn’t have the time to check those this day.</p>
<p>Figurines were a big feature this trip to Akiba. We went to Radio Kaikan and it was absolutely full of them.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fshinchan.jpg&amp;w=700&amp;h=525&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="525" alt="Shin-chan figurines" style="width:100%;height:auto" loading="lazy" decoding="async"> Kazama fell down in Radio Kaikan. I guess this is very in-character for him. </div> </center>
<div><p><b>Yonic:</b> I actually learned a bit about hobby crafts. I had no idea you could build models out of <strong>metal</strong> parts! How do you even put those together? Is it soldering?</p></div>
<div><p><b>Raxki:</b> I’ve never built one but I think so, yeah.</p></div>
<div><p><b>Yonic:</b> Figure collecting sure is big in Japan. Truly underestimated it.</p></div>
<table style="table-layout: fixed; width: 100%;"><tbody><tr><td> </td><td></td><td> </td></tr></tbody></table>
<p>Many of the shops offered second hand goods from all different kinds of media, such as games, anime, and virtual idols. But our biggest findings were these:</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fsamus-amiibo.jpg&amp;w=700&amp;h=824&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="824" alt="The lineup of merchandise for hardcore Metroid fans" style="width:100%;height:auto" loading="lazy" decoding="async"> A Samus Figma and two amiibo of Metroid: Samus Returns. I had my Samus Returns 3DS before we went to Japan. </div> </center>
<p class="astro-gicio36m"> <a href="/player/metroid/brinstar-tetris" target="_blank" class="astro-gicio36m">Music: Catch Mode (Brinstar remix)</a> <i class="astro-gicio36m">(Tetris DS)</i></p>  
<p>Our eyes couldn’t believe it! Raxki was actually looking for this very Figma. The price was quite egregious but it was <em>practically</em> the best deal, being second hand. As for me, I took the amiibos of Samus and the baby Metroid from Samus Returns, the latter of which is extremely sought after among collectors and Metroid fans.</p>
<p>We also went to <strong>Super Potato</strong>, one of the places I held dear the most in the electric city, because it’s a shop that specializes in <strong>vintage games and gaming systems</strong>, and the shop ambience it gave was extremely warm and welcoming.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fn64-games.jpg&amp;w=700&amp;h=525&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="525" alt="Nintendo 64 games on sale" style="width:100%;height:auto" loading="lazy" decoding="async"> A collection of N64 games that were sold without the box. It was nice to see Kirby 64 and Yoshi’s Story there. The latter one, one of my friend’s favorite game, will show its face later in the trip once again… </div> </center>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fvirtual-boy.jpg&amp;w=700&amp;h=933&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="933" alt="Virtual Boy" style="width:100%;height:auto" loading="lazy" decoding="async"> An actual Virtual Boy! Unfortunately, it was out of order. </div> </center>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fstar-fox.jpg&amp;w=700&amp;h=933&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="933" alt="A statue of Fox McCloud from Star Fox 64" style="width:100%;height:auto" loading="lazy" decoding="async"> The name’s Fox McCloud, Star Fox is the name of my team! </div> </center>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fgame-corner.jpg&amp;w=700&amp;h=525&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="525" alt="Vintage game corner" style="width:100%;height:auto" loading="lazy" decoding="async"> At the top floor, there is a vintage game corner that I absolutely loved. </div> </center>
<p>Close by was also what was used to be one of the many SEGA arcade buildings. I didn’t play anything at all there, but it was full of UFO catchers and other similar arcade machines on the first floor. I happened to spot a huge red Yoshi plushie that was super adorable in one of those machines, but considering the rigged nature of these —and also I was pretty short on change— I refrained from playing.</p>
<p>Other floors were dedicated to each genre of arcade games, from fighting games to rhythm and racing games. There were also DDR floors, but nobody was playing on them. Would have been a wonderful sight!</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fvspo.jpg&amp;w=700&amp;h=786&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="786" alt="One of the iconic SEGA buildings" style="width:100%;height:auto" loading="lazy" decoding="async"> Interestingly enough, the logo of the new owner, GiGO, was replaced by the one from this group of virtual e-sports idols at the top of the building. </div> </center>
<div><p>&lt;Yonic&gt;</p><p>Is it merely a promotional thing, or did it change companies?</p><p>I’d say it’s probably the former.</p><p>&lt;/Yonic&gt;</p></div>
 
<p>We didn’t do much after that as most businesses were closing down. We were going to check a maid café as I was keen to try the experience, but we got into the awkward situation that as we got into the elevator for one of them, one of the waiters went in to put a “Closed” sticker in front of the elevator button to the floor we were going. In hindsight, we should have checked for a business hours sign before checking on the wait times.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Ffancy-car.jpg&amp;w=700&amp;h=500&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="500" alt="A strikingly painted car" style="width:100%;height:auto" loading="lazy" decoding="async"> As we were going back to the station, we found this car owned by a hardcore fan of a character from one of The Idolm@ster games. Car culture in Japan sure goes hard, and so does the devotion for a virtual girl. </div> </center>
<h2 id="day-5-asakusa-sumida-and-odaiba">Day 5: Asakusa, Sumida and Odaiba</h2>
<p class="astro-gicio36m"> <a href="/player/pokemon/hgss/cherrygrove" target="_blank" class="astro-gicio36m">Music: Cherrygrove City</a> <i class="astro-gicio36m">(Pokémon HeartGold &amp; SoulSilver: Super Music Collection | Go Ichinose)</i></p>  
<p>This was a <em>very</em> active day. We went to three different locations because they were conveniently located relatively close to each other and we took a convenient transport to Odaiba afterwards.</p>
<p>We went first thing in the morning to Asakusa, one of the more traditional wards in Tokyo.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Frolling-gates.jpg&amp;w=700&amp;h=525&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="525" alt="Paintings on rolling gates" style="width:100%;height:auto" loading="lazy" decoding="async"> When we arrived at Asakusa station, stores on this nearby street (Okuyama Omairimachi) were closed, allowing us to see the beautiful Kabuki paintings they’ve made on their storefront rolling gates, one of the rare sights we’ve found by pure chance. </div> </center>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fedo.jpg&amp;w=700&amp;h=525&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="525" alt="A painting of an ancient street" style="width:100%;height:auto" loading="lazy" decoding="async"> A painting on what I presume it’s how this street used to look in Edo (ancient Tokyo) </div> </center>
<p>Once we crossed this street, we arrived at one of the side entrances at the back of Sensō-ji, one of the most important Buddhist temples in Japan.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fsensoji.jpg&amp;w=700&amp;h=394&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="394" alt="The main hall of Sensō-ji" style="width:100%;height:auto" loading="lazy" decoding="async"> The main area of the temple. </div> </center>
<p>Since we came from the back, we got to visit the temple and do some praying —hopefully getting it right— but I was very impressed that there wasn’t just a temple, but also a sintoist shrine to the side of it, as well as typical Japanese-style contemplative gardens.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fsensoji-gardens.jpg&amp;w=700&amp;h=394&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="394" alt="The main hall of Sensō-ji" style="width:100%;height:auto" loading="lazy" decoding="async"> The gardens is something that’s a bit underappreciated about this temple. They also have descriptions in English about the many objects placed throughout. </div> </center>
<div><p>&lt;Yonic&gt;</p><p>I wish I was more cultured on shrines, temples and Japanese art, there were so many objects in these sacred places and I had no idea what they were at the time.</p><p>Maybe once I do I will update this article with more concrete info on what I’ve seen.</p><p>&lt;/Yonic&gt;</p></div>
 
<p>We came back by strolling down Nakamise street, and did a bit of shopping before it started to get extremely crowded —that’s why we arrived so early.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fnakamise.jpg&amp;w=700&amp;h=394&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="394" alt="Nakamise street" style="width:100%;height:auto" loading="lazy" decoding="async"> Before we even reached the Kaminari gate, it was already overrun with tourists and believers alike. </div> </center>
<p>To avoid crowds, we took a slight detour offside Nakamise street heading to the famous Tokyo Skytree. Along the way, we stopped at a store well known for its matcha ice cream.</p>
<center> <div style="width:400px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fdango.jpg&amp;w=400&amp;h=225&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="400" height="225" alt="Dango on a stick" style="width:100%;height:auto" loading="lazy" decoding="async"> I also got to eat some really sweet dango! </div> </center>
<center> <div style="width:450px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fstar-wars.jpg&amp;w=450&amp;h=600&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="450" height="600" alt="Star Wars promotional book" style="width:100%;height:auto" loading="lazy" decoding="async"> A really interesting item I found in one of the surrounding streets: <strong>A promotional book of the original release of the <em>Star Wars: The Empire Strikes Back</em> movie</strong>! </div> </center>
<div><p><b>Yonic:</b> Hopefully I can use the cover as reference for future paintings!</p></div>
 
<p>Crossing the Sumida river, we entered one of the more ancient parts of the Sumida ward, which was much more calm than other bustling areas nearby.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fvending-machine.jpg&amp;w=700&amp;h=933&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="933" alt="Pikachu vending machine" style="width:100%;height:auto" loading="lazy" decoding="async"> One of the vending machines in a park next to the Sumida river with lots of Pikachu on it. It really drew me in to buy a strawberry milkshake… </div> </center>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fushijima.jpg&amp;w=700&amp;h=525&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="525" alt="A statue at Ushijima shrine" style="width:100%;height:auto" loading="lazy" decoding="async"> A statue in Ushijima shrine, which reveres the god of oxes and is at least 1150 years old. </div> </center>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fskytree.jpg&amp;w=700&amp;h=933&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="933" alt="Tokyo Skytree next to a torii gate" style="width:100%;height:auto" loading="lazy" decoding="async"> We eventually arrived at Tokyo Skytree, but didn’t get inside nor at the top because I thought it was overrated. This view of the tower from one of the entrances to Ushijima was really worth a picture, though. </div> </center>
<p>In hindsight, maybe we shouldn’t have stopped by to get that matcha ice cream, because we suddenly had to make haste; we had a boat ride to catch.</p>
<p class="astro-gicio36m"> <a href="/player/daft-punk/hbfs" target="_blank" class="astro-gicio36m">Music: Harder, Better, Faster, Stronger</a> <i class="astro-gicio36m">(Discovery | Daft Punk)</i></p>  
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fasahi-hq.jpg&amp;w=700&amp;h=933&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="933" alt="The golden turd" style="width:100%;height:auto" loading="lazy" decoding="async"> By sheer luck, Maps gave us a path straight to the Asahi Headquarters, known for its modern art at the rooftop, or “golden turd” as some people like to call. In my eyes it looks like the smoke of beer in the making. </div> </center>
<p>After racewalking for like it felt like forever, we got there just in time to our cruise: The Emeraldas.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Femeraldas.jpg&amp;w=700&amp;h=440&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="440" alt="The Emeraldas" style="width:100%;height:auto" loading="lazy" decoding="async"> This vessel was designed by the legendary Leiji Matsumoto, master creator of space opera works such as <em>Galaxy Express 999</em>, and childhood hero of Daft Punk, with whom supervised the creation of <a href="https://www.youtube.com/playlist?list=PLuVA1c4AKmObL4YRUVU1yhA6dPfNZcJrp">Interstella 5555</a>, an animated series that accompanied their music album <em>Discovery</em>. </div> </center>
<p>The cruise ship crossed below several of the many bridges that connect Tokyo over the Sumida river to arrive at Odaiba, one of the artificial islands in Tokyo in a little below an hour.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Frainbow-bridge.jpg&amp;w=700&amp;h=394&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="394" alt="The Rainbow Bridge from the Odaiba dock" style="width:100%;height:auto" loading="lazy" decoding="async"> The Emeraldas crossed the Rainbow Bridge, seen here from Odaiba. </div> </center>
<p>Now, there were a lot of stuff I wanted to do in Odaiba, but we mostly spent the afternoon in the mall containing the Gundam Base Tokyo, noteworthy for having another of the three life sized Gundam in Japan.</p>
<p class="astro-gicio36m"> <a href="/player/gundam/unicorn" target="_blank" class="astro-gicio36m">Music: Unicorn</a> <i class="astro-gicio36m">(MOBILE SUIT GUNDAM UNICORN OMPST 1 | Hiroyuki Sawano)</i></p>  
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Funicorn-gundam.jpg&amp;w=700&amp;h=900&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="900" alt="Gundam Unicorn life size statue" style="width:100%;height:auto" loading="lazy" decoding="async"> Two down, one to go. </div> </center>
<div><p><b>Raxki:</b> This was were the first life size Gundam was built, based on the RX-78-2 Gundam from the original series, but it got replaced by this Unicorn Gundam in 2017.</p></div>
 
<p>The DiverCity mall supposedly had a workshop where you could built your own Gunpla, but it was closed off at the time. But at least we got to see several of the entries from a recent Gunpla builder contest.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fdiorama.jpg&amp;w=700&amp;h=394&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="394" alt="Gundam Unicorn diorama" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center>
<div><p>&lt;Yonic&gt;</p><p>The finesse on some of the dioramas is just lovely, how plain items such as cotton and crumbled paper can create rather realistic textures and visual effects such as smoke.</p><p>Crafting these dioramas must have taken a lot of precision and patience!</p><p>&lt;/Yonic&gt;</p></div>
 
<center> <div style="width:400px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Funicorn-lit.jpg&amp;w=400&amp;h=711&amp;fit=inside&amp;a=bottom&amp;we=1&amp;quality=0&amp;output=jpg" width="400" height="711" alt="Gundam Unicorn life size statue at night" style="width:100%;height:auto" loading="lazy" decoding="async"> The Gundam Unicorn lits up at night. It also has some moving parts as well. </div> </center>
<p>We took the monorail back home, which we noticed it was fully automatized —which is something that urban planning channels should probably look into.</p>
<div><p><b>Raxki:</b> We’ll be coming back here again.</p></div>
<div><p><b>Yonic:</b> Eyup. We didn’t have much motive to come back here, but we didn’t have much to do the day we returned anyway, so I asked if we could come and we did.</p></div>
<table style="table-layout: fixed; width: 100%;"><tbody><tr><td> </td><td></td><td> </td></tr></tbody></table>
<h2 id="day-6-yokohama">Day 6: Yokohama</h2>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fyokohama-station.jpg&amp;w=700&amp;h=525&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="525" alt="Me and Raxki at Yokohama Station" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center>
<p class="astro-gicio36m"> <a href="/player/zack-wiki/beginning" target="_blank" class="astro-gicio36m">Music: The Beginning</a> <i class="astro-gicio36m">(Zack &amp; Wiki - Quest for Barbaros' Treasure)</i></p>  
<p>The previous day ended with Gundam. And this day started with… More Gundam.</p>
<p>Prior to this trip, I booked in advance for a stage show involving a <strong>life size moving Gundam</strong> in Yokohama. Saving the best for last!</p>
<div><p><b>Yonic:</b> It was mainly because of this event that the trip planned around this time.</p></div>
<div><p><b>Raxki:</b> The Moving Gundam would only be running until March 2024, so we <strong>had</strong> to go before that.</p></div>
<div><p><b>Yonic:</b> It was your main reason to visit Japan after all…</p></div>
<table style="table-layout: fixed; width: 100%;"><tbody><tr><td> </td><td></td><td> </td></tr></tbody></table>
<center> <div style="width:500px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fmoving_gundam.jpg&amp;w=500&amp;h=700&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="500" height="700" alt="Moving Gundam at Yokohama" style="width:100%;height:auto" loading="lazy" decoding="async"> According to Raxki, despite being a lifesize rendition, this one could actually be the smallest of the three in Japan. </div> </center>
<p>We also got up the docking tower to check it up close and personal. To be fair, the perspective and vistas totally felt in-proportion to their depictions in the anime series, so props to the animators for making theirs up to scale.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fmoving_gundam_upclose.jpg&amp;w=700&amp;h=425&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="425" alt="Closeup of moving Gundam" style="width:100%;height:auto" loading="lazy" decoding="async"> This looks like <em>we’re</em> inside a Gundam diorama now. </div> </center>
<p>There was also a museum showing all the technology and the work that made an attraction such as this possible.</p>
<div><p>&lt;Yonic&gt;</p><p>One of the things that I’ve been wondering ever since I heard about Gundam was something along the lines of: “How would one be able to make something so huge be able to move with the grace and flexibility of a human person?”.</p><p>This Gundam is about 10 times the size of an average human in a developed country, which means that its volume is actually 1000 times higher. It’s a textbook example of the <a href="https://en.wikipedia.org/wiki/Square%E2%80%93cube_law">square–cube law</a>. And it’s probably going to be more dense than an average human with all its organs, so this thing could easily weigh in at about 60 metric tons or more.</p><p>On the other hand, the Gundam in Yokohama is stated to weigh about 25 metric tons, and that’s just for all the visual pieces and mechanical systems, and yet still, it moves extremely slow in comparison to the ones in the animated series.</p><p>Some Gundam use swords for combat, which requires a lot of agility to become usable weapons. If you want a thing of at least 60 metric tons move fast, you’re gonna need very large thrusters, which heats up the internals.</p><p>The larger something is, the harder it is for it to cool down, because heat is dispersed throughout a surface, but chemical reactions such as in thrusters scale up with volume.</p><p>It’s way more likely to see a reactor meltdown than be able to swing your sword in rapid succession on a mecha like that.</p><p>…Wait, why am I so invested in studying the physics of a Gundam…?</p><p>&lt;/Yonic&gt;</p></div>
 
<br>
<p class="astro-gicio36m"> <a href="/player/gundam/twinkle" target="_blank" class="astro-gicio36m">Music: Twinkle</a> <i class="astro-gicio36m">(Gundam Build Divers ReRISE ep 2 | spira · spica)</i></p>  
<p>We spent here pretty much all afternoon. We took a short walk once it was starting to get dark, and visited a location that appeared in the <em>Gundam Build Fighters</em> series on our way.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fyokohama.jpg&amp;w=700&amp;h=380&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="380" alt="Yokohama at dusk" style="width:100%;height:auto" loading="lazy" decoding="async"> At first glance, this kinda looks like the beachline of Barcelona with the W Barcelona looking building in the background. </div> </center>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fredbrick.jpg&amp;w=700&amp;h=394&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="394" alt="Red brick warehouse" style="width:100%;height:auto" loading="lazy" decoding="async"> This red brick warehouse is a big shopping mall and cultural center in the city, and one of the real life locations in <em>Gundam Build Fighters</em>. There’s a bunch of these buildings with a “red brick/industrial” architecture scattered througout Japan. </div> </center>
<center> <div style="width:500px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Ffox.jpg&amp;w=500&amp;h=800&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="500" height="800" alt="A fox" style="width:100%;height:auto" loading="lazy" decoding="async"> There was also this pretty cool looking fox sculpture. Gotta give modern art its spotlight, too! </div> </center>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Fmy-trip-to-japan-2023-days-4-to-6%2Fport_memorial.jpg&amp;w=700&amp;h=350&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="350" alt="Port Memorial" style="width:100%;height:auto" loading="lazy" decoding="async"> It’s quite eyecatching to spot some classic revivalist architecture thrown about the city. </div> </center>
<p>We then took the monorail back to Tokyo, which I noticed it was fully automatized. I guess for a monorail that has its own independent track system, it makes a lot of sense that it should be fully automatized, but it makes me wonder if it’s capable of reacting to unusual and unexpected events.</p>
<p>And that was pretty much it for the first week of our trip. We did most of what Raxki wanted to do the most during this time. With that now completed, now it was time for the places and experiences I wanted to check out! Which is coming up on the next part of this series…</p>]]></content>
    </entry>
        <entry>
            <title>I'm finally quitting YouTube, and it's all great</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2024/05/finally-quitting-youtube</id>
            <link href="https://www.yonic.blog/blog/article/2024/05/finally-quitting-youtube" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2024/05/finally-quitting-youtube" />
            <summary><![CDATA[ YouTube is what takes me most of my screen time, so I decided to get rid of it once and for all. ]]></summary>
            <published>2024-05-04T13:52:40.021Z</published>
            <updated>2024-05-04T13:52:40.021Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Ffinally-quitting-youtube%2Fhero.png&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><p class="astro-gicio36m"> <a href="/player/kingdom-hearts/2/hollow-bastion" target="_blank" class="astro-gicio36m">Music: Restoring Hollow Bastion</a> <i class="astro-gicio36m">(Kingdom Hearts II.5 Final Mix | Youko Shinomura)</i></p>  
<div class="feed-preview"><p>There’s no denying that <strong>YouTube has become increasingly addictive</strong> over the last decade, and in the past few years I’ve begun to become increasingly more distasteful of the platform as it becomes more and more harmful to my wellbeing and my lifestyle.</p><p>However, recent changes in their platform and its “algorithmic shifts” have pulled my last straw, and have forced me to finally take definitive actions.</p></div>
<h2 id="the-reasons-why-youtube-sucks">The reasons why YouTube sucks</h2>
<p>Since the mid 2010s, YouTube has been developing some UX design practices that in my humble opinion, are anti-humanistic in that they are designed to drain your soul away for profit. I’m not exaggerating on this.</p>
<p>Social engineers have researched the concept of “<a href="https://esmed.org/MRA/mra/article/view/2677">attention economy</a>”, the business model of keeping the attention of a user in order to throw the user as many ads and collect as much usage metrics and marketing data as possible.</p>
<p>To achieve this, YouTube relies on several UI and UX patterns that rely on stimulating the user’s attention with minimal input —especially on mobile, which is more convenient for the user:</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Ffinally-quitting-youtube%2Fyoutube-ui.jpeg&amp;w=700&amp;h=525&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="525" alt="YouTube UI on phones" style="width:100%;height:auto" loading="lazy" decoding="async"> Swipe “<em>up</em>”? Sounds like an Y-axis flip issue. </div> </center>
<ul>
<li>In the home screen, you get a list of recommended videos that are likely to grab your attention.</li>
<li>If not, the user swipes downward to “pull” the UI. This is actually very similar to pulling a lever in a slot machine.</li>
<li>Because the content shown is user generated, <strong>what will be shown is random</strong>, with a bias to cater the user. This is very much like a <a href="https://en.wikipedia.org/wiki/Operant_conditioning_chamber">Skinner Box</a>, which helps encourage people into repeating the same action over and over again.</li>
<li><strong>Autoplay is enabled by default</strong>, which negates the necessity of looking for a new video after finishing with another.</li>
<li>When the user selects a video, <strong>a list of recommendations appears below the video</strong>. This creates an escape route from a dissatisfying video to something that may be more pleasing to the user.</li>
</ul>
<div><p>&lt;Yonic&gt;</p><p>The thumbnails of these recommended videos used to be <strong>much</strong> smaller, and in even older versions, you had to check another tab to see them.</p><p>Nowadays they are just a tad smaller than the video when in portrait mode and visible as soon as you open the video, which makes it an extremely more convenient “escape route”.</p><center><center> <div style="width:400px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Ffinally-quitting-youtube%2Fold-youtube.png&amp;w=400&amp;h=300&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="400" height="300" alt="Old YouTube" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center></center><p>&lt;/Yonic&gt;</p></div>
 
<p>This is all done to ensure one can enjoy videos with as minimum hassle as possible. This may seem like it’s not a big deal, but in a world where the principle of minimum effort reigns, <strong>it is vital for user engagement</strong>.</p>
<p>Why? There are many factors, but one of them is because our brains are very conscious on <strong>the effort you put to obtain something</strong>, even if it’s something as small as pushing a button. <a href="https://pdfs.semanticscholar.org/ffe8/77e4093a8f879d5543c71cf294488effb0a7.pdf">A research paper makes a direct inverse correlation between the lack of effort and the probability of choosing what content to watch</a>, and that the balance between how worth the effort is for the reward works at a logarithmic scale: It makes a much bigger difference between 1 and 2 steps than between 10 and 11.</p>
<p>TikTok has managed to basically reduce this to essentially zero from the point you open the app, basically turning it into an “automatic fast video feeder”. YouTube is betting hard on this too with <strong>YouTube Shorts</strong>.</p>
<p>Yes, the speed at which new content is delivered can also trick your brain into wanting more even though the content you might be watching isn’t that interesting. <a href="https://doi.org/10.1016/j.tele.2019.101243">This study</a> links this phenomenon to attachment theory —one involving forming interpersonal connections, especially with parents. In other words, <strong>researchers hypothesize our brains can think of YouTube and TikTok as if it were loved ones</strong>.</p>
<p> <b>YouTube video: </b> <a class="anchor" href="https://www.youtube.com/watch?v=0Igj3qI0GBA" target="_blank" rel="noreferrer noopener">Everyone hates YouTube shorts</a> (17:15) </p>
<p>This results in the paradoxical effect that people now don’t really need highly enjoyable content to stay engaged, because instead of selecting what you want to watch, the content is given to you directly without any input from you. This has led to an oversupply of videos, both of high and low values of production, but with very varying quality of engagement. This “era of excess” —as some experts call it— is usually described as YouTube giving you feelings of boredom, fear of missing out, anxiety, depression, and loneliness.</p>
<p>All of these gimmicks (among many, many other factors) result in the many negative effects that have been deeply documented by many studies across the years, like the ones above. I suggest looking them up in <a href="https://scholar.google.com/scholar?q=ux+design+app+addiction+videos">Google Scholar</a> if you don’t mind the scientific jargon, because press (especially on TV) tends to hit hard on these by blowing the effects a bit out of proportion to discourage people from using competing mediums of entertainment.</p>
<h3 id="so-what-did-i-use-to-do-to-combat-this">So what did I use to do to combat this?</h3>
<p>Basically, I simply did the opposite: <strong>Make the experience of browsing YouTube as painful as possible</strong>, but not too much, so that I could still enjoy it without feeling like I’ve been drained of my time.</p>
<p>I use <a href="https://unhook.app/">Unhook</a>, a browser addon to remove some of the most convenient ways to watch videos. After installing it, if I wanted to watch a video, I had to actively type it in in the search bar, an <strong>extremely effortful thing</strong> compared to being suggested what I wanted to see.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Ffinally-quitting-youtube%2Fmy-youtube.png&amp;w=700&amp;h=400&amp;fit=inside&amp;a=top&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="400" alt="Screenshot of my YouTube layout" style="width:100%;height:auto" loading="lazy" decoding="async"> This is how I used to use Unhook to remove some of the content that was extremely distracting, especially the sidebar with its recommendations on what to watch next. </div> </center>
<p>Since then, my experience with YouTube has improved massively. All of a sudden, <strong>I was way more invested into watching longer videos all the way to the end</strong> —an <em>impressive</em> level of commitment according to Map Men. And if I don’t know what else to watch, I began getting the sensation of needing to stop watching YouTube, <strong>and now I only watch it the time I absolutely need to</strong>, most of the time anyway.</p>
<p>However, this is only when I use YouTube on PC. On mobile, I have no way to customize this with as much freedom that I know of, and I still end up using it a lot more than I should. There was the risk of misclicking on the app and being forced to watch a short until I figured out how to get away from them, but it was pretty miniscule in comparison to the rest of the time I spent using the app.</p>
<div><p>&lt;Yonic&gt;</p><p>And even in the remote case I wanted to share a YouTube short to someone else, I’m able to convert the link to those shorts so that you can watch it as a regular YouTube video. Like this!</p><p>youtube.com/<strong>shorts</strong>/id-of-video → youtube.com/<strong>watch</strong>/id-of-video</p><p>&lt;/Yonic&gt;</p></div>
 
<p>But it was fine for me at the time, as I was just starting my screen time diet. I wanted to take thinks slowly. But all of a sudden, YouTube would change in a way that I just simply couldn’t tolerate and made me take more drastic measures.</p>
<h2 id="the-last-straw">The last straw</h2>
<p>YouTube’s latest change is what has ultimately forced my hand into quitting YouTube altogether: <strong>The war on ad blockers</strong>.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Ffinally-quitting-youtube%2Fultimatum.jpg&amp;w=700&amp;h=463&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="463" alt="Ad blockers are not allowed on YouTube dialog" style="width:100%;height:auto" loading="lazy" decoding="async"> YouTube has started imposing an ultimatum on users who use ad blockers: Use their premium service or disable ad blockers. </div> </center>
<div><p><b>Yonic:</b> I haven’t really seen this message myself but I <em>still</em> find it outrageous.</p></div>
<div><p><b>Raxki:</b> I think I have, once.</p></div>
<table style="table-layout: fixed; width: 100%;"><tbody><tr><td style="text-align: left"> </td><td></td><td style="text-align: right"> </td></tr></tbody></table>
<p>Advertisements have been part of the YouTube’s business model for a bit over a decade, but <strong>over the past few years ads have started to become more and more intrusive</strong> to the viewer’s experience.</p>
<p>Over its history, YouTube went from ads to the side of the video, to small popups at the bottom, to <strong>midroll advertisements</strong> that used to be skippable after 5 or so seconds —which I can assume everyone did. Now you can’t even skip those ads (although bypassing them was possible for a while) and you can expect at least one every two videos or so. Sometimes, two in a row.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Ffinally-quitting-youtube%2Fvideos-ads.png&amp;w=700&amp;h=370&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="370" alt="The 16 second unskippable ad for 4 seconds of video was worth it." style="width:100%;height:auto" loading="lazy" decoding="async"> The situation has gone so bad that you can be forced to watch ads that may be longer than the actual video itself. </div> </center>
<p>Granted, I have to admit that the attitude towards advertisements has gone pretty sour over the past few decades, because we were pretty used to ad breaks with television. However, they were —usually— pretty seamless because they usually had transitions to ease the way to them. Nowadays, not so much.</p>
<p>YouTube used to put ads to the side of a video or relatively small at the bottom side over it, but nowadays it’s a video ad that creators have barely any control over its placement and can result in very awkward and annoying cuts, so regardless of whether their actions deserve their hate or not, they’re kinda asking for it. <a href="https://www.reddit.com/r/AfterVanced/comments/19c8uj3/comment/kiyv861/">At least they are merciful enough not to put these kinds of ads in developing countries…</a></p>
<p>If it were a more seamless experience, I wouldn’t feel the necessity to use an ad blocker. But huzzah —many websites and apps already clutter their content with so many ads that it significantly hampers my experience. <strong>As long as that remains true, I’m keeping my ad blockers on.</strong></p>
<h2 id="the-turn-to-invidious">The turn to Invidious</h2>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Ffinally-quitting-youtube%2Finvidious.png&amp;w=700&amp;h=394&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="394" alt="Invidious" style="width:100%;height:auto" loading="lazy" decoding="async"> Screenshot from an Invidious instance </div> </center>
<p>Now I consume most YouTube content through <strong>Invidious</strong>. But I didn’t realize that this change would also bring along some <strong>unexpected but positive effects</strong> that helped me a lot on my PC Exodus —that’s how I call the screen time diet initiative I’m taking— because the experience I have with it had the <strong>perfect amount of misery</strong> I needed to take several steps forward on reducing my screen time.</p>
<p><a href="https://redirect.invidious.io/">Invidious</a> is a frontend that is installed in servers across the world called <strong>instances</strong>, and serves as a some sort of an ad-free and privacy-respecting alternative to YouTube. Of course, Google is actively fighting against it by blocking access to YouTube videos from these instances. <strong>However, it’s not perfect</strong> and Invidious hosts work hard on bypassing those blocks. On times where the block seems to persist, I just quit and stop watching videos.</p>
<p>But by far the most significant improvement was on mobile. The usage limit function on iOS tends to have a pretty annoying issue when using it on “installed web apps” like, say, an Invidious instance: <strong>The website doesn’t respond to any input after choosing to “ignore the time limit warning”</strong>, and very often I’m forced to restart the app and search the video again. In Safari and websites added to the home screen, the time expired screen shows up every time you enter a new domain, so <strong>this will happen every time I switch instances, making it a huge pain to watch videos</strong> when I surpass the time limit and the instance has been blocked.</p>
<p>Ever since I replaced YouTube for Invidious on iOS, my usage time has taken quite the drop, <strong>and for the first time, I reached under 3 hours a day in weekly usage</strong>. A huge accomplishment!</p>
<p>I’ve also noticed that my productivity time has increased quite significantly, and I’ve been able to clear my backlog of games at a quicker pace than before, but my overall satisfaction has remained mostly the same, if not better!</p>
<p>In the near future, I will be willing to take much bolder steps.</p>]]></content>
    </entry>
        <entry>
            <title>RSS and web feeds are taking back your Internet</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2024/04/web-feeds-are-taking-back-your-internet</id>
            <link href="https://www.yonic.blog/blog/article/2024/04/web-feeds-are-taking-back-your-internet" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2024/04/web-feeds-are-taking-back-your-internet" />
            <summary><![CDATA[ With the surge of AI and corporate interests, an old alternative which can give you back control over what you want to see seems to be making its comeback. ]]></summary>
            <published>2024-04-13T07:34:21.751Z</published>
            <updated>2024-04-13T07:34:21.751Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F04%2Fweb-feeds-are-taking-back-your-internet%2Fhero.png&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><div class="feed-preview"><p>The Internet used to be a free willed, more independent place. If you wanted to check information about a topic, you had to actively search for it on Google, Yahoo, or any other search engine around at the time.</p><p>Nowadays, everything seems to have been turned the other way around: Everything boils down to websites and apps selecting that information for you, “recommending” you things to watch or read. Sure, it’s convenient, but up to a point.</p><p>Overly relying on this method (and companies will design to ensure you become addicted to being recommended stuff) has a lot of negative effects on you and everyone around, which I will get onto in future posts.</p><p>For now, I want to show you something that can give you back a bit of independence over what you want to see. Something that has been around for quite a while, but it’s still relevant to this day.</p></div>
<h2 id="web-feeds-what-are-they-and-why-should-you-care">Web feeds: What are they and why should you care?</h2>
<p class="astro-gicio36m"> <a href="/player/trauma-team/corpse-whisperer" target="_blank" class="astro-gicio36m">Music: Corpse Whisperer</a> <i class="astro-gicio36m">(Trauma Team)</i></p>  
<p>To put it simply, a web feed is basically like a <strong>YouTube subscription</strong>. You add one of these feeds into a <strong>feed reader</strong> app and it will automatically grab the latest posts from that web feed as they come, and put them all together in one neat place. It’s also called a <strong>news aggregator</strong> because the app <strong>keeps stockpiling the news or posts</strong> you’re subscribed to.</p>
<p>These reader apps can have other features like keeping track of which ones you’ve read, organizing posts by topic, tagging posts to read later, among other things.</p>
<p>But more importantly, web feeds are designed in such a way that the websites that provide these feeds can’t manipulate its contents depending on who’s accessing it; unlike recommendations made by an “algorithm”, <strong>the content is the same for everyone</strong>.</p>
<p>This implies no website can get your personal information for their benefits, so it’s <strong>excellent for those worried about privacy</strong> (which is something that has become increasingly concerning in some countries). And you have <strong>total control</strong> over what you want to see: If you don’t like something, just unsubscribe from the feed by removing it from the app, and their associated posts will go away!</p>
<p>Another benefit is that since it’s <em>you</em> handles the content you’re seeing, <strong>it won’t be especially suited to retain you in the same website for hours</strong>, although the effects can vary significantly depending on the content and the website you’re watching it from. <a href="/browse/series/pc-exodus">Still, this is something that right now I am very concerned about and regard very highly</a>.</p>
<p>You may have heard about <strong>RSS</strong> or <strong>Atom</strong> feeds. They are simply two different types of web feeds. Websites that provide feeds will usually provide either one or the other, but newsreader apps normally support both types because they are very similar and widely used. For example, this blog offers an Atom feed compatible with Feedly-based apps for the Modern blog, and a RSS feed for the Legacy version blog that can be used with newsreaders for older systems.</p>
<p>They are also very lightweight, and will often just have text and images, nothing fancier than that. Videos are usually filtered out or will not play, on the other hand, <strong>the posts will have their ads stripped out</strong> (though the newsreader could slap ads of their own in their app). But if you feel like it’s too little for you, nearly all feed readers will provide you a link to display the full post in your browser.</p>
<div><p>Some websites will purposefully give you just a small summary of the article to encourage you to visit the full page, and use their telemetry and tracking tools on you when you do so.</p><p>This blog provides a web feed like this, but your privacy won’t be compromised when seeing the full version because I specifically designed this blog to avoid as much telemetry from other companies as I could.</p></div>
 
<p>Many newsreaders also support converting posts from <strong>social media</strong> like YouTube or Reddit, into a web feed that you can read just like any regular one. Just put the link to the user profile from the social platform you want to be kept notified and you’ll get their latest posts as they come, <strong>no algorithms</strong> nor <strong>recommendations</strong> involved. Just beware that the conversion is not always perfect and that you might have to open the post in a browser to see it correctly.</p>
<h2 id="a-double-edged-sword">A double-edged sword</h2>
<p>With web feeds, it’s ultimately up to you what you want to see, and what you’d rather ignore. <strong>If used without critical thinking, you could end up building your own <em>echo chamber</em></strong>, that is, you could end up following feeds that reflect and reinforce your beliefs, and might end up radicalizing yourself.</p>
<p>Granted, social media nowadays builds their own echo chambers for you so that you can stay in their platforms as long as possible. Web feeds don’t do this; <strong>it’s what you choose to read</strong>, so use web feeds responsibly.</p>
<p>For managing my own feeds, I use these guidelines:</p>
<ol>
<li><strong>Check the authors and their sources:</strong> Even the most popular and reputable websites that you might be subscribed to can have <a href="https://kotaku.com/author/hownottodraw">very nasty authors</a>, or make claims that can be widely disputed.</li>
<li><strong>Seek information from as many points of view as possible</strong>: An enduring task, considering how polarizing media is becoming nowadays.</li>
<li><strong>Keep your hobbies into account</strong>: This will keep your hobbies active in your brain while at the same time keep you informed about the things you like to do, with little yet need to be accounted for risk of becoming polarized.</li>
<li><strong>Be open to new things!</strong> Local newspapers are excellent to check for new things to do, or get in touch about what’s happening where you live.</li>
</ol>
<h2 id="why-didnt-web-feeds-caught-on">Why didn’t web feeds caught on?</h2>
<p>The thing is that they used to be a big deal in the 2000s, but many attribute the downfall of web feeds to the shutdown of <a href="https://www.pcmag.com/news/google-reader-shutting-down-on-july-1">Google Reader</a>, Alphabet’s solution for news aggregators. But I personally believe it was a catalyst more than its cause.</p>
<p>My main theory is that it came down mostly to its design, which was mostly against the coming of the age of Big Data and personalized marketing. By design, <strong>news aggregators request updates from the web feed on their own</strong> and don’t leverage anything from the browser or browsers you may have installed.</p>
<p><strong>Feed readers generally won’t send login information or anything about the person who is requesting it</strong>, and the feed is handled on the 3rd party newsreader, the site delivering the web feed won’t get any precious user usage data, and they can’t put any middleware in between to ask for a login or something of the sort. Again, this is also by design.</p>
<div><p>If you’re seeing a website for free, then you’re paying by being their product.</p><p>But to the website maintainer’s eyes, web feeds allow you to bypass this and essentially become a freeloader.</p></div>
 
<p>So it’s no surprise why Google and other big tech companies whose business model relies a lot on collecting user data started removing (and sometimes even discouraging using) web feeds. Although Google added an RSS compatible solution, it was on Google Chrome, so they had control over the usage data, and apparently they removed shortly afterwards on desktop platforms.</p>
<p>However, RSS is here to stay, with many blogs and journalist websites still supporting it for those who remain loyal to that technology, and in the world of AI generated content, being able to control what you’re reading and watching has become more relevant than ever.</p>]]></content>
    </entry>
        <entry>
            <title>Astronomy may be on the decline, but we can still save it</title>
            <author>
                <name>Yonic</name>
            </author>
            <id>https://www.yonic.blog/blog/article/2024/04/astronomy-decline</id>
            <link href="https://www.yonic.blog/blog/article/2024/04/astronomy-decline" />
            <link rel="alternate" type="text/html" href="https://www.yonic.blog/blog/2024/04/astronomy-decline" />
            <summary><![CDATA[ A rather pessimistic outlook on one of the oldest sciences. ]]></summary>
            <published>2024-04-06T18:19:16.258Z</published>
            <updated>2024-04-06T18:19:16.258Z</updated>
            <content type="xhtml"><![CDATA[<figure><img alt="Cover image" src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F04%2Fastronomy-decline%2Fhero.png&w=550&h=310&fit=inside&a=center&we=1&quality=90&output=jpg"><figcaption></figcaption></figure><p class="astro-gicio36m"> <a href="/player/eyewitness/space/skywatching" target="_blank" class="astro-gicio36m">Music: Sky Watching</a> <i class="astro-gicio36m">(Eyewitness Encyclopedia of Space and the Universe | Ian Hawkridge)</i></p>  
<div class="feed-preview"><p>Last night I set out to try and photograph Comet 12P/Pons-Brooks, also known as “The Devil’s Comet” that’s been approaching the Sun since March.</p><p>It was a very faint comet, so with my limited gear I could only make it be seen very slightly when zoomed in. It was clear that I would need to upgrade my equipment if I wanted to make clearer pictures of these thingies. However, it also made me think about other things that eventually bubbled into a theory that astronomy, the oldest science —dating back to ancient times and even prehistoric times— may be in danger of becoming a shadow of what it was in the past.</p><p>But this fate could be avoided if we solve at least two of the major problems astronomy is currently facing, both in the short and long term.</p></div>
<h2 id="light-pollution-and-the-suffocation-of-the-night">Light pollution and the suffocation of the night</h2>
<p>When one talks about pollution, they usually refer about air pollution and things like climate change. But there are other kinds of things that can contaminate our environment.</p>
<p>One of the least heard of is <strong>light pollution</strong>, which is caused by artificial lighting in our cities and towns. When it’s carelessly used, cities and road lights shoot light upwards into the sky, cluttering the skies with the glow coming out of the cities and drowning the skylight.</p>
<p>The <strong>Bortle scale</strong> compares on a scale from 1 to 9 how affected the night sky is due to light pollution in terms of visibility of astronomical objects, with skies of class 1 being pristine dark skies, and class 9 being the typical night sky you would see inside a city.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F04%2Fastronomy-decline%2Frho_ophiuchi.jpg&amp;w=700&amp;h=465&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="465" alt="Picture of the Milky Way" style="width:100%;height:auto" loading="lazy" decoding="async"> This is a picture of the Milky Way I took two years ago, in an area with Bortle class 2 skies. You can see a lot of detail surrounding the galaxy and even hints of nebulae. </div> </center>
<div><p>&lt;Yonic&gt;</p><p>For comparison, the picture of the comet I photographed at the top of this post was in an area with a Bortle scale of 4, which is typical in suburban to rural settings.</p><p>Although I’d say it’s a bit of an unfair comparison because I made these photos for completely different targets, the differences are still very striking.</p><p>&lt;/Yonic&gt;</p></div>
 
<p>In a sky like the one of the comet’s picture, one would be able to see up to around 300 stars with an unaided eye. In a truly dark sky, that number goes up to 9,500 stars. <strong>Downtown? About 50 stars if you try hard enough.</strong></p>
<p>It is estimated that about <a href="https://www.astronomy.com/science/one-third-of-humanity-cant-see-the-milky-way/">one third of humanity has never been able to see the Milky Way</a>. In 1994, an earthquake hit Los Angeles which caused a blackout of the whole city. <a href="https://www.thevintagenews.com/2018/02/08/northridge-earthquake-1994/">That day there had been reportings of “a strange sky” that showed up out of nowhere, and people called the local Griffith Observatory up asking what it was</a>.</p>
<p>Similarly, during lockdown, there had been an all-time high of reports of sightings of mysterious objects, like <strong>flashing discs of light</strong>.</p>
<center> <div style="width:300px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F04%2Fastronomy-decline%2Fufo.png&amp;w=300&amp;h=381&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="300" height="381" alt="Photo of a &quot;flashing light&quot;" style="width:100%;height:auto" loading="lazy" decoding="async"> One of the many reported so-called “strange lights” from Colombia. They claim it seems like an UFO/flying saucer, but in reality this is most likely to be Venus being captured by a camera that has no idea how to focus it due to for how far away it is and how tiny it looks like. </div> </center>
<div><p><b>Yonic:</b> People being flippant and stupid? I’d rather call it <strong>astronomical illiteracy</strong>.</p></div>
 
<p>This would never have happened if it wasn’t for the light pollution, because you would be able to see many more stars and easily identify which are planets and which are other things, and of course, look up in awe at the beauty of things like the Milky Way or even the Andromeda galaxy. <strong>Light pollution washes away all of that, leaving a plain and uninteresting sky</strong>.</p>
<p>However, the actual amount of light pollution doesn’t have a maximum past class 9, so it can get so polluted that one could live in what’s called an “eternal twilight”, in which the sky gets so bright it feels like an if it were at twilight.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F04%2Fastronomy-decline%2Fny-skyline.jpg&amp;w=700&amp;h=394&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="394" alt="Skyline of New York at night" style="width:100%;height:auto" loading="lazy" decoding="async"> Light pollution in cities like New York make it impossible to see any stars at all, where the “eternal twilight” is clearly visible. </div> </center>
<p>Throughout the history of humanity, generations of astronomers studied the night sky and elaborated many different models for understanding our place in the Universe, among other things. They were able to do it because electric artificial illumination wouldn’t become a thing until the early 20th century.</p>
<p>Of course, technological advancements allowed us to see more of space and in more ways than just “how we see things”. But I believe that could also bring an undesired effect.</p>
<h2 id="deceptive-marketing-and-the-surge-of-hobby-killers">Deceptive marketing and the surge of “hobby killers”</h2>
<p class="astro-gicio36m"> <a href="/player/eyewitness/space/spacecraft" target="_blank" class="astro-gicio36m">Music: Space Hardware</a> <i class="astro-gicio36m">(Eyewitness Encyclopedia of Space and the Universe | Ian Hawkridge)</i></p>  
<p>Technology for astronomical observations really skyrocketed in the mid to late 20th century, with the construction of observatories specialized in the invisible light (radio, infrared, x-ray and ultraviolet, among others) and space probes that can get much closer to other planets, enabling the possibility to take pictures of the planets of the Solar System with an amazing resolution.</p>
<p>Before that, telescopes at the time could only make out general features of the planets, such as Saturn’s rings and Jupiter’s red spot; one could spot the four Galilean moons, but they’d look like dots in the sky.</p>
<div><p>&lt;Yonic&gt;</p><p>Fun fact: When the film <em>2001: A Space Odyssey</em> was made, there hadn’t been any probes that had arrived to Jupiter at the time, so the depictions of Jupiter and its moons were made rather vague with all the telescope images that they had at the time to avoid possible inconsistencies with how they actually look.</p><center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F04%2Fastronomy-decline%2FJupiter_2001.jpg&amp;w=700&amp;h=300&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="300" alt="Jupiter in 2001: A Space Odyssey" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center><p>But by the time the sequel <em>2010: The Year We Make Contact</em> came out, the <em>Pioneer</em> and the <em>Voyager</em> probes had already been to both Jupiter and Saturn, which allowed to use much higher quality pictures of the former and its moons to make more accurate and detailed depictions of the astral bodies.</p><center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F04%2Fastronomy-decline%2Fjupiter_2010.png&amp;w=700&amp;h=300&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="300" alt="Jupiter in 2010: The Year We Make Contact" style="width:100%;height:auto" loading="lazy" decoding="async">  </div> </center><p>&lt;/Yonic&gt;</p></div>
 
<p>I’m not saying that these leaps in imaging quality of the Solar System have been hampering astronomy; quite the opposite, actually. It’s what allowed many people to develop an even more intimate fascination towards space.</p>
<p>How could one not be fascinated by something like this?</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F04%2Fastronomy-decline%2Fcomet_hamal.png&amp;w=700&amp;h=467&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="467" alt="Closeup of comet 12P/Pons-Brooks" style="width:100%;height:auto" loading="lazy" decoding="async"> The same comet mentioned above, taken by a professional astrophotographer. <em>(Credit: Dan Bartlett)</em> </div> </center>
<p>The problem comes when you use images like these for deceptive marketing. I’ve seen advertisements of budget “telescopes” that give you the promise of seeing interesting things such as Saturn’s rings in deep detail or Jupiter’s clouds in high resolution. These have been promptly given the name of <strong>hobby killers</strong> because despite them being cheap and portable, they tend to be overly complicated and junk in quality compared to a higher quality one.</p>
<center> <div style="width:700px"> <img src="https://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F04%2Fastronomy-decline%2Fhobby_killer.png&amp;w=700&amp;h=446&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=0&amp;output=jpg" width="700" height="446" alt="Amazon page of a hobby killer telescope" style="width:100%;height:auto" loading="lazy" decoding="async"> An example of a hobby killer that could be found in Amazon. One of the obvious red flags is that they usually have a phone adapter and have a really high quality “preview” of what you could see. They generally use the Moon for it because it’s harder to tell the difference in quality, but some go bolder, like this one. </div> </center>
<p>With the ability to share high quality pictures of space thanks to Internet, the expectations of children have increased a lot, unless they have a proper understanding of how objects like our planets actually look like through a telescope beforehand.</p>
<div><p>&lt;Yonic&gt;</p><p>Practicing astronomy is a hobby that takes an enormous amount of effort, endurance, and patience. From sleepless nights that could be ruined by clouds, dealing with the cold, wind and other atmospheric conditions like air humidity. Let alone bugs attracted to light on your torches or screens.</p><p>And with light pollution, you may also have to drive for hours to get to a place with decently dark skies, so you might as well consider camping, which adds a lot more to the ordeal. And if the telescope isn’t very good, after all the effort you did bringing your children to a dark and cold place, you might not want to hear them complaining: “BUT IT LOOKS SO FUZZYYYY!”</p><p>One could easily give up if their expectations are not met and don’t have the perseverance to keep trying.</p><p>&lt;/Yonic&gt;</p></div>
 
<p>Now, some who are into astronomy do claim that their hobbies actually had been nurtured by a cheap and janky telescope, and I won’t object to those testimonials. There are many factors that influence on making or breaking astronomy as a passion, and this shouldn’t be the only main factor to consider.</p>
<p>But the lack of understanding when it comes to the numbers and specs of a telescope, alongside the fallacy of “bigger numbers = better” —especially for things like <dfn><abbr title="300 magnification" style="cursor: url('/img/cursors/help.png'), help;">300X</abbr></dfn>— and its exploitation by misleading marketing make giving cheaper telescopes more value than they actually have really easy.</p>
<p>Combined with the ten-fold increase in price of the higher quality telescopes, many parents will end up choosing the cheap and junk scopes. Because apparently spending $1000 once for something that’s “just a hobby” is too much, but <a href="https://projectplay.org/state-of-play-2022/costs-to-play-trends">spending that same amount to take your kids to sports activities in the US <em>yearly</em> will pay off</a>. Sports are still good for many reasons, of course; but a high quality telescope with fairly good maintenance can last you for decades and can be easily sold if your kid decides to drop off astronomy, not much so with sports gear —and <a href="https://edition.cnn.com/2016/01/21/health/kids-youth-sports-parents/index.html">a lot of them will on their teen years</a>.</p>
<p>Astronomy is an expensive hobby, but <strong>that doesn’t really mean you lose a lot by trying it.</strong></p>
<h2 id="so-how-do-we-fix-these-issues">So how do we fix these issues?</h2>
<p class="astro-gicio36m"> <a href="/player/eyewitness/space/stardome" target="_blank" class="astro-gicio36m">Music: Star Dome</a> <i class="astro-gicio36m">(Eyewitness Encyclopedia of Space and the Universe | Ian Hawkridge)</i></p>  
<p>Surprisingly, both light pollution and the “killer” telescopes problems have particularly very simple solutions.</p>
<p>For light pollution, you can have your local community implement <strong>more responsible lighting</strong>. Which means making lights that don’t shoot into the sky with cutoff shields, using less lighting power than necessary, and use them only when necessary. The temperature of the light seems to also have an impact, so preferably use warm white lights over cooler white ones.</p>
<p> <b>YouTube video: </b> <a class="anchor" href="https://www.youtube.com/watch?v=jWgrPyVoV9s" target="_blank" rel="noreferrer noopener">A guide for preventing light pollution in your neighbourhood</a> (10:44) </p>
<p>As for avoiding disappointment of curious children, it’s <strong>mostly a matter of nurturing that curiosity into fondness</strong>. One good way would be to actually save up for a <strong>much more decent telescope</strong>, while consulting on experts on the field about which one to buy and take their advice seriously. They needn’t be a professional astronomer: Just anyone with enough expertise would suffice.</p>
<p> <b>YouTube video: </b> <a class="anchor" href="https://www.youtube.com/watch?v=5SlgkLLs6bM" target="_blank" rel="noreferrer noopener">A guide for avoiding hobby killers</a> (17:55) </p>
<p>A probably even better way would be with hands-on interactions with the astronomy community by attending <strong>star parties</strong>, where they would learn a lot more with the guidance of mentors than just relying on blind experience.</p>
<p>However, just because I said they are simple solutions, they may not be easy to implement:</p>
<ul>
<li>Light pollution regulations may be deemed unpopular due to bureaucratic or sociocultural aspects (North American people love the “lights make street safer” argument, while it’s harder in Europe and Japan to make civil enforcements).</li>
<li>I personally believe that hobbies should happen naturally and be nurtured, and not be forced onto someone. Much like raising a kid, it is a considerable challenge.</li>
</ul>
<p>Nonetheless, if we want to continue enjoying the marvels that has space for us hiding in the night sky, we should be raising awareness on these issues, so as to ensure that one of the most ancestral sciences doesn’t become a thing of the past.</p>
<p>But it may not be all that bad. Improvements in technology allow us to see space with way more detail than in the past centuries. One could still show someone high-definition pictures of these objects and wow them with how they look, and as of recent, the creation of smart telescopes has made astrophotography way more accessible for everyone. And while astronomy is not something that’s usually taught within the standard educational curriculum, Internet allows people to self-educate on the topic (which takes a considerable portion of astronomy enthusiasts, by the way). <strong>As long as the positives outweigh the negatives, astronomy will persevere.</strong></p>]]></content>
    </entry></feed>