After approximately 6 hours, I finished another session of improving the OS. This session focused on refining LumiOS’s look and feel. I also added two new apps - Browser and Weather. Overall, this update took me lots of time to fix small details.
New Apps:
Browser: A searching tool that allows you to search on the web (incomplete)
Weather app: Real-time weather tracker using OpenWeather API, showing current and future temperature, visibility, wind, and so on.
Updates on Existing Apps:
Widget: Added a weather widget; link the widget to the Weather app.
New Features:
Visual & Design:
Unified color system with accent glow effects.
New glass morphism layers.
Standardized spacing scale and border radius system.
Defined consistent typography sizes, weights, and letter spacing.
Added maximizing and minimizing animations.
Components:
Desktop icons now have a different lift and glow on hover.
Buttons and menus use smooth transform feedback.
Context menus show accent bars and slide‑in animations.
Window controls have larger hit areas and ring hover effects.
Start menu and quick settings redesigned with better padding and hover states.
Lock Screen:
New layout with large time display and username.
Added unlock animation.
Complete CSS and JS restructure for smoother motion.
Taskbar:
Added a search bar that lets you quickly find and open specific apps.
Taskbar buttons have scale and glow animations.
Challenges solved:
When I tried adding new ideas to enhance the overall visual appeal, I encountered a serious issue: the overlay system and window management stopped working again. The wallpaper no longer aligned with the desktop, and the window dragging function broke as well. I started looking for the problem but couldn’t find the cause, so I decided to restore everything and proceed more carefully.
Bugs:
The browser app is not working. It loaded external websites directly inside an iframe. Many sites block being embedded through CSP or X-Frame-Options, so the page often stayed blank, or the navigation controls stopped working. I tried loading external sites directly in an iframe, which does not work. I also tried routing page loads through the local proxy, but the app still depends on websites that often block embedding.
Future Plan:
Fixing the browser app will be the first thing I do in the future. I will also try to add micro-interactions such as window snapping.
Through the last few days, I kept on working on my project — a webOS. I focused on creating a cool, joyful, and especially user‑friendly experience. I improved old apps such as Clock, Terminal, Files, and so on by adding real OS functions to increase their practicality. Moreover, I added a new app — “Paint,” which allows the user to draw freely on a canvas with various tools. In addition, I added a system tray on the taskbar that lets the user change more settings.
One of the challenges is the theme. It’s hard to combine multiple settings (dark/light mode, accent color, etc.) using CSS custom properties without conflicts. I’m not good at CSS, so I failed here many times, especially with z‑index. Also, ensuring the accent color propagates to all UI components is difficult as well. I needed to use some AI here to make sure I didn’t forget anything. Another challenging part is cross‑app communication. Opening .txt files with the Notes app requires some tough work, as well as opening other apps from the Widgets app.
To test it, visit: https://lxtimer.github.io/LumiOS/, or clone the repo to run locally.
I just realized that my OS doesn’t have a lock screen yet, so I decided to make a simple one. But then, I had some problems. The blur effect on the background somehow doesn’t work at all. I had to test each part of my code to find an answer. Thankfully, I found the solution at the end. Anyways, I spent some time on the start screen; I hope you enjoy it!
A brand new Dev Log! Over the past few days, I added a bunch of exciting new features, mainly focusing on user experience. I also fixed some tiny bugs that struggled me a lot.
New Apps
Paint: A drawing canvas that allows the user to freely decorate things they want using tools, different colors, and shapes.
Updates on Existing Apps
Notes: Notes now support markdown format and can be downloaded
Calculator: Calculator now has an advanced mode that allows users to use a scientific calculator.
Terminal: Terminal now supports more commands (even though they are still not fully functional)
Clock: Clock now has a timer section that can be used to set a countdown timer.
New Features
Draggable desktop icons
Taskbar now has an entire tray allowing the user to change volume, brightness, Wi-Fi, and many other settings all in one place.
Taskbar now shows battery status.
New wallpapers are added to the settings.
Change the UI of some apps.
Challenges
The right-click context menu somehow didn’t show up again. I tried different solutions, but none of them worked.
Solutions
I asked some AI agents and browsed for a long time, and finally found the solution. The “contextmenu” handler in main.js crashed from undefined “closeVolumePopup()” and “closeBatteryPopup()” calls; adding both to “taskbar.js” with the usual “.visible”‑toggle pattern fixed the crash and the related desktop‑click bug that blocked “showContextMenu()” and overlay dismissal.
In the next update, I will try to implement the Weather App, the animated wallpapers, also building a browser App.
In the next update, I will try to implement the Weather App, the animated wallpapers, also building a browser App.
A brand new Dev Log! Over the past few days, I added a bunch of exciting new features, mainly focusing on user experience. I also fixed some tiny bugs that struggled me a lot.
New Apps
Paint: A drawing canvas that allows the user to freely decorate things they want using tools, different colors, and shapes.
Updates on Existing Apps
Notes: Notes now support markdown format and can be downloaded
Calculator: Calculator now has an advanced mode that allows users to use a scientific calculator.
Terminal: Terminal now supports more commands (even though they are still not fully functional)
Clock: Clock now has a timer section that can be used to set a countdown timer.
New Features
Draggable desktop icons
Taskbar now has an entire tray allowing the user to change volume, brightness, Wi-Fi, and many other settings all in one place.
Taskbar now shows battery status.
New wallpapers are added to the settings.
Change the UI of some apps.
Challenges
The right-click context menu somehow didn’t show up again. I tried different solutions, but none of them worked.
Solutions
I asked some AI agents and browsed for a long time, and finally found the solution. The “contextmenu” handler in main.js crashed from undefined “closeVolumePopup()” and “closeBatteryPopup()” calls; adding both to “taskbar.js” with the usual “.visible”‑toggle pattern fixed the crash and the related desktop‑click bug that blocked “showContextMenu()” and overlay dismissal.
In the next update, I will try to implement the Weather App, the animated wallpapers, also building a browser App.
In the next update, I will try to implement the Weather App, the animated wallpapers, also building a browser App.
I created a web‑based operating system that focuses on being light-weight, functional, and visually appealing. One of the biggest challenges I faced was building the window management system. I had to spend some time watching YouTube tutorials, reading different websites, and studying other webOS projects before finally getting it to work.
I am proud of the UI I made, which includes transparent and gradient windows, widgets, and taskbars. I did use some AI for this part since I ran out of ideas and didn't know what to do.
Overall, my goal is to create an OS that people genuinely enjoy using, and I’ll try my best to keep this project up!
Finally! After a long time of testing, I found where the bug is. I forgot that there is a layer on top of everything, so I added “pointer-events: none;” in #wlayer and “pointer-events: auto;” in .win. Also, I added a right click context menu.
Another update! After hours spent fixing tiny bugs, the OS has received a lot of new features and apps, as well as a massive update to the GUI and the overall system! The OS is more complete and practical now.
New Apps
Clock app: An app where you can check the current time, use a stopwatch, or set an alarm clock
Calendar app: Built a new Calendar app from scratch, a month grid with event dots, a day-detail panel for adding and deleting color-tagged events, and an Agenda tab listing everything chronologically
Widget app: You can add widgets to the desktop right now. Widgets, such as a small clock or calendar, can be added to the desktop
New Features
Settings became more functional: transparency, dark mode, animations, accent color, and brightness are now available. Added a pinned app dock to the taskbar for quick launching. The volume tray icon now opens a real pop-up with a slider.
Files app can now be used. It’s still incomplete, but some basic functions like opening folders and going back are implemented
Taskbar opacity: You can change the taskbar’s opacity from 0% to 100%, which makes the OS look better
Windows have been rebuilt. Now they are not only transparent, but also include a gradient color as background and a change in border line.
The flowing particles effect has been added to the OS in the background.
Bugs
The desktop icons are still not working, as they are not responding to clicks. Two likely causes are that ES module scoping hides “openApp()” from inline onclick handlers, or a full-screen overlay (like the widget layer) is missing “pointer-events: none” and silently blocking clicks before they reach the icons.
My next plan is to fix the bugs, add animated wallpapers, add a weather and AI app, and possibly add some online features (e.g., cloud sync).
This is my first webOS. The reason I wanted to start something like this is that I have dreamed of creating an operating system of my own. I once created an OS based on Windows, but sadly failed. That’s why I found webOS is somewhere else for me to go. Even though I’m not good at frontend, with the help of YouTube and AI, I still managed to get a start. Currently, the OS features:
Calculator APP: where you can do some simple calculations.
Notes APP: where you can write some simple notes
Settings APP: Basic settings (still in progress)
One of the biggest challenges should be window management. It’s pretty hard to make sure the windows work independently…
In the future, I will focus on aesthetics and add more effects and more apps to make the webOS both useful and visually appealing.
