ProCodeCG Kids Regular Coding Class – Open Topics – 4 Feb 2017

Standard

Open topic class today πŸ™‚ Β Pru was getting ready to continue her Thunkable lessons πŸ™‚

IMG_2041

The Xylophone Apps now works on Pru Android device yaaay πŸ™‚

 

IMG_2064

The Xylophone code

IMG_2065

Then Pru created the camera app

IMG_2068 IMG_2069

She customized the GUI

IMG_2072

And yes it worked! πŸ™‚

IMG_2073

Raul stopped his Arduino project and start Java Programming πŸ™‚ He’s now very good at compiling and debugging πŸ™‚

IMG_2063

Raul has learned about GUI. He created guessing number and calculator app in Java today πŸ™‚ Β He glad that all his Java code worked (as oppose to his Arduino project LOL)

IMG_2070

There was also Vian working on his GameMaker but too bad we didn’t take any pic of him 😦

We will update handouts for more interesting topics and projects next week πŸ™‚

 

Advertisements

ProCodeCG Kids Coding Camp – Creating Apps Day #3 – 4 Jan 2017

Standard

Day #3 πŸ™‚ Again the room was set up by Areli and fam πŸ™‚ Thanks so much πŸ™‚

IMG_0104

We finished our calculator apps and create some more πŸ™‚

IMG_0107

IMG_0105 2

IMG_0106

IMG_0108

We also add pop up warning window if there is a division by zero πŸ˜‰

IMG_0109

IMG_0110 IMG_0111

IMG_0112 IMG_0113

IMG_0114

 

IMG_0116 IMG_0117

Then we created a Xylophone app πŸ˜‰

IMG_0115

IMG_0118

Yeh, we code and play LOL

IMG_0119

Kids like to code inside the box

IMG_0120

Literally πŸ˜€

IMG_0122

IMG_0125

While the kids was having the break and playing. Capt. BR did some debugging while having lunch

IMG_0124

And Capt. Fizhan giving help to those who didn’t take a break πŸ˜€

IMG_0126

Our Xylophone! πŸ™‚

IMG_0127

IMG_0128 IMG_0129

IMG_0130 IMG_0131

It worked nicely and have been tested πŸ˜‰

IMG_0123

IMG_0132 IMG_0133

IMG_0134

The next app was To Do List App. It required some database and we used TinyDB to store the list. The block is quite complex but the kids finished it πŸ˜‰

IMG_0135

IMG_0151

IMG_0136 IMG_0137

IMG_0138

IMG_0144

Here are our Apps Programmers! πŸ™‚ Ready to create many more!

IMG_0141

Some screenshots πŸ™‚

Bildschirmfoto 2017-01-04 um 10.06.51 AM Bildschirmfoto 2017-01-04 um 12.17.00 PM

Bildschirmfoto 2017-01-04 um 12.17.06 PM Bildschirmfoto 2017-01-04 um 1.23.46 PM

Bildschirmfoto 2017-01-04 um 1.39.14 PM Bildschirmfoto 2017-01-04 um 1.49.44 PM

And what happened behind the screen πŸ˜€ πŸ˜€ πŸ˜€

IMG_0148 IMG_0149

IMG_0150

See you again kids! So glad to have you in class πŸ™‚ Tomorrow we will start learning Arduino Programming πŸ™‚

ProCodeCG Kids Coding Camp – Creating Apps Day #1 – 2 Jan 2017

Standard

Hello! Day #1 of Creating Apps πŸ˜‰

Areli and Mom arrived earlier than us today and the set up the class so neatly, thanks Areli and Mom! πŸ™‚

IMG_9871

Let’s introduce our apps programmers in the class today: Indra

IMG_9872

Areli

IMG_9873

Ardian

IMG_9874

Dea

IMG_9875

and Michael! πŸ™‚

IMG_9876

We warmed ourself up by doing challenges on Blockly Games so we will be used to the syntax and the nature of Thunkable programming

IMG_9877 IMG_9878

We have lots of trails of different kind of challenges πŸ™‚

IMG_9879

Capt. Syahna with documents and stuff

IMG_9880

Capt. Zaki assisting Areli

IMG_9881

The class went very well, each kid had different ways to deal with the challenge

IMG_9914 IMG_9915

IMG_9916

IMG_9921

This is Areli’s long code on Blockly section Turtle, level 7 πŸ™‚

IMG_9919

A very long one and works very well πŸ™‚

IMG_9920

This one is level 10 of Pond section. Capt. Zaki created this code to help Mike finished his πŸ™‚

IMG_9922

This is Areli’s Turtle level 8

IMG_9923

and Mike Pond’s

IMG_9927

Lunch time! πŸ™‚

IMG_9924 IMG_9925

IMG_9926

After lunch we started creating our own Android apps! We create the apps using Thunkable and then generate this QR Code to be scanned by any Android phones using the same network and the app will be downloaded right into the phone and ready to use! πŸ˜‰

IMG_9928 IMG_9931

This one is Dea’s app πŸ™‚

IMG_9935

One button will show the pic and the other one will hide it πŸ™‚

IMG_9936

This one is Indra’s

IMG_9949

And Areli’s πŸ™‚

IMG_9950

Ardian and Mike still had trouble with their phone and the simulator so we will definitely try again tomorrow πŸ™‚

Here is the screenshots of some things we did today πŸ™‚

Bildschirmfoto 2017-01-02 um 9.46.02 AM Bildschirmfoto 2017-01-02 um 11.08.08 AM

Bildschirmfoto 2017-01-02 um 11.58.24 AM Bildschirmfoto 2017-01-02 um 1.47.51 PM

Bildschirmfoto 2017-01-02 um 1.47.53 PM

Going to make more interesting apps tomorrow! πŸ™‚

ProCodeCG Kids Regular Coding Class – Intro to Programming, GameMaker, Java Programming, Apps Programming – 19 Nov 2016

Standard

Whoaaa, we had lots of progress yesterday πŸ™‚

IMG_6847

Nanin didn’t come only for coding, she brought a book to be shared with ka Cinta and ka Syahna πŸ™‚ These girls are really great together; they share many things in common πŸ˜‰

IMG_6825

Faris came with lots of progress

IMG_6823

His program in Java had been able to read files πŸ™‚

IMG_6840

He also added some more features to it. It’s multiplayer now πŸ™‚

IMG_6827

Pru was Β very busy developing a To Do list app with Thunkable. We use TinyDB, a little database to store our to do list πŸ™‚ She made it work but some things didn’t work properly. We’ll fix it πŸ™‚
IMG_6837

Yogi had lots of plan in his head but not ready to share it πŸ˜€ He said he want to add lots of things to his GameMaker game πŸ™‚
IMG_6841

J is always so serious doing his Java programming

IMG_6842

He insisted to do the exercise from the handout for college students πŸ˜€ He had finished lots of code like this one

IMG_6848

And this login password

IMG_6849

And also this one πŸ™‚

IMG_6850

We had a newcomer too: Fadhil πŸ™‚ Welcome to the class, buddy πŸ˜‰
IMG_6844

IMG_6852

Parents are also having fun in the class, either by helping the kids or doing own experiments πŸ˜‰

IMG_6845

These three girls has their own thing to do πŸ™‚

IMG_6851

Areli has successfully added score monitor and change level πŸ™‚
IMG_6853

Bet that he will add lots of level to the game πŸ˜‰

IMG_6854

Can’t wait to see them again next week πŸ™‚

ProCodeCG Kids Regular Coding Class – 23 July 2016 – Exhibition Prep Part 1

Standard

Hello! Today we did some prep for the upcoming ProCodeCG Kids Exhibition πŸ˜‰ We also did lots of other things today πŸ™‚

IMG_7297

Azriel was preparing to present his code for the exhibition

IMG_7298

While Capt. Cinta giving jumpstart to Awa and Darrell πŸ™‚
IMG_7299

Edo helped Tyo to create Android apps with Thunkable

IMG_7301

We had a newcomer: Zahran πŸ˜‰ His little brother looked interested in what his big bro was doing, like any other ProCodeCG Kids LittleΒ Bros πŸ˜€
IMG_7302

Awa was catching up with the Cyber Security topic he missed last week

IMG_7303

We also had Vian back (after quite a long time), he was under Capt. Faris assistance πŸ™‚
IMG_7304

And later Azriel said there was something wrong going on with his code and he cancelled the presentation LOL

IMG_7305

Clarence and Prudence are the most quiet students in class. They were also keeping up with the Cyber Security thing and the finished it πŸ™‚
IMG_7306

Yaaay, our Capt. Reza was back! He came and before had a chance to unpack his back and set up his laptop, he already served the duty of helping other kid πŸ˜‰ ❀
IMG_7308

Faris, while helping Vian, was doing an investigation about the source code of Pokemon Go πŸ˜€ He downloaded the .apk and decompile it. And dissected it πŸ˜€

IMG_7333

We didn’t need the projector today because so many things were going on πŸ˜€

IMG_7309

Capt. Cinta started a new project we named: InstaKilo πŸ˜€ This is a simple apps supposed to look like Instagram where we have photos and people can like and leave comments πŸ™‚
IMG_7310

We’re developing it with Thunkable πŸ™‚

IMG_7312

Awa looked so serious! πŸ˜€
IMG_7313

So did Darrell πŸ™‚

IMG_7315

So did Zahran πŸ˜€
IMG_7316

Awa got the bestΒ tutor πŸ™‚ Look how happy he was πŸ˜€

IMG_7317

Yayyy Rezandra came too with a finished game in GameMaker for exhibition! All we need is adding scores and more features πŸ™‚
IMG_7319

The game looked like this πŸ™‚

IMG_7334

Muhammad came too! (with his little brother, so typical in ProCodeCG Kids Coding Class to see pairs of sibling like this πŸ˜€ )

IMG_7321

Azriel was very busy fixing his code while Reza was busy catching up
IMG_7322

We’re all busy!

IMG_7323
IMG_7324 IMG_7325

We’re busy and we discuss with each other to solve things
IMG_7326

This is Azriel’s code. Apparently there was some error related to the datatype (the method expect integer while the input parameter was float)

IMG_7327

Awa was working so hard he said Β he need to faint for a while πŸ˜€ πŸ˜€ πŸ˜€
IMG_7328

Malik came with his code in (pure) Java. A chatting apps.

IMG_7330

We just need to fix a few error.Β The code is written in Java. No visual programming, no drag and drop πŸ˜€
IMG_7332

Tyo and Edo were working on their code for exhibition
IMG_7335

Muhammad was doing some password cracking example
IMG_7336

Awa went to the other side of the class to check what other kids were doing πŸ™‚

IMG_7342

Any progress, Azriel?
IMG_7343

Prudence had finished her Cyber Security task and she moved on to the next challenge

IMG_7344

Reza did come late but he successfully caught up!
IMG_7345

One of the most entertaining things in this place is that we always find a pet πŸ˜€

IMG_7346

The cat just quietly napping on the table πŸ˜€
IMG_7347

And we will name it Thunkable πŸ˜€

IMG_7348

ProCodeCG Kids Coding Camp – Creating Apps – Day #2

Standard

Creating Apps, Day #2 πŸ˜‰

We created a game today! πŸ˜‰ A simple game we used to code with GML (GameMaker Language). This Pong Game is a very good example to introduce canvas, objects, image, sounds, arrangement and control πŸ™‚

Bildschirmfoto 2016-07-01 um 9.29.43 AM

Some of the code

Bildschirmfoto 2016-07-01 um 10.02.32 AM

The whole code
Bildschirmfoto 2016-07-01 um 10.33.40 AM

Next we created a simple calculator

Bildschirmfoto 2016-07-01 um 12.54.19 PM

The code
Bildschirmfoto 2016-07-01 um 12.54.21 PM

The calculator on the simulator

Bildschirmfoto 2016-07-01 um 1.26.22 PM

And we also created a guess game
Bildschirmfoto 2016-07-01 um 5.33.00 PM

the code is still very simple, we will improve it tomorrow πŸ™‚

Bildschirmfoto 2016-07-01 um 5.33.04 PM

This is when the guess is wrong
Bildschirmfoto 2016-07-01 um 5.39.26 PM

And this is when the guess is correct πŸ™‚

Bildschirmfoto 2016-07-01 um 5.40.12 PM

For each app we just generate the QR Code and everybody can play πŸ™‚
IMG_5529 IMG_5530

The GodFather Captain gave us a visit again πŸ™‚
IMG_5531

Capt. Zaki, as usual, preparing today’s lesson

IMG_5532
IMG_5535

GodFather Captain busy with the Gizwits πŸ˜€
IMG_5536 IMG_5537

Oh wow, this kid really got a style πŸ˜€
IMG_5538

And this one always hide behind something πŸ˜€

IMG_5539

LOL! πŸ˜€
IMG_5540 IMG_5541

Capt. Cinta assisting Mail
IMG_5542 IMG_5543

Friday’s Prayer break
IMG_5544

We created some games apps and play πŸ˜€

IMG_5545

or listening to music
IMG_5546

Or just checking up handphone

IMG_5547

After the break, Capt. Zaki explained about the calculator

IMG_5553
IMG_5554

WithΒ Capt. Cinta navigating the screen

IMG_5555

Yep, it works πŸ˜‰
IMG_5556

IMG_5571IMG_5557

In two days, kids gots lots of new apps on their smartphones
IMG_5558

Capt. Zaki and Capt. Cinta, always love to see kids in teamwork πŸ˜‰ ❀

IMG_5559

Zahra and Icha
IMG_5561

Ara
IMG_5562

Edo and Thoriq

IMG_5563

Ozan (and Capt. Fizhan)
IMG_5564

Farrell and Mail

IMG_5565

Rheino
IMG_5566

Fayza

IMG_5567

Fadhlan
IMG_5568

Nadhira

IMG_5569

Tian
IMG_5570

After all kids got the app worked, we call it a day!
IMG_5573 IMG_5574

Will create more apps tomorrow! πŸ˜‰

 

ProCodeCG Kids Coding Camp – Creating Apps – Day #1

Standard

First day of Creating Apps! πŸ™‚

Today we learn how to create android apps with Thunkable

Thunkable is a spin off of App Inventor. It is a very friendly tools to create mobile apps

Bildschirmfoto 2016-06-30 um 9.56.10 AM

And after the apps ready, it can be exported using QR Code or as .apk to be downloaded to computer, and run with a simulator.

Bildschirmfoto 2016-06-30 um 9.41.18 AM

As the beginning, we create a button that will display a picture when it is clicked
Bildschirmfoto 2016-06-30 um 10.00.50 AM

Thunkable use drag and drop coding (very similar to Blockly)

Bildschirmfoto 2016-06-30 um 10.06.49 AM

A recommended simulator is KoPlayer (for PC) or BlueStacks (for Windows and Mac). This is how the app looks like on BlueStacks for Mac
Bildschirmfoto 2016-06-30 um 10.30.18 AM

The next app we created is a login form

Bildschirmfoto 2016-06-30 um 1.13.21 PM

The code
Bildschirmfoto 2016-06-30 um 1.13.34 PM

How it looks like on BlueStacks
Bildschirmfoto 2016-06-30 um 1.24.18 PM

If we enter the correct user id and password, it will go to the next screen

Bildschirmfoto 2016-06-30 um 1.24.23 PM

Then we add some back button
Bildschirmfoto 2016-06-30 um 1.39.23 PM

And some time picker too

Bildschirmfoto 2016-06-30 um 1.47.40 PM

Before the class started
IMG_5431

Capt. Cinta and Capt. Syahna

IMG_5432

Edo, Thoriq and Fauzan
IMG_5433

Fadhlan and Fayza

IMG_5434

Zahra and Icha
IMG_5435

Capt. Zaki and Capt. Fizhan

IMG_5436

Capt. Zaki preparing the lessons today
IMG_5437

The QR Code

IMG_5442

Everyone can read it and use the app on their android phone
IMG_5443

Capt. Cinta assisting Fadhlan

IMG_5444

Lots of things to do today because we had to do lots of setups for each computer and smartphones

IMG_5447
IMG_5450

This is Tian
IMG_5451

Ismail

IMG_5452

Nadhira
IMG_5453

Capt. Zaki assisting Fayza

IMG_5454

Rheino
IMG_5455

Fadhlan
IMG_5456

Ara
IMG_5457

Zahra and Icha having fun πŸ˜€

IMG_5458

Edo and Thoriq too πŸ˜€
IMG_5459

Ozan looks so happy too πŸ™‚

IMG_5460

Today our GodFather Captain visited us again and shared some stories about electronic devices and information technology πŸ™‚
IMG_5462 IMG_5464

He showed us Gizwits
IMG_5465

The kids were really interested

IMG_5466

ProCodeCG is so going to make class or coding camp “IOT for Kids” πŸ˜‰
IMG_5467

Back to work again

IMG_5468
IMG_5469 IMG_5470

This is how the app looks like on kids android smartphones
IMG_5445
IMG_5471 IMG_5472
IMG_5473 IMG_5474
IMG_5475 IMG_5476
IMG_5477 IMG_5478

This is too fun! We will continue this tomorrow! πŸ™‚