Thursday, July 31, 2014

Additional Resources


Additional opportunities to explore coding:

Learn Python
https://groklearning.com/hoc/

Learn Ruby
http://hackety.com/

Learn Ruby, JavaScript, Python with Learn Street
https://www.learnstreet.com/

Check out a variety of progamming courses (not all free)
https://www.udemy.com/courses/Development/

Introduction to Computer Science- Learn Code with GUI
http://learn.code.org/

Drawing with Code
http://hello.processing.org/

Make games for iPhone
https://www.makegameswith.us/build-an-ios-game-in-your-browser/

Make Apps
http://appinventor.mit.edu/explore/

Another App making program
https://www.touchdevelop.com/hourofcode2

Thursday - Completion & Sharing

Robozzle & Save My Robotos
As students arrived, they were invited to try out Robozzle & Save My Robotos. Both games are similar to Light-bot. However, Robozzle allows students to play and rate levels created by other people, as well as create their own. Robozzle features both functions and conditionals. Save My Robotos has a slightly different twist on the formula, in Save My Robotos, players must device a program that will work correctly on multiple robots all at the same time.



Completing Projects

Students continued working in the programming environment of their choosing. Students could create a game or animation using object-oriented visual programming via Tynker, create a work of digital art or interactive animation through JavaScript via Khan Academy, create custom programs using JavaScript for Karel in CodeHS, or pursue game development object-oriented visual programming through Stencyl.








Group Photo
Students gathered to take a group photo in the green room.


Lunch and Sharing
During and after lunch, parents were invited to see projects and products completed by the students. Products included animations, illustrations, and games created in both visual programming platforms and in JavaScript.

Images the students have uploaded and shared can be seen on our Padlet.


Many students were happy to share their Tynker creations. Most students made multiple animations and games in Tynker, you can see a few of them in our Tynker Showcase.





Exporting & Transferring Files from Stencyl

I've created a short instructional video in case you'd like to let a friend or family member try your Stencyl game. In this video, I'll also show you how you can take your project files home in case you'd like to work on it some more.


See the video here:
https://vimeo.com/102232660



As requested: Mr. Shaun's Mambo Game-
I'd like to add more levels later, as its pretty short, and currently none of the enemies can hurt you. Will probably add more to it later on during the year. To play it, download it, then open it with Google Chrome or the internet browser of your choice.
You can download it here.

Wednesday, July 30, 2014

Wednesday - Today's Concepts

Light-bot
As students arrived, they began the morning in Light-bot. Light-bot is a simple programming game which originally began in 2008 by Danny Yaroslavski. At the time, Yaroslavski was still in high school and creating flash games just for fun. Lightbot was one of several he'd created. In 2009, while interning at Armor Games, Yaroslavski released Light-bot 2.0. As an undergrad at the University of Waterloo, Yaroslavski has received an award of $4,000 for the game.

In the game Light-bot, computer science concepts are built into the game's core mechanics, creating a fun way to practice programming logic in a way other than coding. Students command Light-bot through a GUI (Graphic User Interface) to navigate a board and light up each blue tile present. The game starts simple, but with time requires a fair level of problem solving.




The original game can be played online for free. The sequel adds new concepts and capabilities, including a level editor and is also a free online flash game. Yaroslavski has released a new official mobile version (Android & iOS), redesigned to better teach CS concepts, as well as the new Light-bot Jr (Android & iOS) for younger players. Yaroslavski intends to continue testing and developing Light-bot.


The game is utilized in many high school and even college and university introductory CS courses, but is also approachable for children. The game has also been featured in a variety of educational resources, including Code.org's Hour of Code and Common Sense Media's Summer Learning Guide.

Starting Stencyl

Stencyl is a game-design program that can create 2-d games for flash, iOS, Android, or desktop platforms. Through creating games with Stencyl, students can create and modify behaviors using a visual programming environment similar to Tynker, but specifically designed for the development of games.

To create or modify behaviors, students must classify objects, set and define variables, Students were assisted in the process of creating a simple platformer. Students ready to move to more complex concepts can also attempt to create a shmup-type game (like Space Invaders or Galaga).


Students can test their creations at nearly any point, and as many times as they choose through exporting their project as an all-included flash file.


 

Choice Project

After lunch, students were allowed to choose in which environment they'd like to further work in to design a cs-related product in. Students could go back to create a game or animation using visual programming via Tynker, create a work of digital art or interactive animation through JavaScript via Khan Academy, create custom programs using JavaScript for Karel in CodeHS, or pursue game development through visual programming in Stencyl.







Below are screenshots of student projects currently in progress. These images were taken and uploaded by our students during their work this afternoon.




Visit our Padlet to see some of the student projects (work-in-progress), as well as photos taken by our volunteers.

Starting Stencyl

This morning we will try out Stencyl.



Stencyl is a program specifically designed to create games. Stencyl is free and allows all sorts of games. Finished products can be exported as a flash game, or can be exported in other formats such as for iOS or Android if you're willing to upgrade from the base version.

Programming in Stencyl is similar to programming in Tynker or Scratch. Start Stencyl by following along the basic Crash Course, which will teach you how to create a basic platformer.

Download the Crash Course Kit.

Download the instructional slides <- PDF format + correction
    ^ Corrected, the previous PDF was reading as corrupted on Mac OSX

Download the instructional slides <- Keynote '09 + correction

Tuesday, July 29, 2014

Tuesday - Today's Concepts

Communication
Communication is a big aspect of every field and subject. Continuing on yesterday's practice of non-verbal communication, students started off the morning with the Look Game. Students pass the Look from one person to another around the room by making eye contact.

The game starts simple, but can become more complicated as students are given more options. As the game becomes more complex, students will need to pay attention to others, but also act with overt decisiveness for others to be able to follow.


Basic Sequencing with Code

With CodeHS.com, students are gradually introduced to working with programming with JavaScript. Students are provided with a limited number of commands they can utilize to navigate Karel the Dog on a two dimensional grid. These first activities gradually introduce students to the JavaScript syntax, in addition to other CS concepts.




Defining and Calling Functions

Students are taught how to expand their list of commands by defining their own functions, allowing them to work more efficiently by being able to repeatedly use a function they've created instead of having to type multiple lines of code repeatedly. Proper use of white space and the ability to add comments are also introduced. As students continue using more functions, the concepts of Top Down Design and Decomposition are also introduced.




Loops and If Statements

As students move further into Karel, they learn how to write For Loops, While Loops, If Statements, and If/Else Statements in JavaScript. Depending on the each students pace and comfort level with the content, some students may move into this content faster, and others might not get to it before the end of the week. The CodeCamp group will remain up after the completion of the week, and students may login from home to complete the Karel exercises in order to learn the code needed for these concepts and/or to practice these skills later on.



Drawing with Code

After lunch, students followed along with Khan Academy. Through Khan Academy's Intro to JavaScript content, students learn how to create basic simple shapes. Students could create more complex images by combining and manipulating rectangles and ellipses by defining their parameters, such as starting x & y coordinates and x & y height.





RGB & More

As students progress through Drawing with JavaScript, they learn how to create colors using RGB, transform shapes, and build/draw order of the shapes they are creating.




Even More with Code

If students choose to move further through these activities, they can learn how to add in string of text as well as animation, including interaction with user input. Additional exercises also cover content variables, logic, and arrays.

"Magic Trick" Card Game

Students use two-colored cards to be able to quickly determine a changed card among a seemingly random large grid of cards. This trick makes use of the computer science concepts 'states' and 'parity'.



Visit our Padlet to see some of the student projects (work-in-progress), as well as photos taken by our volunteers.

Starting a Padlet

Showing Visual Learning through the online web app, Padlet. We are just starting it today, so it may be sparse for now, but it will continue to develop through Thursday.

 Our Padlet can be visited here.

Monday, July 28, 2014

Monday - Today's Concepts

Communication

Throughout today, students had to learn to communicate a variety of ways. Students had to communicate non-verbally with their peers, with specificity and intent during a simulation, and through blocks of code to program an online web tool.



Programming Simulation

In small groups, students 'programmed' one of our facilitators to open a bag of M&Ms, then sort them by color. Facilitators acted as computers requiring specific and clear commands. Following this, students paired up and repeated the activity, taking both a turn being the computer, and the programmer.



Basic Programming Sequences

Each student worked with Tynker, an object-oriented Visual Programming (Graphic User Interface) online web app, similar to MIT's Scratch. Students begin basic programming through placing interlinking blocks through the story of Pixel the puppy.


For & While Loops

A basic loop function allows a command, or series of commands, to be repeated for a specific number of times. A similar loop function allows students to program Pixel to repeat a command, or series of commands, until a certain condition is met.



Keyboard Input

Students can input parallel sequences of code to allow user keyboard input.



A Variety of Additional Options

Students can use these programming blocks, or experiment with new ones, to create and command a variety of objects that can both interact with each other and with user input. Students can also try out and remix content published by other users.