RidzOS

What Did We Make? We built a fully functional web operating system named RidzOS! It features a custom desktop interface, an interactive top status bar with a live clock ticking every second, desktop application icon shortcuts, modular draggable windows with closing and layer focusing capabilities, and a built-in notes application driven by JavaScript arrays and dynamic sidebars.
What Was Challenging? Building the window management engine was definitely the trickiest part. Wiring up the math for mouse dragging coordinates so windows follow your cursor smoothly, managing layer order so clicked windows always rise to the top above others, and protecting the top menu bar from being covered required careful programming logic.
What Are You Proud Of? Being able to conceptualize, code, and ship a completely personalized operating system live onto the internet is a massive achievement. Watching the custom gradient wallpaper load, clicking the icon to spawn windows, and seeing notes render dynamically from an array all coming together into a polished product feels incredible.
What Should People Know When Testing? When testing Ridith OS, keep these things in mind: You can click and drag any window header around the screen just like a real operating system. Click the desktop app icon to launch the notes application, and use the sidebar items to switch between notes. The top bar features a live clock showing real time updates, and windows will automatically stack on top of each other when clicked. Technical Architecture Ridith OS is structured around two primary code files: index .html: Contains the core DOM structure, including the desktop layout container, the top status bar, desktop app shortcut wrappers, and the modular window templates for both the welcome prompt and the notes application.script.js: Manages all dynamic behaviors. This includes the real time clock interval loop, the physics engine for mouse dragging windows, window layering and focus management, and the JavaScript array iteration used to dynamically populate the notes sidebar content. Getting Started Locally To run or modify this project on your local machine or through a cloud development environment, follow these steps: Clone or download the repository to your local computer. Open the project folder inside any code editor such as Visual Studio Code or GitHub Codespaces. Open the index.html file in any modern web browser or deploy the repository using GitHub Pages to run it live on the web. Future Development Plans Future updates and additions planned for the platform include additional desktop utilities, persistent local storage support for user notes, custom theme selection, and expanded interactive applications