RetroCade is an ambitious ever-growing experiment set out to create a functional, semi-realistic audio system in HTML, CSS and JavaScript only. Made with and in reminiscence of the golden age of electronica and disco.

"Never gonna give you up..."

Sweet dreams (are made of this)

And indeed they are.

I based my concept on the Akai GX-747 and on the memories of my father's Grundig TS1000. I felt that this mixture of old and new made a perfectly pleasant and balanced layout. Influenced by Google's currently trending material design, the concept went through quite a few iterations and many moments of self-doubt. Am I adding too many buttons? Is it supposed to be three-head or four-head? Should it even have a stop button or just pause? You get the gist of it.

Get down on it

Get down on it!

So, what do I plan on adding in the future, you ask?

  • Functional power button
  • Functional play/pause buttons
  • Draggable volume sliders
  • Rotating knobs
  • Animated VU meters
  • Easing rewind/fast-forward functions
  • Display counter that actually keeps track of time

Perhaps even the possibility of playing a real track.


See it in action

buttons, dials, sliders

Reel-to-reel tape recorders can often times appear confusing due to their highly complicated layouts. I tried to approach this issue by heavily simplifying the original concept, whilst still providing a somewhat functional, minimalist UI.