Course design and teaching practice in STEAM education at distance via an interactive e-learning platform


Purpose
The purpose of this paper is to provide some references for teachers who use KidsProgram or other graphic programming tools platform for STEAM (science, technology, engineering, arts and mathematics) education at distance by game-based teaching. From the design of the STEAM class, teachers can know how to stimulate students’ interest in programming and cultivating their ability to innovate and solve practical problems more clearly with KidsProgram.


Design/methodology/approach
This paper will explain the teaching design from ten aspects and implement it in real class to see the result. The ten aspects are situations creation, knowledge popularization, raising problems, analyzing problems, concepts introduction, interface design, logic design, self-evaluation and mutual evaluation, teacher comments and extension and innovation. With the KidsProgram platform, this paper takes “The Missile Convey,” a sub-course of “Discovery Universe” as an example. Through the situation created by the teacher, students brainstorm the dangers that the earth may encounter in the universe and then learn relevant scientific knowledge. Next, students raise and analyze problems according to the situation under the guidance of the teacher. Through the interaction with teachers, students review the programming concepts and the usage of corresponding coding blocks needed for the project, like “random number.” They need to carry out interface design and logic design for the project, and complete the project. After that, the students use the self-evaluation form and the mutual evaluation form to modify and then show and share the projects to the in front of the class. After self-evaluation and peer evaluation, the teacher will make a final summary evaluation and make some suggestions for improvement. From the students’ programming productions and the interviews with them, the teaching result can be known.


Findings
With elaborate teaching design and appropriate teaching strategies, students can flexibly use multi-disciplinary knowledge of science, technology, engineering, art and mathematics to solve problems in the process of creation, which is conducive to the cultivation and improvement of students’ comprehensive quality on KidsProgram classroom, under the guidance of STEAM education. In other words, in this class, students need to use engineering thinking to plan the whole project based on the understanding of scientific principles, design interfaces with artistic ideas, use mathematical knowledge for logical operations, and gradually solve technical problems with the above knowledge or methods in a comprehensive way.


Originality/value
The KidsProgram is a leading graphical programming tool platform in China in recent years. It deeply reconstructs the concept of Scratch designed by MIT. Graphic programming, a method of programming by dragging and dropping blocks containing natural languages, is different from traditional code programming. In this paper, the visualized cases in the class will be demonstrated in the “interface design” and “logic design.” This paper designs a course in STEAM education at distance via KidsProgram, hoping to provide some reference for other research on teaching of graphical programming tools.



Introduction
In the face of the new challenges of the information age, the education reform of "21st Century Skills" should also be applied. It is more and more urgent for students to master programming ability and improve information literacy. KidsProgram is one of the few programming platforms in China that are independently developed for children's programming. The platform deeply reconstructs MIT Scratch, expands and perfects the number and classification of programming blocks, and creatively solves the problem of image material upload distortion. It has the ability of in-depth development beyond other similar programming tools, so as to fully meet students' requirements for visual effects. The right choice of the teaching platform is only the beginning. How to carry out specific and effective teaching in programming class is still a problem worth exploring. STEAM is short for science, technology, engineering, arts and mathematics, which integrates different subjects in an interdisciplinary way. According to Wang and Wu (2016), STEAM education has many advantages in transforming teaching concepts and models based on new technologies, and plays an important role in improving the level of science and technology and guaranteeing the national strategic development. Distance education has a long history, but its popularity and use has grown exponentially as more advanced technology has become available. By 2008, online learning programs were available in the USA in 44 states at the K-12 level (Olszewski-Kubilius and Corwith, 2011). Internet forums, online discussion group and online learning community can contribute to an efficacious distance education experience. Research shows that socialization plays an important role in some forms of distance education (Sazmandasfaranjan et al., 2013). Distance education can reduce transportation costs and provide more flexible learning methods for students who are more interested in programming and have no opportunities. "Internet +" technology is bringing about changes in educational concepts and models, learning behaviors, cognitive styles and learning models. The full integration of technology and education requires top-level design at the level of curriculum, resources, teaching and learning and evaluation. STEAM education is a core link to change the organizational form of education, cultivate innovative talents and seize the high ground of talents, which requires the participation and cooperation of the whole society implanting STEAM education in the programming class of primary school at distance, which is of great significance for elementary students to understand the world in an integrated way, can improve their problem-solving ability to transform the world with interdisciplinary knowledge.

STEAM education
In 2007, the USA proposed STEM education as a national development strategy to address future social challenges. STEM education is also the predecessor of STEAM education philosophy. In 2010, Yakman (2008), an American scholar, proposed the framework of STEAM education concept, emphasizing the integration of artistic and humanistic elements into the basic elements of interdisciplinary learning, that is, the integration of science and technology based on mathematics with engineering and arts. STEM focuses on convergent thinking, while STEAM tends to divergent thinking with the addition of arts. The integration of Arts is conducive to promoting students' understanding of knowledge, which cultivates students to think creatively and critically. At the same time, students can also cultivate critical thinking in the process of communicating and sharing creative ideas with peers through humanities and arts. However, at present, arts and science are still regarded by many people as two completely different fields. Neither teachers nor students have yet adapted to the integration of arts and science. It will take some time to fully achieve the great leap from STEM to STEAM. According to Zheng (2017), because of the development of the times and the progress of science and technology, STEAM education has attracted the attention of all countries around the world and become an educational idea and measure to explore talent cultivation in the twenty-first century.

123
Course design and teaching practice in STEAM education In many developed countries, the commonly used teaching modes for STEAM education are "Project-based Learning," "Design-based Learning," "5E Learning Circle" oriented by scientific inquiry and "Blended Learning" formed by the cross integration of various modes. Regardless of the model, the STEAM education concept classroom has six common elements: real situation, key problems, design plans, implementation plans, improvement plans and product communication and presentation. Domestic research on the concept of STEAM education started late, and a localized teaching model has not yet been formed.
In recent years, many Chinese scholars (e.g. Zheng, 2016;Zhou et al., 2017;Chen and Wang, 2019) have been exploring ways to integrate STEAM education with different disciplines. Exploratory courses related to information technology courses and creative courses of science and technology, such as Scratch graphical programming, open source hardware, 3D printing, APP Inventor, woodwork and paper circuit, etc. are particularly prominent in the development of STEAM education. In terms of education policy, curriculum development and teaching evaluation, the development of STEAM education in the USA provides many references for China. However, due to different national conditions, it is not only expensive to make use of the existing course resources of STEAM education in the USA for secondary development, but also difficult to link up the knowledge system of course content. At present, the development of STEAM related courses and specific classroom teaching in China cannot directly apply the experience of the USA, and are still in the process of continuous exploration. Ren et al. (2016) point out that with the continuous integration of the real world and the virtual world, the use of digital tools such as computers to expand human thinking and assist humans in dealing with problems and affairs has become a way of life. In response to the challenges of the twenty-first century, the USA puts forward a new idea of "21st Century Skills" education reform, and proposes to combine "21st Century Skills" with the K-12 education system to provide a new research paradigm for the cultivation of basic education talents. "21st Century Skills" are classified into the following categories: information and communication skills, analytical and problem-solving skills, life and career skills (Zhang, 2012). These skills are considered to be the basic conditions for education reform in the twenty-first century. The programming abilities mainly include basic abilities and high-level abilities. Basic abilities include observation, comparison, analysis, judgment, ability to process information, practical ability, cooperation consciousness, creative thinking, etc. High-level abilities mainly include algorithm programming ability, program modularization ability, programming problem mathematical modeling ability and debugging ability. In this era of artificial intelligence and the Internet of Everything, 71 percent of all new STEAM jobs are computer related. Programming ability has become an important ability to adapt to future work and life, and children's programming has developed at home and abroad.

KidsProgram
In children's programming education, graphical programming tools are the most basic requirement. Such tools are based on primary students' age characteristics and cognitive patterns. Because their logical thinking ability is constantly developing and relatively immature, it is difficult to use adult programming language, especially for domestic children, who are restricted by multiple factors such as English, mathematics, natural language and logical thinking. Graphical programming tools can skillfully circumvent these difficulties and achieve visual interaction (Youngquist and Pataray-Ching, 2004). At the same time, an important attribute of children's programming is to stimulate children's interest in learning. Therefore, an interesting and practical programming platform is very necessary. Scratch, the originator of graphical programming, has many disadvantages, such as small number of programming blocks, slow updating and unclear uploaded project pictures, etc., which are not as effective as expected in the actual use of domestic programming classes. Many Chinese children's programming education institutions independently or jointly develop programming platforms suitable for the Chinese market according to their needs.
There are not many domestic graphic programming platforms with independent in-depth research and development, most of which directly use or sinicize Scratch to teach. Compared with Codemao, a well-known graphic programming platform in China, although KidsProgram is weak in the development of hardware blocks for the time being, the type and quantity of basic blocks are better than the former. In other words, the KidsProgram has great development potential in the primary stage of learning programming for students, that is, cultivating logical thinking, understanding "Computer Science" and stimulating their interest in programming.
The programming tool of KidsProgram supports the basic concept of software development, such as assignment, sequence, cycle, judgment, events, functions, and data structures and generic programming concepts, including "object-oriented programming" and "remote calls". The latter is why it is different from other similar programming tool, which can ensure the comprehensiveness and practicability of the programming knowledge learning and lay a solid knowledge foundation for more in-depth programming learning in the future. In addition, the programming tool of KidsProgram provides nearly 400 "programming blocks" with different coverage, which has the in-depth development ability beyond other similar programming tools. Moreover, in the terms of the software project used by the picture material, KidsProgram do not do any compression processing, the use of picture material will not exist deformation or distortion. Finally, the tool supports running project works on mobile devices, which can be shared and distributed through WeChat Moments.
The platform not only serves as a programming tool, but also has interactive electronic courses and exercises as auxiliary support. More importantly, the platform provides a space for teachers to issue projects and students to upload projects. Therefore, it provides support for teachers to adjust teaching flexibly, record students' learning as a whole and improve evaluation methods.
4. Game-based learning for programming ability According to Shang et al. (2008), Associate Professor at Peking University, "there are two kinds of understanding of gamification. One is to learn by playing games, and the other is to design the ideas in your mind into games and carry out learning activities in the process." The "learning factors" in the game, such as the situation, problem solving, competition, level, challenge and the interaction between players and the situation, play an important role in the thinking, cognition and enthusiasm of the game participants (Tao, 2006). NMC Horizon Report 2016 K-12 Edition lists "games and gamification" as a learning technology that will be widely used in the coming year. In short, game-based learning is a practical form of game mechanism in the field of education (Bao and Zhao, 2015). In the graphic programming teaching platform such as KidsProgram, we can not only let students master some programming knowledge through games, but also let students design their own game to apply programming knowledge and improve other related abilities.
The development of children's programming skills should be integrated into specific game-based learning to achieve results. Programming learning is boring, so children tend to lose interest in learning in the process of learning, and the cultivation of programming ability is out of the question. Based on an in-depth analysis of primary students' learning characteristics and cognitive ability, the author chooses game-based learning as a way to support situational learning. Game-based learning, as a way for student to learn, not only enhances students' enthusiasm for learning, but also develops their ability to solve problems. In the game-based learning class, it is no longer centered on teachers' teaching, but on learners' self-discovery and self-experience. There are two forms of gamification learning, one is to learn from playing games; the other is to design games to turn their 125 Course design and teaching practice in STEAM education creative ideas into games (Shang, 2015). In this paper, the students' design game is used to carry out on the t KidsProgram classroom teaching under the guidance of STEAM education. Based on the support of KidsProgram editor, the classroom design includes student inquiry learning and teacher-assisted guidance. First, the teacher determines the learning theme and selects a game suitable for the student to perform game-based programming. In this process, the teacher needs to analyze the learners, set the learning goals and mobilize the students' interest in learning; then, the teacher proposes the game tasks and sets related questions. At the same time, students are constantly observing the questions, forming the prototype of the questions to be explored in their mind, clarifying the questions under the guidance of teaching and gradually forming their own ideas. Besides, in the introduction of the problem, students mainly conceive and design the scene, role and task of the game. Driven by tasks and curiosity, they actively conduct independent and cooperative research to form the steps and methods to solve problems. In the process of writing the game, students need to design, make and debug the game. During the demonstration, students should correct and optimize their own achievements according to other students' opinions or suggestions. In the key part of designing a game, teachers should provide auxiliary support to students in the activity. When it is difficult for students to understand a certain knowledge point in the process of inquiry, teachers need to make appropriate adjustments to the problem. In addition, in the process of designing games, teachers should track and evaluate students' learning. Finally, the students will summarize and reflect on the design of this game activity. In exploratory learning activities, due to differences in student abilities, some children may successfully complete the process, while others need to make feedback revisions, find problems and actively seek solutions to problems. Teachers should also summarize and reflect, comprehensively evaluate the performance of learners in learning activities, summarize knowledge points and actively guide students to find innovative solutions. In the whole learning process, through the analysis, design, implementation, optimization and sharing of the game, the students can spiral loop iteration, deepen the understanding of programming thinking and constantly improve their programming ability.
5. The general process of KidsProgram course design under the guidance of STEAM education at distance Through the exploration of the foreign STEAM classroom teaching mode, the six classroom elements are concise, they are real situation, key problems, design plans, implementation plans, improvement plans and product communication and presentation. Based on this, the author combines the characteristics of the graphical programming class to expand the KidsProgram teaching course for STEAM education into ten linkssituations creation, knowledge popularization, raising problems, analyzing problems, concepts introduction, interface design, logic design, self-evaluation and mutual evaluation, teacher comments and extension and innovation (as shown in Figure 1).

Real situation
STEAM classrooms emphasize real-world problem solving. The real situation should start from the students' experience background, stimulate the students' interest and motivation in learning and give the students an environment to apply multi-disciplinary knowledge comprehensively. Animation and games designed with block programming in the KidsProgram help stimulate students' curiosity and challenge. The teacher should create the situation to enable the students to fully mobilize the existing experience and knowledge, on this basis to supplement the background knowledge related to the subject, at this time can be integrated into scientific knowledge or principles.

Key problems
The class for STEAM education needs a key problem. Therefore, teachers should put forward a problem in the existing situation and guide students to analyze the problems, and divide the big problems into small problems. This key problem needs to stimulate students' interest in learning and provide them with research directions. In order to achieve the expected effect, the programming concept and the usage of programming block should be introduced by the teacher in time to provide further support for the problem solving.

Design, implement and improve plans
STEAM education-oriented classes point to the solution of real and critical problems, which inevitably require design, implementation and improvement. Students will continuously conduct interface design and logical design during the iterative improvement process of designing, implementing and improving programs by means of KidsProgram. In the interface design, students need to use language arts to prepare materials and layout. Next, in logic design, students need to use engineering thinking and mathematical knowledge to drag blocks for programming.

Product communication and presentation
The KidsProgram class for STEAM education ultimately produces a result or product for problem solving, usually a runnable project programmed with programming blocks. After the design and development is completed, it can be shared by communication and presentation. At this stage, teachers should encourage students to actively express themselves by introducing their own products, through which to improve their language expression and communication skills and other social humanistic and artistic qualities. Based on self-evaluation, mutual evaluation and teachers' comments, each group can expand and innovate in the basic projects.

A teaching practice of KidsProgram course design under the guidance of STEAM education at distance
In the STEAM education-oriented KidsProgram classroom teaching, teachers should try not to inculcate a large number of abstract concepts but to guide students to actively explore the true

Kids Program
Interdisciplinary literacy of STEAM education Course design and teaching practice in STEAM education knowledge, analyze problems from multiple disciplinary perspectives and solve problems creatively. This paper takes the teaching design of "The Missile Convey," a sub-course of "Discovery Universe" in the KidsProgram platform, as an example to analyze the classroom teaching process of "KidsProgram" for STEAM education. The author adopts the teaching mode of "teacher-led, student-centered," closely connects the classroom with the reality of life, enables students to apply what they have learned and experience the fun of being a creator.

Situation creation
The teacher uses video to bring students into the situation that "the earth may encounter danger in the universe" by taking the popular movie "stray earth" as the entry point. After arousing the students' intense discussion, the teacher asks the students to answer, laying the foundation for the next step to supplement the corresponding knowledge. Of course, teachers need to consider the answers that students may come up with before class so as to be fully prepared for teaching:

Knowledge popularization
After the situation creation, the teacher will popularize and explain the relevant scientific knowledge with the micro-lectures. First of all, the concept of black hole, the proposer and the shooting principle of it are briefly introduced by referring to the latest public photo of black hole taken by human beings. Students learn about the invasion of alien creatures in the universe mainly through science fiction cartoons or movies. Therefore, in this section the teacher can ask two or three students to describe the species that may invade us and the corresponding measures to develop students' imagination and expression ability. In the third part, the teacher can let students to first watch the story of Wernher von Braun, who is good at making rockets to feel the scientific literacy and quality of scientists, and then introduce the meteorites and missiles that can shoot down meteorites and the differences between missiles and rockets in detail.

Raising problems
After introducing the relevant knowledge, with the help of PPT, the teacher concluded that the problem that is most likely to pose a threat to the earth is the problem of falling meteorites. At the same time, the design of a programming game related to the small project is more likely to stimulate the learning enthusiasm of the third-grade students. Based on this, the teacher proposes that the students make a "The Missile Convey" game, which can be shared with friends and relatives after completion, so as to improve their awareness of protecting the earth.

Analyzing problems
Under the guidance of the teacher, students will analyze the problem and turn the key problem of making the game of "The Missile Convey" into an achievable programming goalusing the keyboard to control the spaceship to avoid the meteorites attack, and using the mouse to shoot down the meteorites. It can be divided into several sub-problems: How do meteorites appear? How does spaceship appear? How does the spaceship move to avoid the meteorite? How to launch missiles to protect the spaceship?

Concepts introduction
In addition to the concept of "random numbers," the game project involves other programming knowledge and building blocks that have been learned in previous courses. Therefore, the teacher inspired the students to think about the main programming concepts needed for the project -"mouse event", "or" concept, getting "attributes", "event" and "stop all" concept. Then, the teacher proposed to implement the block scripts and introduced the new concept "random number" needed in this project (as shown in Figure 2): Interactive Record 2: Teacher: Boys and girls, after setting the goal, let's think about what programming concepts are needed to guide the completion of this game, ok? For example, we need to use the keyboard to control the spaceship, so the "keyboard event" listening and response are need. Can you give me more concepts?
Student: The mouse is used to send missiles, so there should be a "mouse event".
Teacher: Good! I'll give you a smiley face sticker, and let the students behind you to continue.

Interface design
After reviewing and introducing relevant concepts, the teacher guides the students to carry out interface design. Most of the students choose the right background from the stage background library. Students who are not satisfied with the background library can use the browser to find the favorite picture and save and upload it as the background or draw the background picture by themselves. Regardless of which method is chosen, the teacher should remind the student that the material selected should be consistent with the theme of the game project. After the background selection, the main characters (spacecraft, meteorites, etc.) in the stage are similar, but their initial specific position and their movement trajectory need further consideration by the students (as shown in Figure 3). In this part, students should encourage students to freely exert their imagination and create their own style. In the process, students can get the training of technical literacy and artistic literacy.
With this block script, the alien can appear anywhere on the "stage" Figure 2. Introduction of "random number"

129
Course design and teaching practice in STEAM education 6.7 Logic design After the students have discussed the plan, the teacher guides them to draw the process diagram of each role to achieve the corresponding effect by using the canvas function of the KidsProgram Editor, which builds the clear thinking for the next script and makes the overall plan more operable. Take the flowchart of meteorites as an example (as shown in Figure 4). Students can specify the effect that can be achieved by designing the flowchart, which is also convenient to add and modify the effect later. Next, according to the flowchart drawn by students, the code splicing of random movement and missile disappearance should be completed. This process requires students to review relevant concepts taught by teachers and make full use of mathematical knowledge such as holistic engineering thinking and coordinate system to solve problems. When encountering a problem, students are allowed to discuss and learn from classmates online. The whole logical design stage is mainly to cultivate students' engineering and mathematical literacy. Script blocks that can make meteorites randomly appear are shown in Figure 5.
6.8 Self-evaluation and mutual evaluation After completing the project design, the teacher will distribute the self-evaluation scale to the students for self-evaluation. Students should write the name of person who is evaluated at the beginning of the form and sign their own names as score keepers at the bottom right. At the same time, students should upload their projects and a video to demonstrate them. The self-assessment form and the mutual assessment form will be collected as part of the student's usual grade. The self-evaluation form will guide students to make self-evaluation from the five dimensions of "Mastering Relevant Knowledge," "Exquisite Picture Layout," "Smooth Program Operation," "Adding Extra Effect" and "Helping Others" (as shown in Table I). The dimensions of the mutual evaluation table delete "Mastering Relevant Knowledge" and "Helping Others" in the self-evaluation stage, because these two dimensions are acquired before and during the creation process of the work and cannot be shown through the work presentation. In addition, the mutual evaluation table also adds a clear dimension of language expression to strengthen students' emphasis on language expression. The mutual evaluation table is given in Table II.

131
Course design and teaching practice in STEAM education 6.9 Teacher comments After watching the students' works, the teacher found that some students had the effect deviation in meteorite due to the misunderstanding. Although the flight speed of different students' missile is different, but all students can use the keyboard to move the spaceship and use the mouse to launch the missile. Teachers should try their best to make the evaluation systematic and objective, so that students can feel happy for their achievements and have the motivation to continue to improve the shortcomings so as to make the product iterate.

Extension and innovation
The students with the effect deviation continue to improve under the guidance of the teacher. The students who have completed the task well can continue to improve the new effects on the basis of this, such as adding an explosion effect to the "missile," so that when the missile flies to the target position it will explode. Besides, they can also add more meteorites to improve the difficulty of the game. To add text reminds such as "Success" and "Failure" is also a good idea. Students can improve their work after class and upload it to the KidsProgram. After that, the teacher can communicate with the students in a distance after class.

Conclusion
According to the projects and videos uploaded by students, most of them have mastered the effects of "floating meteorites," "flying spaceships" and "escorting missiles" by acquiring properties of other "sprites," controlling behaviors of "sprites" with the keyboard, with the usage of "or" logic, random numbers, "stopping" and other related programming concepts. However, there are still some small problems in setting the trajectory of the meteorite. At this time, the help of the classmates and the timely guidance of the teacher play an important role. According to the interviews with students in and after class, students can actively discuss design with the classmates online, learn from each other and share their games with others after class. There are big differences in understanding level and practical ability between different students. Teachers need to constantly inspect students' situation in online discussion when students carry out interface design and logic design. The whole class is student oriented, with the teacher playing the role of a guider, source provider and server in distance, so that students can experience the complete process of problem solving and stimulate their innovation ability in the process of "doing." With elaborate game-based teaching design and appropriate teaching strategies, students can flexibly use multi-disciplinary knowledge of science, technology, engineering, arts and mathematics to solve problems in the process of creation, which is conducive to the cultivation and improvement of students' comprehensive quality on KidsProgram classroom, under the guidance of STEAM education. At present, with the emphasis on programming capabilities in China, many primary and secondary school creative programming contests are in full swing. This paper designs a course in STEAM education at distance via KidsProgram, hoping to provide some reference for other research on teaching of graphical programming tools.