From App Inventor to Java: Introducing Object-oriented Programming to Middle School Students Through Experiential Learning

Conceptualiza* on (Concluding, learning from the experience) from traditional learning setting and use experiential learning strategies where students try to solve authentic problems with an inquiry approach. We wanted the students to develop problem solving and self-directed learning abilities while they also remain motivated to learn increasingly challenging topics. To incorporate experiential learning in our curriculum, each module begins from concrete experience to reflective observation, then to abstract conceptualization to active experimentation. In other words, the first stage is where the learner actively experiences an activity. The second stage is when the learner consciously reflects back on that experience. The third stage is where the learner attempts to conceptualize a theory or a model of what is observed. The fourth stage is where the learner is trying to plan how to test a model or theory or plan for a forthcoming experience. In both of our courses, for each module, we tried to follow the same learning cycle very closely by dividing each day’s instructional hour (4 hours) into 4 stages: 1) Concrete Experience: Mini Lecture and demo, 2) Reflective Observation: Demo practice individually by students, 3) Abstract Conceptualization: Team discussion, and 4) Active Experimentation: Team work to complete a module of the project [see Fig 1]. 3.2 Learning Objectives In our curriculum, through the 2 block courses, we wanted the students to learn the foundational concepts of object-oriented programming language, in this case Java. Even though AI2 is introduced first, we wanted students to internalize various structures of programming so later it is easier for them to transition to Java. The major learning objectives of our curriculum are: 1) Understand fundamentals of programming such as input/output, variables, data types, operators, expressions, conditional (branching), iterative execution, methods, etc. 2) Understand OOP fundamentals in Java, e.g. defining classes, using methods and libraries, etc. 3) Write a computer program to solve specific problems. Some concepts in AI2 like event driven programming and concurrent execution require a lot of background in terms of OOP and threading. We believe that these topics are too advanced for middle school students and hence we do not cover them in our curriculum. Additionally, due to inherent complexity, we decided not to cover polymorphism or inheritance, with the hope that students will get exposed to those critical concepts in high school. 4. BLOCK 1: App Inventor Curriculum Here we describe various modules of App Inventor curriculum. We divided the students in selforganizing teams (3-4 people) where each team had to develop the same mobile application through teamwork. The application closely mimics a student record management system, which would ask a user to enter each student’s name, grade, DOB and gender and through the textbox component of AI2. Finally, the collected data will be used to display the names of all students, their grade and age, as of current date and their gender. The application will also maintain a List of students, which can be utilized to select and view particular student’s information. To accelerate the implementation of this application, we created a design diagram beforehand. The design of the application was broken into 7 parts where each part’s required concepts would align with 1 module of the course. The developed application’s screenshot is shown in Figure 2. 4.1 Variables and Data Types Module Our first module focused on delivering the concept of data types or variables in AI2. We presented the concept of variable creation and use of variables. Variables for the three AI2 data types: text (or string), number, and Boolean was also explained. Several variables were created, renamed, and given initial values through a demo application in AI2. A more detailed explanation of Boolean operators and Boolean variables were also presented. The comparison operator blocks for both textual and numerical data were demonstrated. To incorporate experiential learning, here is how we designed the first module, which is followed in all modules of both courses. Figure 2. Screenshot of the mobile application developed in AI2 Concrete Experience: We first delivered a mini lecture on how variables store data and what is their purpose, which took approximately 15 min. It was followed by a demo of a widely used app named “Hello Purr” [18] having a button object and then programmed the button so when it is clicked a "meow" sound would play. Variable update was demonstrated with a label with a text on top it, displaying how many times the button was clicked. This demo took additional 15 min. Reflective Observation: The students were then asked to repeat the steps of the Hello Purr app individually during next 30 min. Abstract Conceptualization: This was followed by a 30 min team discussion on how many and what types of variables are needed to complete their project. Without advanced programming concepts (like loops or lists), students quickly realized that they would need fairly large number of variables since there were 30 students. Instructors helped each team during this time so they could form a collective correct solution.Conceptualization: This was followed by a 30 min team discussion on how many and what types of variables are needed to complete their project. Without advanced programming concepts (like loops or lists), students quickly realized that they would need fairly large number of variables since there were 30 students. Instructors helped each team during this time so they could form a collective correct solution. Active Experimentation: The next 2 hours were dedicated to develop their solution in AI2 in teams. This allowed them to complete a small part of the project using variables to store student data (all hard coded in AI2). Students were encouraged to switch the role of driver and navigators [16] every 30 min. 4.2 I/O and Operators Module The easiest way to introduce the notion of I/O in AI2 is through the use of textbox. The concept of this component was presented to the participants as the primary method of collecting numeric or textual information from the user. First 30 min of this module was spent on explaining what I/O is from the perspective of a program and demonstrating a textbox’s two events, GotFocus and LostFocus. The following 30 min was spent on demonstrating step-by-step instructions how to use a textbox in AI2. This sample app asks the user about what course they took last semester and the corresponding grade, which needed to be entered through the textbox. The program would then concatenate that information into a single sentence that stated their course name and grade using two labels to display the information. Students spent the next 30 min repeating the instructions for the sample program individually. The following 30 min was spent on team discussion to form a collective solution on what type of I/O functionality is required for their project and how they can program those. The rest of the in-class time was spent on project development within teams. Each team worked on asking the user to enter student information through textbox and using labels to display them. This allowed another feature of the project to be completed. 4.3 Conditionals Module This module focused on introducing the notion of conditionals and branches in programs. The structure of both the if/then-do and the if/then-do/else-do blocks, provided by the AI2 were explained. We also explained the role of Boolean variables used in the decision-making processes of a program. All these were explained in the first 30 min, which was followed by a demonstration of a sample program implementing decisions in AI2. The sample program simply sets different number (text) on a label based on a global variable value. We changed the global variable value to demonstrate how different if-branches are getting executed, which results in a different number displayed on the label. Like in our previous modules, the students first repeated the steps of this sample program, which was followed by a team discussion. Students spent the final 2.5 hours implementing the decision part of their project, where we asked them to display “Male” or “Female” on labels based on the gender variable, either M or F, respectively. 4.4 Repetitions Module This module focused on iterations or loops in AI2. Three type of looping control blocks were explained using the built-in Control Blocks of AI2. The structure and the parameters used with the for range loop, while do loop, and “infinite while loop” were presented and explained. The for range loop block’s start, end, and step parameters were explained. This was followed by the reflective observation stage with a demonstration of a simple application utilizing the concepts of loops. Due to time limitation, in this class, students were asked to repeat the steps after the instructor during the application demonstration. The demo app simply allowed the students to practice 3 types of loops where one ball (red color) bounced continuously till the user hits a key, another ball (blue color) bounces for a specific number of times entered by the user and the last ball (green color) would keep bouncing forever. During abstract conceptualization stage, each team discussed how they could utilize repetition in their project to use the same textboxes to take input of multiple students’ information . Majority of the team struggled during this phase that was expected and the instructor tried to help them in constructing their solution, which required little over 2.5 hours, in teams, for them to develop. Some teams needed help during this phase to debug unexpected repetition behaviors encountered due to inaccurate logics and bugs. 4.5 Procedures Module The goal of this module was to teach students about procedures in AI2 and their functionality. We e