You are browsing as a guest. Sign up (or log in) to start making projects!

EmberCrow OS

  • 3 Devlogs
  • 5 Total hours

A hacker-themed, black & white web desktop with an ember-orange accent, built with plain HTML/CSS/JS (no frameworks, no build step).

Ship #1

what i made

embercrow os - a hacker themed desktop that runs in the browser, no install. retro boot sequence, draggable windows, five apps (terminal, files, notes, music, about), and a living ascii mascot with a glowing eye that tracks your cursor and reacts to what you're doing.

what was challenging

getting the mascot's behavior (eye tracking, blinking, idle reactions) to feel natural while keeping the logic separate from the dom and testable.

what i'm proud of

it actually feels alive, and the core logic is all unit tested despite being a no-framework, no-build-step project.

skip the boot with any key (or watch it once), open some apps, try the [*] theme button in the taskbar, and sit still for 30 seconds to see the crow react

Try project → See source code →
Open comments for this post

39m 38s logged

last one for this round, added a theme switcher to the desktop. there’s a new [*] button in the taskbar that cycles through three color schemes: ember (the original orange, default), phosphor (green, classic crt terminal look), and cyber (blue). clicking it swaps the accent color across the whole desktop. window borders, highlights, the terminal cursor, and even the living mascot’s glowing eye all shift to match, since they were already built on a shared accent
variable.

it resets back to ember on reload, so you always start from the default look.

architecture-wise this was a clean one to slot in. the theme logic is a small standalone module (just a list of themes and a “next theme” function), same pattern as the window manager and mascot logic, so it’s unit tested without needing a browser.

last one for this round, added a theme switcher to the desktop. there’s a new [*] button in the taskbar that cycles through three color schemes: ember (the original orange, default), phosphor (green, classic crt terminal look), and cyber (blue). clicking it swaps the accent color across the whole desktop. window borders, highlights, the terminal cursor, and even the living mascot’s glowing eye all shift to match, since they were already built on a shared accent
variable.

it resets back to ember on reload, so you always start from the default look.

architecture-wise this was a clean one to slot in. the theme logic is a small standalone module (just a list of themes and a “next theme” function), same pattern as the window manager and mascot logic, so it’s unit tested without needing a browser.

Replying to @ghita

0
Open comments for this post

34m 44s logged

quick one - made the repo public today and set up a live demo, so now you can actually try embercrow os in the browser instead of cloning it.

demo: https://andreirazvanghita.github.io/embercrowos-stardance/
repo: https://github.com/AndreiRazvanGhita/embercrowos-stardance

it deploys automatically through github actions, so whenever i push to master the live version updates within a minute or two. nothing new functionality-wise, just wanted it accessible for anyone who wants to poke around without setting up a local server.

quick one - made the repo public today and set up a live demo, so now you can actually try embercrow os in the browser instead of cloning it.

demo: https://andreirazvanghita.github.io/embercrowos-stardance/
repo: https://github.com/AndreiRazvanGhita/embercrowos-stardance

it deploys automatically through github actions, so whenever i push to master the live version updates within a minute or two. nothing new functionality-wise, just wanted it accessible for anyone who wants to poke around without setting up a local server.

Replying to @ghita

0
Open comments for this post

3h 29m 16s logged

ok so this is my webos mission entry. theme is basically “what if a hacker terminal and a desktop os had a baby” - black and white everything, one accent color (ember orange), monospace fonts, the works. no frameworks, just html/css/js because i wanted to actually understand every line of this thing.

got the core stuff working:

window manager - you can drag windows around, focus them (the active one gets a glowy orange outline, felt very “hacker movie” to me), minimize to the taskbar, close them. double click an icon and it spawns a new window, slightly offset so they don’t all stack exactly on top of each other.

apps - went with 5:

  • a terminal you can actually type into (help, whoami, ls, etc, plus a hidden crow command that prints an ascii bird because why not)
  • a fake file explorer with a little folder tree (there’s a secrets.txt in there, very serious business)
  • an “about” app that’s basically neofetch but for my os, shows uptime and stuff
  • a notes app that saves to localStorage so your notes survive a refresh
  • a music player with a little audio visualizer using the web audio api - this one took way longer than expected

the boot sequence - probably my favorite part. when you load the page you get a fake terminal boot log scrolling by ([ ok ] mounting //embercrow/root… type stuff), then this big ascii bird silhouette fades in with a glowing orange eye, then a fake login prompt types itself out and “logs you in” (no actual password, it’s all for show), then it does a crt scanline transition into the desktop. you can skip it by pressing any key if you don’t want to sit through it every time.

the mascot is “the embercrow” - giant bird of prey made out of dots/ascii blocks with one glowing eye. shows up in the boot sequence and as a little taskbar icon.

architecture-wise i kept the window manager totally dumb/generic - it doesn’t know anything about specific apps, each app just registers itself with a title, icon, and a function that builds its content. made it way easier to build each app on its own and test it in isolation.

todo

mostly polish at this point - tweaking the boot sequence timing, maybe a couple more terminal easter eggs. core stuff is done and working.

ok so this is my webos mission entry. theme is basically “what if a hacker terminal and a desktop os had a baby” - black and white everything, one accent color (ember orange), monospace fonts, the works. no frameworks, just html/css/js because i wanted to actually understand every line of this thing.

got the core stuff working:

window manager - you can drag windows around, focus them (the active one gets a glowy orange outline, felt very “hacker movie” to me), minimize to the taskbar, close them. double click an icon and it spawns a new window, slightly offset so they don’t all stack exactly on top of each other.

apps - went with 5:

  • a terminal you can actually type into (help, whoami, ls, etc, plus a hidden crow command that prints an ascii bird because why not)
  • a fake file explorer with a little folder tree (there’s a secrets.txt in there, very serious business)
  • an “about” app that’s basically neofetch but for my os, shows uptime and stuff
  • a notes app that saves to localStorage so your notes survive a refresh
  • a music player with a little audio visualizer using the web audio api - this one took way longer than expected

the boot sequence - probably my favorite part. when you load the page you get a fake terminal boot log scrolling by ([ ok ] mounting //embercrow/root… type stuff), then this big ascii bird silhouette fades in with a glowing orange eye, then a fake login prompt types itself out and “logs you in” (no actual password, it’s all for show), then it does a crt scanline transition into the desktop. you can skip it by pressing any key if you don’t want to sit through it every time.

the mascot is “the embercrow” - giant bird of prey made out of dots/ascii blocks with one glowing eye. shows up in the boot sequence and as a little taskbar icon.

architecture-wise i kept the window manager totally dumb/generic - it doesn’t know anything about specific apps, each app just registers itself with a title, icon, and a function that builds its content. made it way easier to build each app on its own and test it in isolation.

todo

mostly polish at this point - tweaking the boot sequence timing, maybe a couple more terminal easter eggs. core stuff is done and working.

Replying to @ghita

0

Followers

Loading…