✌️ Added a new waveform visualizer to the https://songsling.io landing page.

🎡 It uses web audio to generate noise and plays back a looped beat. There's no sound as the output is muted, but it's very useful for performant drawing (via canvas).

🌐 Next: the idea is to sync the start of the beat with the keyframe in the animation (made by https://www.instagram.com/123pingu/) where the globe starts smiling and mute again when turns around. I might have to change it from .gif to .mp4 or find a solution to track .gif keyframes. Suggestions welcome!

The essence of the service is that you can create interactive tracks that change in response to online metrics. So my idea was to have an animation of 🌐and a waveform that sort of conveys that (beat starts pumping when the 🌐 looks happy/accomplished, otherwise it's quiet)

Everything that would enhance the results really! I'm not a designer so all feedback very welcome.

Comments

Fresh Top
  1. Considered using something like 3js, and actually get the globe's geometry into the page? I think it'd be pretty hot if you could get it animating in realtime. You'd have the opportunity to blend animations instead of just queuing precanned videos?

    2
  2. Have the .dae file actually but from an older version of the animation, it's a possibility though. threejs is already used on the project list page (bird model, visible in demo)

    4
  3. Quirky and original

    The copy is not as clear as it could be. I understand the product after reading your Pipo story but if I were to approach this with a fresh mind then I'd have a hard time figuring out what this is exactly. The demo is nice to have but it's too freeform, in my opinion. I think something more guided would work better here. Taking parts of your Pipo story and some screenshots from the demo might make it clearer!

    Also welcome to Keyframes! This is a crazy and super impressive idea. I wouldn't have thought about that in a million years myself.

    5
  4. I really like the idea

    I second "voy-tech" here ;)
    you demo is great but I would love to have some wizard or a video to explain what is the platform all about.

    4
  5. Thank you all, great feedback! I'm planning to work on expanding the landing page with explanations and details - featuring more cute animations like a robot and a vacuum cleaner πŸ˜„

    Everything was super-scrappy so far just trying to get it to a decent presentable shape. The next phase will be about somehow clearly communicating the idea, which is really really hard... I'm finding it surprisingly difficult to narrow down four years worth of internal ping pong to the typical few seconds of people's attention span πŸ˜„

    11
  6. I am here to just compliment the 🌐

    3

Sign Up or Log In to leave a comment.