Audiobus: Use your music apps together.

What is Audiobus?Audiobus is an award-winning music app for iPhone and iPad which lets you use your other music apps together. Chain effects on your favourite synth, run the output of apps or Audio Units into an app like GarageBand or Loopy, or select a different audio interface output for each app. Route MIDI between apps — drive a synth from a MIDI sequencer, or add an arpeggiator to your MIDI keyboard — or sync with your external MIDI gear. And control your entire setup from a MIDI controller.

Download on the App Store

Audiobus is the app that makes the rest of your setup better.

Kodelife, new app from Hexler

2

Comments

  • @xor said:

    @skiphunt said:
    I haven't seen any demos for Kodelife yet. Do you need to know how to code in OpenGL in order to use this app?

    Only if you want to create your own. You can copy/paste (with slight tweaking) shaders from sites like shadertoy.com

    In the videos it looks like pure coding. Wouldn’t you at least need to know enough coding for the code tweaking you mention?

    I want to play with this some, but I have zero interest in learning to code for it.

  • @skiphunt said:

    @xor said:

    @skiphunt said:
    I haven't seen any demos for Kodelife yet. Do you need to know how to code in OpenGL in order to use this app?

    Only if you want to create your own. You can copy/paste (with slight tweaking) shaders from sites like shadertoy.com

    In the videos it looks like pure coding. Wouldn’t you at least need to know enough coding for the code tweaking you mention?

    I want to play with this some, but I have zero interest in learning to code for it.

    I doubt you’d enjoy it. This app isn’t trying to hide the fact that shaders are code. You might be able to get existing shaders to run in it but not much beyond that.

  • @xor said:

    @skiphunt said:

    @xor said:

    @skiphunt said:
    I haven't seen any demos for Kodelife yet. Do you need to know how to code in OpenGL in order to use this app?

    Only if you want to create your own. You can copy/paste (with slight tweaking) shaders from sites like shadertoy.com

    In the videos it looks like pure coding. Wouldn’t you at least need to know enough coding for the code tweaking you mention?

    I want to play with this some, but I have zero interest in learning to code for it.

    I doubt you’d enjoy it. This app isn’t trying to hide the fact that shaders are code. You might be able to get existing shaders to run in it but not much beyond that.

    This is what I'm thinking. However, let me be a bit more concise. You seem to have a good grasp of this app, it's general use, and potential.

    With some code... even if you don't know that language, you can often discover what's doing what by just changing a few values here and there. With kodelife, it looks like you get instant feedback?

    For example... with basic html code... even if you don't code in html, you can often simply copy/paste some code and sort of figure out how it works by replacing a few address locations and a few values here and there.

    I can't tell from the videos if this would be a fruitful approach with this shader editor. It looks like you need to know more of the language than simply altering some parameters to get a more customized result.

    What is your thought on this approach? A non-shader-coder could wing it from copied code? Or, the very little you could manage without coding knowledge would be so limited as to not be worth the effort?

  • @skiphunt said:

    @xor said:

    @skiphunt said:

    @xor said:

    @skiphunt said:
    I haven't seen any demos for Kodelife yet. Do you need to know how to code in OpenGL in order to use this app?

    Only if you want to create your own. You can copy/paste (with slight tweaking) shaders from sites like shadertoy.com

    In the videos it looks like pure coding. Wouldn’t you at least need to know enough coding for the code tweaking you mention?

    I want to play with this some, but I have zero interest in learning to code for it.

    I doubt you’d enjoy it. This app isn’t trying to hide the fact that shaders are code. You might be able to get existing shaders to run in it but not much beyond that.

    This is what I'm thinking. However, let me be a bit more concise. You seem to have a good grasp of this app, it's general use, and potential.

    With some code... even if you don't know that language, you can often discover what's doing what by just changing a few values here and there. With kodelife, it looks like you get instant feedback?

    For example... with basic html code... even if you don't code in html, you can often simply copy/paste some code and sort of figure out how it works by replacing a few address locations and a few values here and there.

    I can't tell from the videos if this would be a fruitful approach with this shader editor. It looks like you need to know more of the language than simply altering some parameters to get a more customized result.

    What is your thought on this approach? A non-shader-coder could wing it from copied code? Or, the very little you could manage without coding knowledge would be so limited as to not be worth the effort?

    My thoughts is that might work to a degree. I used K-machine for a while using that mindset and it worked but not always Just a matter of experimentation for those with patience.

  • Kodelife has been around for desktop quite a while (maybe in beta but still), search youtube and you can find some experiments and people working it. I found some really cool projects on github but did not manage to open them on iOS. I've also asked the dev to add more example files in the app and the answer was that they are working on just that.

  • Kodelife compared to Shaderific? (Both on iPad)

  • edited July 2021

    @skiphunt you can edit the code in KodeLife on the fly and it will show your changes instantly plus if you have any errors in your code, it will point them out too. Many of the shaders on the ShaderToys website will be a simple copy and paste job. You can use traditional video editing techniques using loops of video you’ve recorded and use them in other apps. Lots of great fodder for use as the background layer in the VS app.

    As far as tweaking existing code in shaders to incorporate audio reactivity into shaders, the path of least resistance is to look in the code of shaders that can be controlled by a “mouse” or on Apple mobile devices your finger and substitute the mouse code for audio code. A bit of scaling might be needed to make it work appropriately but a little trial and error will get you in the correct ballpark. You can start with shaders created using less code to figure out how to do your mouse to audio input conversion and then look to do similar mods on more complex code that uses mouse input.

  • @mojozart said:
    Kodelife compared to Shaderific? (Both on iPad)

    Shaderific basically takes obj files which are basically 3D wire frame info and you can use either video or pictures to cover them. It has a nice editor and info about how to learn GLSL like pop ups for keywords. You can rotate your object around the screen and specify how many copies of the object you want. It comes with lots of helpful examples you can use right away. It doesn’t do a lot of the types of shaders that KodeLife can and I don’t see a way for Shaderific to do reactive audio. Here’s a screen shot of an elephant I’ve textured with a 2D graphic file.

    Currently, KodeLife has a manual that really doesn’t cover how to learn GLSL at all. You can use sites like The Book of Shaders to learn and can paste the code in from that site directly into KodeLife and it will work. KodeLife doesn’t appear to have a way to use obj files that I can see.

  • edited July 2021

    Ok... well, I bought Kodelife.

    This is what I suspected. It's merely a tool for writing and editing code. Looks like OpenGL specifically.

    I was going to get a refund... but for $5 I decided to keep it as sort of a puzzle to try and figure out.

    I looked up learning OpenGL from scratch with no computer science or coding background... and it appears that it could take years to learn it. Not going to go down that road. ;)

    However, I've watched a few videos and I've at least learned to change a few parameters and at least get a result. (baby steps)

    I have yet to get any cut/paste from shadertoy into Kodelife to work. I mean, I can't even get close. Every one I've tried is full of errors after pasting in.

    Could someone walk me through the most basic cut/paste of a shadertoy script into Kodelife... and let me know what I need to change/tweak to get it do work in Kodelife? Something very basic and simple would be fine. I'd just like to at least get over the cut/paste hump and then I'll gradually dig a bit deeper.

    I also installed Kodelife on my desktop since cut/paste is a lot easier than doing it on the iPad.

  • I ended up buying it after posting and it is incredibly cool. I like the live coding aspect. The tricky bit isn’t the code as much as the math.

    The goal of the shader is to return a color (rgba) for a single pixel at coordinates specified by inData.v_texcoord.

    Tossing out all the boilerplate, here’s their default sample. Just two lines of code but good luck figuring out why it does what it does. // comments are mine

    // turn coordinates into odd numbers beginning at 1 (effectively zooming out - figured
    // out by deleting the * 2 and -1 - live coding cool)
    vec2 uv = -1. + 2. * inData.v_texcoord;
    
    fragColor = vec4(
        // red
        // sin & cos vary between -1 an 1 but colors are just 0 - 1
        // abs just rectifies the signal so it’s always positive.
        // see below for the explanation of the left half of
        // sin’s input, basically it’s based on the x position 
        // of the pixel modulated by it’s y position and time
        abs(
            // sin(time) is a lfo cycling from 0, 1, 0, -1, 0 every
            // 6.28 seconds. 
            sin(
                // cos(time) is a lfo of approx .16Hz (cos cycles from 1 to -1
                // and back to 1 over inputs of 0 - 2pi [6.28] seconds).
                // cos(uv.y) is a “lfo” over the vertical dimension cycling from 
                // 1 back to 1 every 6.28 pixels but since uv is doubled
                // in the first line the cycle is 3.14 pixels and since it’s
                // tripled in the expression it cycles almost once per
                // pixel. 
                // the cos (-1 to 1) is doubled then scaled by the horizontal
                // position of the pixel
                // time is added as an additional modulation
                cos(time+3.*uv.y)*2.*uv.x+time
            )
        ),
    
        // green
        // basically the same as above but it’s the y position pixel that’s 
        // modulated by the x position and time
        abs(
            cos(
                sin(time+2.*uv.x)*3.*uv.y+time
            )
        ),
    
        // blue - spectrum.x is the energy of the low (or high?) audio frequencies coming in 
        // multiplying by 100 just amplifies the signal (again the range is 0 - 1 so this is really
        // cranking up the input
        spectrum.x * 100.,
    
        // alpha (opacity) 1 is fully opaque
        1.0);
    

    Even knowing all that you’d need to have studied advanced math to guess it might look something like this

  • edited July 2021

    @xor What kind of advanced math specifically? I've been planning to get into this sort of thing.

    That said, for anyone else who's wondering, you can probably just type sin cos tan xyz open parenthese to the 4th power plus absolute value of 3 close parenthese times 8 divided by the square root of 9 fgsfdsqdpiocndmiocjmwo and eventually you'll get something cool, ya know? At least that's what I'm counting on.

  • edited July 2021

    @skiphunt said:
    Ok... well, I bought Kodelife.

    This is what I suspected. It's merely a tool for writing and editing code. Looks like OpenGL specifically.

    I was going to get a refund... but for $5 I decided to keep it as sort of a puzzle to try and figure out.

    I looked up learning OpenGL from scratch with no computer science or coding background... and it appears that it could take years to learn it. Not going to go down that road. ;)

    However, I've watched a few videos and I've at least learned to change a few parameters and at least get a result. (baby steps)

    I have yet to get any cut/paste from shadertoy into Kodelife to work. I mean, I can't even get close. Every one I've tried is full of errors after pasting in.

    Could someone walk me through the most basic cut/paste of a shadertoy script into Kodelife... and let me know what I need to change/tweak to get it do work in Kodelife? Something very basic and simple would be fine. I'd just like to at least get over the cut/paste hump and then I'll gradually dig a bit deeper.

    I also installed Kodelife on my desktop since cut/paste is a lot easier than doing it on the iPad.

    For the ShaderToy shaders, you need to copy main code into the last section of the template. The top section will be okay as it is. For example, replace lines 34-38 in the template with the code from the Image tab on the ShaderToy.com site— this will work for most though not all ShaderToy shaders. Some shaders may have image files iChannel0 thru iChannel3 which you’d need to download and assign in KodeLife.

    I’ve attached zipped ShaderToy shader that I modified to be audio reactive. You can unzip it and then load it into KodeLife. I added lines 27, and 39-41. I changed lines 121 and 129 and lines 120 and 128 have the original code commented out using, “//“.

    The following screen shots show how to add the built-in variable spectrum1 which stores input audio information split into 3 frequency bands.


    For best audio results, you can use a USB audio interface for the audio input. You can also use the built-in mic and have KodeLife listen to the iPad’s built-in mic. You can specify the audio input/output settings in the app’s audio settings from the gear icon in the upper right corner.

  • edited July 2021

    I finally managed to do something all Kodelife i.e not using ShaderToy copied code. It's no beauty but a step on the way.

  • @Pxlhg said:
    I finally managed to do something all Kodelife i.e not using ShaderToy copied code. It's no beauty but a step on the way.

    That's awesome.

    Really liking the track as well.

  • @Pxlhg said:
    I finally managed to do something all Kodelife i.e not using ShaderToy copied code. It's no beauty but a step on the way.

    cool! this is actually pretty helpful to see the changes in visual made while you're changing the code. thx

  • @Paulinko said:

    @skiphunt said:
    Ok... well, I bought Kodelife.

    This is what I suspected. It's merely a tool for writing and editing code. Looks like OpenGL specifically.

    I was going to get a refund... but for $5 I decided to keep it as sort of a puzzle to try and figure out.

    I looked up learning OpenGL from scratch with no computer science or coding background... and it appears that it could take years to learn it. Not going to go down that road. ;)

    However, I've watched a few videos and I've at least learned to change a few parameters and at least get a result. (baby steps)

    I have yet to get any cut/paste from shadertoy into Kodelife to work. I mean, I can't even get close. Every one I've tried is full of errors after pasting in.

    Could someone walk me through the most basic cut/paste of a shadertoy script into Kodelife... and let me know what I need to change/tweak to get it do work in Kodelife? Something very basic and simple would be fine. I'd just like to at least get over the cut/paste hump and then I'll gradually dig a bit deeper.

    I also installed Kodelife on my desktop since cut/paste is a lot easier than doing it on the iPad.

    For the ShaderToy shaders, you need to copy main code into the last section of the template. The top section will be okay as it is. For example, replace lines 34-38 in the template with the code from the Image tab on the ShaderToy.com site— this will work for most though not all ShaderToy shaders. Some shaders may have image files iChannel0 thru iChannel3 which you’d need to download and assign in KodeLife.

    I’ve attached zipped ShaderToy shader that I modified to be audio reactive. You can unzip it and then load it into KodeLife. I added lines 27, and 39-41. I changed lines 121 and 129 and lines 120 and 128 have the original code commented out using, “//“.

    The following screen shots show how to add the built-in variable spectrum1 which stores input audio information split into 3 frequency bands.


    For best audio results, you can use a USB audio interface for the audio input. You can also use the built-in mic and have KodeLife listen to the iPad’s built-in mic. You can specify the audio input/output settings in the app’s audio settings from the gear icon in the upper right corner.

    Awesome! Thanks for taking the time. Just downloaded your file and will study the changes you made later.

    I don't think I'm going to get to any kind of master level with this... without taking the time to learn opengl from the ground up... but I think I might be able to at least get to the point of being able to use already available script projects with help like this. Thanks!

  • @xor said:
    I ended up buying it after posting and it is incredibly cool. I like the live coding aspect. The tricky bit isn’t the code as much as the math.

    The goal of the shader is to return a color (rgba) for a single pixel at coordinates specified by inData.v_texcoord.

    Tossing out all the boilerplate, here’s their default sample. Just two lines of code but good luck figuring out why it does what it does. // comments are mine

    // turn coordinates into odd numbers beginning at 1 (effectively zooming out - figured
    // out by deleting the * 2 and -1 - live coding cool)
    vec2 uv = -1. + 2. * inData.v_texcoord;
    
    fragColor = vec4(
        // red
        // sin & cos vary between -1 an 1 but colors are just 0 - 1
        // abs just rectifies the signal so it’s always positive.
        // see below for the explanation of the left half of
        // sin’s input, basically it’s based on the x position 
        // of the pixel modulated by it’s y position and time
        abs(
            // sin(time) is a lfo cycling from 0, 1, 0, -1, 0 every
            // 6.28 seconds. 
            sin(
                // cos(time) is a lfo of approx .16Hz (cos cycles from 1 to -1
                // and back to 1 over inputs of 0 - 2pi [6.28] seconds).
                // cos(uv.y) is a “lfo” over the vertical dimension cycling from 
                // 1 back to 1 every 6.28 pixels but since uv is doubled
                // in the first line the cycle is 3.14 pixels and since it’s
                // tripled in the expression it cycles almost once per
                // pixel. 
                // the cos (-1 to 1) is doubled then scaled by the horizontal
                // position of the pixel
                // time is added as an additional modulation
                cos(time+3.*uv.y)*2.*uv.x+time
            )
        ),
    
        // green
        // basically the same as above but it’s the y position pixel that’s 
        // modulated by the x position and time
        abs(
            cos(
                sin(time+2.*uv.x)*3.*uv.y+time
            )
        ),
    
        // blue - spectrum.x is the energy of the low (or high?) audio frequencies coming in 
        // multiplying by 100 just amplifies the signal (again the range is 0 - 1 so this is really
        // cranking up the input
        spectrum.x * 100.,
    
        // alpha (opacity) 1 is fully opaque
        1.0);
    

    Even knowing all that you’d need to have studied advanced math to guess it might look something like this

    I too thought the live coding aspect is really cool. That's part of why I bought it. It's likely just wishful thinking... but seeing the effects of code changes might be extremely helpful as a learning tool. Not that it'll do much to teach me the language... but at least getting to the point where I can change values to customize other's work... seems very doable.

    Seeing your comments within the code is useful I think... possibly in figuring out what some of the code means.

    I hope we can keep a thread going that's dedicated to this. Or, maybe it's not really all that relevant to this forum? I guess if there are enough of us interested in it... perhaps it's relevant enough? :)

  • @skiphunt you’re welcome. I’ll work on a video tutorial on how to modify existing code to make it audio reactive. The code does look intimidating and I do think it takes quite a bit of time to learn how to write your own code, but modifying existing code is significantly easier and can yield some useful results. It’s also a way to understand the code and perhaps attempt to create your own or not.

  • @Skyblazer said:
    @xor What kind of advanced math specifically? I've been planning to get into this sort of thing.

    That said, for anyone else who's wondering, you can probably just type sin cos tan xyz open parenthese to the 4th power plus absolute value of 3 close parenthese times 8 divided by the square root of 9 fgsfdsqdpiocndmiocjmwo and eventually you'll get something cool, ya know? At least that's what I'm counting on.

    I just meant either being able to visualize what the result is going to be by reading at the expression or having a picture in your mind and being able to write the expression.

    Throwing 1,000 monkeys at it is pretty easy and can generate some pretty results and doesn’t require any special math training other than knowing that it exists. Here’s proof of that

  • @Paulinko said:
    @skiphunt you’re welcome. I’ll work on a video tutorial on how to modify existing code to make it audio reactive. The code does look intimidating and I do think it takes quite a bit of time to learn how to write your own code, but modifying existing code is significantly easier and can yield some useful results. It’s also a way to understand the code and perhaps attempt to create your own or not.

    A video would be incredible! I've looked a bit on YouTube and most of the videos seem to assume you already code. Or, the person doing the demo doesn't quite get it either.

    A video of just the basics of taking a shadertoy script... what to copy from it into kodelife... and then how to do a minimal amount of tweaking to alter it some... would be spectacular. :)


  • @skiphunt The video shows the basics of setting up a USB audio interface, getting code from ShaderToy.com, and modifying the code to make it audio reactive in KodeLife. I’ll make a few more videos on this topic next week that will go into different strategies for modifying shader code to make it audio reactive.

  • @Paulinko said:

    @skiphunt The video shows the basics of setting up a USB audio interface, getting code from ShaderToy.com, and modifying the code to make it audio reactive in KodeLife. I’ll make a few more videos on this topic next week that will go into different strategies for modifying shader code to make it audio reactive.

    OMG!! THANK YOU!!!

    That's exactly what I needed.

    Do you have a Patreon page? If not, you should set one up. It's pretty easy and quick. When you set it up you have a choice to make it either a subscription type account, or a paid post type of account. The subscription ones are really hard to pull off unless you have a huge fan base that loves throwing money at you. (somewhat rare)

    If you do the paid post ones... when you make a post you can make it free for public view, or you can set a price for the paid post.

    I don't think this costs anything. I'm pretty sure Patreon takes a small cut of your profit, but that's it.

    Videos like this one that you just made will save me SOOO much time. You just cut to the chase and didn't try to impress anyone with esoteric coding language. I would've paid to have access to this video. Probably not much but if you made a few videos and set the price to view a buck or two using the paid post model... I bet over time you'd make enough to be worth the effort.

    Maybe have a couple that are free so that viewers can see that you get right to it without a bunch of chit chat about what you think about this and that. Keep it short and simple like this one you just did. Then make the next ones short, simple, and focussed just like this one... and charge something for them.

  • @skiphunt thank you for your kind suggestion regarding Patreon. What I’ve learned about shaders and music in general has largely been through people on forums like this and YouTube. I’ve received plenty of insights from others so my little videos are just a way of passing on some things I’ve learned and found useful. I’m blessed with a relatively boring personality so I don’t have to worry about people wanting me to chat up my videos.

  • @Paulinko said:
    @skiphunt thank you for your kind suggestion regarding Patreon. What I’ve learned about shaders and music in general has largely been through people on forums like this and YouTube. I’ve received plenty of insights from others so my little videos are just a way of passing on some things I’ve learned and found useful. I’m blessed with a relatively boring personality so I don’t have to worry about people wanting me to chat up my videos.

    Curious... which browser on the iPad are you using to so easily copy/paste? I'm using Safari on 14.7iPadOS and it's extremely difficult to select text to copy/paste in shadertoy. And, I don't get those copy/paste/cut icons in the lower left screen like you do. Are you running a different browser or an earlier iPadOS version?

  • @Paulinko said:

    @skiphunt The video shows the basics of setting up a USB audio interface, getting code from ShaderToy.com, and modifying the code to make it audio reactive in KodeLife. I’ll make a few more videos on this topic next week that will go into different strategies for modifying shader code to make it audio reactive.

    Excellent tutorial!

  • edited August 2021

    @skiphunt said:

    @Paulinko said:
    @skiphunt thank you for your kind suggestion regarding Patreon. What I’ve learned about shaders and music in general has largely been through people on forums like this and YouTube. I’ve received plenty of insights from others so my little videos are just a way of passing on some things I’ve learned and found useful. I’m blessed with a relatively boring personality so I don’t have to worry about people wanting me to chat up my videos.

    Curious... which browser on the iPad are you using to so easily copy/paste? I'm using Safari on 14.7iPadOS and it's extremely difficult to select text to copy/paste in shadertoy. And, I don't get those copy/paste/cut icons in the lower left screen like you do. Are you running a different browser or an earlier iPadOS version?

    The difference is I’m using a mouse. Selecting the text on the ShaderToy.com site seems impossible with just your finger. A bluetooth keyboard with arrow keys is also another method your can use to select the text you want to copy. I’ll be sure to mention these points in my next video.

    Ironically enough, you can use your finger in Google Chrome to select and then copy text without any problem.

  • @Paulinko said:
    @skiphunt said:

    @Paulinko said:
    @skiphunt thank you for your kind suggestion regarding Patreon. What I’ve learned about shaders and music in general has largely been through people on forums like this and YouTube. I’ve received plenty of insights from others so my little videos are just a way of passing on some things I’ve learned and found useful. I’m blessed with a relatively boring personality so I don’t have to worry about people wanting me to chat up my videos.

    Curious... which browser on the iPad are you using to so easily copy/paste? I'm using Safari on 14.7iPadOS and it's extremely difficult to select text to copy/paste in shadertoy. And, I don't get those copy/paste/cut icons in the lower left screen like you do. Are you running a different browser or an earlier iPadOS version?

    The difference is I’m using a mouse. Selecting the text on the ShaderToy.com site seems impossible with just your finger. A bluetooth keyboard with arrow keys is also another method your can use to select the text you want to copy. I’ll be sure to mention these points in my next video.

    Ironically enough, you can use your finger in Google Chrome to select and then copy text without any problem.

    Ah… that’s what I figured. Just tried Google Chrome. A little better maybe. Thanks 🙏


  • Shows how to modify mouse controlled ShaderToy.com shaders into audio reactive shaders.

  • This all sounds intriguing. How is OpenGL implemented in the iOS version, though — is it on top of Metal? Asking because Apple have deprecated OpenGL on iOS, and as a nubby tinkerer, I’d want to use OpenGL examples from ShaderToy rather than have to eventually rely on something platform-specific like Metal (mainly because of the wealth of community support that comes with OpenGL).

  • Latest update (Nov 6) has some real fancy shaders to show. Finally! :) The last one by Jochen Feldkötter (The Explorer) is a real treat, most of his examples are but this one is a bit longer.

Sign In or Register to comment.