Devlog: giving AuriaOS two real apps (and finding out neither of them worked)

Calculator and Mood Lamp had been placeholders since day one. A folder icon and a div that said “🧮 Calculator app” and nothing else. A window
opened, technically. Nothing else did. For the second submission I finally built them for real.

Building them

Calculator got a real display and button grid, doing immediate-execution math on purpose: 6 + 3 × 2 = gives 18 not 12 because that’s how an actual physical calculator behaves and a proper order-of-operations parser felt like solving a problem nobody asked for. Divide by zero gives Error like it should. Keyboard input works too but only while
the calculator window is actually focused so it can’t hijack typing elsewhere.

Mood Lamp got more ambition! Instead of a “click a button, see a color” toy, it’s a global ambient tint over the whole desktop not just its own
window. Four presets pulled from the existing accent palette, plus a real color picker and intensity slider for anyone who wants to go off-menu.

Wrote the CSS, wrote the JS, wired both in, called it done. It was not done. The buttons that did nothing.

Time for the First bug! Mood Lamp’s buttons didn’t work. No errors, no visual change, just silence..which is a specific kind of bug since broken JS usually throws. Silence like that means the code never actually ran. That’s exactly what happened. wireCalculator() and wireMoodLamp() were both fully written and correct and never called from anywhere. openWindow() still had the old dispatch list from before either app existed so every button in both apps existed in the DOM with zero listeners attached. Not a typo, just two lines I never wrote.

The command that lied about itself

From the previous reviews, I got to know that typing lightmode on in the terminal printed darkmode turned on. The Dark Mode → Light Mode rename happened everywhere except one spot. The shared toggleBooleanSetting() helper used the internal state key (darkmode, which still has to exist since the actual effect is a literal CSS invert) for the confirmation message too. I split those apart so the message reflects what you actually typed not the plumbing underneath it.

The mood lamp that had no mood

Once the wiring was fixed, buttons visibly responded but the desktop itself looked exactly the same. Sampling the actual rendered pixel before/after at max intensity confirmed it. The shift was small enough to round to nothing. The overlay used mix-blend-mode: soft-light which was picked for subtlety. Except soft-light scales toward zero as the base color approaches black and AuriaOS’s desktop is about as close to black as a color gets (almost). The mode I chose for subtlety was almost mathematically guaranteed to do nothing on this exact theme. I switched it to screen, which always adds light regardless of how dark the base is. Same 30% intensity setting, suddenly an actual visible wash instead of a rounding error.

The actual lesson? None of these three were exotic bugs. A missing function call, a copy mismatch, a blend mode never checked against the theme it’d run on. All three shipped unnoticed because each one failed quietly instead of throwing. Worth remembering “it’s not doing anything” isn’t a shrug, it’s a symptom!

Devlog: SlackyssaLiu Went to Space (and I Forgot to Write Any of This Down)

The itch

SlackyssaLiu started as a pretty standard first Slack bot. Slash commands, a few API wrappers, the usual suspects: catfacts, jokes, quotes, echo, ping, some sneeze/wave filler commands for personality. It worked fine. It also looked exactly like every other “my first slackbot” project out there because it basically followed the same recipe everyone does. Integrate a joke API, integrate a weather-adjacent API, call it done.

I wanted to know how to make it stand out so I asked around for ideas. The answer was pretty obvious in hindsight. Stop building the demo everyone builds and build something around an actual theme with actual state instead of a stateless command list wrapped around whatever free API came up first.

I bounced between a few themes.. figure skating (RIP, no usable free API), medieval history (also no API, just Wikipedia scraping, hard pass) and space. Space won because it had exactly what I needed. Solid free APIs with no bureaucracy (Open Notify needs zero auth, NASA’s API just needs a free key) and enough surface area to build something that actually feels alive instead of just answering when poked.

What actually changed

This ended up being a full redesign not a patch job. Rough shape of it (RIP to /skl-achoo, you were doing your best).

Killed the old command set! No more catfact/joke/quote/echo/achoo/wave.
None of it fit the new direction and it was the generic stuff I was trying to get away from in the first place. A moment of silence for the bot that could sneeze but not tell you when a rocket was launching.

New space-themed commands: /skl-iss and /skl-crew (Open Notify, no key needed), /skl-launch (Launch Library 2, with an actual countdown for maximum dramatic tension), /skl-apod and /skl-mars (NASA’s API, APOD + random Curiosity rover photos the rover did not consent to being featured but also cannot complain).

Added actual persistence. SQLite via better-sqlite3. This was the real shift. The old bot had the memory of a goldfish with amnesia. It never remembered anything between requests. Now it tracks mission
logs per channel, user callsigns and which launches it’s already announced (so it doesn’t spam the same countdown twice like an overeager intern). Added scheduled behavior. node-cron jobs that post NASA’s picture of the day every morning and ping the channel when a launch is within the hour. This is the part I think actually makes it feel like a running thing instead of a command list. It does stuff without being asked which is more initiative than I show most mornings.

I gave it an actual personality module! pulled every joke/flavor line out of the command handlers and centralized them in personality.js. Went through two tone passes because apparently I couldn’t decide if the bot should sound like a stoic AI from a space movie or like it’s been on Twitter since 2019. It landed somewhere in between and honestly that’s a personality a lot of people have. Having it centralized meant the whole voice-swap was a
single-file change instead of hunting through every command like a raccoon going through someone’s trash.

Fixed real bugs from the original file along the way, typos that would’ve crashed the bot. cool, cool, very cool, glad I caught that before it caught me.

Why I forgot to log any of this

Short version, I was moving fast across a lot of files at once. db setup, service wrappers, command rewiring, personality, scheduler and treated it like “just get it working” instead of “document as I go”. I was working on a lot of projects at the same time and this was something I did just after finding about Stardance so I barely remembered to ship it. But I’m doing so now, several weeks late, riding in on a horse made of retroactive commit messages. I barely had any brainpower left for side projects at 1am because of my “awesome” uni.

Devlog 2

script.js is the new addition so here’s what it’s actually doing! It holds all the material data (steel, concrete, timber, etc. actual specs, pros/cons, use cases) and it builds the registry cards from that data instead of having every card written out individually, it also runs the boot-sequence typing effect when you open a record and fills out the detail page when you click into a material (title, seal, dials, the whole thing) and handles switching between sections! including moving the gauge fill to wherever you’ve navigated

so basically, it’s the part making the site do things instead of just sitting there looking nice. which, to be fair, was kind of the previous situation. also noticed a few other things while going through the files. so update! the nav labels got renamed to something a little moodier. Registry is now Compendium, Application is now Instrumentality. apparently we’re doing terminology now (I hope it does sound better though). The landing page kicker changed too, from the previous plain version to “The Seventeenth Record” which raises the fairly obvious question of where records one through sixteen are. WELL, let me just say.. I don’t know! probably somewhere above my pay grade

there are also two fonts being imported that aren’t actually used anywhere in the CSS yet. they’re just there in the import line, loaded in and ready to contribute absolutely nothing. honestly, good for them anndddd just to be clear, none of the stuff from the last devlog i noticed are fixed yet. We got an absolutely broken mobile responsiveness. This pass was mostly about getting things organized rather than fixing anything. one thing at a time though! we’re not building the interstate

Devlog 1

Alright, first one of these so let’s keep it honest instead of doing a highlight reel. ARCHIVE-7 is a materials reference site I’m building that’s skinned like a terminal from a sunken Art Deco engineering archive. Steel, concrete, timber, that kind of thing but presented like you salvaged the data from underwater instead of scrolling a normal database. That’s the pitch anyway. Where it actually is right now is a bit messier than the pitch.

The nav is a pressure gauge and I’m still into that idea. Instead of a normal navbar there’s a vertical gauge running down the left edge! A tube with five stops on it, marked in fathoms instead of section names (0, 22, 48, 76, 110). Click a stop, in theory the fill level rises to meet it and the whole thing feels like you’re descending deeper into the archive. In practice, right now, the animation just isn’t firing. It snaps to the new state instead of settling into it so at the moment it’s basically a fancy-looking list that skips the part that made it interesting. That’s next on the list to actually fix not just assume is working because the CSS looks right.

The landing page has a hole in it. This one stings a bit to post but whatever, that’s the point of a devlog. The cover page is supposed to show a facility summary and a featured specimen pulled from the real data. Something that gives you a reason to be on that page instead of just a title. Right now both of those sections are rendering completely empty. The header text up top is fine, the sign-off line at the bottom is fine but there’s a big gap in the middle where actual content should be.

Small thing but noting it. There’s a thin vertical line + rotated readout sitting on the right edge, purely there to balance the gauge visually so the page doesn’t feel like it’s all weighted to one side. Right now it’s sitting a little too close to the scrollbar for my taste. Minor but going on the list.

So that’s the state of it. Visually the parts that ARE rendering look like what I want. The palette, the type, the gauge shape but structurally there’s real stuff not working yet. Next devlog is hopefully “the gauge moves and the cover page isn’t empty” we’ll see!

Devlog #4

There’s not much coming to my mind on where to go from here so instead I went in to style.css to fix text truncation. Well.. I accidentally ended up tweaking basically everything. I added new easing functions, cleaned up button styling and fixed a stupid transition typo. While I was at it I gave the media box a custom cursor and added some hover/scale/rotation animations. I also polished the logbook, lightbox and gave the archive cards a little more life! Also fixed a few tiny compatibility and sizing things while I was there. DIdn’t do much but that’s something. Probably my final devlog before shipping

Devlog #3

Okay so update from the last one where I was basically just doing CSS and hoping for the best. Turns out trusting the process was, in fact, the move because somehow I went from “vague brass and navy colors on a div” to an entire working site. I genuinely didn’t expect to get here especially with college still eating my whole week.

The NASA API stuff is finally hooked up and actually works now not just “works in theory” but actually pulling real pictures for real dates. Prev/next day, jumping to today, random date, all of it fetches properly. There’s a whole archive view now too where you can browse a full month at once instead of clicking one day at a time forever and an “on this day” strip that shows the same date from past years which honestly turned out way cooler than I expected!

Also added a logbook thing so you can save entries you like and they stick around in localStorage. No backend, no login, just quietly sitting in your browser. Feels good having something that persists without having to build a whole account system for a side project. ALso uh, I spent an embarrassing amount of time on tiny details that probably nobody will consciously notice but me.. a little reticle cursor over the image instead of the default pointer, a custom loading animation instead of a plain spinner, a weird little rotated stamp on the corner of each plate that just says “field log” because I thought it was cute. None of it needed to exist BUT all of it exists anyway.

Still caught a genuinely embarrassing amount of bugs going through it though. Had a straight up syntax error sitting in my object literal for who knows how long, had the archive endpoint pointed at a fetch() call instead of an actual url string and had a whole render function that hid the plate right after trying to show it so nothing ever displayed and I could not figure out why for a long time. Felt very smart once I found each one and very stupid for how long it took.

Still following the “learn it from a tutorial not from AI” thing I keep telling myself and it’s actually paying off! I can explain almost every part of this now instead of just going “uh, it works, don’t ask me why” Not fully done yet, still want to poke at a couple things. That’s it for this one. Back to pretending I don’t have an assignment due tomorrow (I actually have 3).

Also, quick note on why this is one giant entry instead of three; most of this stretch was JS work and the CSS barely moved while I was doing it. Didn’t feel like there was a real “here’s a visual update” moment to split off on its own so instead of forcing three thin entries out of what was really one continuous push on the JS side, I just let it be one entry that covers all of it, hope that makes sense!

Devlog 2 - Tiny Progress is Still Progress

College has been eating up most of my time lately so I haven’t been able to work on Asterism as much as I’d like. Still, I’ve been squeezing in about 5–10 minutes whenever I can. It doesn’t sound like much but I keep telling myself that something is better than nothing. Hopefully that’s true in my case too. Most of the progress has been on the CSS. Nothing groundbreaking yet but it’s taking shape, I think..? It’s still very much a work in progress and honestly… I’m kind of figuring things out as I go. I’m not entirely sure where this project is heading aesthetically but I’m trusting the process. Sometimes you just have to keep building until everything starts clicking into place. That’s pretty much it for this devlog. I wish I had more exciting things to share but college has completely drained me. I’m absolutely exhausted and my brain has officially stopped producing coherent thoughts. Hopefully the next update will have more than just CSS tweaks and maybe even some NASA API magic (hopefully x2)

So I added the base for the galerie.I just need to add a slideshow thing which is going to be a little hard because I already have 2 and I need to add the 2 buttons to switch between the images.I am giving my best to squeze in coding time but the graphics themselves take a lot of time.Thanks for reading!!!

Devlog 1 - Getting something on the page

Renamed the project to Asterism mostly because I didn’t want to keep looking at “apod-site” in my file tree. I spent way longer than I expected just laying out the HTML. I kept going back and forth on whether to build the archive/logbook or wait until I actually need them and ended up just doing all of it upfront so I’m not restructuring divs later while also trying to debug JS. Not sure that was the right call, it means I have a full page of markup and literally none of it does anything YET

The JS side was easy actually. I wanted to just check the NASA API actually returns what I think it returns before touching the real page so I hacked together a quick fetch on a totally separate.

#datepicker/#app that isn’t even in my real HTML. I mean it previously did. And It worked, sort of. Proved the concept but now I have to go rip it out and rewire it to the actual elements. Also just noticed I left a require("jspdf") at the top of the file that I don’t even use. I must’ve grabbed it off some snippet while I was googling something else and forgot to delete it. That’s not going to work anyway since this is Vite/ES modules and not Node. I didn’t get to do styling at all beyond the reset so right now it’s just there. Black text on white, nothing scoped, no theme variables defined just yet

Devlog 4 - probably the last one before this ships

I keep telling myself this is close to done which is exactly what I said the last three times so take that with the appropriate amount of salt. But this time there’s a real reason to believe it. Most of what’s left is polish not decisions anymore.

what actually changed

The site went through more identities than I’d like to admit before landing on the notebook look. I tried a blueprint version, a PCB/circuit-board version, a GitHub-dark version. All of them looked fine. But none of them looked like it suited me, it was a very conflicting feeling. The notebook one stuck because it’s the only one where the metaphor does real work! grid paper, a spiral binding, margin notes with actual arrows pointing at the sentence that matters. It made sense in my head so I left it that way.

Once the theme was settled, most of the work was making it feel less templated and more like something a person actually wrote. Early drafts of the About section kept reusing the same few phrases without me noticing. Every project blurb ending on the same self-deprecating note. Once I caught it, I went back through line by line and cut the repeats until it actually sounded like me instead of me imitating myself. The newest piece is Marginalia. A small section for the stuff that doesn’t fit under “projects” because it’s not a project, it’s just what I’m reading right now; that could mean a design thinking book, German grammar drills, Meditations, my interest about semiconductors. It’s styled as loose index cards taped down at odd angles instead of a clean list on purpose. A tidy bulleted list would’ve looked like a resume section. This is supposed to look like stuff pinned to a corkboard because that’s closer to what it actually is. There’s a colophon now too, tucked at the very bottom. What I built it with, what it’s set in. Small thing but I like that it’s there.

why it’s taking this long

Two honest reasons, no dressing them up. College session started back up and coursework wins every time it competes with a side project for hours in a day. That’s not a complaint, it’s just the actual constraint. I can’t build fast on a hobby site when the thing paying for the degree needs the same brain. And I’ve just been tired. Just the ordinary physical exhaustion of stacking coursework on top of a project I care about where neither one gets the focus it deserves and both end up a little slower for it. Some nights the right call was closing the laptop instead of pushing out a section that would’ve needed redoing anyway.

Neither of those is a great excuse for a slow devlog cadence but they’re the true ones.

what’s actually left

Contact section still isn’t back in. dropped it a while ago, might need to rebuild it now that the rest of the layout has moved on. I do need suggestions and opinions for that. And there’s a couple of real bugs to clean up before this goes anywhere public. And then it’s done or at least done enough to stop calling it a work in progress

Devlog 3

There are already enough portfolios on the internet. You know the ones with dark background, giant gradient blob, “Hi, I’m X” followed by twelve technology logos and a call-to-action that says “Let’s Connect.” They’re polished but they don’t really tell you anything about the person behind them. And I wanted something different. The idea slowly became a notebook. Not a perfect one, one that’s been carried around for a while. Grid paper, handwritten annotations, sticky notes, typewriter text, little arrows pointing at things that probably didn’t need explaining but got explained anyway

The About section became surprisingly personal. Instead of listing hobbies, I wrote about why I enjoy electronics, why medieval engineering fascinates me and why I keep pulling things apart until I understand how they work. It feels much more honest than anything else. Marginalia is probably my favorite section so far. It’s exactly what the name suggests! the things I’m currently reading, learning or obsessing over. German grammar drills, Meditations, semiconductors.. they’re all snapshots of whatever has my attention at the moment. The little sticky notes scattered around the page make it feel like someone actually uses this notebook instead of simply displaying it. I also hid a small easter egg in the navigation. Every personal website deserves at least one thing that exists purely because it made its creator smile.

This devlog ended up being less about adding new features and more about polishing what was already there. Most of the time went into fixing CSS quirks, adjusting spacing, repositioning elements and making everything feel a little more cohesive. None of the changes were particularly flashy on their own but together they made the site feel much closer to the notebook aesthetic I had in mind. It’s one of those sessions where a dozen tiny tweaks ended up making a much bigger difference than a single new feature ever could

Devlog 2

Getting the About section written took longer than I expected. Because it’s surprisingly difficult to write about yourself without sounding like you’re trying to impress someone. I rewrote the same paragraphs more times than I’d like to admit, slowly replacing things that sounded good with things that actually felt like me. The Projects section had a different problem. Turns out writing code is easier than writing about the code you’ve already written. Summarizing months of work into a few sentences, choosing screenshots, deciding what to leave out and figuring out what someone would actually find interesting is its own little design challenge. The biggest change, though, ended up being the handwritten notes

At first, the page looked like every other portfolio I’d seen. Project title, description, repository link, repeat. It worked but it didn’t feel like my notebook. The little margin notes, project statuses and honest comments about what went well (or didn’t) gave each project a bit of personality. Ironically, those tiny annotations took longer to write than some of the summaries. Maybe building a portfolio isn’t really about showing everything you’ve made

Devlog 1: Trial and error will be the end of me

This page took almost three hours and somehow none of that time was spent writing code. I mean- it was.. BUT YOU GET MY POINT. The hardest part wasn’t building it. It was deciding what it should even look like. I went through idea after idea, scrapped most of them then spent way too long trying to imagine the layout in my head. How much space should there be between sections? Is this too empty? Too crowded?

The funny part is that I wanted this site to feel like one of my real notebooks. Except my real notebooks look like they survived a natural disaster. They’re full of arrows pointing nowhere, thoughts squeezed into the margins, things crossed out three times and random ideas that only make sense because I wrote them. Turns out translating that into a website without making it look completely chaotic is… surprisingly DIFFICULT! GRRAAHH

Every project reminds me of the same thing. Starting is the hardest part. Finding a direction, committing to a design and figuring out the layout and spacing always takes me longer than writing the code itself. Eventually something clicks. Until then, it’s mostly moving things around, staring at them, moving them back and pretending it’s part of the process, ay i mean it kinda IS part of the process! ANYWAYS, as i was saying- trial and error is genuinely going to be the end of me one day.

Devlog: Reworking AuriaOS’s Visual Identity

I thought AuriaOS was ready to ship. The window manager was working, apps launched, windows could be dragged, resized, minimized and restored. And the logic was solid.

Then the project got flagged as AI-generated, well I wouldn’t say AI-generated but maybe traits similar to that of one. It wasn’t because of the code but because of the UI.

Looking back, I understood why. The dark navy background, teal accents, frosted glass, soft glows and identical rounded corners looked a lot like the visual style that’s become common in AI-generated interface concepts. Those chosen elements together, they unintentionally resembled that aesthetic.

So I decided to redesign the visual system without touching the underlying functionality!

Redesigning the UI

The HTML and Javascript mostly stayed the same but most of the CSS was reworked.

• Replaced the glassy navy and teal theme with a warmer ink and brass palette
• Split the single border radius into multiple sizes so controls, windows and tiles each have their own geometry
• Removed glow-heavy styling in favor of flat panels, subtle borders and offset shadows
• Simplified typography by using JetBrains Mono for the interface with Fraunces reserved for the Start menu greeting
• Replaced decorative gradients with a subtle SVG grain texture
• Added small details like a window seal, custom text selection and distinct hover treatments across different UI regions
• Swapped macOS-style traffic-light controls for simpler outlined window buttons

My goal was simple, it wasn’t to make the UI less polished, it was to give it a clearer identity.

Bugs I Found Along the Way

Rewriting and going through every CSS rule also uncovered a few real bugs

Broken resize handles

Some resize handle selectors accidentally used descendant selectors instead of grouped selectors so several resize directions silently stopped working

Invisible desktop

Adding overflow: hidden exposed another issue: #desktop never had an explicit height. Because every child was absolutely positioned, the container collapsed to zero height and clipped everything inside it. Restoring width: 100% and height: 100% fixed it immediately

A backwards theme toggle

The old “Dark Mode” toggle now made the already-dark interface lighter so i renamed the user-facing option to Light Mode while keeping the internal setting unchanged

Looking Back

Getting the project flagged was frustrating but it pushed me to reconsider the design instead of just accepting my first version. The redesign gave AuriaOS a stronger visual identity and the careful review of the stylesheet ended up revealing several bugs that had gone unnoticed during the rewrite. In the end, the project became better both visually and technically

POLITICS!! + Debugging Hell v2

I mean I guess it is? Not too sure.

Event Manager completely overhauled. Double events now no longer have the chance of repeating the same event.

Created a new GameEffects script which just takes a bunch of simple code away from EventManager and plays the basic functions such as the “tax revenue increases” which you see below.

This was quite a headache to create, and I severely underestimated how much time this would take. I have 2 extra nested classes inside of EventManager for Political Question and Political Scenario.

[... inside EventManager.cs ...]
    public class PoliticalQuestion
    {
        public string Question;
        public TaskCompletionSource<bool> TaskCompletionSource = new TaskCompletionSource<bool>();
        public Action onAccept;

        public PoliticalQuestion(string question, Action onAccept)
        {
            Question = question;
            this.onAccept = onAccept;
        }
    }

    public class PoliticalScenario
    {
        public string description;
        public Action runnable;

        public PoliticalScenario(string featureDescription, Action functionality)
        {
            description = featureDescription;
            runnable = functionality;
        }
    }

    [Header("Political Question Variables")]
    public List<PoliticalQuestion> PendingQuestions = new List<PoliticalQuestion>();
    public event Action onQueueChanged;

    private PoliticalScenario[] goodFeatures;

    private PoliticalScenario[] badFeatures;

The political question is sent off to the UI manager, which displays it as shown below. Then it handles user input pressing Y/Enter or N/Esc to accept the user choice, and returns it back to the Event Manager. Seems simple enough, yet there are many ways to do it but I think that the above implementation works the best out of all the ones that I tried. I attempted to use Game Manager as a middleman but that did not work out - so I resorted to passing an entire class.

The political scenario allows for the string to actually do something, so that the game knows what to process and what the user agreed to without creating a bunch of variables, and can allow for stacked political question events which is nice.

Game’s looking really neat, and the multipliers and stuff can make the game go very crazy very quickly.

Too much of a good thing is a bad thing!!

Debugged the entire system for like a solid 3 hours it was actually bad.

Came first in the UK tho!! I’m back after those 6 exams are done.

Yes I know the UI looks pretty bad but it’s good enough for pre-beta testing.

Oh yeah, speaking of UI everything is more bold. Figured out how to do that.