Category Archives: JavaScript

The Importance of Teaching Media Creation Skills

There is an abiding myth that kids today are born digital natives. Anyone who has ever taught ICTs in any form will know that this is simply not the case. Digital skills very much have to be taught! Kay and Goldberg have described computers as a metamedium, a medium, in other words used in the creation of other media. As such it would seem axiomatic that computing should be taught to everyone. And yet this is far from the case. All over the world computing has to fight for a space in the curriculum. No doubt much of this contention stems from the expense of acquiring computing resources, and from securing adequately trained teachers. The great onlining of education has shown us the importance of computers as a medium of communication, but as a medium of creativity it can scarcely be less important. I have taught PhotoShop, Flash and Dreamweaver for many years, often in the context of web design, or game creation. I find that it is an excellent way to segue into coding for middle school students. Computers can be used to create all manner of digital content, but games are particularly alluring for students.

In this blog post I would like to walk through my thoughts about how the nature of remote teaching will have to change my curriculum and instructional design. I would like to cover the same basic concepts: namely photo-editing and game design introducing elementary programming procedures.

Starting with image manipulation in PhotoShop one can teach not only photo-editing skills, but also copyright issues. I usually teach students to use the Creative Commons Search Engine to find suitable images to use that are copyright free. There are many plarforms available for games creation. Up until last year I used Flash, despite the increasing difficulties as the platform becomes less and less supported. I have been considering using Scratch instead, but the seamless integration inside websites and the ability to run in a browser still made Flash a viable choice. My school had an Adobe licence, so justifying that expense was also a concern. I usually teach students how to create buttons in flash and use interactive behaviours. This requires starting to use ActionScript. We use existing scripts and learn how to tweak them. After a few tutorials I get the students to design their own games and then help them get it to work. The graphic shows one of the games created by students which depended upon drag and drop behaviours to work.

So, here’s my problem. I am due to start teaching this unit in May with my grade 8 class, and yet we are likely to be on lockdown, and I am wondering if it is a unit of work I can teach remotely. Certainly not with PhotoShop and Flash, as students are unlikely to have the Adobe Suite. But apart from the problem around access to the software and the necessary data or devices – most of my students use iPads if they do not have a laptop. This presents a number of problems. Firstly, I will be really sad not to have the linkage between image editing and games creation. Realizing that everything about remote teaching and learning takes longer, I will have to concentrate on the game design alone. For remote teaching an online Photo editor such as Photopea appears to work well. The crucial skill is removing a background and saving as a gif with transparency. I am not sure that I will be able to adequately support students through photo-editing online, and the games design, however. So I will have to play this aspect by ear.

In my experience getting students to the point where they can design their own games requires a good few basic tutorials teaching base skills, and then a great deal of scaffolding the process of discovery, especially where it requires coding beyond my own capacity! Tackling this online presents problems. It is difficult to help students debug their code when you can’t see their screen, or where you have to reconstruct it to test it on your own screen! It also needs to be something that can be done on an iPad if a student does not have access to a laptop or pc. It should also not involve any downloading of software or purchase of an app.

So I have decided to use Scratch on the MIT platform which works inside a browser, and apparently works fairly well on an iPad and allows students to use a free account. Students can also share their projects with others. This is crucial because I would like students to work in small groups. I usually get students to do a few tutorials online and then set the project as a group project. Working with groups might prove tricky during remote teaching and learning, but might also help overcome some of the isolation of working from home.

To test the versatility of the platform I created a quick pong game and a tamigotchi game, and it seems to me that Scratch works very well at enabling game creation. The platform also has tutorials which allow for students to work on their own, and develop capacity beyond any tutorials and tasks I create for the class. It also has an extension for the BBC micro:bit controller, which I use for robotics. I have not been able to explore this, but it seems to me that it creates some potential tie-ins, which is important. I also use the MIT platform for mobile app design with my grade 9s, so using Scratch on the MIT platform to introduce coding seems a good fit all round.

To my mind the key to instructional design in a case like this is to have a programme in mind which can be cut short, or can be extended, depending upon the time available and the capacity of the students. In this case the vagaries of remote teaching becomes a particular concern. I will write a follow up post after completing the unit.


A. Kay and A. Goldberg, “Personal dynamic media,” Computer, 1977, pp. 31-41.


Learn to Code Online – Making Waves with Code Combat

I do not usually review any platforms or tools which come with a cost, but Code Combat offers a free Introductory Unit which can be used as a stand-alone unit of work so I will set my scruples aside! My school has purchased a Code Combat license which includes 11 Units of work in either Python or JavaScript with some web development units using HTML and CSS. The platform has students create games by typing in code, and progressing from one level to another once they have completed a previous level. Each unit varies in length from about an hour to complete to several hours of work. The units introduce basic programming concepts such as For loops, While loops, nested loops and so on. Concepts are introduced incrementally and learning can be very rapid. I use it for my grade 8 & 9 Computer Skills classes. A solid diet of Code Combat is not a very good idea, so I intersperse it through the year with applications and information literacy assignments.

The platform is generally excellent, but there are a few issues which need to be taken into account when implementing it as a coding platform. You will note that I am not considering the wider question of whether to offer coding to all students. To my mind it is crucial that all students get some exposure to coding, not necessarily because everyone will be coding in their jobs, but because I believe everyone needs an understanding of how coding works, and because I think it helps develop problem solving skills generally! The command line interface, rather than the more usual drag and drop “Scratch” style interface helps develop skills of accuracy and precision.

The issue that I want to address is how the platform can be used pedagogically, because I believe it cannot simply be used on its own. The teacher cannot simply point students in the direction of the platform and walk away! I want to draw on Semantic Wave theory, which I have discussed in a YouTube video, to demonstrate what I mean. To recap, teaching and learning is crucially about the deconstruction and reconstruction of meaning (semantics). Teachers help students to unpack ideas, helping them understand complex or abstract ideas using metaphors, examples and everyday language so that they can understand it in their own terms. Teachers then help students to take these raw, more experiential, concrete or simple ideas and reformulate them in more academic understandings. An example would be when a teacher models the unpacking of a work of literature, exploring the themes and imagery of a Shakespearean play and  then scaffolding a student’s writing so that they can take incidents from the play and tease out the thematic concerns in a coherent literary essay. Knowledge is deconstructed and reconstructed.

This movement between abstract and complex and concrete and simple, and hopefully back again is described in the research literature as a semantic wave. Research into good practice in the classroom suggests that good teaching and learning requires a full range between abstract and concrete, complex and simple, and repeated waves over time. My own research interest lies in looking at what affordances technology may offer for meaning making practices in the classroom.

I have recently done an analysis of the lowering or strengthening of semantic gravity and density in one of the Code Combat units which taught web design skills (HTML and CSS). What emerged was a pattern not too unfamiliar in the classroom with traditional face-to-face instruction. The software was very good at explaining concepts, introducing an idea, such as a mark-up tag, and giving concrete examples so that students could understand what an HTML tag looks like, and what it does. Across the thirteen levels of the unit there were repeated movements between abstract and concrete as the software unpacked each of the concepts involved. Very little opportunity was given for students to explore the examples and try to reconstruct knowledge by, for example, creating novel tags. Only in the final two lessons was there any emphasis on encouraging students to build knowledge themselves.

This type of semantic wave, a movement from abstract (weak semantic gravity) to concrete (strong semantic gravity) is very common in the classroom. It is termed a “down escalator”. Down escalators are essential, and problematic only if they form the major part of the diet and are seldom accompanied by any upward movement of the wave. In other words most of the class is simply explanation, with very little opportunity for students to explore their own understandings and construct knowledge in their own voice.

This happens more often than we would like to admit in classrooms, but with digital platforms it is even more common. In fact this unit of work offers quite a decent nod at constructivist pedagogies with a fairly open ended final set of units in which the student is invited to use the knowledge they have gained to create their own web pages. When students construct knowledge, sound educational practice is to carefully scaffold this to help students draw valid conclusions. Experienced teachers are skilled at doing this, but educational software is not. Perhaps developments in Artificial Intelligence will render it more effective, but currently machines do not respond to what students are doing with much insight or facility. This makes the Instructional Design absolutely vital. If all the software does is help explain concepts to students, but never give them an opportunity to use that knowledge to reconstruct it in their own understandings and voice, that knowledge will never be internalized. Machines are ill-suited to this task. In this Code Combat unit of work the Instructional design does in fact give some opportunity to take knowledge of one tag, for example, and try it with another, or see what happens when the properties of tags are changed. There are in fact partial upward movements of the wave. part of the reason I chose Code Combat as a platform was that it does a reasonable job of explaining and giving an opportunity to practice skills, but it is clearly not enough.

In order to provide more scaffolding I had two choices. the first was to ensure that I was able to jump from student to student as they worked on the units, helping mediate the content to ensure greater opportunities for exploration. This might be practical on an individual basis, but almost impossible with a class of thirty as I had. I was also reluctant to become the expert, solving everyone’s problems. That way nobody except myself would learn anything! Debugging student code is also very time consuming, and in a class of thirty would give me, say one minute with each student, always assuming I could help spot any problems in that time!

The second option was to encourage students to work in pairs and provide peer and teacher mentoring. The aim of this was to ensure that students always had someone else present with whom to discuss what they were learning, help overcome problems when students got stuck, to try out ideas and compare code – “why does yours work and mine doesn’t?” This provides students with opportunities to explain to others why their code seems to work, and what their thinking was, and helps, I believe, build a better understanding over time. It also helps students to express their ideas about what they are doing and weakens the semantic gravity by getting them to abstract their thoughts out. Indeed when I do help a student what I try to do is ask them what they are trying to do rather than trying to fix the issue myself.

Peer mentoring and collaboration is a powerful way to bridge the gap between the instructional power of e-learning software, and its somewhat less potent ability to foster constructivist learning practice.





Hack Your Life!

tdLearning to Code is all the rage right now, but how to implement a coding for all programme is not as easy as it sounds. There are a number of decisions which need to be taken. The first decision is around whether it will be merely open to all, or compulsory for all. At my school we expose all the students to a little bit of coding in their computer skills classes, in the form of some Scratch and some JavaScript. I also do a Game Design unit using Flash, with a little bit of Action Script. It works in that everyone can meet the requirements, but not all students embrace coding enthusiastically, so there might be a great deal to say for going the extra-curricular route, or maybe both.

I suspect that both is the right answer for most contexts. Everyone needs to be exposed to some coding, but I’m not convinced everyone can handle a full-on programme. the second decision is what programming language to use.

I started teaching some coding back in the late 1990s, with some Logo, and then quickly moved to JavaScript. The big advantage of JavaScript is that you do not need a compiler. All you need is a browser and a web editor. Currently I get my grade 9s to use JavaScript to create a quiz which will tell the user if they are right or wrong, and tally a score. When they create Flash games, I teach them to use AS3 to create drag and drops, and how to use tutorials to learn more skills. However, with many new interfaces for creating mobile apps appearing, my gut feeling is that this is the way to go, and I am probably going this route this year. MIT has a platform for creating apps, but there are so many popping up, I haven’t been able to research them all.

Here’s the introductory video for the MIT App platform to give you an idea of how it works.

The third decision is around how to build enthusiasm. Some students will enter into it with gusto and there is so much available online that they will be able to teach themselves. But getting the social aspect to work is vital to any programme having staying power. If you can meet face to face that is the best option, but in many schools the normal sporting and extra-curricular programme is so full, finding a mutually agreeable time is well-nigh impossible. I have tried running a virtual club, but the buy-in is limited. Special programmes which run for a limited period of time, such as a Hackathon or Hack Off may work better if you can find a niche in the calendar. I have been trying to shoe-horn some coding time into whole school programmes such as Cross-curricular tasks, or end of year programmes when teachers are marking exams and willing to sacrifice curriculum time, but for some reason staff meetings tend to resist the idea as soon as you mention coding, or even worse, hacking. For students the word hacking has a much more positive valency, however.

I honestly don’t know what the answer is, to all three questions, but I do sense that this year the zeitgeist is different. The idea that everyone should code is so out there, I think it may just take hold!




Scratch IT!

sratchOne of the questions I ask myself every year is what kind of introduction to coding I can usefully give my grade 8 and 9 students. I have used both JavaScript and ActionScript at various times. This week the IT teacher taught my class to use Scratch, and the students produced a simple Pong style game in an hour lesson. The motivation behind this guest appearance was the desire to grow the number of students electing to take IT as a subject to Matric. Scratch is a free program which uses a visual interface to set up conditionals, loops and all those programming things that depend on pesky indents or braces in programming languages such as Java, very off-putting for students! The results are displayed in a preview window, and do not require compiling! Again, a big plus for beginners.

There is a huge debate amongst IT teachers about the usefulness of Scratch as an introduction to programming, many seeing it as a waste of time they could be using to get straight into Java. Others praise it!

I watched the lesson from the back of the classroom, and was impressed by what I saw: students engaged in creating the game and exploring the application beyond the instructions given. Coding games, is, I believe the way to go. No-one really wants to code tax return programs, and games tend to provide an enormous sense of satisfaction. Gosh – did I do that!?

Snapshot 1 (2013-07-12 12-58 PM)I used Scratch for he first time last year as part of an online course on and found it tremendous fun. I am not sure about how it stacks up as a tool for programming students, but for a general class, with no interest in programming, it really seemed to old their attention, and the results were pretty good.

I believe all students should have some exposure to programming. We live in a world were coding is embedded in the very air we breathe and it is extremely dangerous to allow a situation where we become dependent as a species on something we cannot at the very least tweak! I also think it helps develop thinking skills. There is something precise and unforgiving about computer programming. It permits no margin for woolliness and demands the highest standards of precision and accuracy from students. Gratification is delayed, and I believe this is also a very useful lesson students sometimes don’t learn often enough in this day and age! It teaches the value of persistence as well, and, again, students tend to give up far too easily when tasks become difficult.

On this exposure to Scratch, I have to say that it seems about the best introduction to programming for a general class that I have come across.


Learning to Code – Python is fun!

My enthusiasm for computers began in the early 1980s with an Apple machine and a language called Super Pilot, which I learned as part of my teacher training. I went on to play around with BASIC and a ZX Spectrum, before work and life got in the way. I never really developed that early interest in programming until I started teaching JavaScript to my computer literacy classes back in the early 2000s. I had trained as an English and History teacher but drifted into teaching computer applications because I was able to use a computer, and the rest of the staff were pretty clueless. From the beginning, though, I didn’t want to teach only Word, Excel and Access – I wanted my students to have some exposure to coding.

To my mind JavaScript was perfect. It ran in a browser so you didn’t have to spend the fist few lessons worrying about compilers and such, and you could quite quickly introduce key programming principles: comments, declaring variables, for loops, and so on. My own skills though were pretty basic – just a little above my students’!

aseroidOver the last year or so there has been an explosion of interest in learning to code, and so I decided to develop my skills more formally by doing a course on Python on Coursera. The course was offered by Rice, and consisted of lectures, quizzes and mini-projects developing simple games in Python, building up to an asteroid game in week 8! Student code was evaluated by peers, and the pace was relentless, with deadlines every Sunday! The coding was hard for relative novices like me, unfamiliar with Object Oriented Programming, but not too hard, and I think the staff managed to get the right balance. I managed to get all the projects out, sometimes not quite perfectly, when pressures of time got too much, but I always felt I could do it.

The peer evaluation worked well, and fostered a sense of collegiality. The Discussion Forums were very useful for posting queries and getting help when you got stuck. Sometimes perhaps a bit too much code was posted, but in terms of learning, it was very helpful to share ideas and see how others were approaching the problem.

The course also used a great tool – codeskulptor – which allowed you to code, and run your code inside a browser. It also allowed you to assess other students’ code easily. All-in-all there was a real sense of a community and a class, despite the purely online format and size of the course.

In my own classes I have been using game-creation as a tool as well, teaching my grade 10s to use basic ActionScript to create Flash games. This has worked well, and the quality of games has risen this year. However, I am looking for new ways to increase the coding content expected of my classes – none of which are programming classes. Having completed this Python course, I am considering designing a short high school Python course, based on game design. By providing partially coded templates it should be more accessible, and some of the basics could be introduced fairly painlessly.

If my students get half the buzz I got out of Python then they’ll be hooked for life!


Teaching Kids To Hack!

Ever since Google CEO Eric Schmidt’s speech last year in which he foregrounded the need for more computer programming in schools, there has been a mushrooming of initiatives around coding for kids. As an ICT Teacher, this is something I have thought long and hard about over the years.

Back in the 1990s I used Logo quite a bit, and it was fun, but both the students, and I found it limiting. So I started introducing JavaScript. Because it works in the browser, and you do not need a compiler, students can start coding right away. I start with a little html and then jump in with some JavaScript, getting my students to code a simple web page calculator which inputs two numbers and then adds, subtracts, multiples and divides the numbers. I use tutorialised content and whole-class, step-by-step instruction. Bearing in mind that this is a general class, not students taking IT as a subject, this is sometimes too much for a few students, and they struggle to complete even this, heavily guided task.

I then ask the students to use what they have learned to design a more complicated calculator, such as a web page which can do multiple conversions: such as kilometers to miles, kilograms to pounds, and so on, or to engage in their own project. A significant group of students clearly relishes this challenge, and every web page greets one with fun applications such as personalised greetings, web pages that change background colour depending on one’s favourite colour, and so on.

I think JavaScript works quite well as a general introduction to programming. It is relatively easy to learn, has a great deal of support and tutorialised content on the Internet, such as Codecademy so students can take it further and doesn’t need compilers which need to be configured. It also allows students to learn enough to be able to tweak downloadable JavaScript code for their websites.

You will lose a certain number of students with JavaScript, however, because it is not visual, and requires accuracy and debugging. It is very dry to learn. For any students who start switching off, it is important to give enough help and support to enable them to at least complete a simple project, and give plenty of opportunity to add visual elements using the design view of programs like Dreamweaver. For this reason I get students to do their JavaScript coding in the code tab of Dreamweaver. This seems to work well.

Leave a comment

Posted by on July 21, 2012 in Coding For Kids, JavaScript

%d bloggers like this: