DEV Community: Harsh Mehta

Create Music with Code: 2

Harsh Mehta — Thu, 02 Jul 2020 03:30:14 +0000

Well, it's been a long time since I wrote Create Music With Code and a lot of people seemed interested in a second part. Unfortunately, I didn't get the time, up until now!
So here goes!

Where We Left Off

Last time we left off with loops. We learned how to loop basically anything that you want to play for like an infinite amount of time.

loop do
  sample :bd_haus
  sleep 1
end

The above code snippet will play the bd_haus sample every second over and over again. This makes sense from a programming point of view, but since we cannot exit from this loop, it makes no sense to just play one loop and ignore the rest of the code. Good for us that Sonic Pi has live_loop for that!

Live Loops

live_loop is a way to loop your music and also play other code while you're at it. Moreover, you can play multiple live loops at the same time. A better alternative to loop don't you think? Yes, in fact, I've never used loop at all :p!

So why learn loop in the first place? In my opinion, loop is a good way to teach the basics of programming to kids, or maybe someone who is new to programming itself, how loops work in other programming languages, which I think is one of the bases of any programming language out there.

Enough talk, let's cut to the chase.
A live_loop looks very similar to loop

live_loop :beat do
  sample :bd_haus
  sleep 1
end
sleep 3
play :c4

This will play the loop and after 3 seconds, it will play the play :c4 command. You'll notice how the live_loop still keeps on playing and that's the best part about it.
You can notice that it's a bit different than the loop. I've added :beat after its syntax. In order to declare a live_loop you need to name it

live_loop :[any_name] do
   #your music
end

There's actually a very good reason why we name a live_loop, but I'm not covering it in this article. What's even more interesting is that live_loop gives you the power to change it while it's running!
In the previous code, try changing anything in the live_loop while it's still running. for example

live_loop :beat do
  sample :bd_sone
...

This probably won't make much sense if you're reading this but when you try changing anything in a live_loop all the changes will reflect even when you are still running the code. Which is amazing.

Using Effects

In Sonic Pi, you can even add Effects or FX to almost anything that you play. You can add FX by using the following syntax:

with_fx :[selected_fx] do
    #code that you want to add the FX to
end

You'll get a drop-down list as soon as you write with_fx which will give a list of available effects you can use.

Let's try out the echo FX in a live_loop and see how it sounds.

live_loop :tune do
  with_fx :echo do
    play :c3
    sleep 1
  end
end

You'll notice that the command play :c3 echoes. You can use anything and give it an FX. For example, you can even use samples, like so:

live_loop :beat do
  with_fx :reverb do
    sample :bd_haus
    sleep 1
  end
end

The reverb FX adds a bit of "room effect" to your music.

Randomization

Sonic Pi has some built-in functions that can add randomness to your music. One such function is the rrand function which will give a random value between two numbers. The syntax goes something like this:

rrand(min,max)

Providing min and max basically defines the range between two numbers. So let's check it out

play rrand(60, 95)

Run it and you'll notice it'll play 86.251 as a random value. But hold on, how come that every time you press Run, it plays the same note over and over again?

The answer is that it is not truly random, it’s pseudo-random. Sonic Pi will give you random-like numbers in a repeatable manner. This is very useful for ensuring that the music you create on your machine sounds identical to everybody else’s machine - even if you use some randomness in your composition.

The above reasoning is taken from Sonic Pi's official documentation and I don't think that I can explain any better than this.

What's interesting is that if you play it twice it will generate a different note the second time. For example, check this out:

play rrand(60,95)
sleep 1
play rrand(60,95)

Run it and you'll notice that it plays a new note the second time. So basically, a new pseudo-random number is generated if you use it again.
You can take a live_loop to generate random notes every time.

live_loop :melody do
  play rrand(60,90)
  sleep 0.5
end

This will play a different note every time it enters the loop.

Done and Dusted?

That's about it for now! Play around with live loops, FX, random numbers, try using multiple live loops, adding random numbers in different sample parameters, and get creative! Remember, it's all fun and games. There is no such thing as a right and a wrong approach in art! It all depends on your creativity.

Missed Part 1?

I have covered the extreme basics of Sonic Pi in my Part 1, in case you missed it, do check it out.

Contact Me

You can contact me if you have any doubts and you can also let me know on social media if you'd like a part 3. :D

Create Music with Code

Harsh Mehta — Wed, 01 Apr 2020 09:01:39 +0000

Hello 👋🏼

I was always interested in music but somehow I just couldn't get myself to explore those costly tools with complex UI. Until a few weeks ago, I found something really interesting. I found out about a tool that compiles code into Music! I tested it out and was instantly hooked. It's really fun and even if you're not that much into making music, you can kill some great time with Sonic Pi. So, here's a blog on how to get started!

What's Sonic Pi?

Sonic Pi is a code-based music creation and performance tool.
This basically means that you can create, mix music by code. Sonic Pi is built on Ruby and is Open Source.
You can download Sonic Pi from their website. You can download it for Windows, macOS and Raspberry Pi as well.

Basic Music Theory

Before we start, I'll be covering some basic Music theory which is very easy to understand so don't worry.

Notes

The piano diagram below shows the various piano notes that piano keys usually correspond to. The ones with # are the sharp notes and the ones with the symbol that looks like a b are the flat notes. Keys, wherever multiple notes are written, can be referenced as those notes. Meaning that C# and Db are the same key.

You can test what these notes usually sound on piano on this virtual piano. Make sure you enable the "Letter Notes" so that you know which note you are playing by pressing the key.

Numbers, Notes and Octaves.

Every note along with its octave represents a number, depending on the number of keys on a keyboard. An Octave is an interval between musical pitch and another with double its frequency. So, numbers or notes belonging to one octave will have the same frequency and those with different octave numbers will have different frequencies. Here is a cheat sheet I've taken from MeHackit's Sonic Pi tutorial.

Coding on Sonic Pi

Once you open Sonic Pi you'll probably be able to understand most of the interface but Sonic Pi's documentation has a UI guide that I'm attaching below for your reference.

Playing notes

We'll start by playing a note and this is how you play a note. In your editor, just type play :c and hit Run.

Congratulations! You've created and played your first music :p!

You can also change the octaves in the notes like so
play :c2 which will play the C note at the 2nd octave. You can experiment with different notes and octaves yourself. You can also refer to the cheat sheet provided above.

You can also play a note by its number. If you look for the note C at 4th octave you'll find the number 60. So, playing :c4 is the same as playing the 60th note number. To play a note number on Sonic Pi, just type play and the corresponding note:

play 60

Notice how we did not include the colon as we did in the play :c command. When we play a number, we don't have to use any colon.

Changing the Synth

One thing you'll notice, that these notes sound very different than a normal piano. That's because Sonic Pi uses a default synthesizer and we can change the synth with the use_synth command. A bunch of synth options will appear in a list like so:

I'm using the piano synth and after that, all my notes will sound like a piano

use_synth :piano
play :c4

Awesome right? You can try playing with different synth options available to you by Sonic Pi.

Sleep

We just played a single note up until now, but what if we want to play more than one note? I can just play another note below my first note, simple right?

play :c4
play :c2

No. If you tried it yourself you will know what's wrong. The problem is that Sonic Pi executes lines of code quickly. So technically, before my first note even finishes playing, my second note will start which is almost instant. So what's the workaround? For that, we have the sleep command.

play :c4
sleep 1
play :c2

Once the first note is played, the sleep command will tell Sonic Pi to stop for a second and then play the next note. The time is in seconds so if you type sleep 0.25, it will sleep for a Quarter of a second.

Parameters

You can tweak notes by changing their different parameters. You can add parameters to your notes separated by a comma.

You'll see a bunch of parameter options that we can use. We'll go through a few of them.

Pan

With the pan parameter, you can change the direction of your sound. For example, you can play your sound on the right or left or in the middle or anywhere in-between left and right. The value ranges from -1 to 1. -1 being extreme left and 1 being extreme right.

play :c3, pan: -1 #plays the note on left
sleep 1
play :c3, pan: 1 #plays the note on right
sleep 1
play :c3, pan: 0 #plays the note in the middle(default)
sleep 1
play :c3, pan: -0.25 #plays the note a little bit to the left

Amp

With the amp parameter, you can change the amp of your notes. Which basically means you can change the volume.

play :c4, amp: 2

If you run the above snippet, you'll hear the volume has increased. The default amp value is 1 and it starts from 0. If you put amp: 0, the volume will be 0 and you won't be able to hear anything.

Samples

We'll explore something really interesting called samples. Samples are basically pre-recorded sounds that you can use in your music. Sonic Pi has around 130 of such samples and also gives you the option to use external samples that aren't available in Sonic Pi. You can play different samples using the sample keyword and you'll get a list of samples you can select from.

There are a lot of different cool samples that you can explore. For example, the following sample will give you a kick or a beat sound.

sample :bd_haus

Just like the play command, samples also have parameters that you can use to tweak how your samples sound. You can play with different samples and different parameters.

Loops

That was nice, in fact, it was so nice that we'd like to play it over and over again. So rather than playing the sample on every line, which will take me forever to do so, we can use the loop command given to us by Sonic Pi. The syntax goes something like this:

loop do
  #code that you want to loop
end

Note that every loop must have at least one sleep command. Otherwise, Sonic Pi will try to play everything at once, which will completely cause it to break and will throw you an error about the loop not sleeping or syncing.

loop do
  sample :bd_haus
  sleep 1
end

As you might have guessed, the above code snippet will play the bd_haus sample every second over and over again.

Done and Dusted?

That's about it for now! Play around with notes, samples, loops, and try changing different parameters and get creative! Remember, it's all fun and games. There is no such thing as a right and a wrong approach in art! It all depends on your creativity.

Part 2

In Part 2, I have covered the basics of live_loop, adding effects, and using randomness in your music! Do check out if you like this part :)

Contact Me

You can contact me if you have any doubts and you can also let me know on social media and do give a feedback! :D

Stay Home and Stay Safe :) <3

Filter Images in Flutter

Harsh Mehta — Wed, 29 Jan 2020 07:46:22 +0000

I've been finding some really interesting "hacks" that have helped me a lot to come up with easy solutions during my internship as a Flutter Dev.

One such solution was using ColorFiltered Widget in Flutter to Filter my images. Initially, our designer could provide any necessary images or assets required to build UI. But the problem came when there were multiple "versions" of the same image. By versions, I mean the same image in different colors and transparency. In fact, if I calculate, there were approximately 15 images that had around 3 versions each that had just color changes.

That's around 45 images. As a developer, keeping all the images that were only different in color wouldn't make much sense. This would increase the App Size and my work as I would have to manage all the images with their proper locations and whatnot. Apart from that, I would have to load a different image every time, which again doesn't make sense as it would probably add unnecessary load to the App.

Luckily, Flutter has the widget called ColorFiltered that can handle all of that for me. Here's what I did.

I had this original image:

And this was one of the versions of the same image: (Ignore the background)

Similarly, as stated before, there were 15 different images and 3 such "versions" of these images. Here's an example for the above 2 images I used in Flutter.

ColorFiltered(
child: Image.asset("assets/images/originalImage.png", scale: 5,),
colorFilter: ColorFilter.mode(Colors.white, BlendMode.srcIn),)
),

The ColorFiltered widget has the colorFilter property that we can use to add filters to a Widget. I added a white color and used BlendMode class that can be used to blend pixels. srcIn is just a property that overlaps both the color and on the original image. There are a lot of properties for the BlendMode class that are provided by the folks at Flutter and you can check them out here.

This gave me exactly the image I wanted:

With just 2 lines of code, I was able to reduce around 45 images 15, and what's better? I didn't even have to trouble the designer for the images and did it myself without much hassle and the help of Flutter, of course!