After She Logged Off.....

booting screen
desktop
image folder
web search
message app
unknown's messages
locked diary
unlocked diary
recycle bin
new message
oh

This project is inspired by the digital-forensics structure common in true crime documentarie sreconstructing a missing person's last weeks entirely through their device alongwith with the recruitment patterns that are commonly seen in cult and secret-society conspiracy theories. Instead of narrating what happened to Mary Jane, the player has to make out for themselves from her search history, messages, photos, and diary, the same way investigators and true-crime audiences piece together a disappearance from digital evidence. Diving into the context of the project, we are simulating the desktop of a girl , Mary Jane, that has been missing since 18th of April, 2024. This young woman who battles with hallucinations and side effects of her medicine is slowly drawn into a secretive group of people through an online friend who we do not know much of. The chats do not give away much detail about the two's relationship and most importantly not the man's as he's a crucial suspect to her missing case. What looks at first, like an online friendship is actually a recruitment. I've had the whole idea of "recovered device reconstructs a disappearance" structure, which is the core mechanic of the project, from watching a series of true crime documentaries and conspiracy theories. One of the stories that stuck with me was about the American murder of Shannon Watts and her two daughters who were killed by her husband. Their case was documented entirely through social media posts, texts, archived footage and home videos. I took a different lane and thought why not solve a murder through media and technological assets and came up with this desktop simulation plan. The occult symbolic layer was added as an inspiration from conspiracy theories and amateur online theories about cults. You're basically handling Mary Jane's "recovered desktop" and has to piece together what has actually happened to her. The desktop has the following features:

A boot screen: Static text of the boot screen is hardcoded into JavaScript and two setTimeout built in functions that execute the lines after specified amount of time: one fills in a blank line with "REOCOVERY COMPLETE" at 900ms and the other adds a The whole black screen appearning before the dekstop and its elements is just an illusion created by CSS property z-index at 200.
Desktop shell : The wallpaper is applied using CSS background-image on #desktop. The desktop: before layers a repeating dot-grid structure creating a subtle 'static'. The desktop:after adds a a box-shadow to darkened edges than the center.
The windowing System: Every app is a .win div, all positioned absolutely and hidden by default and can only be opened by the .open class. openWin(id) matches with the #win-{id}, adds .open and calls bringToFront() and encounters zTop which helps stack the new window over the previously opened window. closeWin(id) undoes it. Dragging of window boxes is handled by the mousedown, mousemove,mouseup listeners to each windows .titlebar.
Images and Recycle Bin(Photo viewing): A photoSets object holds two arrays : images and bin each having {src, name} objects. photoIndexes object tracks the current index per set. showPhoto(set) changes the image according to the index and changePhtot(set,direction) increments or decrements to that index. Arrow-key listeners are for changing photo when the window is open.
WebFind broweser: Its just a hard coded list of 'searches' styled by CSS. No JS. It is static.
Messages: This took a lot of work. The #chat-list shows three .contact-row divs (Unknown, Mom and Dr. Ahlgren). Clicking one of the contacts calls openThread(id) , hiding the list and matching #thread-{id} div. Each thread is a stack of .msg-row divs written in HTML and styled in CSS. unlockDiary() also has hardcoded HTML except a lowercased version of the input given at the password section is compared to the string '1111'. 7.Ending: Once all the important windows are opened , a visited set collects all the visited . As you visit all the windows a markVisited(id) is called from openWin but for unlockDiary() and for openThread('friend') specifically for that chat, opening the diary or messaging app does not count. You need to actually unlock the diary and open Unknown's chat. Once all the ids are acquired the revealFinalMessage() is called and it unhides the final thread in the friend thread. .badge lights up a notif indicator on the icon and the contact list row . I'm planning to add more progression into the story with addition of audio and video footage rather than just static sources. Maybe more mind boggling puzzles that you have to wrack your brains through .