January Sale 75% off all courses until 24th Jan
Special offer Audio Reactive Visuals with Code By Yannis Yannakopoulos
January Sale!
$100 $25
Audio Reactive Visuals with Code
English English, Spanish, French (+2) [Machine translation]
3 Hours 20 Mins Course

Audio Reactive Visuals with Code

January Sale!     $100 $25

Sound can dictate a new Visual Language. In this case the browser is the canvas and in this course you will learn how to use sound to draw onto that canvas, with code.

We’ll start from the ground up and set the basis for creating audiovisual art with Javascript & GLSL.

You’ll learn how to analyse sound in realtime and how to use that analysis, to control moving graphics. We'll start simple by learning how to draw basic shapes in the canvas and we'll gradually move on to more complex subjects, like WebGL & Shaders.

By the end of this course, you will be able to create audio-reactive artworks in the browser, but most importantly you will be able to use code, as a tool for personal expression.

The subtitles are automatically generated, so the quality of the captions may vary.

Course Table of contents
What will you learn?

5 sections • 19 lectures • 3 hours 20 mins

  • Intro
    1 lectures 03:02 Mins
    • Course introduction
      03:02 Mins
  • Drawing on the canvas
    5 lectures 26:38 Mins
    • Introduction to p5.js
      03:03 Mins
    • Hello canvas
      06:31 Mins
    • Basic shapes
      03:46 Mins
    • Color
      05:56 Mins
    • Interactions
      07:22 Mins
  • Sound Analysis
    5 lectures 44:18 Mins
    • Introduction to Sound Analysis
      01:01 Mins
    • Amplitude & Waveform
      09:00 Mins
    • Fast Fourier Transform
      07:28 Mins
    • Beat Detection
      14:53 Mins
    • First Sketch
      11:56 Mins
  • WebGL & Shaders
    7 lectures 1 Hour 50 Mins
    • Introduction to Shaders
      11:18 Mins
    • Distorting Shapes with Audio frequencies - Sketch 1
      17:14 Mins
    • Distorting Shapes with Audio frequencies - Sketch 2
      14:17 Mins
    • Distorting Shapes with Audio frequencies - Sketch 3
      03:27 Mins
    • Audio-based image effects
      21:03 Mins
    • Different inputs (WebCamera, Microphone)
      05:57 mins
    • Controlling visuals in real time (MIDI controller, keyboard/mouse )
      17:15 Mins
  • Outro
    1 lectures 15:49 Mins
    • Inspiration
      15:49 Mins
Yannis Yannakopoulos
Work Work Work 
Work Work Work 

Yannis is one of the most collaborative, creative and interesting people I know. Apart from the code part -which he masters in every project- and his expertise in interactive experiences, his deep love, dedication and understanding of music, makes him the ideal instructor for this immersive masterclass.
Sofia Papadopoulou
Sofia Papadopoulou Visual Designer and Art Director
Course details

Audio Reactive Visuals with Code

Audio Reactive Visuals with Code

By Yannis Yannakopoulos

$25 75% off $100

January Sale!

  • English
  • English, Spanish, French, Italian, Portuguese (Machine translation)
  • Beginners & Intermediate This course is addressed to any creative individual who's interested in creative coding and/or audio-reactive visuals.
  • Access on mobile and Desktop
  • Full time access
  • Certificate of completion
About the Speaker
Learn from the best
  • Yannis Yannakopoulos

    Yannis Yannakopoulos

    Freelance Developer


    Yannis is an Independent Developer based in Athens, Greece. Interested in the relation between sound & image, he creates audiovisual projects, in the browser, with code.


Similar Courses