05x05 - Code Concert

[bunniefuu]

[girls] ♪ S-C-I-G-I-R-L-S ♪

[Izzie] We need you!

[Izzie] Come on!

[girls] ♪ When I need help and I've got a question ♪

♪ There's a place I go for inspiration ♪

♪ Got to get to the web, check the girls' investigation ♪

♪ What girls? ♪

♪ SciGirls! ♪

Whoo!

[girls] ♪ S-C-I-G-I-R-L-S ♪

[Izzie] I need you!

[girls] ♪ S-C-I-G-I-R-L-S ♪

Come on!

♪ You've got to log on, post ♪

♪ Upload, pitch in ♪ Yeah!

♪ Want to get inside a world that's fascinating? ♪

♪ The time is right 'cause SciGirls are waiting ♪

[girls] ♪ S-C-I-G-I-R-L-S ♪

[Izzie] We need you!

[girls] ♪ S-C-I-G-I-R-L-S ♪

[Izzie] SciGirls!

[Izzie] Come on, bunnies, hop.

Hop, hop, hop!

♪ ♪

But you're bunnies! Bunnies hop.

[Jake] Hey, Iz.

How's bunny babysitting?

[Izzie] I'm trying to train them to play,

but they're not listening.

[Jake] You know what speaks to me?

Food.

[Izzie] Okay. I'll try that next.

Pets love treats.

I was thinking less pizza, more carrots.

Come on. Do a little hoppy for Izzie.

[crickets chirping]

[Jake] You're getting hungry.

You want yummy carrots...

You want to hop.

[Izzie] Jake, this isn't working.

We need help.

SciGirls, we need you.

[synth music]

♪ ♪

No.

No. Ooh.

This looks interesting.

♪ ♪

[Britanee] My name is Britanee.

This is my name sign.

♪ ♪

I enjoy drawing,

hanging out with friends,

and playing sports.

♪ ♪

[Saabiriinn] My name is Saabiriinn,

and this is my name sign.

♪ ♪

I come from a Somali background,

and I'm proud of that.

♪ ♪

[Estrella] My name is Estrella,

and this is my name sign.

♪ ♪

I attend Metro Deaf School.

I met both Britanee and Saabiriinn at school.

[laughter]

♪ ♪

[Saabiriinn] One of my favorite things to do

is hang around with my friends.

I have lots of fun with them.

♪ ♪

We like to dance and get our energy up

before we go into class.

[gentle music]

[percussive music]

I use ASL, American Sign Language,

to communicate.

[Estrella] I do understand other languages,

such as English.

[Britanee] I use English, ASL,

and sometimes signing and talking at the same time.

[upbeat music]

[Estrella] I met Saabiriinn when she moved here

from Africa.

I taught her some sign language.

Britanee moved here from a public school,

so I taught her, too,

and we all became good friends that way.

♪ ♪

[woman] What might computer programming be?

[Estrella] Today, we're learning

about computer coding

from the University of St. Thomas

college students.

[Estrella] Learning to code

is learning to communicate

in a specific way.

[Britanee] Code is something that you enter in.

It's almost like a language

that you communicate with the computer.

[woman] Each letter will have red, green, and blue.

[Estrella] Cool.

[woman] So if it's zero-zero,

then you write zero-zero.

[Saabiriinn] We have interpreters

Gina, Krista, and Shelly

to assist us while communicating

with people who don't use ASL.

[Estrella] Should we change colors?

[Saabiriinn] Yeah, I think so.

[Estrella] We're learning how to write code

to show visual artwork.

[woman] In the upper corner,

you see a play button.

Hit that, and it'll run your program.

[Estrella] Okay, good. It worked.

The name of the computer language

is Processing.

[Rachel] That's how bright your color is.

[Estrella] Learning a new language

felt powerful

because we're understanding how software works.

[upbeat rock music]

[Saabiriinn] I like that we can use a computer

to communicate, but it's complicated.

Cool.

[Britanee] I was thrilled.

You know, finally, I was able to get it to work.

♪ ♪

[Estrella] So do I pick any number?

[Emily] Yeah, any number.

[Britanee] We met Emily and Rachel

at the computer programming workshop.

[Rachel] Huh. Nice.

[Emily] We are working on a project

for a girls a cappella group at St. Thomas,

making some visuals for their upcoming performance,

and we're wondering if you would like

to bring your new coding skills and join us.

[Estrella] Cool. [Britanee] Yeah.

[Saabiriinn] Yes.

[Estrella] Emily asked us to assist

with the singing group

and create code

to go along with their music.

So we would be able to create the visuals.

[rock music]

♪ ♪

[Saabiriinn] We went to the University of St. Thomas

to start our project.

[Emily] So Code and Chords is software

that the team and I created

as a tool for visualizing music in real time

so that when you sing...

[note]

It will respond to what you're singing...

[higher note]

With colors and shapes

and different cool things like that.

[higher note]

The colors of the different shapes

change depending on what note you're singing.

[Saabiriinn] Okay. [Britanee] Cool.

[Emily] We have multiple mics here.

I'm gonna sing into this one,

if Saabiriinn, you want to play some into this one.

Okay? [Saabiriinn] Sure.

[piano notes]

[Emily] [scatting]

[laughter]

Lovely, lovely.

[Saabiriinn] You see the different colors

that light up.

It feels like you could see the b*at of the music.

[piano notes]

[Emily] Yeah! Very cool.

[upbeat music]

[Estrella] Rachel showed us

a basic Code and Chords program.

[Rachel] This is actually a printed out version

of the code that went into making

what you saw up on the screen with Emily.

[Estrella] Code and Chords has a computer language

called Processing

that we learned at the workshop.

[Rachel] What we're going to do

is go through and circle

what we recognize in this code.

[Britanee] Okay. [Saabiriinn] Great.

[upbeat music]

[Estrella] We were able to circle and explain

what each code meant.

[Rachel] Down on line ,

what do you think that does?

[Britanee] That's responsible for a shape.

R-E-C-T makes a square shape.

Depending on the number you enter,

it changes the size, the height, and the width.

[Rachel] Nice. I like that you notice

that these are actually RGB values

that correspond to colors.

You are all going to get the opportunity to test code

and see what it looks like on the screen.

[Britanee] Cool. [Saabiriinn] Cool.

[upbeat music]

♪ ♪

[Emily] Now we're going to look at the computer version

of the printout that you were just looking at.

So what if you try a completely different shape?

[Saabiriinn] Let's switch it out for this one.

[Britanee] Maybe change the to .

♪ ♪

[piano notes]

[Estrella] We were able to change the code

in order to change the colors and shapes

and really become creative.

♪ ♪

You could do almost anything you'd like.

[Britanee] Okay, hit Run.

[piano notes]

There we go!

[Rachel] The song you're gonna code visuals for--

it's called "Try."

[Saabiriinn] Mandy Harvey

wrote the song "Try."

[Estrella] I did see the show "America's Got Talent,"

and I saw her perform,

and I couldn't believe that she was deaf.

[Saabiriinn] That just shows that deaf people

can do anything.

[Rachel] Here I have a couple packets

that break down the song you'll be coding visuals for.

So we notice that there's eight singers

for the singing group called Cadenza.

Then, the seven musical notes.

And this is a breakdown

of the different sections of the song.

[Estrella] We're building on the existing

Code and Chords software.

[Saabiriinn] We're making a visual display

for the singers.

♪ ♪

When you take existing code

and change it for a different use,

that's called remixing.

[Rachel] On this flash drive,

there's a recording of the song

you can test with,

and Emily and I will come check in with you in a bit.

[Britanee] All right. [Estrella] Can't wait.

[Saabiriinn] Cool.

[Estrella] I'm really excited,

because I have never experienced

something like this,

so it only creates more learning for me.

[Saabiriinn] I'm excited to learn more about this song.

[Britanee] My name is Britanee,

I am , and this is my home.

I'm outside now.

I can show you what the outside

of my house looks like.

My favorite hobby is drawing.

So if I'm bored or want something to do,

I'll go draw.

♪ ♪

I can show you all the pets I have.

These are my turtles.

I know their t*nk is dirty.

And now I'll introduce you to my hamster.

♪ ♪

And my favorite sports to play

are volleyball and basketball.

Sometimes I'll chat with my friends

through text or videophone.

Bye!

♪ ♪

We went back to our school to learn about our song.

♪ ♪

What we're using is a vibration speaker

that helps us to be able to feel the vibration of music

so that we understand the flow.

[singers] ♪ Ooh ♪

[Estrella] Wow.

[singers] ♪ Ooh ♪

♪ ♪

[Saabiriinn] I like this. [Britanee] Yeah, me too!

♪ ♪

For me, experiencing the song was fun

and it was fun to learn what the song was about.

[Saabiriinn] It was amazing to learn about the song.

It's something I haven't experienced before

through technology.

[singing]

[singer] ♪ I don't feel the way I used to ♪

[Saabiriinn] I really like it.

[Estrella] I think you can really feel the vibes

with the high notes. [Britanee] Yeah, I agree.

[Estrella] Music has not been a huge part of my life,

and I don't have

a deep relationship with music,

but feeling the vibration was very powerful to me.

[choir singing]

[light music]

[Estrella] Thanks.

[Saabiriinn] So what do you think

of the words of the song?

[Britanee] Yeah, what do you think it's about?

[Estrella] I think it's a little bit of a sad song.

[Britanee] And my opinion is because this girl is deaf,

she's trying to express what it's like.

It starts out a bit somber,

but then it becomes happy in the end.

[Saabiriinn] Yeah, because she finally made it.

[Estrella] So maybe we should start brainstorming

about how to coordinate the colors with the notes.

Maybe the darker colors would be

more of the somber and sad feelings,

and then we'll change them to the vibrant colors,

and that would represent happiness.

[Britanee] Okay. [Saabiriinn] Yeah, good idea.

[Estrella] So do you think we should get some paper

and cut out our shapes?

[Saabiriinn] Yeah, okay.

[percussive music]

♪ ♪

[Britanee] We made a storyboard for the beginning,

middle, and end of the song.

[Saabiriinn] Each storyboard has shapes

for the eight singers.

♪ ♪

[Britanee] The beginning of the song

is the storyboard that I put together.

It shows a lot of frustration

because she's not as successful

as she would like to be.

So our second storyboard,

what would we like to see?

[Estrella] I think we'll show the hollow part of the star,

and then the flower that's broken in half.

In the middle, you still see

some frustration and anger happening,

like a storm you're trying to get through,

and you're not there yet.

And then, moving on to the third storyboard,

you feel whole again with those eight shapes.

[Saabiriinn] In the end, having a breakthrough

and becoming happier and feeling more successful.

[Britanee] I think we're ready to go to Rachel

with our storyboards. [Estrella] Yep, we are.

♪ ♪

[peppy music]

♪ ♪

[Rachel] So I'm excited to see

what you girls came up with.

[Estrella] Rachel found each of our storyboards

powerful,

and that they did match up

with the song's message.

[Rachel] I like how the colors all change.

So one thing that we do in computer science

and computer engineering classes:

we write kind of a rough draft called pseudocode.

[Britanee] Pseudocode is a process

that you write in your own words

so another person will be able

to follow the code.

[Rachel] What would we do after that?

[Estrella] Wouldn't you be setting

the color of the music notes?

[Rachel] Exactly.

[Estrella] You are using more everyday words

with pseudocode,

and then you change it to code

when you put it in the computer.

[Britanee] It's important

because if you'd like to make some changes,

or if there's any confusion,

then you're able to look back at your pseudocode

to see if there's something that you entered incorrectly.

Then you can make that change.

[Saabiriinn] Hi. I'm Saabiriinn.

[upbeat music]

I'm swimming at the YMCA.

♪ ♪

And this is my sister.

I joined our Battle of the Books team.

We had to read three different books.

We took third in the national competition.

I love going shopping.

I think it's really fun.

Thank you, and thank you for watching us.

♪ ♪

[Britanee] Today, what we worked on

were shapes and colors,

inputting those into red, green, and blue values.

♪ ♪

On the computer,

every color is a unique combination

of red, green, and blue.

[Saabiriinn] Do you want the blue to be dark or light?

[Britanee] I think dark blue would be fine.

Okay.

Perfect. It's set.

So red is , green is ,

and blue is .

Now for note A.

[Estrella] How we found the RGB value--

we selected a color

and assigned its number for the shade that we wanted,

and then it gave us an idea

to prepare the rest of the song.

[Britanee] Okay, perfect!

So we have red at ,

green at , and blue at .

[Estrella] If you don't make notes,

it may take you longer,

or the results may be different

than what you're looking for.

[Saabiriinn] And it helps for you to understand

where you need to make revisions

or fix any errors.

[Estrella] All right. Three, two, one, run.

[choir singing]

[Saabiriinn] Awesome.

[Britanee] Cool.

[Estrella] But why is this black here?

[Britanee] When we were selecting

the colors for the first part of the song,

we ended up selecting the same color for F sharp

as we did for the background.

[Estrella] So we'll have to change the F note.

[Britanee] Even though we made that mistake,

we were able to change it, and it felt magical.

[Estrella] It was awesome

to actually see the colors change.

It meant that we made one small accomplishment

and that we would be able to move on.

So that was cool.

[energetic music]

♪ ♪

Okay, so we should just go ahead

and start picking our shapes.

[Saabiriinn] Which one should we go with first?

[Estrella] Let's slide the bar.

[Saabiriinn] That's good.

[Estrella] We were actually figuring out

not just basic shapes,

but also some different shapes,

such as clouds and stars.

Let's see if we can narrow it a little bit more.

[Britanee] The tool we used was a shape editor.

♪ ♪

[Saabiriinn] It allows you to be more creative

in making your shapes.

[Estrella] So that would be soprano one and two.

[Britanee] Does it look like a broken star to us?

Try sliding that.

[Saabiriinn] There you go.

[Britanee] How about this one?

[Estrella] So that would be alto three.

[Saabiriinn] We had a piece of graph paper,

and we had to put coordinates together

on the X and Y axis.

[Britanee] We wanted to figure out

our X and Y coordinates

before we entered them into the computer.

[Saabiriinn] The X and Y coordinates are numbers

that let the computer know

where to place the shape on the screen.

[Estrella] Should we run it?

[Britanee] Okay.

[choir singing]

[Estrella] Wow.

♪ ♪

[Saabiriinn] What's challenging

is actually moving the shapes

and trying to get the shape

exactly where you'd like it.

[Estrella] Now that we've changed the numbers,

it makes more sense.

[Britanee] Even though our shape

isn't centered where we'd like it.

[Estrella] But it was still worth it.

[Saabiriinn] We sometimes are in the vicinity

of where we would like our shapes to be,

but then our shape is tilted one way or another.

That's challenging.

[Izzie] Got it.

We just need to communicate with the bunnies

in a way they understand.

I did some research.

Training bunnies is like training horses.

They need a fun space to play,

like a bunny playground.

[Jake] Well, I'm great at building bunny playgrounds.

[awkward music]

♪ ♪

[grunts] [Izzie] Watch the hammer, Jake.

[Jake] Gah! [cries out]

♪ ♪

[Izzie] Oh, over here.

[Jake] [cries out]

[crashing]

♪ ♪

Okay, let's tie up the little tire.

[Izzie] Oh, hold it steady.

[Jake] Ow! Ah!

[Izzie] [sighs] Jake.

[easygoing music]

Now we show them what to do.

[Jake] You mean be bunnies for them?

Yes!

♪ ♪

[grunts] [crashing]

Might've got a little carried away.

♪ ♪

[Izzie] Go on, hop over.

[Jake] Or we could do that.

[Izzie] Yes!

Oh, they sure like this

when they do it right.

Now get up that ramp, bunny.

[Jake] Oh, wow.

[laughs] That tickles!

Don't eat my hair.

[Izzie] Yes!

It worked!

♪ ♪

[Estrella] We just finished coding our first storyboard.

[Britanee] So how do we do the next one?

[Rachel] Basically, we want,

"If something is pressed, run our design."

[Estrella] She actually taught us

how to input each of the scenes

and then create an if statement.

We could use an if statement to tell the computer

when to go to the next section of code,

and then to the next section after that.

♪ ♪

[Britanee] It's very hard to understand at first,

but once she explained it to us,

we understood how we had to enter

each set of code for our scenes.

♪ ♪

The next step in our process

is that we'll meet all eight of the singers

to test our code with live singing.

♪ ♪

[Rachel] Come on in, girls.

[Estrella] Hi. [Britanee] Hi, everybody.

[Saabiriinn] Hi.

[woman] We're Cadenza.

[Saabiriinn] The Cadenza singing group

from the University of St. Thomas

is here today.

[Britanee] Okay, you guys ready

to put the shapes to the sound?

[singers] Yeah! Yeah, let's do it.

[Britanee] All right. Let's do it.

it was surprising and really cool to see

all the different colors and shapes

according to what they were singing.

I could tell when they were singing

a high note or a low note.

[choir singing]

[Estrella] It was good to see the program

running the visual display.

♪ ♪

[singers] ♪ There is no one for me to blame ♪

[Britanee] Our interpreter cues us

when one part of the song is done,

so we know it's time to press the button

to change to the next scene.

♪ ♪

[upbeat music]

[Saabiriinn] It was really much different than I thought.

It was awesome. I loved it.

I'm wondering if you have any suggestions

or feedback for us.

[singer] The visuals you created for your storyboards

are incredible. I think it'd be really cool

if you incorporated more of the shapes,

like the raindrops and the rainbow at the end.

I think that'd be really impactful.

[Britanee] They said that it felt awesome.

They also gave us a little bit of feedback

and suggested changes so we could add more pop.

[Estrella] Yeah, thank you.

It helped us to create more ideas

to make our visual display

look much better.

[Emily] And remember that all coders

go through multiple versions,

building on what they have and making it better.

[Britanee] Yeah.

[Estrella] Hi again.

My name is Estrella.

Here I am with my cousins,

and my sister, too, behind me.

I have two siblings, one older.

Her name is Esmerelda.

I have a brother. His name is Elijah.

So the three of us love to draw.

Our whole family likes to draw.

I'm usually involved

with many different clubs and sports.

So now we're at the Vikings training camp,

checking out some of the art

and getting autographs from some of the players.

♪ ♪

So that's super cool.

I have a hamster.

Here she is, saying hi.

I think that's all for now.

Bye!

♪ ♪

[Britanee] We only have a few days

to finish our program improvements.

[Saabiriinn] Where are we gonna put it?

[Estrella] We'll add it right in here.

[Britanee] Today, the improvements

that we worked on

were making our background change.

We also added a rainbow,

and then we also added

two lightning bolts to our program.

[Estrella] We wanted to represent

the soloist with a zero,

and then we could add the lightning bolts.

[Britanee] I feel nervous,

but I'm excited at the same time,

because I'm excited to show all of our hard work.

[Saabiriinn] I feel nervous and I can't wait.

[Britanee] I think that's good.

[Estrella] Okay, good job.

♪ ♪

We're at the Science Museum,

and we're here because we'll be showing

our Code and Chords program to real live people tonight.

[Saabiriinn] I feel proud and inspired

to show what we've been working so hard on.

[Emily] We have been in communication with Mandy,

who wrote the song you've been working on,

and she has a special message for you.

[Saabiriinn] [gasps]

[Mandy] Hey, everyone.

I'm so excited to be hanging out with you.

I am so proud

of all of the hard work that you're doing,

and I really hope that I get to see it

and use it for my own concerts.

[Britanee] Wow.

Oh, my gosh.

[Saabiriinn] I'm overwhelmed.

I don't know what to say.

[Rachel] Did that get you ready and excited for tonight, then?

[Estrella] Yes! [Saabiriinn] Yes!

[Britanee] Definitely, yes.

I'm ready to show the world.

It's showtime!

[upbeat music]

♪ ♪

[Rachel] Nice!

[Estrella] I feel nervous just because

we'll have a number of people in the audience,

but at the same time,

I'm excited and looking forward

to showing our program to them.

♪ ♪

[Estrella] Welcome

to our Codes and Chords production.

We've been working on this in collaboration

with the University of St. Thomas students.

[Britanee] It's critical that deaf people

have the benefit of visual aides

to understand music better,

putting us on the same page

as our hearing peers.

[Saabiriinn] Thank you for coming.

We hope you enjoy the show,

and now we'd like to call to the stage

the Cadenza singers.

[applause]

[singers vocalizing]

♪ ♪

[Britanee] Through our project,

I feel like we were able to express ourselves

to a larger audience,

allowing our audience to understand

that deaf people can create things along with music

as a way to communicate.

[Saabiriinn] I feel like I'm ready for anything.

I could teach my family,

other people,

and generations to come

who have never done anything like this.

So I see this being passed on.

[singer] ♪ 'Cause I know ♪

♪ The only thing in my way ♪

♪ ♪

♪ Is me ♪

[Estrella] A lot of deaf people

feel like they aren't able to appreciate music

or have a relationship with music

without sound,

but this shows that you can.

[Saabiriinn] I hope that they see, like,

"Oh, I could do this, too,"

and that they would be able to discover

the relationship between music and code.

[singer] ♪ If I would try ♪

♪ ♪

[applause]

[upbeat music]

♪ ♪

[Estrella] Oh, it's totally inspiring,

I mean, that I've learned this

and to really know more about coding.

It makes me curious to learn more.

♪ ♪

[woman] I'm so proud of you.

[Estrella] Thanks.

[Britanee] My confidence has changed.

I think before, I was a little unsure,

maybe frustrated at times,

but as we made those breakthroughs,

our confidence built,

and I'm proud of myself for that.

♪ ♪

[Saabiriinn] I want to learn more.

I want to try more complex programming.

I want to go deeper.

♪ ♪

[Jake] Welcome to Izzie's Bunny Boot Camp!

[upbeat music]

♪ ♪

[Izzie] Go, bunny, go!

♪ ♪

[Jake] Wow, your bunny business boomed, Iz.

[Izzie] I know!

And I couldn't have done it without you, Jake.

Wow.

That's pretty advanced.

[Jake] Yeah, I taught him that.

I should open my own bunny business.

I'll call it "Jake's Advanced Bunny Training Academy

Specializing in High Fives."

[Izzie] [laughs] Yeah, I like it.

♪