Audio visualization with hype?


(Achim Goebel) #1

Hi there is there anyone ever tried to visualize a soundfile?
I checked out a lot of java pages but all of them using CSS. So any idea how to do this with hype? Any idea welcome:-)
02


#2

@tvnerd

Hi Achim!

Here is a thread that discusses some audio visualization concepts from display in the Hype interface itself to having a waveform play in the Preview~browser. None of the posts show an “equalizer” type of display as in your example - but You might get some ideas here…

Play audio in preview for timing (show as a waveform)


(Achim Goebel) #3

Hi Jim,
thank´s for your advice, unfortunately this is not, what i´m looking for.
Creating a videofile is what i can do with finalcut x and a nice plugin from Pixelfilmstudios
called audiovisualizer.
I´d like to get rid of the video and find a java based solution.
All examples i found in the www working with CSS:-(


#4

Can you share what you’ve found so we can see what you’re trying to replicate? This type of thing can’t be done purely with CSS.

Here’s one project I found that visualizes audio: https://wavesurfer-js.org


(Achim Goebel) #5

Hi Daniel,
this is, what i´m looking for:
http://bignerdranch.github.io/music-frequency-d3/

Cheers

Achim


#6

Well there you have it – it does what you want, so why not use that? I’m confused what you are hoping to do with Hype. If you’d like to visualize sound within your Hype document, you have the option to embed something that like within an HTML Widget. Hype doesn’t block you at all from using additional libraries and techniques built for the web. We encourage it!


(Achim Goebel) #7

Yep, good idea, forgot about this option;-)


(Hans-Gerd Claßen) #8

though you could easily adapt the script to power hypeanimations:

http://www.aachener-zeitung.de/zva/karlo/Z_stuff/frequenceVisualizer/

:slight_smile:


(Mark Hunte) #9

Mesmerising . But I now keep seeing spots :grin:dancing in front of my eyes…


#10

I’m getting out my dancing shoes! :footprints: :notes: :tada:


(Hans-Gerd Claßen) #11

replaced the song with a garagebandmix -> much better -> like the psychedelic touch :wink:

http://www.aachener-zeitung.de/zva/karlo/Z_stuff/frequenceVisualizer/

the playground: