DEV Community

Cover image for PHANTOM โ€” Beyond the Unknown ๐Ÿ‘ป | Hacktoberfest Open-Source AI Challenge
Shraddha Kolate
Shraddha Kolate

Posted on

PHANTOM โ€” Beyond the Unknown ๐Ÿ‘ป | Hacktoberfest Open-Source AI Challenge

Hacktoberfest Open-Source AI Challenge: Ghost in the Machine Submission ๐Ÿ‘ป๐ŸŒผ

This is a submission for the Hacktoberfest Open-Source AI Challenge Week 4: Ghost in the Machine

PHANTOM โ€” Beyond the Unknown ๐Ÿ‘ป | Hacktoberfest Open-Source AI Challenge

Every shadow has a story. Every silence hides a question.

At 3 AM, you hear three knocks on your bedroom window.

You open the curtains. Nobody is there.

But when you turn away, you notice something on the glass: a pale handprint.

Would you call it a coincidence, imagine the possibilities, or turn it into a story?

That question inspired PHANTOM โ€” Beyond the Unknown, an immersive paranormal storytelling experience built for the Hacktoberfest Open-Source AI Challenge: Ghost in the Machine.

๐Ÿ”— Live Demo: https://phantom-paranormal-shra.bolt.host

๐Ÿ’ป GitHub Repository: https://github.com/shraddhakolate30-maker/phantom-beyond-the-unknown

๐ŸŒ‘ What Does PHANTOM Mean?

The name is more than a spooky title.

PHANTOM represents the mysterious presence that exists at the edge of what we can see, understand, or explain.

Beyond the Unknown represents the journey into those unanswered questions โ€” the strange experiences we cannot easily explain, the memories that stay with us, and the stories that emerge from our imagination.

Together, PHANTOM โ€” Beyond the Unknown invites people to explore the space between mystery and imagination through storytelling.

Its tagline captures the idea perfectly:

Every shadow has a story.

๐Ÿ‘ป What Is PHANTOM?

PHANTOM is a paranormal storytelling web application designed to make exploring and creating eerie stories an immersive experience.

Instead of presenting horror as just another collection of text, I wanted to create an atmosphere where the experience itself feels mysterious.

The project brings together storytelling, AI-assisted creativity, a haunted visual atmosphere, and eerie background ambience.

โœจ Key Features

1. ๐Ÿ“– Story Wall

A space to explore paranormal stories, strange encounters, haunted places, unexplained events, and fictional horror.

2. ๐Ÿ•ฏ๏ธ AI Story Forge

A story-generation experience that helps transform a spooky idea or prompt into an atmospheric horror narrative.

Whether the inspiration is a mysterious mirror, unexplained footsteps, or a forgotten room, the goal is to give that idea a story of its own.

3. ๐Ÿ“ Share Your Story

A place for users to contribute their own paranormal experiences or fictional stories.

Personal experiences are presented as accounts, not as independently verified evidence of paranormal activity.

4. ๐ŸŒ˜ Story of the Week

A dedicated space to highlight a story and encourage readers to discover new mysteries.

5. ๐Ÿš๏ธ An Immersive Haunted Atmosphere

The visual experience uses a dark, cinematic horror aesthetic, with eerie backgrounds and atmospheric sound designed to complement the stories.

6. ๐ŸŽญ Different Kinds of Fear

PHANTOM explores several storytelling styles, including:

  • Real-life paranormal experiences
  • Ghost encounters
  • Haunted places
  • Unexplained events
  • Horror fiction
  • Psychological horror

Each category offers a different way to explore the unknown.

๐Ÿง  The AI Behind the Stories

PHANTOM is built with a focus on making AI-assisted storytelling part of the actual experience rather than simply adding an AI label to a website.

The Story Forge is configured around Gemma 3 1B in ONNX format through Transformers.js, with generation tested through the application.

The intended approach is browser-side model inference, allowing the application to use an open-weight model rather than depending entirely on a closed, hosted text-generation API.

Model loading, download requirements, browser compatibility, and generation speed can affect the experience, so these remain important parts of the technical implementation.

The purpose is simple: make AI a creative tool that helps turn an idea into a story while keeping the experience accessible through a web interface.

๐Ÿ”“ Why Does Open Innovation Matter?

For me, open innovation means having more freedom to experiment, learn, and build.

Using an open-weight model provides opportunities to explore how AI works, understand its limitations, and adapt the implementation instead of treating a closed API as a black box.

With PHANTOM, this approach offers three important possibilities:

More control: The model and inference pipeline can be inspected and modified as the project evolves.

More room to experiment: Different prompts, model configurations, and storytelling approaches can be tested.

A learning opportunity: Building around an open model creates an opportunity to understand more than just the final output โ€” it encourages exploration of how the technology works.

Browser-side inference also offers the potential to reduce dependence on a separate text-generation server. However, the model may still need to be downloaded, and actual offline behaviour depends on the implementation and availability of the required assets.

I believe open innovation matters because it makes experimentation more accessible and gives builders more control over what they create.

๐Ÿ› ๏ธ Tech Stack

  • React + TypeScript โ€” application interface and structure
  • Vite โ€” development and build tooling
  • Tailwind CSS โ€” styling and visual design
  • Transformers.js โ€” browser-side model inference
  • Gemma 3 1B (ONNX) โ€” configured open-weight language model for the Story Forge

๐Ÿงช What I Learned While Building PHANTOM

One of the biggest lessons was that a working interface and a working AI feature are not necessarily the same thing.

Story generation needs more than a button and a text box. Model loading, generation time, error handling, and the quality of the resulting story all affect the user experience.

I also learned how much atmosphere matters in a storytelling application. Visual design, sound, pacing, and written descriptions work together to create an experience that feels cohesive.

Most importantly, this project gave me an opportunity to experiment with open-weight AI while building something creative and interactive.

๐Ÿ”ฎ What's Next?

PHANTOM has room to grow.

Future improvements could include richer storytelling interactions, more ways to explore community-submitted stories, improved model-loading feedback, and additional controls for shaping generated narratives.

I also want to continue improving the balance between an immersive horror atmosphere and a smooth, accessible user experience.

๐Ÿ‘๏ธ Beyond the Unknown

Not every unexplained event needs an immediate answer.

Sometimes, the most interesting part is the story we create while searching for one.

PHANTOM is my attempt to bring that feeling into a web experience โ€” combining paranormal storytelling, atmosphere, and open-weight AI in one place.

Built for the Hacktoberfest Open-Source AI Challenge: Ghost in the Machine.

If you explore PHANTOM, I would love to know:

Which unsettles you more โ€” a ghost you can see, or a presence you can only feel? ๐Ÿ‘ป


devchallenge #hf26challenge #AI #OpenSource #Hacktoberfest #WebDevelopment #Storytelling #Gemma

Top comments (0)