DevLog #1 — The Beginning of Mystery Files

Why I Started This Project

When I first began building my personalOS project, I considered creating a traditional portfolio-style experience. While that approach would have worked, it didn’t feel particularly memorable.

I wanted to build something that people would want to explore.

Something that felt less like a website and more like stepping into a story.

That idea eventually became Mystery Files — a fictional detective archive where users investigate clues, examine evidence, review suspects, and reconstruct events surrounding an unsolved case known as The Midnight Ledger.

The Vision

My goal is not simply to create a collection of web pages.

I want the project to feel like a real investigative system.

When someone opens the site, I want them to feel as though they have been granted access to a restricted detective database. Every window, every piece of evidence, every suspect profile, and every timeline entry should contribute to a larger mystery waiting to be solved.

Rather than telling users a story directly, I want them to uncover it themselves.

Building the Foundation

This development phase focused on creating the core structure that everything else will be built upon.

The operating-system style interface is now functional and serves as the central hub for the investigation.

Current features include:

✓ Desktop-style environment

✓ Draggable application windows

✓ Open and close window controls

✓ Investigation-themed navigation

✓ Live system clock

✓ Multi-window workflow

✓ Responsive information panels

The Midnight Ledger

To give the project a strong narrative foundation, I created the first case file: The Midnight Ledger.

The case revolves around the mysterious disappearance of an important museum ledger during a stormy night.

At first glance, the crime appears simple.

However, as evidence accumulates and timelines begin to overlap, multiple suspects emerge, each with motives, opportunities, and secrets of their own.

The truth remains hidden somewhere within the investigation.

Investigation Modules

To organize information, I introduced several dedicated sections:

📁 Case Files

The central location for case briefings, background information, and investigation summaries.

🧾 Suspects

Profiles containing motives, alibis, and relationships to the case.

🔍 Evidence

Collected clues and physical items connected to the investigation.

⏱️ Timeline

A chronological reconstruction of important events leading up to the crime.

Design Direction

A large amount of time was spent shaping the atmosphere of the project.

I wanted the interface to feel professional, mysterious, and immersive.

The dark color palette, floating windows, information cards, and investigation-focused layout were all chosen to support that goal.

Every design decision was made with one question in mind:

“Does this feel like a real detective system?”

Challenges Along the Way

One of the biggest challenges was finding the balance between storytelling and usability.

A mystery is only interesting if information is revealed gradually, but a website must still be easy to navigate.

Designing separate investigative windows proved to be an effective solution, allowing information to remain organized while preserving the feeling of exploring a case file.

Looking Ahead

Although this is only the first development log, the foundation is now in place.

For now, Mystery Files exists as the opening chapter of a much larger story.

The archive has been created.

The evidence has been collected.

The suspects have been identified.

The only thing missing is the truth.