rinoOS
- 3 Devlogs
- 1 Total hours
rinoOS - live like rino.
rinoOS - live like rino.
Last thing before this is finished. Added an actual learning guide for the OS, rather than having to figure it out by trial and error.
There’s now a Guide app, with a teal icon located at the start of the dock. It launches into a window that takes you through all the basics, like opening applications, resizing and moving windows, what the three buttons for windows do, the context menu, talking to Jarvis in the terminal. When you first land on the desktop, a tooltip will pop up that shows you where the Guide icon is, and says “New here? Click Guide to get to know the OS.” Also, I added the context menu on the desktop. Just do a right-click on any empty space on your desktop and there will be quick access to such things as opening terminal, creating a sticky note, opening guides, changing wallpapers. However, you won’t see this menu when you perform the same action over an opened application, it is only visible on an empty desktop. I had to deal with some bugs that not many people are even going to notice, but which were crucial for my program. After I implemented the resizing functionality, the dragging became somewhat slow, which resulted from a css transition intended only for maximizing an application being applied to dragging and resizing as well. and there was another issue with the hint bubble being pointed to the guide icon. That one was a strange one, it turned out that a transform on the dock’s container element broke the position:fixed styling of everything within it, so the bubble was aligning itself to the center of the dock rather than the screen. Moved it outside of it and it now perfectly aligns with the icon, double checked on different screen sizes.
Finally, the boot sequence needed some work too. The animation itself was smooth enough, but at the total duration of 2.6 seconds, it just felt like skipping through rather than loading 5 messages. Slowed it down to about 4 seconds and added a smooth crossfade in between each message instead of the abrupt change, and now it feels like an actual boot sequence, not just random colors.
That is all I have for now for rinoOS. Boot up, choose a background, click around, talk to jarvis when bored.
Live the rino life 🟣
picking up from devlog #1. last time the three window buttons just sat there doing nothing, red worked but yellow and green were dead weight. fixed that.minimize now actually minimizes. click yellow and the window shrinks down and tucks itself into a little tray right next to the dock, like a real taskbar. click the tile and it pops back open exactly where it was.fullscreen works too. green button blows the window up to fill the whole desktop, click again and it snaps back to wherever it was sitting before. sticky notes is finally here. it’s its own app in the dock now, click the + tile and a new note shows up, type whatever, delete it with the x in the corner. they’re scattered at slight angles so it actually looks like sticky notes and not a grid.also made every window resizable from the bottom right corner, figured if you’re gonna explore my OS you should be able to make a window bigger to actually read stuff instead of squinting. ran into one annoying bug along the way: dragging windows around started feeling laggy and weird after i added resizing, turned out a css transition meant only for the maximize animation was quietly applying to every drag and resize too, so windows were animating toward your cursor instead of just following it. fixed by only turning that transition on for the maximize snap and keeping drag/resize completely instant. one more update coming next.
so the mission was basically: build a personal website, but make it actually interesting instead of the usual “hi, here’s my resume” page nobody reads. my first instinct was to do the safe thing, a simple portfolio site, projects listed top to bottom, done in an hour. but that felt like the laziest version of the mission. anyone can make a list of stuff they built.so instead i made rinoOS, (rino being my digital identity) live like rino. the idea: instead of reading about me, you boot into a whole fake OS and explore it like it’s actually mine. you start on a boot screen that fake loads stuff like “syncing f1 telemetry… brewing chai…” then you pick a wallpaper before you even see the desktop. after that you’re dropped into a real desktop with draggable windows, a dock, and a working clock, and you click around to find out who i am instead of scrolling a page.i built most of this outside the repo first, just working on the html locally and testing it as i went, then finally moved everything over once it actually worked.what’s in it so far: 8 wallpapers, pick your vibe before you boot in. windows for About, Projects, Skills, F1 Fan Zone, and Contact. a Jarvis terminal you can actually type commands into, like hey jarvis, open projects.the projects window has my real stuff: Jarvis, a voice assistant i built with whisper and ollama, a live F1 telemetry dashboard, and Time Debt, a roblox game where you’re racing the clock to collect as much as possible before time runs out. biggest issue so far: it looked perfect locally, then i pushed it to github pages and got a blank readme instead of my site. turns out pages only serves a file named exactly index.html. dumb mistake, learned it fast. next up: a sticky notes app and proper minimize to dock animations. live like rino 🟣