We are going to start our discussion on user experience. We've talked a lot in this series about how computers move data around within the computer, but not so much about our role in the process. So today, we're going to look at our earliest form of interaction through keyboards. We'll talk about how the keyboard got its qwerty layout, and then we'll track its evolution in electronic typewriters, and eventually terminals with screens. We are going to focus specifically on text interaction through command-line interfaces, and next week we'll take a look at graphics.
We're going to discuss the critical role graphical user interfaces, or GUIs played in the adoption of computers. Before the mid-1980's the most common way people could interact with their devices was through command-line interfaces, which though efficient, aren't really designed for casual users. This all changed with the introduction of the Macintosh by Apple in 1984.
Carrie Anne is going to start our overview of the fundamental building blocks of programming languages. We’ll start by creating small programs for our very own video game to show how statements and functions work. We aren’t going to code in a specific language, but we’ll show you how conditional statements like IF and ELSE statements, WHILE loops, and FOR loops control the flow of programs in nearly all languages, and then we’ll finish by packaging up these instructions into functions that can be called by our game to perform more and more complex actions.
Programming--sometimes referred to as coding--is a nuts and bolts activity for computer scientists. While this chapter won't teach you how to program (we've given some links to sites that can do this in the introduction), we are going to look at what a programming language is, and how computer scientists breathe life into a language. From a programmer's point of view, they type some instructions, and the computer follows them. But how does the computer know what to do? Bear in mind that you might be using one of the many languages such as Python, Java, Scratch, Basic or C#, yet computers only have the hardware to follow instructions in one language: a very simple "machine code" that is difficult for humans to read and write. Then if you invent a new programming language, how do you tell the computer how to use it?
In this chapter, we'll look at what happens when you write and run a program, and how this affects the way that you distribute the program for others to use.
Students will learn to read App Lab’s API documentation and will use functions that accept parameters in order to complete a series of drawing puzzles which require them to make use of the App Lab API documentation to learn new drawing commands. Many of these commands will require the use of parameters. The final challenge asks students to design a personal monogram making use of the commands they learned during the lesson.
Students will be able to:- use parameters to provide different values as input to procedures when they are called in a program.- use API documentation to assist in writing programs.- define an API as the set of commands made available by a programming language.
Note: You will need to create a free account on code.org before you can view this resource.
In this lesson, students practice using and creating functions with parameters. Students learn that writing functions with parameters can generalize solutions to problems even further. Especially in situations where you feel like you are about to duplicate some code with only a few changes to some numbers, that is a good time to write a function that accepts parameters. In the second half of the lesson, students make a series of modifications to a program that creates an “Under the Sea” scene by adding parameters to functions to more easily add variation to the scene. Lastly, students are introduced to App Lab’s random number functions to supply random values to function calls so the scene looks a little different every time the program runs.
Students will be able to:- write functions with parameters to generalize a solution instead of duplicating code.- identify appropriate situations for creating a function with parameters.- use random numbers as inputs to function calls for the purpose of testing.- add parameters to a function in an existing piece of code to generalize its behavior.
Students will extend the My Favorite Things app they built in the previous lesson so that it now manages and displays a collection of images and responds to key events. Students are introduced to the practice of refactoring code in order to keep programs consistent and remove redundancies when adding new functionality. As part of learning to use key events, students are shown that event handlers pass a parameter which contains additional information about the event. This lesson also serves as further practice at using arrays in programs.
Students will be able to:- use an array to maintain a collection of data in a program.- create apps that allow user interaction through key events.- refactor code in order to appropriately incorporate new functionality while maintaining readability and consistency.
This lesson will probably take two days to complete. It introduces students to algorithms that process lists of data. The students will do two unplugged activities related to algorithms and program some of them themselves in App Lab. The for loop is re-introduced to implement these algorithms because it’s straightforward to use to process all the elements of a list. The lesson begins with an unplugged activity in which students write an algorithm to find the minimum value in a hand of cards. Students then move to Code Studio to write programs that use loops and arrays. Students are shown how to use a for loop to visit every element in an array. Students use this pattern to process an array in increasingly complex ways. At the end of the progression, students will write functions which process arrays to find or alter information, including finding the minimum value - a problem they worked on in the unplugged activity. Finally, an unplugged activity has students reason about linear vs. binary search and attempt to write pseudocode for a binary search.
Students will be able to:- use a for loop in a program to implement an algorithm that processes all elements of an array.- write code that implements a linear search on an unsorted array of numbers.- write code to find the minimum value in an unsorted list of numbers.- explain how binary search is more efficient than linear search but can only be used on sorted lists.
In this lesson, students are introduced to the return command and learn to write their own functions that return values. Students first complete a simple unplugged activity based on the game Go Fish to introduce the concept of a return value. They will then complete a short sequence of exercises in Code Studio, which introduces preferred patterns for writing functions that return values. At the end of the sequence, students write and use functions that return values in a simple turtle driver app.
Students will be able to:- use the return command to design functions.- identify instances when a function with a return value can be used to contain frequently used computations within a program.- design functions that return values to perform frequently needed computations within a program.
Students continue to practice working with arrays and are introduced to a new user interface element, the canvas. The canvas includes commands for drawing simple geometric shapes (circles, rectangles, lines) and also triggers mouse and key events like any other user interface element. Over the course of the lesson, students combine these features to make an app that allows a user to draw an image while recording every dot drawn on the canvas in an array. By processing this array in different ways, the app will allow students to redraw their image in different styles, like random, spray paint, and sketching. Along the way, students use their knowledge of functions with return values to make code which is easy to manage and reuse.
Students will be able to:- programmatically control the canvas element in response to user interactions.- maintain a dynamically generated array through the running of a program in order to record and reuse user input.- use nested loops within a program to repeat a command on the same array index multiple times.- perform variable arithmetic within an array index to access items in an array by their relative position.
