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

My very own WebOS

  • 3 Devlogs
  • 3 Total hours

A retro-themed operating system running entirely in the browser. Built with vanilla HTML, CSS, and JavaScript — no frameworks, no build tools.

Ship #1 Changes requested

I built a retro-style operating system that runs entirely in your browser. It recreates the feel of an old CRT monitor with scanlines, subtle screen flicker, a phosphor glow effect, and even a fake BIOS boot sequence when it starts up. It isn't just a visual demo, either. There's a full desktop environment with draggable and resizable windows, four virtual desktops, a taskbar, and 12 built-in apps—including seven games like Tetris, Snake, Pong, and Flappy Bird. Everything is written in plain JavaScript, HTML, and CSS, with no frameworks or external dependencies. The biggest challenge was building the window manager. Making window dragging, resizing, edge snapping, and taskbar updates all work together smoothly without introducing weird bugs took by far the most time. Tetris was another fun challenge, especially implementing piece rotation, ghost pieces, line clearing, and the scoring system.

If you'd like to try it, just open https://shritej-koneru.github.io/WebOS/ in Chrome—there's nothing to install.

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

27m 1s logged

RetroOS Dev Log #3 — Game Fixes & ImprovementsAll 7 games got a round of bug fixes, a tutorial system, and event listener cleanup.Event Listener Leaks FixedEvery game was leaking keydown and setInterval handlers when the window closed. If you opened Snake, played a bit, closed it, then opened it again — you’d have two game loops running simultaneously. Fixed by adding proper destroy() methods to every game that clean up intervals and remove keyboard listeners on window close.Tutorial SystemAdded a first-time “HOW TO PLAY” overlay for each game. Shows control instructions when you open a game for the first time, with a “GOT IT!” button. Uses localStorage to remember which tutorials you’ve seen, so they only appear once. Fixed a bug where the GOT IT button was replacing the entire overlay innerHTML instead of appending — the tutorial layer now sits on top of the game overlay without destroying it.Game-Specific FixesTetris — Fixed a speed scaling bug caused by a const closure in the interval callback. Level progression now correctly adjusts speed (50ms at max, scaling down from 500ms). Hard drop scoring fixed.Pong — Fixed keyboard controls bleeding between windows. Added focus management so arrow keys don’t scroll the page. Prevented default key behavior during gameplay. AI paddle smoothing adjusted for more natural movement.Snake — Fixed game-over overlay not rendering properly. Cleaned up interval cleanup on close. Speed increase now properly floors at 60ms minimum.Breakout — Fixed ball getting stuck in infinite bounce loops at edge cases. Brick collision now uses minimum overlap detection for correct directional bounce. Side panel layout fixed for smaller screens.Minesweeper — Fixed first-click mine placement to guarantee a safe 3x3 starting area. Win detection now correctly counts unrevealed cells vs mine count.2048 — Fixed tile merge logic preventing double-merges in a single move. Win overlay now shows without blocking continued play.Flappy Bird — Fixed pipe spawning overlap on fast refresh. Added state machine to prevent movement before first flap. Touch event support added for mobile.

0
0
3
Open comments for this post

1h 17m 35s logged

RetroOS Dev Log #2 — The AppsAfter getting the core OS shell running, it was time to fill it with actual software. Here’s everything that went in.Music PlayerAdded a background music system with 3 chiptune tracks (all CC0 licensed). Auto-loops, auto-advances to the next track on end, and gracefully skips broken files. Volume sits at 0.3 so it doesn’t fight with the sound effects. Toggleable from Settings or via Ctrl+M.TerminalBuilt a full command-line emulator with 11 commands. Supports command history (arrow keys), Ctrl+L to clear, and auto-scroll. Commands include the basics (help, clear, echo, date, whoami) plus some fun ones:ls / cat — Virtual filesystem with 4 readable filescolor — Change terminal text color (8 options)calc — Evaluate math expressions inlinefortune — Random quote from a pool of 8neofetch — ASCII art logo with system info (resolution, uptime since boot)shutdown — Triggers the OS shutdown sequenceNotepadSimple text editor with word wrap toggle, tab key support (inserts 2 spaces), and a statusbar showing character/line count. Every keystroke plays a typing sound for that retro feel.PaintPixel art canvas with a 24-color palette and 3 brush sizes. Drawing uses line interpolation so fast strokes don’t leave gaps. Includes eraser, fill, clear, and save as PNG. Touch support for tablets. Everything renders pixel-perfect with imageSmoothingEnabled = false.CalculatorStandard calculator with chained operations. Color-coded buttons — green for functions, blue for operators, purple for equals. Handles decimals, negation, percent, and division by zero gracefully.SettingsThe theme engine. 6 CRT color themes (Green, Amber, Blue, Cyan, Red, White) that dynamically restyle the entire OS. 5 toggle switches for scanlines, flicker, curvature, glow, and music. Music section shows the current track with a next button. All settings persist to localStorage.7 GamesEvery game renders on , handles keyboard input, and cleans up properly when the window closes.Snake — Classic grid-based movement. Speed ramps up as you eat. Head drawn with eyes.Tetris — Full implementation with rotation, wall-kicks, ghost piece, next-piece preview, scoring (100/300/500/800 per lines cleared × level), and level progression.Pong — Ball physics with increasing speed per hit. 2-player (W/S vs ↑/↓) or vs AI with smooth interpolation chasing. First to 7 wins.Breakout — 6 rows of colored bricks, mouse/keyboard/touch paddle, side panel with lives and score. Brick collision uses minimum overlap detection for correct bounce direction.Minesweeper — 12×12 grid with 20 mines. Safe first click guaranteed. Recursive flood-fill on zero cells. Right-click to flag.2048 — Slide and merge tiles. Handles all 4 directions via transpose/reverse tricks. Win at 2048 but game continues. Dynamic font scaling for large numbers.Flappy Bird — Gravity simulation with pipe scrolling. Space/click/tap to flap. Yellow bird with beak and eye. State machine prevents movement before first flap.App-Specific StylingAdded comprehensive CSS for all 12 apps — terminal output colors, notepad toolbar, paint swatches, game canvas overlays, calculator grid with color-coded buttons, custom settings toggles, clock widget positioning, and breakout’s side panel layout.What’s in: 12 apps, 7 games, 1 music player, full theme system Stack: Still zero dependencies. All vanilla.

0
0
3
Open comments for this post

1h 6m logged

RetroOS Dev Log #1 — The First HourBuilt a retro-themed OS that runs in the browser. In one hour, got the core shell running: CRT monitor effects (scanlines, flicker, phosphor glow), a BIOS boot sequence, draggable/resizable windows with edge-snapping, 4 virtual desktops, taskbar with start menu, keyboard shortcuts, and localStorage persistence. All vanilla HTML/CSS/JS — zero dependencies.The full version ships with 12 apps (terminal, notepad, paint, calculator, 7 games), but the first hour was all about making the OS feel real. Every window opens with a sound effect, the boot screen counts up memory like it’s 1995, and the whole thing glows green like a CRT monitor. More apps incoming.Stack: Vanilla JS, CSS3, Web Audio API, Canvas Repo: https://github.com/shritej-koneru/WebOS

0
0
23

Delete project?

Are you sure you want to permanently delete this project? This action cannot be undone.

All devlogs, followers, and associated data will be removed.

Followers

Loading…