Git Product home page Git Product logo

golden-record-images's Introduction

Real-time decoding and Audio Visualizer of the 116 images present on the Voyager Golden Record using the browser. The speed in which the images are displayed are not representative of those on the record.

Site: https://goldenrecord.netlify.app/

Table of contents

Images

voyager.images.mp4

Process

The Verge's video on decoding the images by hand is what initially sparked my interest. Having only seen the calibration circle that they decoded by hand, I wanted to see if I could do the rest.

They gave a set of instructions on the steps to follow, despite that and Ron Barry's article, I was still left scratching my head as not all of the details were clear. Here is a jist of the journey to getting the first calibration image.

Process picture 1

The brief instructions that I followed outlined that each column of the image was about 8ms long. However, this didn't translate well when looking at the audio file, as a file with 44.1kHz sample rate meant that 1ms represented 44 samples which could land on either column. After some digging, I found that with a 44.1kHz sample rate, each line would be exactly 367 samples. Which resulted in this image:

Process picture 2

Now that the image was somewhat aligned, the slanting became an issue. When looking at the audio file through audacity, we can see that the distance between the audio peaks are not exactly 367 samples.

Process picture 3

This stumped me for quite a while, but it turned out that the distance between every other peak was ALWAYS 367 * 2 sample apart, which represents 2 columns on an image. With that tiny change in the implementation, and some small bug fixes, we get the intended calibration picture.

Process picture 4

After that, it was just rinse and repeat with the other pictures, with the only difference being the color pictures being comprised of 3 overlapping images each representing Red, Green and Blue respectively.

Poor Image Quality?

Malte Gruber gives a good explanation as to why all of the images seem to have artifacts, which is a side effect of the digitization of the record.

More can be read here.

Acknowledgements

  • Ron Barry
    • Very useful instructions and insights through his article
  • Malte Gruber
    • Useful reference when stuck with some of the HTML Canvas implementations.

golden-record-images's People

Contributors

marcbaeuerle avatar

Stargazers

Lucas Ferreira avatar  avatar Malte Gruber avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.