holy shit i'm finally done

1 files changed, 127 insertions, 0 deletions

diff --git a/src/desktop/files/netpunk.tsx b/src/desktop/files/netpunk.tsx
new file mode 100644
index 0000000..7645495
--- /dev/null
+++ b/src/desktop/files/netpunk.tsx
@@ -0,0 +1,127 @@
+import { VirtualTextFile } from "$/apps/source";
+import { Hr } from "../hr";
+import { Link } from "../link";
+
+export default {
+    name: "Netpunk.txt",
+    type: "text",
+    content: (
+        <>
+            <h2>Netpunk (feat. Kasane Teto)</h2>
+            <p>I think I started working on this about 2-3 years ago? It’s been so long I don’t remember! The oldest file on my PC with “netpunk” in the name is from 2024, so it must’ve been something like that. It was around the time I got my first electric guitar, a Yamaha Pacifica 112J in light blue. I’ve been practicing guitar ever since and it’s really hard, but a lot of fun as well. My fingers sure have grown extra layers of skin from all that playing.</p>
+            <Link type="image" link="https://sunnexo.moe/ui/toolbox/hardware/pacifica.webp" alt="" />
+            <p>
+                This is also the first time I’ve ever used a vocal synth! I love Teto so much… I’m kinda terrible at writing lyrics so I’m really happy I got help from retraceyoursteps! She perfectly understood the type of girlfailure energy I wanted to write about. Read the lyrics below!
+            </p>
+            <p>A clumsy robot forgets about their girlfriend’s anniversary, scrambling to find something to do for the date, eventually concluding they should watch a movie. Of course the movie is in high demand, so the tickets have sold out. Ultimately they resort to piracy, and things spiral out of control…</p>
+            <Hr />
+            <h2>Graphics</h2>
+            <p>This was originally going to get a bigger music video, but the scope was a little bigger than I could handle on my own. Stellazium and I came up with a big storyboard, but unfortunately she got occupied with other work. I actually learned Blender and made a ton of assets using it, but they didn’t end up getting used this time. Maybe they’ll be useful for future projects though!</p>
+            <p>Eventually I decided to reduce the scope of the video and make it more manageable for one person. I think it still ended up pretty nice, despite cutting out a bunch of our ideas.</p>
+            <Link type="image" link="https://sunnexo.moe/music/netpunk/scene-1.png" alt="" />
+            <Link type="image" link="https://sunnexo.moe/music/netpunk/storyboard.webp" alt="" />
+            <Link type="image" link="https://sunnexo.moe/music/netpunk/props.webp" alt="" />
+            <Link type="image" link="https://sunnexo.moe/music/netpunk/tree.webp" alt="" />
+            <Link type="video" link="https://sunnexo.moe/music/netpunk/geonodes.mp4" />
+            <Hr />
+            <h2>Character design</h2>
+            <p>We figured out the song’s narrative, and I had to come up with a character design that reflected the clumsy idiotic nature of the protagonist. I brainstormed a bit with Avolicis and our initial iteration looked like this:</p>
+            <Link type="image" link="https://sunnexo.moe/music/netpunk/character-1.png" alt="" />
+            <p>I tried modeling this in Blender. Blender however, is way more difficult than it seems. Getting the mesh right was quite a challenge already, but then getting the rig working was even worse! To animate a 3D model it needs to have a skeleton (also called a rig). That skeleton will then deform the mesh when you move the bones around. This was far more work than I first thought, as I kept running into issues like the mesh not deforming correctly.</p>
+            <Link type="image" link="https://sunnexo.moe/music/netpunk/character-2.png" alt="" />
+            <p>The original design had a skirt but I had to ditch it because it wouldn’t bend the way I expected. My friend Niko has a lot of experience with Blender so he was able to help me a lot with the technical stuff. Thanks to him I gained a ton of knowledge about the type of things that are easy or hard to do in Blender, and adjusted the 2nd iteration of the character accordingly.</p>
+            <p>Ghosttra.in helped me a lot with the model revision, giving me feedback on the proportions, hairstyle and outfit design. This time we went for a crop top and bodysuit, along with shorter hair that’s easier to animate.</p>
+            <p>
+                I also used{" "}
+                <Link link="https://keyframechef.gumroad.com/l/StylizedFemaleBasemesh" type="link">a base mesh by KeyframeChef</Link>{" "}
+                to make sure I would get the mesh deformation right. Using that as a starting point I sculpted the model more towards my reference. I recommend watching{" "}
+                <Link link="https://youtu.be/T0uzPeADuqg" type="link">their video about low poly character creation!</Link>
+            </p>
+            <p>The character looks way better than before, and it’s easier to animate as well. I’m very happy with the way this model turned out!</p>
+            <Link type="image" link="https://sunnexo.moe/music/netpunk/sunnexo netpunk character ref.png" alt="" />
+            <Link type="image" link="https://sunnexo.moe/music/netpunk/shader nodes.png" alt="" />
+            <Link type="image" link="https://sunnexo.moe/music/netpunk/good frame.png" alt="" />
+            <Hr />
+            <h2>Textmode</h2>
+            <p>
+                Similar to{" "}
+                <Link link="https://youtube.com/embed/1pG48TT3Kqo" type="link">Internet Exploder’s music video</Link>
+                , I got help from humanbydefinition for the textmode graphics. They made{" "}
+                <Link link="https://code.textmode.art/" type="link">a tool</Link>{" "}
+                that lets me interpret videos as a grid of text symbols, also known as textmode art. I used this tool for the backgrounds in the music video, by feeding it footage from my camcorder, glitchy scenes I made in Blender and more.
+            </p>
+            <Link type="image" link="https://sunnexo.moe/music/netpunk/textmode.gif" alt="" />
+            <Hr />
+            <h2>Netpunk papercraft</h2>
+            <p>To celebrate the release of my debut album I’ve made something silly… This may seem random, but I’ve always wanted to design a papercraft figure from scratch. And now that I’ve learned Blender I was finally able to do it!</p>
+            <p>
+                <strong>Big announcement:</strong> You can build one yourself too,{" "}
+                <Link link="https://sunnexo.moe/papercraft" type="link">get the template here!!</Link>
+            </p>
+            <Link type="image" link="https://sunnexo.moe/music/netpunk/papercraft-3.jpeg" />
+            <Link type="image" link="https://sunnexo.moe/music/netpunk/papercraft template preview.png" alt="" />
+            <Hr />
+            <p>
+                Lyrics written by Sunnexo and retraceyoursteps, performed by{" "}
+                <Link link="https://kasaneteto.jp/" type="link">
+                    Kasane Teto SV
+                </Link>
+            </p>
+<p>I just woke up</p>
+<p>My head in the clouds</p>
+<p>I've got one shot</p>
+<p>To figure it out</p>
+<p>But there's one problem</p>
+<p>The tickets sold out</p>
+<p>What the hell am I gonna do? (Oh god)</p>
+<br/>
+<p>I'm running on an empty charge</p>
+<p>You know my heart is still at large</p>
+<p>I can't believe I'm such a mess</p>
+<p>My head is yearning for more rest</p>
+<p>An anniversary forgot</p>
+<p>Because I stayed in bed to rot</p>
+<p>My mind is about to blow up</p>
+<p>My time is running out</p>
+<br/>
+<p>(♫)</p>
+<br/>
+<p>Now I'm searching the internet</p>
+<p>Gotta see if they have it yet</p>
+<p>It's a new film, no resales found</p>
+<p>Need to figure something out</p>
+<p><br/></p>
+<p>So I'm trying to pirate it</p>
+<p>But this website looks kinda shit</p>
+<p>Now out of options, I've got no choice</p>
+<p>But to take this chance</p>
+<p><br/></p>
+<p>My antivirus uninstalled </p>
+<p>I sense my data all dissolved</p>
+<p>I can't believe I screwed this up</p>
+<p>Can barely even make a sound</p>
+<p>My head is feeling all abuzz</p>
+<p>Because my code is all for naught</p>
+<p>My mind is about to blow up</p>
+<p>My time is rŗ̶̢̧͉̤̼̮͚͍̳̯̪͔̥̐̈́̄͒̌͗͆́̉́́͝ư̵̧͉͐̔̾̀͋̀̓̔̓͂͒̕͠n̷͚̬͉̦͒̐̈̈̌͌͂̉̑̃͛̒͝͠͝n̷̡̠͈̲̪͙̤͈͔̭͔̞͖̻͖̑̍́̍̒̉́̑̊̊̓͌̈̚ͅǐ̷͓n̵̢̙̉͐̆͑̈́͆͗̏̅͗̇̒̐ǵ̸͎̻̤̬͗̅̃̈̀̃̾̓ ̵̻̟̖̦̠̥̮̄͂̈́͛̉̎̌̽̒̕͘ő̵̞̯̱̼̼̭̲̘̳͑͛̆̅u̷̢͍̮̤̖̼̼̽̀́͒̆̂̃̒́̏̂̓͝͝͠͝t̶̨͇̮͓̦̯̞͍̬̮̯̞̼͖̊͌̈́̇̂̒̈́͋̚</p>
+<br/>
+<p>(̵̻̱̣́♫̷̦̈́̍͝)̸̺̓͑</p>
+<br/>
+<p>Alright I've got an idea</p>
+<p>Think I know what I gotta do (oh yeah)</p>
+<br/>
+<p>I'm thinking of a better plan</p>
+<p>I know the time I have at hand</p>
+<p>I may have hit my head real hard</p>
+<p>That might've made me really smart</p>
+<p>So tickets for the local fair</p>
+<p>A dinner date with time to spare</p>
+<p>Some scented candles and the rest</p>
+<p>Today will be the best</p>
+<br />
+<p>(♫)</p>
+        </>
+    ),
+    height: "70vh",
+    width: "70vw",
+} as VirtualTextFile;