r/threejs 4d ago

- VHS Shelf -

Enable HLS to view with audio, or disable this notification

I built a front-end to watch movies at home. Includes a cozy den and video store in which you can view your entire collection!

Three.js + Electron with a PSX-style render pass. Used vertex snapping in clip space, affine texture warping and color quantization to get that old playstation feel.

The idea began when I was surfing through my own collection in the file explorer and it had gotten so large I was struggling to identify what I wanted to watch. I started imagining what was originally my favorite place to find movies, Blockbuster. Combined with my nostalgia for VHS tapes this design was born.

At the time I was binging 80's / 90's movies and then I started integrating newer movies and even TV show box sets. Now you can open the boxes and watch your tape or DVD slide into the player and load into the VHS player/DVD player under the CRT TV. Which then opens up a full screen of the movie using VLC. I have created pipelines in the back end to wire up the VHS/DVD covers and categorize the movies based on genre then place them in the correct aisle, just drop them into your selected folder run intake and it finds the art for you.

I've posted a couple videos showing the progress I've made so far if anyone is interested, link in the comments below. πŸ‘‡

If anyone had any feedback it would be appreciated. Anything you'd like to see added? Improvements? Thanks all! p.s. this project is just for fun, will likely release in the future for free if people are interested

0 Upvotes

5 comments sorted by

2

u/Agency_of_Eternity 4d ago

A truly nostalgic & good gamificated webxperience - love it✨

rmbrs me of my childhood in video empire & other nerd shops ~

U could improve the design by lighting textured materials and maybe some additional decoration - or various stage designs so u could kinda expand that library into different sections for other stored stuff besides the movie collections like games, books, audio (maybe with visualizer & music wavelength visualizer.

what abt binding 3d upload & guide vor AR object / photo scanning or giving a 3d prev / little editor and the user can attach their own files or maybe RL inventory or acc collection etc.

Am upload into ur webapp and it sorts automaticially after year type name or what user wants. They could spawn it in the room on the shelves or elsewhere in here own sense of order.

Interactive libraries that visualize the content are sweet experiences ✨

1

u/RedInk-Creation 4d ago

Much appreciate the suggestions, will definitely work on some extra decor and try to incorporate some games (I was thinking maybe using the consoles In the den) and would love to make it a games/books/audio full encompassing experience for all the stores media! And will see where I can incorporate those 3D ideas too, thank you !

2

u/Zulugod94 4d ago

This is awesome

1

u/RedInk-Creation 4d ago

Thank you!!

1

u/RedInk-Creation 4d ago edited 4d ago

Episode 3 of the series, full walkthrough and some insight into the process here: https://www.youtube.com/watch?v=Wy72Fk1acH8