Lesson 4: Learn to Drag and Drop
Overview
In this lesson, students will relate the concept of algorithms back to everyday, real-life activities by planting an actual seed. The goal here is to start building the skills to translate real-world situations to online scenarios and vice versa.
Purpose
The main goal of this lesson is to build experience with computers. By covering the most basic computer functions such as clicking, dragging, and dropping, we are creating a more equal playing field in the class for future puzzles. This lesson also provides a great opportunity to introduce appropriate computer lab behavior.
Agenda
Warm Up (10 min)
Bridging Activity - Drag and Drop (10 - 15 min)
Main Activity (20 - 30 min)
Wrap Up (5 - 10 min)
Extension Activities
View on Code Studio
Objectives
Students will be able to:
- Recognize what is expected of them when they transition into the computer lab.
- Drag, drop, and click to complete Code.org puzzles.
Preparation
- Watch the How to Make a Class Section on Code.org - Teacher Video. Create a class section and make sure every student has a card with their passcode on it.
- Have the school IT person add a quick link for your class section to the computer desktop.
- Make sure each student has a Think Spot Journal - Reflection Journal.
Links
Heads Up! Please make a copy of any documents you plan to share with students.
For the Teachers
- CSF Pre-Express Course
- CS Fundamentals Main Activity Tips - Lesson Recommendations
For the Students
- Pair Programming - Student Video
- Unplugged Blockly Blocks (Grades K-1) - Manipulatives
- Think Spot Journal - Reflection Journal
Vocabulary
- Click - Press the mouse button
- Double-Click - Press the mouse button very quickly
- Drag - Click your mouse button and hold as you move the mouse pointer to a new location
- Drop - Release your mouse button to "let go" of an item that you are dragging
Support
Report a Bug
Teaching Guide
Warm Up (10 min)
Behaving in the Computer Lab
Goal: This discussion will teach students what to expect and how to behave when they enter the computer lab.
Discussion Goals:
- Use calm bodies in the lab
- Remember not to chew gum or candy
- Sanitize your hands
- Sit with your partner at one computer
- Make sure that the first "driver" can reach the mouse
- When you get frustrated, don't hit or shake the computer or monitor
- Follow the 20/20/20 - Website rule
- How to deal with the Wiggles every 20-30 minutes (requires a free login on GoNoodle)
- Ask your partner before you ask the teacher
- Keep volume down so everyone else can hear their partners
- Use your journal for keeping track of feelings and solutions
Discuss
Have a good discussion around the computer lab expectations to make sure that students understand the rules. Some topics of discussion might include:
- Is running in the computer lab okay?
- How loudly should we talk when we are in the computer lab?
- What should you do if you get stuck on a puzzle?
- If you get frustrated, will it help to hit the computer?
- When we're about to go to the computer lab, how should we get ready?
Vocabulary
- Click: Pressing the mouse button
- Double-Click: Pressing the mouse button twice very quickly.
- Drag: Click your mouse button and hold as you move the mouse pointer to another location
- Drop: Releasing your mouse button to "let go" of the item that you are dragging.
Bridging Activity - Drag and Drop (10 - 15 min)
Choose one of the following to do with your class:
Dragging and Dropping Algorithms
Print out a copy of Real-Life Algorithms: Plant a Seed - Worksheet. Cut out each of the squares representing tasks. On a projector or in front of the class practice "dragging and dropping" by pressing your finger on one of the paper squares and moving it across a table. Explain that you can "click" on this square by tapping your finger to the square, or you can "drag" the square by pressing your finger on the square and moving it. To "drop" the square, release your finger from the square.
After showing this to the class, ask for volunteers to put the algorithm in correct order by "dragging and dropping" the squares.
Previewing Online Puzzles as a Class
Project a puzzle from the online stage. Show the class how to click on the picture and place it in the correct spot by dragging and dropping. Purposely make mistakes such as clicking the background or dropping the image before it's at the right spot. Ask for help from volunteers in the class when you run into these problems.
Main Activity (20 - 30 min)
CSF Pre-Express Course
Teacher Tip
Show the students the right way to help classmates:
- Don’t sit in the classmate’s chair
- Don’t use the classmate’s keyboard
- Don’t touch the classmate’s mouse
- Make sure the classmate can describe the solution to you out loud before you walk away
Goal: This will teach students how to use Code.org to complete online puzzles.
This stage was designed to give students the opportunity to practice hand-eye coordination, clicking, and drag & drop skills. Students will also play with sequence.
The vocabulary introduced in this lesson becomes relevant during this activity. Take some time to explicitly teach how to click, double-click, drag, and drop. It might work better for you to cover these words in the classroom environment where you can lead by example -- or it might make more sense to teach the words individually as students work on their puzzles in the lab. You will need to decide what you believe is best for your class.
Place kids in pairs and have them watch the Pair Programming - Student Video video at their stations. This should help students start off in the right direction.
Teachers play a vital role in computer science education and supporting a collaborative and vibrant classroom environment. During online activities, the role of the teacher is primarily one of encouragement and support. Online lessons are meant to be student-centered, so teachers should avoid stepping in when students get stuck. Some ideas on how to do this are:
- Utilize pair programming whenever possible during the activity.
- Encourage students with questions/challenges to start by asking their partner.
- Unanswered questions can be escalated to a nearby group, who might already know the solution.
- Remind students to use the debugging process before you approach.
- Have students describe the problem that they’re seeing. What is it supposed to do? What does it do? What does that tell you?
- Remind frustrated students that frustration is a step on the path to learning, and that persistence will pay off.
- If a student is still stuck after all of this, ask leading questions to get the student to spot an error on their own.
Wrap Up (5 - 10 min)
Journaling
Goal: Help students reflect on the things they learned in this lesson
Give the students a journal prompt to help them process some of the things that they encountered during the day.
Journal Prompts:
- Can you draw a sequence for getting ready to go to the computer lab?
- Draw a computer lab "Do" and a "Don't"
- Use your journal to let me know how you felt about today's lesson plan
Extension Activities
If students complete the puzzles from this stage early, have them spend some time trying to come up with their own puzzles in their Think Spot Journal - Reflection Journal.
Standards Alignment
View full course alignment
CSTA K-12 Computer Science Standards (2017)
AP - Algorithms & Programming
- 1A-AP-11 - Decompose (break down) the steps needed to solve a problem into a precise sequence of instructions.