SOURCE Lesson Plans Detail

Computer Science

Topic Computer Science
Program Brown Science Prep
Developed by Meryl Charleston, Sumit Sohani, and Montana Fowler
Developer Type Undergraduate students

Overview / Purpose / Essential Questions

The purpose of this lesson is to explore computer science by answering questions such as what is the history of computer science? What problems can be solved using a computer? What types of professions are open to computer scientists? And what research is currently going on in the field of computer science? Students will also get an introduction to coding using the Pencil Code learning program

Performance / Lesson Objective(s)

1. Learn about computer science as a field

2. Use Pencil Code to code develop a product 
3. Present and pitch pencil code product as a startup company 

Lesson Materials

1. Company swag (livestrong bracelets of different colors that say BSP) 2. Pencilcode website, password for bspisawesome account is “awesome”

3. Printed Pencilcode documentation for each student and mentor (double-sided)

Lesson Motivation

  1. Introduction
  1. What is Computer Science?

Make an Idea map on the board and ask students:

(slide 1)What comes to mind when you think of “computer science”?

Circle Computer Science on the board and have them branch off of it, each student adding an idea/something they associate with computer science (Coding, Steve Jobs, Facebook, etc). We have included a sample idea map. Make sure to add these things if they don’t.





Yes, it includes all these things, and more.


An Overview of Computer Science

Computer Science is as much about using computers as chemistry is about using beakers.  It’s a way of solving problems using computers not about studying computers!

What types of problems can we solve with computers?

  • Beakers are really great at measuring volumes which is why we use them in chem----Computers are really good at doing processes over and over again and at a a pretty fast speed. We can also use the internet and apps to reach lots of people all over the world.

  • (slide 2) Margaret Hamilton developed onboard flight software for the Apollo space program. “Three minutes before the Apollo 11 lunar lander Eagle reached the surface of the moon, computer alarms went off. The landing would have been aborted had Hamilton not anticipated the problem and created software to solve it.” source

  • (slide 3) Surgical robots can perform more precise surgeries than humans can, because their hands won’t shake accidentally.

  • (slide 4) optional video included Kiva.org - A nonprofit organization that allows people to lend money to entrepreneurs in third world countries. What is cool is that Kiva has a 98.46% repayment rate, and often Kiva users will then use their repayments to invest in other entrepreneurs.

  • (slide 5) We also have lots of cool apps and gadgets like Fitbits that make us healthier! Have them name some more helpful apps.


B. History of Computer Science (slide 6)

Highlights from the History of CS

(slide 7) The first electronic computer was the ENIAC (Electronic Numerical Integrator and Computer if anyone asks), built in 1943 at the University of Pennsylvania. It was over 1000 times faster than any previous computer. It occupied more than 1,000 square feet and weighed 30 tons! Imagine taking that to the library. source


(slide 8) First computer “bug” was found by Grace Hopper September 9, 1947

Have student(s) explain what a bug is/give examples of bugs they’ve encountered

  • Generally just a glitch in a program that causes it to do something that it was not designed to do

  • examples: Apple Maps 2012 app used to give meaningless directions. For instance, the Washington Monument moved across the street. (source)

  • (slide 8) Back to first bug– it was an actual bug! Grace Hopper found a moth stuck in the computer she was building.


Brown’s Involvement in CS History

(slide 9) Brown started teaching computer science in 1956 in the Economics and Applied Math departments. In 1979 it was the first university to make its own computer science department and to study it as its own discipline.


(slide 10) Andy van Dam was one of the educators to help split off the program, and he is still teaching an Intro to CS course and a graphics course here at Brown!  He was the second person EVER to get a Ph.D in computer science! This is a very new field that is changing, growing, and affecting our lives exponentially.

  • Since Brown has an animation track that helps feed into Pixar, a lot of animators at Pixar went to Brown! You can see small connections to Brown in Pixar movies like in the Monsters University’s gate and Toy Story’s main character being named Andy.


Notable People in Computer Science

(slide 12) Grace Hopper discovered the first computer bug

  • Invented first compiler for programming languages. A compiler is a program that converts code that you write in a programming language into a computer language that the machine you’re using can understand.

  • Her work led to one of the first “high level” programming languages (this one was called COBOL). High level basically means that the programmer is “far away” from the computer, and can type code that is much more readable to the human (vs. low level code, which looks like what can be read by a computer, and is very hard for us to understand).


(slide 13) Jerry Lawson invented interchangeable cartridges for video games

  • Head of engineering and marketing for a semiconductor company’s gaming division

  • First home gaming system that used interchangeable cartridges. Before this, games were built directly into their hardware. Can you imagine an XBOX today where all the games have to be built in? (And you can’t buy new ones?)

  • Part of the Homebrew Computer Club, which could include Steve Jobs and Steve Wozniak (founders of apple).

  • Made one of the first video games called Demolition Derby.


(slide 14) Alan Turing, the father of computer science and AI

  • Highly influential as a person who developed a lot of CS theory still used today! Considered the father of computer science and AI.

  • Developed techniques to crack the Enigma machine, an encryption device the Germans used in WWII. his work played a big role in helping the Allies intercept Nazi messages.

  • Made the “Turing Test”: A human would be talking to two “people” on a computer, except one is really a robot. This person then decides who is the human and who is the robot. Kind of the “benchmark” for sentient AI (robots that can think on their own) and still has not been firmly satisfied to this date!


C. CS as a Profession Today

Many different job types!

  • Facebook, Twitter, Instagram: All social networks (these are software developers, basically write code to solve problems and improve the features of these sites)

  • Information security analysts: Work in cybersecurity, to protect company information from cyber attacks and security breaches. Basically the reason why you can’t easily hack into websites and steal passwords and stuff.

  • Computer engineer: Actually designing computer components-- the hardware (the actual physical components of the computer). Have to work really hard to make things efficient and clean. The reason the iPhone always keeps getting thinner and bigger is because of computer hardware engineering.

  • App/Web Developers: Have an idea for that awesome new app or game or website, but don’t know what to do? You can just pay an app/web developer to do it for you!

  • Database Administrators: Work primarily in data storage, using databases. Think about a company like UPS, which has to store customer shipping records. Or an insurance company, which has to store customer information. DA’s make these databases secure, but also quickly accessible to those inside the company that need it. Think of them as the builders, that make a house look clean and sturdy.

Startups & startup culture

  • Startups are young, small companies that aim to solve a problem (versus the traditional “companies” you may think of, which do a ton of things). At one point, Facebook was a startup. A lot of app companies start out this way.

  • Don’t have to be tech oriented! There are a lot of food-related startups (for example, PlateJoy, which curates weekly meals for you based on your preferences). However, since a lot of these still need apps and websites, coders are almost always a part of it.

  • Informal culture, with really cool offices and a lot of “perks” (free food).

  • You guys will be “working” at your own startup today!!!

Research

  • Can you even do research using computer science? What???

  • Yes! A lot of research can be done with robots. For example, Professor Stefanie Tellex at Brown (woo!) is currently doing research to figure out how humans can interact with robot using natural, everyday language. How do you make a robot understand words like “Pick up that box over there and bring it to me?” Here’s a video of a robotic forklift following a simple command. (50 seconds).

  • Also, a lot of research is being done on computational vision. This is basically trying to duplicate human vision using electronic components. There are a lot of areas of research working to make computational vision better, from facial recognition (the thing that lets those new Snapchat filters work so well) to motion estimation, which is when two frames from a video are analyzed to see what moved, and how (this is really hard because videos are capturing 3D, but they themselves are just 2D).


II. Using Pencil Code

First, briefly go over the documentation on the handout with the students and have pencilcode open on the projector. Perform each action (move mouse to see coordinates change, etc) the handout describes and show the students key features. Remind them that they can always ask mentors/refer back to the handout if they need help.

  1. Introduction to Pencil Code

**PLEASE DO NOT MODIFY THESE FUNCTIONS, EVERYONE NEEDS TO USE THEM**

You don’t have to go through all of these, do the first and ask students if they want to see more


Example 1: smiley face :)

Run the function. Have students go around and describe what the turtle is doing, make sure they highlight key points: draws different sized circles, jumps to different areas, turns and draws arc.

Example 2: “3D” Ice cream cone!

Same as above. Key things for this one: difference between turnto and the “turnto” and “rt” blocks, difference between “fd,” “jumpto,” “jumpxy,” and creating different sized circles + arc (lol basically copied meryl).

Example 3: Pencil!

Uses fd, jumpto, turnto, etc, but it also uses a loop! The orange function will repeat the inside function as many times specified (in this case 10) This can help us condense our code instead of calling the same things over and over again. It makes it prettier!

B. Debugging

**MAKE SURE YOU’RE MODIFYING YOUR GROUP’S VERSIONS**

**ONLY MAKE CHANGES DURING THE LESSON**

You don’t have to go through all of these, do a little and ask students if they want to see more.


Example 1: sad flower

http://bspisawesome.pencilcode.net/edit/sadflower[number]

example | group 1 | group 2 | group 3 | group 4 | group 5 | group 6

Help! Our sad flower is missing a petal. Help restore it to its former beauty! Run the function, you’ll see an error message. Have the students discuss how to fix it.

Solution: drag a new “dot” block out and set it to “purple” and “40” or click here for the solution

Example 2: square without corners

http://bspisawesome.pencilcode.net/edit/squarewithoutcorners[number]

example | group 1 | group 2 | group 3 | group 4 | group 5 | group 6

Is a square still a square if it has no corners? Sadly, no. Let’s make this line into a square! Run the function and have the students discuss how to fix it.

Solution: “rt 90” before each “fd 100” or click here for the solution

Example 3: troubled triangle

http://bspisawesome.pencilcode.net/edit/triangle-bad[number]

example | group 1 | group 2 | group 3 | group 4 | group 5 | group 6

Our good friend the turtle is trying to draw himself a triangle, so he has something to play with. Unfortunately, it looks kind of messed up. Let’s help him fix it.

Solution: Need to add a pen before the other code to make anything appear, and all the rt angles need to be 120, not 60 (or just click here).

Example 4: crazy house

http://bspisawesome.pencilcode.net/edit/house_debug_example[number]

example | group1 | group 2 | group 3 | group 4 | group 5 | group 6

This house is crazy! The window & door aren’t in the right place!! This is because

the programmer mistakenly used the jumpto function instead of the jumpxy

function. The jumpto function needs the coordinates of the next place for the doodle to jump, whereas the jumpxy function moves the doodle x distance horizontally and y distance vertically.

To fix the house, replace the jumpto functions with jumpxy functions using the numbers in the program’s incorrect method. SAVE THE NUMBERS THAT ARE IN THE JUMPTO FUNCTION! Just put them in the jumpxy function. You don’t need to come up with new numbers! Run it! Now it’s fixed! In our programs we should use jumpxy, because then we can move the entire object around, which can help later. To demonstrate this, at the top of the program in the move to function have the kids give you new x, y coordinates. Run it and watch the entire house be painted elsewhere since we didn’t ground it to specific coordinates. This is an example of a good design choice that can help us later. Good design choices can make all the difference in computer science.

Click here for a link to the correct house


INFO FOR MENTORS

  • Angles: 0 is up, rotates clockwise

  • float cursor over coordinates to see them in bottom right corner

Lesson Activities

1. Pencil code introduction2. Startup company presentations

Procedure

III. Startup!
  1. Explain the Big Activity

Congratulations guys! Today you are building your own tech company! As a group you’re going to create a design on pencil code in the way that tech companies complete projects. First you’ll think of the big picture design as a group, because computer science is all about collaboration on projects! However, it would be inefficient for you all to sit around one person doing the coding, so you’ll divide up the parts of the design to different people so you each have a task or two to complete in the design.


Coding by ourselves be difficult though. Sometimes we don’t notice bugs in our code or we need help to try and figure out the best way to complete our tasks… so we pair program! Though you each have your own task to complete for the big group design, when you code your part you’ll have a partner sitting next to you who can help you debug your code, and you’ll do the same for your partner. This can help with efficiency because another person will help you solve bugs faster than you might completely on your own! We want to emphasize that computer programmers aren’t people sitting in caves by themselves programming; they spend a lot of time working with others and helping each other.


If you finish your part of the design and have time, go help the rest of your team code/debug! If your entire team is finished, try this challenge: https://goo.gl/6mqlP6. Let’s get started on your new company!


B. The Beginning of a Startup

The swag is so important in the computer science world! So we have some company swag for you all! (Pass out wristbands). The different startups have different colors.


You guys also need to discuss a company name amongst yourselves, but it is okay to decide after you figure out your product! A design made by the turtle in Pencil Code!


Here is a sample startup if you need it! If we put it together, it makes the house we saw in the first debugging example. part 1 | part 2 | part 3


  1. Design & Divide up work

Discuss amongst yourselves an idea for a design you could make with the number of parts as there are people in your group. It’s okay for your design to change while you code if you discover the capabilities and limits of the turtle, but it’s time to plan a picture.


Most likely, the students should draw some sort of scene with the turtle… like building a face, or putting several shapes together for a design. They really can do whatever they want as long as there are enough parts for each person in the group to have one. They can draw on the chalkboard to discuss ideas. Make sure they keep the design simple because each person only has 30 minutes to create/debug.


Once they have decided on a general plan, they should divide up each part to a person working at the startup and make sure they are all on the same page. (Especially with the coordinate starting points of each part of the design, so they can come together well.)


Then split the group into pairs & if you have to have one group of three that’s fine too. Have them sit together in the SunLab so they can pair program (explained below).


Make sure you came up with a company name! (for pencil code logins)


Now it’s time to move to the Sun Lab!


When they move to the Sunlab, they’ll go to pencilcode.net and click New Account. They should use their group name and first initial + first (up to) 5 letters of last name as their name and “bsp” as their password. So if Meryl Charleston was in the group “I love bsp” her username would be “Ilovebspmcharle” and her unique url would be ilovebspmcharle.pencilcode.net. The username makes sharing code easier.


They should come and get a mentor when they’re ready to put it all together!

  1. Pair Programming

Tell students to  ask their small group members for help before they ask a mentor! Stress that their job isn’t just to code their part of the project– it’s also to guide and assist the other students in their small group. Computer science is about collaboration.

  1. Debugging

Make sure the students know that they are bound to run into problems with their designs, especially when they are putting them together. This is a huge part of computer science! No one gets it right the first time! For the first iPhone demo, the software crashed unless the user opened the different applications in the correct order.

  1. Putting it Together

Everyone in the group should convene around one computer and copy/paste their separate portions of the project into one project window provided below (password is “bsp”). To copy/paste, click in the portion of the window where their code blocks are and drag to select all of the blocks. CTRL+C or COMMAND+C to copy and CTRL+V or COMMAND+V to paste into another project (or right click and select copy/paste respectively). They can access each other’s code with the links that are unique to their portions of the code.


Leave ample time for this! There might be a lot of adjusting so that their final output looks just right (:


group 1– http://bspgroup1.pencilcode.net

group 2- http://bspgroup2.pencilcode.net

group 3– http://bspgroup3.pencilcode.net

group 4- http://bspgroup4.pencilcode.net

group 5– http://bspgroup5.pencilcode.net

group 6- http://bspgroup6.pencilcode.net


  1. Deciding What to Present

Make sure your team decides on what they are going to say in their 3-minute presentation when we regroup. It should include:

  • Why did they chose the idea for their design?

  • What were a few challenges/bugs they faced, and how did they fix them?

  • Is there anything they would add or change to improve their design next time?

  • What are some skills you learned by doing this project?

  • What’s something surprising you learned about computer science?

  1. Presentations!

Return to 190 for the presentations of the designs!


Supporting Web Information

Pencil code (group 1)– http://bspgroup1.pencilcode.net


Slides- https://docs.google.com/a/brown.edu/presentation/d/1OIX_Dij7r8gaELbEt88Cz0OxBccsr5WmsTTSRPad-v0/edit?usp=sharing

Alignment Info

Audience(s) High school students
STEM Area(s) Computer Science
Standard(s)
Math (Common Core) K.G.1
Describe objects in the environment using names of shapes, and describe the relative positions of these objects using terms such as above, below, beside, in front of, behind, and next to.
Activity Type(s) Hands-on
Grade Level(s) High School
Version 1
Created 01/27/2016 02:33 PM
Updated 12/20/2018 11:00 AM