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

<rss version="2.0">
<channel>
    <title>The Yonic Corner (Legacy Version)</title>
    <link>http://legacy.yonic.blog</link>
    <ttl>10080</ttl>
    <description>A blog about games, technology, and my hobbies</description>
    <generator>Astro v5.16.8</generator>

        <item>
            <title>Testing Weserv imagess</title>
            <subtitle>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.</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2025/11/weserv</link>
            <link href="http://legacy.yonic.blog/blog/article/2025/11/weserv" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/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>
            <pubDate>2025-07-09T15:30:04.563Z</pubDate>
            <description><![CDATA[<img src="http://media.yonic.blog/?url=https%3A%2F%2Faasnova.org%2Fwp-content%2Fuploads%2F2022%2F07%2Fsig09-004.jpg&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><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:454px"> <img src="http://media.yonic.blog/?url=https%3A%2F%2Fwww.galacticsights.ch%2Fimages%2F20160929_Andromeda_Galaxy_M31.jpg&amp;w=448&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Testing Weserv images!" width="448" height="252"> <div class="figure-caption"> jhdskfhjkdshf </div> </div> </center>]]></description>
    </item>
        <item>
            <title>How Super Mario Galaxy shows coming to terms with separation anxiety</title>
            <subtitle>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.</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2025/08/super-mario-galaxy-separation</link>
            <link href="http://legacy.yonic.blog/blog/article/2025/08/super-mario-galaxy-separation" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/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>
            <pubDate>2025-07-09T15:30:04.563Z</pubDate>
            <description><![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>]]></description>
    </item>
        <item>
            <title>A real computer bug</title>
            <subtitle>Based on an actual experience I had last night.</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2025/07/inked-computer-bug</link>
            <link href="http://legacy.yonic.blog/blog/article/2025/07/inked-computer-bug" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/2025/07/inked-computer-bug" />
            <summary><![CDATA[ Based on an actual experience I had last night. ]]></summary>
            <pubDate>2025-07-09T15:30:04.563Z</pubDate>
            <description><![CDATA[<img src="http://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2025%2F07%2Finked-computer-bug%2Fhero-legacy.png&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><div class="feed-preview"><a href="http://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:454px"> <img src="http://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=448&amp;h=816&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Comic page" width="448" height="816"> <div class="figure-caption"> But no worries! They’ll probably starve before they find anything edible
under the keys. </div> </div> </center></div>]]></description>
    </item>
        <item>
            <title>Apple's Liquid Glass is a design disaster: Here's why</title>
            <subtitle>Just when we thought mobile UI couldn't get any worse, Apple throws the ball and reaches out of the park.</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2025/06/apple-liquid-glass</link>
            <link href="http://legacy.yonic.blog/blog/article/2025/06/apple-liquid-glass" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/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>
            <pubDate>2025-06-16T08:43:36.526Z</pubDate>
            <description><![CDATA[<img src="http://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2025%2F06%2Fapple-liquid-glass%2Fhero-legacy.jpg&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><p><b>Music: </b><a href="/player/style-savvy-trendsetters/salsa/">Store music: Salsa A</a>&nbsp;<span>(Nintendo Presents: New Style Boutique)</span></p> 
<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:454px"> <img src="http://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=448&amp;h=336&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Screenshot of Windows 7, featuring Aero Glass" width="448" height="336">  </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>
<center> <div style="width:400px"> <img src="http://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2025%2F06%2Fapple-liquid-glass%2Ftransparency.png&amp;w=394&amp;h=215&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Screenshot of Windows 7, featuring Aero Glass" width="394" height="215">  </div> </center>
<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><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></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:454px"> <img src="http://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=448&amp;h=251&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Comparison of themes in iOS 26" width="448" height="251"> <div class="figure-caption"> <a href="https://www.youtube.com/watch?v=tMe_5gVeRno">Whose idea was this!?</a> </div> </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:454px"> <img src="http://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=448&amp;h=327&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Comparison of themed icons in Android 13" width="448" height="327"> <div class="figure-caption"> This is even worse than the already terrible themed icons on Android. At least
those have clear contrast. </div> </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>]]></description>
    </item>
        <item>
            <title>Testing 3D videos!</title>
            <subtitle>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.</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2025/02/3d-video-test</link>
            <link href="http://legacy.yonic.blog/blog/article/2025/02/3d-video-test" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/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>
            <pubDate>2025-02-27T13:18:27.236Z</pubDate>
            <description><![CDATA[<img src="http://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2025%2F02%2F3d-video-test%2Fhero-legacy.png&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><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: Kirby 3D test (side-by-side version)</b> (<a href="/video/qtime/kirby3d/side-by-side">QuickTime</a>, <a href="/video/flash/kirby3d/side-by-side">Flash</a>)</p>
<p><b>Video: Kirby 3D test (anaglyph version)</b> (<a href="/video/qtime/kirby3d/anaglyph">QuickTime</a>, <a href="/video/flash/kirby3d/anaglyph">Flash</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><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></p></div>
]]></description>
    </item>
        <item>
            <title>Anti-cheat demystified: What's the big deal about kernel-mode anti-cheat?</title>
            <subtitle>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.</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2024/11/anticheat-demistifyed</link>
            <link href="http://legacy.yonic.blog/blog/article/2024/11/anticheat-demistifyed" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/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>
            <pubDate>2024-11-12T15:11:20.354Z</pubDate>
            <description><![CDATA[<img src="http://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F11%2Fanticheat-demistifyed%2Fhero-legacy.png&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><p><b>Music: </b><a href="/player/cod/bo2/multiplayer/">Multiplayer Mode</a>&nbsp;<span>(Jack Wall | Call of Duty: Black Ops II)</span></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:454px"> <img src="http://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=448&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Questioning in L.A. Noire" width="448" height="252"> <div class="figure-caption"> Press <em>X or □</em> to doubt. </div> </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:454px"> <img src="http://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=448&amp;h=336&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Lie detector in The Simpsons" width="448" height="336"> <div class="figure-caption"> I’ll ask you a few yes or no questions and you just answer truthfully. </div> </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:454px"> <img src="http://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=448&amp;h=230&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Neuralink" width="448" height="230"> <div class="figure-caption"> Now you can have advertisements in your dreams! </div> </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><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></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:454px"> <img src="http://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=448&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Neuralink" width="448" height="252"> <div class="figure-caption"> 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> </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><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></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>]]></description>
    </item>
        <item>
            <title>Download software and plugins for The Yonic Corner Legacy</title>
            <subtitle>For your legacy browsing experience</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2024/10/software-download</link>
            <link href="http://legacy.yonic.blog/blog/article/2024/10/software-download" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/2024/10/software-download" />
            <summary><![CDATA[ For your legacy browsing experience ]]></summary>
            <pubDate>2024-11-01T20:39:32.718Z</pubDate>
            <description><![CDATA[<img src="http://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F10%2Fsoftware-download%2Fhero.png&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><div class="feed-preview"><p>With the <a href="/blog/article/2024/10/internet-archive-attacks">wave of cyberattacks targeting the Internet Archive throughout October of 2024</a>, the largest repository of legacy software —among other things— has been compromised.</p><p>Although you can still get on the Internet all the software that you can use to browse this blog and enjoy most of its features, I decided not to take further risks of link rot, so I will be hosting a copy of all necessary software for browsing the blog to its fullest.</p></div>
<p>The Yonic Corner Legacy fully supports the following operating systems:</p>
<ul>
<li><strong>MS-DOS based Windows</strong>: Windows 95, Windows 98 and Windows ME.</li>
<li><strong>Windows NT</strong>: Windows NT 4.0, Windows 2000, Windows XP.</li>
<li><strong>Mac OS Classic</strong>: PowerPC versions of Mac OS 8.6 and Mac OS 9.</li>
</ul>
<p>Older releases might only work with the basic features.</p>
<p>I have packaged all of the software so that you can download them directly from the operating system of your choice, but I also offer the <a href="//www.yonic.blog/file/static/downloads/Yonic_Corner_Legacy_Software_Pack.iso">whole collection as an ISO image file</a> that you can use in emulators and virtual machines, as well as physical computers if you burn them into a CD.<br><small> <b>MD5:</b> <code>8aad37b899aec6f314759486e237ac2a</code>  </small></p>
<table class="alert-box"> <tbody><tr> <td class="icon"> <img alt="Earliest recommended software only!" src="/icons/alert/alert.gif" width="64" height="64"> </td> <td> <div class="data"> <p class="title">Earliest recommended software only!</p> This only contains a list of the oldest versions supported and recommended
for viewing this blog and make use of all its features.<br><br>
In general, you should try to go for the latest supported version. </div> </td> </tr> </tbody></table> 
<h2 id="verifying-downloads">Verifying downloads</h2>
<p>As you saw above, you’ll also find an MD5 checksum, a string of numbers and letters to verify that the file is genuine and has been downloaded correctly. Even if just a single bit of the file was altered during download (possible reasons range from an error during transfer to compromised files by switching legit ones for malicious ones), when you get its MD5 checksum it will be <em>completely</em> different.</p>
<p>In legacy systems, you will need an external program to calculate its checksum:</p>
<ul>
<li>For Windows, you can use the <a href="//www.yonic.blog/file/static/downloads/legacy-windows/GFSW.EXE">GUI File Signature Widget</a>.<br>
<small> <b>MD5:</b> <code>0c726ad4d87684a58d765540547b1f45</code>  </small>
</li>
<li>For Mac, this program called <a href="//www.yonic.blog/file/static/downloads/legacy-mac/Checksum_0_0.sit">Checksum</a> should work.<br>
<small> <b>MD5:</b> <code>e63a76b937006f44a26ec2a7042f4ef0</code>  </small>
</li>
</ul>
<p>And yes, you can throw the checksum checker itself into the program!</p>
<p>Note that it can take quite a while for large files. For ISO files, I recommend using a modern system instead, which will probably already come with some tools for doing this.</p>
<h2 id="recommended-browsers">Recommended browsers</h2>
<h3 id="windows">Windows</h3>
<ul>
<li><a href="//www.yonic.blog/file/static/downloads/legacy-windows/IE55.EXE">Internet Explorer 5.5 + Active Desktop</a><br>
<small> <b>MD5:</b> <code>f20a676fb5a06789d7c54600e74be595</code>  </small>
</li>
<li><a href="//www.yonic.blog/file/static/downloads/legacy-windows/FIREFOX2.EXE">Mozilla Firefox 2</a>
<em>(my recommendation)</em><br>
<small> <b>MD5:</b> <code>be504a7c00f29b5feb332a51f7d68f69</code>  </small>
</li>
<li><a href="//www.yonic.blog/file/static/downloads/legacy-windows/KMELEON.EXE">K-Meleon</a><br>
<small> <b>MD5:</b> <code>108e8eb17930f9aff7b822990f18b1c4</code>  </small>
</li>
</ul>
<p>I would provide a download for Opera 9, but it seems like installers are broken without the proper installer engines installed, which can’t be obtained online anymore and haven’t been properly archived yet.</p>
<div><p><b>&lt;Yonic&gt;</b></p><p>Special thanks to the <strong>Windows Update Restored</strong> team for helping me in providing a custom copy of an Internet Explorer 5.5 installer with the Windows Desktop Update included!</p><p>Otherwise, you’d have to install IE4 first, and then update to IE5.5 to be able to install the <a href="/blog/active-desktop/">blog sidebar</a>!</p><p><b>&lt;/Yonic&gt;</b></p></div>

<h3 id="mac-os">Mac OS</h3>
<ul>
<li><a href="//www.yonic.blog/file/static/downloads/legacy-mac/netscape7_02.sit">Netscape 7</a><br>
<small> <b>MD5:</b> <code>40a89f35c6bd26d32231c02803fb4566</code>  </small>
</li>
<li><a href="//www.yonic.blog/file/static/downloads/legacy-mac/Classilla9.3.4b.sit">Classilla 9.0.4b</a>
<em>(my recommendation)</em><br>
<small> <b>MD5:</b> <code>0c606e8e8b70b2b86caa7dd7de2e7fa3</code>  </small>
</li>
</ul>
<h2 id="music-player">Music player</h2>
<ul>
<li>Windows: <a href="//www.yonic.blog/file/static/downloads/legacy-windows/FLASHPL6.EXE">Flash Player 6</a><br>
<small> <b>MD5:</b> <code>0ef597a2bbf3e05f84d8676609f9378a</code>  </small>
</li>
<li>Mac: <a href="//www.yonic.blog/file/static/downloads/legacy-mac/Flash_Player_6.sit">Flash Player 6</a>.
It’s quite likely that you have an installer already in your system, or it’s
already installed.<br>
<small> <b>MD5:</b> <code>42ac40225394d507fcb6cc3ef35e03e5</code>  </small>
</li>
</ul>
<div><p><b>Yonic:</b> <strong>I don’t recommend getting Flash Player 7</strong>, even though it’s the latest supported version for Windows 95, NT 4.0, and Mac OS 8 and 9. Especially if you’re running an emulator or a virtual machine, as it’s prone to crashing the browser and sometimes even the emulator altogether depending on the video driver that you may have installed.</p></div>

<h2 id="east-asian-language-support">East Asian language support</h2>
<p>For more information about displaying asian languages, check <a href="/blog/article/2024/02/legacy-asian-language-support">this post</a>.</p>
<ul>
<li><strong>Windows:</strong> <a href="//www.yonic.blog/file/static/downloads/legacy-windows/IE55.EXE">Internet Explorer 5.5 + Active Desktop</a>
also comes with installers for extra language packs. The Japanese, Korean and
both Traditional and Simplified Chinese Display Support features are what you
are looking for the most.<br>
<small> <b>MD5:</b> <code>f20a676fb5a06789d7c54600e74be595</code>  </small>
<ul>
<li>If you don’t want to install Internet Explorer 5.5, I also provide some
<a href="//www.yonic.blog/file/static/downloads/legacy-windows/LANGPAKS.EXE">language packs separately</a>,
although these are not as updated.<br>
<small> <b>MD5:</b> <code>e975d2ab4460bdc201a4c5db74771452</code>  </small>
</li>
</ul>
</li>
<li><strong>Mac OS Classic</strong>: <a href="//www.yonic.blog/file/static/downloads/legacy-mac/Apple_MacOS_9.0.4.iso">Mac OS 9 Installation Disk</a>
(this link downloads an ISO file, not to be used in an actual Mac unless you’re
burning the image into a CD)<br>
<small> <b>MD5:</b> <code>bc3ffbc1bce88f5d1bfe3266bded05fe</code>  </small>
</li>
</ul>
<h2 id="web-feeds">Web feeds</h2>
<p>I don’t know of any RSS feeds for Mac, but I am willing to add it here if there are any for Mac OS 9.</p>
<p>On Windows, Mozilla Firefox 2 has native support for RSS feeds, but maybe Omea Reader works well in Windows 9x.</p>]]></description>
    </item>
        <item>
            <title>Adding The Yonic Corner to your Windows desktop</title>
            <subtitle>Only for Windows 95 with the Desktop Update and all versions of Windows 98 until 32-bit Windows XP!</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2024/09/active-desktop</link>
            <link href="http://legacy.yonic.blog/blog/article/2024/09/active-desktop" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/2024/09/active-desktop" />
            <summary><![CDATA[ Only for Windows 95 with the Desktop Update and all versions of Windows 98 until 32-bit Windows XP! ]]></summary>
            <pubDate>2024-11-01T16:09:58.617Z</pubDate>
            <description><![CDATA[<img src="http://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F09%2Factive-desktop%2Fhero-legacy.png&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><div class="feed-preview"><p><b>Music: </b><a href="/player/windowsy/welcome-xp/">Velkommen</a>&nbsp;<span>(Stan LePard | Internet Explorer Starter Kit)</span></p> <p>If you’re viewing the Legacy version of The Yonic Corner in a 32-bit version of Windows 95 through 32-bit XP, <strong>you can now install the Yonic Corner’s Active Desktop widget</strong> to your desktop.</p><p>This will display on your desktop a sidebar with the latest posts in the blog, and it will remain updated as long as you’re connected to the internet. Simply follow the steps in this post to install it.</p></div>
<h2 id="windows-95-and-nt-40">Windows 95 and NT 4.0</h2>
<p>If you’re running Windows 95, you need to make sure you’ve installed the <strong>Windows Desktop Update</strong>. If you have a Windows 98-like interface in the explorer windows, or you have “Active Desktop” or any HTML page as a background, then you already have it installed and you can skip to the next section.</p>
<p>The update can easily be installed via the installation of Internet Explorer 4. If you have Windows 95 OSR2.5, then it’s likely you already have Internet Explorer 4 and Active Desktop, too.</p>
<p>However, do note that The Yonic Corner supports Internet Explorer 5 and newer, but fortunately, with the help of the Windows Update Restored team, I provide an <a href="//www.yonic.blog/file/static/downloads/legacy-windows/IE55.EXE">Internet Explorer 5.5 installer with the option to install Active Desktop as well</a>.</p>
<p>Once you’ve got the update installed, advance to the next section.</p>
<h2 id="windows-98-me-nt-40-and-2000">Windows 98, Me, NT 4.0 and 2000</h2>
<p>Simply <a href="/active-channel/desktop.cdf">click here</a> and you should be prompted to install the Active Desktop item.</p>
<p>I think Windows Me can also install it with just one click but I haven’t been able to test it.</p>
<h2 id="windows-xp">Windows XP</h2>
<p>The 32-bit versions of Windows XP will not be able to recognize the link from above, but you still are capable of installing it to your desktop manually.</p>
<ol>
<li>Right click on the desktop and select “<strong>Properties…</strong>”</li>
<li>In the “<strong>Desktop</strong>” tab, click on the “<strong>Customize desktop…</strong>” tab</li>
<li>In the new window, click on the “<strong>Web</strong>” window and then on the button “<strong>New…</strong>”</li>
<li>In the Location text field, paste the following URL: <strong><a href="http://legacy.yonic.blog/active-channel/desktop.cdf">http://legacy.yonic.blog/active-channel/desktop.cdf</a></strong></li>
<li>Make sure that the Active Desktop item obtained is named “The Yonic Corner Sidebar” and click on “<strong>OK</strong>”.</li>
<li>Check that in the Active Desktop items list there is an item called The Yonic Corner Sidebar and that its <strong>checkbox is checked</strong>. Then, click <strong>OK</strong>.</li>
<li>Click either <strong>OK</strong> or <strong>Apply</strong> to the Desktop Properties window.</li>
</ol>
<h2 id="a-long-gone-technology">A long gone technology</h2>
<p>Active Desktop and its companion technology, Active Channels, didn’t get good reception when first introduced with Internet Explorer 4. It tightened the integration of the web browser and legacy Windows systems, and it was relatively unstable, let alone the fact that it seemed like it was “adding ads and clutter to the desktop”.</p>
<div><p><b>&lt;Yonic&gt;</b></p><p>Boy, sure they were unfortunate back then!</p><p>Fast forward 30 years and now they are <em>everywhere</em>! It’s like every single piece of UI has ads in them!</p><p><b>&lt;/Yonic&gt;</b></p></div>

<p><strong>The 64-bit versions of Windows XP do not come with Active Desktop</strong>, and since Windows Vista, it was completely removed from all versions. Windows Vista and 7 have their own version of “desktop gadgets”, but those were also removed in Windows 8.</p>
<p>Nowadays, if you want to experience something similar to Active Channels, <a href="/blog/article/2024/04/web-feeds-are-taking-back-your-internet">web feeds</a> are the current standard for syndicated content you subscribe to.</p>]]></description>
    </item>
        <item>
            <title>The ultimate guide for installing East Asian languages support for legacy Windows and Mac OS Classic</title>
            <subtitle>This is a guide for installing support for East Asian languages for Windows 9x, Windows NT, and Mac OS Classic.</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2024/02/legacy-asian-language-support</link>
            <link href="http://legacy.yonic.blog/blog/article/2024/02/legacy-asian-language-support" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/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>
            <pubDate>2024-11-01T16:09:58.617Z</pubDate>
            <description><![CDATA[<img src="http://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-legacy.png&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><div class="feed-preview"><p>Sometimes, my blog will have some texts displayed in east Asian languages (mostly Japanese).</p><p></p><p>In the Legacy version (the one you’re looking at right now), said posts will display an alert box like the one above. If you’re browsing with an old operating system without additional support for East Asian languages, strange text may appear.</p><p></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:454px"> <img src="http://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=448&amp;h=336&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" alt="Windows Update Version 3.1 on Windows NT 4.0" width="448" height="336"> <div class="figure-caption"> Windows Update Restored running under Windows NT 4.0, with the East Asian language support installed </div> </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="http://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=406&amp;h=257&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" alt="Step 1" width="400" height="257">  </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="http://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=406&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" alt="Step 2" width="400" height="252">  </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="http://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=406&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" alt="Step 3" width="400" height="252">  </div> </center></center>
<center><center> <div style="width:400px"> <img src="http://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=406&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" alt="Step 4" width="400" height="252">  </div> </center></center>
<ol start="4">
<li>Then click “<strong>Select</strong>”.</li>
</ol>
<center><center> <div style="width:400px"> <img src="http://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=406&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" alt="Step 5" width="400" height="252">  </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="http://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=406&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=gif" alt="Step 6" width="400" height="252">  </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="http://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=406&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=gif" alt="Step 7" width="400" height="252">  </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="http://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=406&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=gif" alt="Step 8" width="400" height="252">  </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="http://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=406&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=gif" alt="Step 9" width="400" height="252">  </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 translate="no"> 東京<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 translate="no"> 北京<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 translate="no"> 臺北<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 translate="no"> 서울<rp>(</rp><rt>Seoul</rt><rp>)</rp> </ruby></span> is how Seoul is written in Korean.</li>
</ul>]]></description>
    </item>
        <item>
            <title>The Internet Archive attacks: A crime against humanity</title>
            <subtitle>Hackers hit the lowest point of bad things they could've done.</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2024/10/internet-archive-attacks</link>
            <link href="http://legacy.yonic.blog/blog/article/2024/10/internet-archive-attacks" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/2024/10/internet-archive-attacks" />
            <summary><![CDATA[ Hackers hit the lowest point of bad things they could've done. ]]></summary>
            <pubDate>2024-10-21T15:39:32.718Z</pubDate>
            <description><![CDATA[<img src="http://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F10%2Finternet-archive-attacks%2Fhero-legacy.png&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><p><b>Music: </b><a href="/player/harry-potter/ea-games/diagon-alley/">Diagon Alley</a>&nbsp;<span>(Jeremy Soule | Harry Potter EA Games)</span></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><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></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><b>Music: </b><a href="/player/harry-potter/ea-games/happy-hogwarts/">Happy Hogwarts (casual variation)</a>&nbsp;<span>(Jeremy Soule | Harry Potter EA Games)</span></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><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></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>]]></description>
    </item>
        <item>
            <title>Making The Yonic Corner Legacy: The layout</title>
            <subtitle>Part two of how I made my blog compatible for old browsers, this time it's about how I put the design in practice.</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2024/09/making-legacy-2</link>
            <link href="http://legacy.yonic.blog/blog/article/2024/09/making-legacy-2" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/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>
            <pubDate>2024-09-24T12:21:23.470Z</pubDate>
            <description><![CDATA[<img src="http://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F09%2Fmaking-legacy-2%2Fhero-legacy.png&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><p><b>Music: </b><a href="/player/windowsy/jive-xg/">JIVE.MID (Microsoft GS Wavetable)</a>&nbsp;<span>(Sam Cardon | Yamaha XG Sample MIDI)</span></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><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></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="http://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=341&amp;h=472&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Box model diagram" width="341" height="472"> <div class="figure-caption"> 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> </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>  <pre class="astro-code min-dark" style="background-color:#1f1f1f;color:#b392f0; overflow-x: auto;" tabindex="0" data-language="css"><code><span class="line"><span class="line-marker"> </span><span style="color:#B392F0">.one {</span></span>
<span class="line"><span class="line-marker"> </span><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 class="line-marker"> </span><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 class="line-marker"> </span><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 class="line-marker"> </span><span style="color:#B392F0">}</span></span></code></pre> </div> 
<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>  <pre class="astro-code min-dark" style="background-color:#1f1f1f;color:#b392f0; overflow-x: auto;" tabindex="0" data-language="css"><code><span class="line"><span class="line-marker"> </span><span style="color:#B392F0">.two {</span></span>
<span class="line"><span class="line-marker"> </span><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 class="line-marker"> </span><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 class="line-marker"> </span><span style="color:#B392F0">}</span></span></code></pre> </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><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></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>  <pre class="astro-code min-dark" style="background-color:#1f1f1f;color:#b392f0; overflow-x: auto;" tabindex="0" data-language="css"><code><span class="line"><span class="line-marker"> </span><span style="color:#FFAB70">*</span><span style="color:#B392F0"> {</span></span>
<span class="line"><span class="line-marker"> </span><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 class="line-marker"> </span><span style="color:#B392F0">}</span></span></code></pre> </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:454px"> <img src="http://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=448&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Beta design" width="448" height="252"> <div class="figure-caption"> 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> </div> </center>
<center> <div style="width:454px"> <img src="http://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=448&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" alt="Final design mockup" width="448" height="252"> <div class="figure-caption"> 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> </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>  <pre class="astro-code min-dark" style="background-color:#1f1f1f;color:#b392f0; overflow-x: auto;" tabindex="0" data-language="html"><code><span class="line"><span class="line-marker"> </span><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 class="line-marker"> </span><span style="color:#6B737C">&lt;!--[if gte IE 6]&gt;&lt;!--&gt;</span></span>
<span class="line"><span class="line-marker"> </span><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 class="line-marker"> </span><span style="color:#6B737C">&lt;!--&lt;![endif]--&gt;</span></span>
<span class="line"><span class="line-marker"> </span></span>
<span class="line"><span class="line-marker"> </span><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 class="line-marker"> </span><span style="color:#6B737C">&lt;!--[if lt IE 6]&gt;</span></span>
<span class="line"><span class="line-marker"> </span><span style="color:#6B737C">&lt;link href="ie5only.css" rel="stylesheet"&gt;</span></span>
<span class="line"><span class="line-marker"> </span><span style="color:#6B737C">&lt;![endif]--&gt;</span></span></code></pre> </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> <b>hack.html:</b><br> <pre class="astro-code min-dark" style="background-color:#1f1f1f;color:#b392f0; overflow-x: auto;" tabindex="0" data-language="html"><code><span class="line"><span class="line-marker"> </span><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 class="line-marker"> </span><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 class="line-marker"> </span><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 class="line-marker"> </span><span style="color:#B392F0">      This will measure 500px exactly!</span></span>
<span class="line"><span class="line-marker"> </span><span style="color:#B392F0">    &lt;/</span><span style="color:#FFAB70">div</span><span style="color:#B392F0">&gt;</span></span>
<span class="line"><span class="line-marker"> </span><span style="color:#B392F0">  &lt;/</span><span style="color:#FFAB70">div</span><span style="color:#B392F0">&gt;</span></span>
<span class="line"><span class="line-marker"> </span><span style="color:#B392F0">&lt;/</span><span style="color:#FFAB70">div</span><span style="color:#B392F0">&gt;</span></span></code></pre> </div> 
<div> <b>hack.css:</b><br> <pre class="astro-code min-dark" style="background-color:#1f1f1f;color:#b392f0; overflow-x: auto;" tabindex="0" mark="4-11" data-language="css"><code><span class="line"><span class="line-marker"> </span><span style="color:#FFAB70">*</span><span style="color:#B392F0"> {</span></span>
<span class="line"><span class="line-marker"> </span><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 class="line-marker"> </span><span style="color:#B392F0">}</span></span>
<span class="line marked"><span class="line-marker"> </span><span style="color:#B392F0">.container {</span></span>
<span class="line marked"><span class="line-marker"> </span><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 class="line-marker"> </span><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 class="line-marker"> </span><span style="color:#B392F0">}</span></span>
<span class="line marked"><span class="line-marker"> </span><span style="color:#B392F0">.padding-box {</span></span>
<span class="line marked"><span class="line-marker"> </span><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 class="line-marker"> </span><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 class="line-marker"> </span><span style="color:#B392F0">}</span></span>
<span class="line"><span class="line-marker"> </span><span style="color:#B392F0">.content {</span></span>
<span class="line"><span class="line-marker"> </span><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 class="line-marker"> </span><span style="color:#B392F0">}</span></span></code></pre> </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><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></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>]]></description>
    </item>
        <item>
            <title>Webcore Bliss</title>
            <subtitle>What if the famous Windows XP wallpaper was made in the 1990s?</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2024/09/bliss-90s</link>
            <link href="http://legacy.yonic.blog/blog/article/2024/09/bliss-90s" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/2024/09/bliss-90s" />
            <summary><![CDATA[ What if the famous Windows XP wallpaper was made in the 1990s? ]]></summary>
            <pubDate>2024-09-19T21:27:47.400Z</pubDate>
            <description><![CDATA[<img src="http://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F09%2Fbliss-90s%2Fhero-legacy.png&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><div class="feed-preview"><a href="http://yonic.blog/file/img/blog/art/renders/bliss-90s.png" target="_blank" rel="noreferrer">Click here for full image</a><center> <div style="width:454px"> <img src="http://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=448&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" alt="Bliss wallpaper in a 90s style" width="448" height="252"> <div class="figure-caption"> What if the famous Windows XP wallpaper was made in the 1990s? </div> </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><b>&lt;Yonic&gt;</b></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="http://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=394&amp;h=274&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="The Amazing Digital Circus logo in the intro" width="394" height="274">  </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><b>&lt;/Yonic&gt;</b></p></div>
]]></description>
    </item>
        <item>
            <title>Gaming isn't crashing: It's stagnating, but it's still going to be very painful.</title>
            <subtitle>Instead of the promised raytracing generation, darkness awaits us. But this is normal.</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2024/08/games-aaa-stagnation</link>
            <link href="http://legacy.yonic.blog/blog/article/2024/08/games-aaa-stagnation" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/2024/08/games-aaa-stagnation" />
            <summary><![CDATA[ Instead of the promised raytracing generation, darkness awaits us. But this is normal. ]]></summary>
            <pubDate>2024-09-02T13:19:44.102Z</pubDate>
            <description><![CDATA[<img src="http://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F08%2Fgames-aaa-stagnation%2Fhero-legacy.png&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><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><b>Music: </b><a href="/player/sims2/busy-sim/">Busy Sim</a>&nbsp;<span>(Mark Mothersbaugh | The Sims 2)</span></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:454px"> <img src="http://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=448&amp;h=309&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=100&amp;output=jpg" alt="A graph showing how game companies from the United States act like" width="448" height="309"> <div class="figure-caption"> 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> </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><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></p></div>

<h2 id="indies-and-the-lack-of-funding">Indies and the lack of funding</h2>
<p><b>Music: </b><a href="/player/last-window/neon-lights/">Neon Lights</a>&nbsp;<span>(Satoshi Okubo | Last Window: The Secret of Cape West)</span></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><b>Music: </b><a href="/player/pokemon/bw2/route-4-spring/">Route 4 (Spring)</a>&nbsp;<span>(Shota Kageyama | Pokémon Black &amp; White: Super Music Collection)</span></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><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></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="http://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=394&amp;h=163&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="A post I made on X about the current situation of gaming" width="394" height="163"> <div class="figure-caption"> 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> </div> </center>]]></description>
    </item>
        <item>
            <title>Inked thoughts: The Tower of Scope</title>
            <subtitle>Games were easier to make in the past.</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2024/08/comic-tower-scope</link>
            <link href="http://legacy.yonic.blog/blog/article/2024/08/comic-tower-scope" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/2024/08/comic-tower-scope" />
            <summary><![CDATA[ Games were easier to make in the past. ]]></summary>
            <pubDate>2024-08-23T15:58:03.761Z</pubDate>
            <description><![CDATA[<img src="http://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F08%2Fcomic-tower-scope%2Fhero-legacy.png&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><div class="feed-preview"><a href="http://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="http://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=394&amp;h=1103&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Comic page" width="394" height="1103"> <div class="figure-caption"> My game projects are all located at 100 parsecs away. </div> </div> </center></div>]]></description>
    </item>
        <item>
            <title>The rise and fall of web profile customization</title>
            <subtitle>Before the 2010s, you were able to customize your profile pages however you pleased. Not anymore.</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2024/08/web-profile-customization</link>
            <link href="http://legacy.yonic.blog/blog/article/2024/08/web-profile-customization" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/2024/08/web-profile-customization" />
            <summary><![CDATA[ Before the 2010s, you were able to customize your profile pages however you pleased. Not anymore. ]]></summary>
            <pubDate>2024-08-15T08:40:09.129Z</pubDate>
            <description><![CDATA[<img src="http://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F08%2Fweb-profile-customization%2Fhero-legacy.png&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><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><b>Music: </b><a href="/player/kirby/64/pop-star/">Pop Star</a>&nbsp;<span>(Jun Ishikawa | Kirby 64)</span></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><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></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:454px"> <img src="http://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=448&amp;h=283&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Custom HTML in Neopets" width="448" height="283"> <div class="figure-caption"> Websites like Neopets quickly started filtering out potentially malicious HTML, mainly <code>&lt;script&gt;</code> tags. </div> </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:454px"> <img src="http://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=448&amp;h=435&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=90&amp;output=jpg" alt="YouTube in 2010" width="448" height="435"> <div class="figure-caption"> 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> </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:454px"> <img src="http://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=448&amp;h=273&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Images hosted on TinyPic were removed" width="448" height="273"> <div class="figure-caption"> Some image hosting sites would infamously show a generic placeholder image for those images that have been automatically removed. </div> </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><b>Music: </b><a href="/player/gt4/gt-mode-2/">GT Mode 2</a>&nbsp;<span>(Isamu Ohira | Gran Turismo 4)</span></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:454px"> <img src="http://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=448&amp;h=227&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="BLISS OS blog screenshot" width="448" height="227"> <div class="figure-caption"> 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> </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> <b>adRemoval.css:</b><br> <pre class="astro-code min-dark" style="background-color:#1f1f1f;color:#b392f0; overflow-x: auto;" tabindex="0" data-language="css"><code><span class="line"><span class="line-marker"> </span><span style="color:#B392F0">.ad {</span></span>
<span class="line"><span class="line-marker"> </span><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 class="line-marker"> </span><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 class="line-marker"> </span><span style="color:#B392F0">}</span></span></code></pre> </div> 
<div> <b>adDisabling.js:</b><br> <pre class="astro-code min-dark" style="background-color:#1f1f1f;color:#b392f0; overflow-x: auto;" tabindex="0" data-language="js"><code><span class="line"><span class="line-marker"> </span><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 class="line-marker"> </span><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 class="line-marker"> </span><span style="color:#79B8FF">    ad</span><span style="color:#B392F0">.remove();</span></span>
<span class="line"><span class="line-marker"> </span><span style="color:#B392F0">}</span></span></code></pre> </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:454px"> <img src="http://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=448&amp;h=288&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Redesign of a website done by a student" width="448" height="288"> <div class="figure-caption"> 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> </div> </center>
<center> <div style="width:454px"> <img src="http://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=448&amp;h=225&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Zara's new website" width="448" height="225"> <div class="figure-caption"> 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> </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>]]></description>
    </item>
        <item>
            <title>The Yonic Corner is now self-hosted</title>
            <subtitle>Away from the cloud we go!</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2024/08/self-hosted-blog</link>
            <link href="http://legacy.yonic.blog/blog/article/2024/08/self-hosted-blog" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/2024/08/self-hosted-blog" />
            <summary><![CDATA[ Away from the cloud we go! ]]></summary>
            <pubDate>2024-08-07T11:11:36.703Z</pubDate>
            <description><![CDATA[<p><b>Music: </b><a href="/player/paper-mario-ttyd/chara/">Teaching new stuff!</a>&nbsp;<span>(Paper Mario: The Thousand-Year Door)</span></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><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></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>]]></description>
    </item>
        <item>
            <title>What does the Moon look like at the equator?</title>
            <subtitle>The Moon looks upside down in the southern hemisphere compared to the northern one. But what about the equator?</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2024/07/moon-shapes</link>
            <link href="http://legacy.yonic.blog/blog/article/2024/07/moon-shapes" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/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>
            <pubDate>2024-07-14T16:55:08.130Z</pubDate>
            <description><![CDATA[<img src="http://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F07%2Fmoon-shapes%2Fhero-legacy.png&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><p><b>Music: </b><a href="/player/space-engine/moon/">The Moon</a>&nbsp;<span>(Ashterra | Space Engine)</span></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:454px"> <img src="http://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=448&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=png" alt="Moonrise and moonset with waxing crescent" width="448" height="252"> <div class="figure-caption"> 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> </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 class="figure-neue" style="background:#101938;width:454px"> <div class="figure-container" style=""> <img src="http://yonic-corner.vulpes.life/static/img/moon-shapes/moon-track-opt.gif" alt="Moonrise and moonset with waxing crescent" width="448" height="254"><div class="figure-caption" style=""> 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> </div> </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>]]></description>
    </item>
        <item>
            <title>Overly analyzing Metroid Prime 4's reveal trailer</title>
            <subtitle>Metroid Prime 4 has managed to stay in the game.</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2024/07/metroid-prime-4-trailer-analysis</link>
            <link href="http://legacy.yonic.blog/blog/article/2024/07/metroid-prime-4-trailer-analysis" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/2024/07/metroid-prime-4-trailer-analysis" />
            <summary><![CDATA[ Metroid Prime 4 has managed to stay in the game. ]]></summary>
            <pubDate>2024-07-01T18:25:44.348Z</pubDate>
            <description><![CDATA[<img src="http://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-legacy.png&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><p><b>Music: </b><a href="/player/metroid-prime/tallon-overworld/">Tallon Overworld</a>&nbsp;<span>(Kenji Yamamoto | Metroid Prime)</span></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="http://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=394&amp;h=370&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Official Nintendo tweet about the successor" width="394" height="370"> <div class="figure-caption"> Screenshot of the announcement of the Switch’s successor. </div> </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><b>Music: </b><a href="/player/metroid-prime-2/space-pirates-ambience/">Space Pirates Ambience</a>&nbsp;<span>(Kenji Yamamoto | Metroid Prime 2: Echoes)</span></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:454px"> <img src="http://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=448&amp;h=422&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Hints of portals in Prime 4" width="448" height="422"> <div class="figure-caption"> 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> </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:454px"> <img src="http://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=448&amp;h=234&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="HUD in Prime 4" width="448" height="234"> <div class="figure-caption"> 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> </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:454px"> <img src="http://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=448&amp;h=399&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Someone's comments on Sylux" width="448" height="399"> <div class="figure-caption"> Some comments on how Sylux’s sudden appearance in a new title could make it unwelcoming towards newcomers. </div> </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:454px"> <img src="http://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=448&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Sylux in Metroid Prime 4" width="448" height="252"> <div class="figure-caption"> 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> </div> </center>
<div><p><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></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><b>Music: </b><a href="/player/metroid-prime-3/norion/">Tensions in Norion</a>&nbsp;<span>(Kenji Yamamoto | Metroid Prime 3: Corruption)</span></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:454px"> <img src="http://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=448&amp;h=213&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Metroid Prime 4 compared to Metroid Prime Remastered" width="448" height="213"> <div class="figure-caption"> <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> </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><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></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>]]></description>
    </item>
        <item>
            <title>My trip to Japan 2023: Days 4 to 6</title>
            <subtitle>These three days me and my friend focus on visiting Tokyo and the neighboring city of Yokohama. And more Gundam.</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2024/05/my-trip-to-japan-2023-days-4-to-6</link>
            <link href="http://legacy.yonic.blog/blog/article/2024/05/my-trip-to-japan-2023-days-4-to-6" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/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>
            <pubDate>2024-05-16T22:32:30.413Z</pubDate>
            <description><![CDATA[<img src="http://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-legacy.png&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><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><b>Music: </b><a href="/player/pokemon/gs/game-corner/">Game Corner</a>&nbsp;<span>(Go Ichinose | Pokémon Gold &amp; Silver: Super Music Collection)</span></p> 
<center> <div style="width:454px"> <img src="http://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=448&amp;h=336&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Akihabara" width="448" height="336">  </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:454px"> <img src="http://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=448&amp;h=336&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Shin-chan figurines" width="448" height="336"> <div class="figure-caption"> Kazama fell down in Radio Kaikan. I guess this is very in-character for him. </div> </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:454px"> <img src="http://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=448&amp;h=527&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="The lineup of merchandise for hardcore Metroid fans" width="448" height="527"> <div class="figure-caption"> A Samus Figma and two amiibo of Metroid: Samus Returns. I had my Samus Returns 3DS before we went to Japan. </div> </div> </center>
<p><b>Music: </b><a href="/player/metroid/brinstar-tetris/">Catch Mode (Brinstar remix)</a>&nbsp;<span>(Tetris DS)</span></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:454px"> <img src="http://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=448&amp;h=336&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Nintendo 64 games on sale" width="448" height="336"> <div class="figure-caption"> 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> </div> </center>
<center> <div style="width:454px"> <img src="http://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=448&amp;h=597&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Virtual Boy" width="448" height="597"> <div class="figure-caption"> An actual Virtual Boy! Unfortunately, it was out of order. </div> </div> </center>
<center> <div style="width:454px"> <img src="http://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=448&amp;h=597&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="A statue of Fox McCloud from Star Fox 64" width="448" height="597"> <div class="figure-caption"> The name’s Fox McCloud, Star Fox is the name of my team! </div> </div> </center>
<center> <div style="width:454px"> <img src="http://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=448&amp;h=336&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Vintage game corner" width="448" height="336"> <div class="figure-caption"> At the top floor, there is a vintage game corner that I absolutely loved. </div> </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:454px"> <img src="http://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=448&amp;h=503&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="One of the iconic SEGA buildings" width="448" height="503"> <div class="figure-caption"> 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> </div> </center>
<div><p><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></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:454px"> <img src="http://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=448&amp;h=320&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="A strikingly painted car" width="448" height="320"> <div class="figure-caption"> 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> </div> </center>
<h2 id="day-5-asakusa-sumida-and-odaiba">Day 5: Asakusa, Sumida and Odaiba</h2>
<p><b>Music: </b><a href="/player/pokemon/hgss/cherrygrove/">Cherrygrove City</a>&nbsp;<span>(Go Ichinose | Pokémon HeartGold &amp; SoulSilver: Super Music Collection)</span></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:454px"> <img src="http://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=448&amp;h=336&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Paintings on rolling gates" width="448" height="336"> <div class="figure-caption"> 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> </div> </center>
<center> <div style="width:454px"> <img src="http://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=448&amp;h=336&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="A painting of an ancient street" width="448" height="336"> <div class="figure-caption"> A painting on what I presume it’s how this street used to look in Edo (ancient Tokyo) </div> </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:454px"> <img src="http://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=448&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="The main hall of Sensō-ji" width="448" height="252"> <div class="figure-caption"> The main area of the temple. </div> </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:454px"> <img src="http://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=448&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="The main hall of Sensō-ji" width="448" height="252"> <div class="figure-caption"> 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> </div> </center>
<div><p><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></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:454px"> <img src="http://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=448&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Nakamise street" width="448" height="252"> <div class="figure-caption"> Before we even reached the Kaminari gate, it was already overrun with tourists and believers alike. </div> </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="http://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=394&amp;h=222&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Dango on a stick" width="394" height="222"> <div class="figure-caption"> I also got to eat some really sweet dango! </div> </div> </center>
<center> <div style="width:450px"> <img src="http://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=444&amp;h=592&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Star Wars promotional book" width="444" height="592"> <div class="figure-caption"> 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> </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:454px"> <img src="http://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=448&amp;h=597&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Pikachu vending machine" width="448" height="597"> <div class="figure-caption"> 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> </div> </center>
<center> <div style="width:454px"> <img src="http://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=448&amp;h=336&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="A statue at Ushijima shrine" width="448" height="336"> <div class="figure-caption"> A statue in Ushijima shrine, which reveres the god of oxes and is at least 1150 years old. </div> </div> </center>
<center> <div style="width:454px"> <img src="http://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=448&amp;h=597&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Tokyo Skytree next to a torii gate" width="448" height="597"> <div class="figure-caption"> 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> </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><b>Music: </b><a href="/player/daft-punk/hbfs/">Harder, Better, Faster, Stronger</a>&nbsp;<span>(Daft Punk | Discovery)</span></p> 
<center> <div style="width:454px"> <img src="http://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=448&amp;h=597&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="The golden turd" width="448" height="597"> <div class="figure-caption"> 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> </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:454px"> <img src="http://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=448&amp;h=282&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="The Emeraldas" width="448" height="282"> <div class="figure-caption"> 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> </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:454px"> <img src="http://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=448&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="The Rainbow Bridge from the Odaiba dock" width="448" height="252"> <div class="figure-caption"> The Emeraldas crossed the Rainbow Bridge, seen here from Odaiba. </div> </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><b>Music: </b><a href="/player/gundam/unicorn/">Unicorn</a>&nbsp;<span>(Hiroyuki Sawano | MOBILE SUIT GUNDAM UNICORN OMPST 1)</span></p> 
<center> <div style="width:454px"> <img src="http://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=448&amp;h=576&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Gundam Unicorn life size statue" width="448" height="576"> <div class="figure-caption"> Two down, one to go. </div> </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:454px"> <img src="http://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=448&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Gundam Unicorn diorama" width="448" height="252">  </div> </center>
<div><p><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></p></div>

<center> <div style="width:400px"> <img src="http://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=394&amp;h=700&amp;fit=inside&amp;a=bottom&amp;we=1&amp;quality=80&amp;output=jpg" alt="Gundam Unicorn life size statue at night" width="394" height="700"> <div class="figure-caption"> The Gundam Unicorn lits up at night. It also has some moving parts as well. </div> </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:454px"> <img src="http://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=448&amp;h=336&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Me and Raxki at Yokohama Station" width="448" height="336">  </div> </center>
<p><b>Music: </b><a href="/player/zack-wiki/beginning/">The Beginning</a>&nbsp;<span>(Zack &amp; Wiki - Quest for Barbaros' Treasure)</span></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:454px"> <img src="http://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=448&amp;h=627&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Moving Gundam at Yokohama" width="448" height="627"> <div class="figure-caption"> According to Raxki, despite being a lifesize rendition, this one could actually be the smallest of the three in Japan. </div> </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:454px"> <img src="http://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=448&amp;h=272&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Closeup of moving Gundam" width="448" height="272"> <div class="figure-caption"> This looks like <em>we’re</em> inside a Gundam diorama now. </div> </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><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></p></div>

<br>
<p><b>Music: </b><a href="/player/gundam/twinkle/">Twinkle</a>&nbsp;<span>(spira · spica | Gundam Build Divers ReRISE ep 2)</span></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:454px"> <img src="http://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=448&amp;h=243&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Yokohama at dusk" width="448" height="243"> <div class="figure-caption"> At first glance, this kinda looks like the beachline of Barcelona with the W Barcelona looking building in the background. </div> </div> </center>
<center> <div style="width:454px"> <img src="http://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=448&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Red brick warehouse" width="448" height="252"> <div class="figure-caption"> 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> </div> </center>
<center> <div style="width:454px"> <img src="http://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=448&amp;h=717&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="A fox" width="448" height="717"> <div class="figure-caption"> There was also this pretty cool looking fox sculpture. Gotta give modern art its spotlight, too! </div> </div> </center>
<center> <div style="width:454px"> <img src="http://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=448&amp;h=224&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Port Memorial" width="448" height="224"> <div class="figure-caption"> It’s quite eyecatching to spot some classic revivalist architecture thrown about the city. </div> </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>]]></description>
    </item>
        <item>
            <title>I'm finally quitting YouTube, and it's all great</title>
            <subtitle>YouTube is what takes me most of my screen time, so I decided to get rid of it once and for all.</subtitle>
            <author>
                <name>Yonic</name>
            </author>
            <link>http://legacy.yonic.blog/blog/article/2024/05/finally-quitting-youtube</link>
            <link href="http://legacy.yonic.blog/blog/article/2024/05/finally-quitting-youtube" />
            <link rel="alternate" type="text/html" href="http://legacy.yonic.blog/blog/article/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>
            <pubDate>2024-05-04T13:52:40.021Z</pubDate>
            <description><![CDATA[<img src="http://media.yonic.blog/?url=https%3A%2F%2Fyonic-corner-public.s3.eu-central-003.backblazeb2.com%2Fimg%2Fblog%2F2024%2F05%2Ffinally-quitting-youtube%2Fhero-legacy.png&w=454&h=303&fit=inside&a=center&we=1&quality=90&output=jpg" alt="Cover image" width="300" height="200"><p><b>Music: </b><a href="/player/kingdom-hearts/2/hollow-bastion/">Restoring Hollow Bastion</a>&nbsp;<span>(Youko Shinomura | Kingdom Hearts II.5 Final Mix)</span></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:454px"> <img src="http://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=448&amp;h=336&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="YouTube UI on phones" width="448" height="336"> <div class="figure-caption"> Swipe “<em>up</em>”? Sounds like an Y-axis flip issue. </div> </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><b>&lt;Yonic&gt;</b></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="http://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=394&amp;h=296&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Old YouTube" width="394" height="296">  </div> </center></center><p><b>&lt;/Yonic&gt;</b></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:454px"> <img src="http://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=448&amp;h=256&amp;fit=inside&amp;a=top&amp;we=1&amp;quality=80&amp;output=jpg" alt="Screenshot of my YouTube layout" width="448" height="256"> <div class="figure-caption"> 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> </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><b>&lt;Yonic&gt;</b></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><b>&lt;/Yonic&gt;</b></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:454px"> <img src="http://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=448&amp;h=296&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Ad blockers are not allowed on YouTube dialog" width="448" height="296"> <div class="figure-caption"> YouTube has started imposing an ultimatum on users who use ad blockers: Use their premium service or disable ad blockers. </div> </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:454px"> <img src="http://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=448&amp;h=237&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="The 16 second unskippable ad for 4 seconds of video was worth it." width="448" height="237"> <div class="figure-caption"> The situation has gone so bad that you can be forced to watch ads that may be longer than the actual video itself. </div> </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:454px"> <img src="http://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=448&amp;h=252&amp;fit=inside&amp;a=center&amp;we=1&amp;quality=80&amp;output=jpg" alt="Invidious" width="448" height="252"> <div class="figure-caption"> Screenshot from an Invidious instance </div> </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>]]></description>
    </item></channel>
</rss>