MoodyBeats

Pratham Dhyani — Fri, 05 Dec 2025 21:10:47 +0000

MoodyBeats—Reimagining the Mixtape for the Haunted Digital Age

MoodyBeats is a love letter to the era of cassette tapes—but with a supernatural twist.

It lets anyone create, customize, and share haunted mixtapes that feel tactile, imperfect, retro, and a little bit spooky.

From designing your own tape shell to hearing the reels hiss and wobble, the entire experience blends nostalgia with eerie digital magic.

1. Maker Mode—Crafting Your Haunted Mixtape 📼

In Maker Mode, users build their mixtape from the ground up, just like in the old days—but with modern tools.

Choose Your Tracks 🎶

Users can add music from Uploaded audio files

They also set a tape title and add a personal message like “A mix just for you…”

True Cassette Flow: Side A / Side B

Instead of a typical playlist, MoodyBeats uses a multiple-sides format:

Sort songs into Side A and Side B
Arrange tracks by hand, giving warm analog vibes instead of algorithmic precision

Design Your Custom Tape Shell 🖍️

Your tape doesn't just sound unique—it looks unique.

Choose from multiple vibrant colors
Select from 4 presets with unique designs

The result feels like a physical artifact: something you could almost touch.

2. Player Mode—An Authentic (and Haunted) Tape Deck Experience

MoodyBeats doesn’t behave like a normal digital player.

It imitates the quirks and limitations of real cassette decks—the good, the bad, and the spooky.

Retro Playback Controls

Users can:

Play / Pause
Fast-Forward
Rewind

There’s no track list—the song names and counts are intentionally hidden to preserve authenticity.

“Skip” only happens when the user fast-forwards far enough to reach the next track.

Living, Breathing Tape Deck UI

The player looks like a vintage cassette machine:

A/B side flipping animation

Tape Overheat Mechanic

Push the tape too hard, and MoodyBeats reacts:

Fast-forward repeatedly → the tape heats up
A “cool down” calms the machine before playback resumes

It's playful, unexpected, and adds a layer of personality.

3. Haunting UI—Where Nostalgia Meets Horror 🧟‍♂️

MoodyBeats injects supernatural energy into an otherwise familiar device.

Every interaction has a chance to feel… haunted.

Spooky Transitions

Don't press the fast forward button too many times... You might hear some creepy noises.
The buttons seem to act up if you dont handle them with care

Audio Jumpscares & Creepy Layers 👻

MoodyBeats hides subtle scares:

Random creepy audio cues during fast-forward or rewind
Very rare “jumpscare audios” blended into existing sound effects

It’s never too much—just enough to make the user question whether the tape is… alive.

4. Sharing the Experience—Haunted Envelope Export & Import 💌

What’s a mixtape if you can’t give it to someone?

MoodyBeats introduces a haunted sharing mechanic.

Shareable MoodyBeats URL

Every mixtape generates a unique link with:

A preview of the custom tape design
A mysterious, ghostly envelope animation when opened

Manual Export/Import

For full control, users can export or import:

Metadata
Audio files
Notes
Visual design configs

Everything is bundled into a single archive file—easy to store, send, or remix.

Custom Haunted Envelope Design

Creators can decorate their envelope with:

Colors, sigils
Stars, skulls, and many more sigils to choose from
Also sign your name (only if you want to)

The Envelope Opening Ceremony 📩

Receiving a MoodyBeats mixtape becomes an experience:

The envelope shakes
A cassette slowly slides out
A handwritten note fades in
The mixtape begins…

Inspiration

We were heavily inspired by the aesthetic of the visuals and audio of a character from Jojo's Bizarre Adventure. The stand (character's ability), to be specific, called "Moody Blues," is what inspired a lot of features of this project.
The audios and aesthetics used for that character were very appropriate for this project. I, personally, found those voice effects very cool, and the color scheme was also super cool.
We'd like our users to find some Easter bugs related to this and many more characters. We love the show, and we know a lot of people who love it too, so we are very excited for them to use the website.

What's next?

We really want to develop an app from this project. I think this could be very good for us to start with. Something that is fun to use and not too difficult for us to make and change. We have used React Native, but we will still need to polish the app before we publish it on any platform.

MoodyBeats is More Than a Player—It’s a Haunted Digital Artifact 💫

It mixes nostalgia, handcrafted creativity, spooky ambience, and glitch-aesthetic storytelling into one cohesive platform.

Whether you’re making a heartfelt mix for a friend or a creepy soundscape for Halloween, MoodyBeats turns music into an experience, not just a playlist.

kiro #vibewithkiro #oldschool #music

StrangEars

Pratham Dhyani — Thu, 14 Aug 2025 11:20:32 +0000

🍃 Turning the feeling into a product

The vision was simple: match someone who needs to vent with someone who’s willing to listen—privately, anonymously, and without judgment. That meant intentional constraints:

Text‑only chat to reduce misuse and keep focus.
Usernames instead of real names, with guidance to avoid real photos.
Always‑visible End Chat and a Report flow that captures the session ID for quick review.
Spam protection via rate limiting to prevent rapid‑fire floods and keep conversations readable.

🏃♂️ The 3‑week sprint

My teammate and I worked closely on all aspects to make sure we were on the same page, be it the design or the features. We chose a stack built for speed and clarity: React 18 with TypeScript, Tailwind, and Socket.IO on the client; and Node/Express, Socket.IO, and Redis for session logic on the server. I treated UX like guardrails: calm surface, obvious exits, and safety tools you can’t miss, and the UI like a welcoming mat: cozy and welcoming.

The first time we saw messages travel across our chat UI, it felt like proof the idea worked—not just the code. Early demos with friends validated the vibe we were aiming for: “cozy.”

🤖 Using Kiro (and learning to manage an AI teammate)

We had a 3rd teammate with us this time around—Kiro, which helped accelerate implementation. It was undeniably helpful for scaffolding the real‑time chat loop, wiring Socket.IO events, and drafting Tailwind layouts we could refine. But it also needed a lot of supervision. We found ourselves repeating instructions—sometimes the same ones—so it would actually implement what we intended, and once it nearly deleted a large chunk of code during “cleanup” (thankfully it asked for confirmation and Sanyam caught it). The lesson: AI can boost productivity, but only with to-the-point prompts, small steps, and human review at every step.

What worked best with Kiro:

Small, directive tasks (“Add a Report modal that auto‑captures session ID and posts to /reports”) instead of broad requests.
Clear acceptance criteria (“Button always visible; modal blocks until reason is selected; server logs timestamp + session ID”).

🎨 Designing for safety over flash

We consciously avoided voice/video in the first version despite receiving that suggestion from quite some people. That decision shaped everything—from the compact message composer to the prominent “End Chat” and “Report” controls. Rate limiting became a must‑have, not a nice‑to‑have: it keeps conversations humane, preserves attention, and blocks bot‑like bursts before they overwhelm a listener.

🌟 What changed me as a builder

Teamwork is an important takeaway for sure. There were multiple times when there were disagreements on designs, but you should know when to back down and accept the suggestion and when to urge for a change when you feel it's important to do what you are thinking. Apart from this, I learned about new frameworks and building tools like Tailwind and Vite.

The most important takeaway has to be that AI is more of a force multiplier and not an autopilot that can do everything by itself. It has a lot of areas of improvement, but it certainly makes implementation and the tedious things easy to do.

DEV Community: Pratham Dhyani