@colgation

Caveman Web OS is an Easter egg hunting game disguised as a prehistoric computer operating system. At first, it looks like a simple WebOS with draggable windows and applications. However, different buttons, messages and interactions can reveal hidden achievements. Players can use the Easter Egg Tracker to see what they have discovered and receive clues about secrets they have not found yet. In case anyone is struggling, here is a video of me completing all the achievements: https://www.youtube.com/watch?v=Ed1CFRDi-0Q

**Live Website**
https://194500-cpu.github.io/CavemanOS/

**Features**
Draggable application windows
Desktop-style navigation bar and dock
Live date and time display
Campfire messaging app
Realtime messages using Supabase
Easter Egg Tracker
Hidden achievements
Caveman AI called Bob
Random dialogue and hints from Bob
Secret phrases and puzzle-based interactions
Special ending screens
Achievement visuals that change after discovery
Custom prehistoric interface and artwork *Sweet Alert 2 for beautiful alerts
How It Works
The WebOS interface is made from HTML elements styled as movable application windows.

**Challenges**

Making Windows Draggable
I had to calculate the movement of the mouse and update each window’s position while preventing windows from being dragged completely outside the screen.

Window Layering
When multiple applications are open, the selected window needs to move in front of the others. I implemented this by increasing each selected window’s z-index.

Realtime Campfire Messages
I connected the project to Supabase so messages could be saved and displayed to different visitors.

I also used Supabase realtime updates so new messages could appear without manually refreshing the page.

Designing Easter Eggs
The achievements needed to be hidden but still possible to discover.

I tried to create clues that gradually lead players toward an answer instead of revealing the solution immediately.

Deploying With GitHub Pages
I learned how GitHub Pages serves the project from the docs folder. I also encountered Git merge conflicts while moving files and learned how local development can behave differently from a deployed website.

**What I Learned**
During this project, I learned more about:

JavaScript event listeners
DOM manipulation
Functions and application state
Asynchronous JavaScript
Supabase databases
Realtime database subscriptions
CSS positioning
CSS transitions
Draggable interfaces
z-index and window layering
Responsive layouts
Git commits
Merge conflicts
GitHub Pages deployment
Debugging differences between local and deployed websites
Future Improvements

My 150g antweight wedgebot design (only 3dprinted parts excluding motors/batteries/board).

Key features and design choices I made:

1) The wedge is intetionally not flat at the bottom. It is more of a triangle pointing downwards, in order to have a higher surface clearance.

2) My antweight does NOT use TPU for its wedge, but rather 100% PLA+. This because the rigid wedge will get under opponents using TPU wedges (90% of opponents).

3) Even when flipped, the bot can still move around.

4) A pointy end helps prevent it from lying on its back (imagine if your bot landed on the back but couldn't self-right -> loss)

5) Finally, the wedge is not flush with the top. The small amount of vertical face helps it to catch onto opponents, not just slide under them.

By combining all these features, I have created a deceptively simple design, which is beginner friendly and competitive.

-Colgation

A Slack bot that runs 24/7 on Nest and has 5 commands:

/aerodynamic-help - shows all available commands
/aerodynamic-ping - Check bot latency
/aerodynamic-737 - Get an Airbus 737 fun fact
/aerodynamic-cessna172 - Get a Cessna 172p Skyhawk fun fact
/aerodynamic-wright - Get a Wright Flyer fun fact
Test out the commands in the #bot-spam channel on slack!

I made a easter egg hunter hidden as a WebOS. It has visible tracker for achievments, a connected "Campfire" app that uses a database to store messages, and included closable and draggable windows.

Interested? Check it out!