Silent Teacher – A game to learn how to code

Hi everyone, I'm the guy behind Silent Teacher. I just had the surprise to see my work on HN, in fact a colleague of mine published it without me knowing, I didn't have the chance to really explain the goal.

This is a side project, and the goal is not to teach how to code. I agree with several comments here, it's sometime confusing, it's short and minimalistic. The real goal is far less ambitious. I just wanted people to catch a glimpse of what is coding. It's like stepping into un unknown world for a few minutes. And it's not aimed at everybody. Some people are driven away by written explanations, or can feel patronized very quick, and I wanted to address that. Here, the first questions make you feel confident, then with tries and errors, by yourself (or apparently so) you understand a bit how this works.

The story behind this is : I was never able to explain how code works to my wife. She is math-o-phobic and she never gave me the chance to explain... just the fact of explaining something like this scares her away. But one day, sitting next to her on the train, I opened my JavaScript console and began typing 3 + 4, then without a word I pointed the keyboard and screen to her... 20 minutes later we were doing functions and variables, without even a word. This is how this project was born.

Sorry for those who where mislead by the title of this HN post. We have other tools currently in development to address code teaching (one more focused on code reading, one more focused on creativity, one more focus on JavaScript ...), and only when 3 or 4 of these will be published will we be able to teach properly to a larger audience.

Thanks for all the feedback today, I really appreciate it.

When I see such projects, I try to remember how I learned to code.

And I certainly didn't do such practices.

First thing I did, was mIRC-script most of it copied from other scripts and retrofitted.

I think this was a good start, since I got something useful out of it and it increased my interest in coding. I didn't understand much of it, not even arrays.

But I wrote a web-crawler with this basic knowledge and a copy of a TCP socket example, got some data from a website, used 10 vars (the start-page of the news site just showed 10 articles at once lol) to save and modify it and spam the titles in the channels, with links to it.

I was intrigued by this power I got, even if I didn't understood much of it, fusing web and irc together, I felt like a hacker...

Later I went to a IT school, studied computer science etc.

Most of this basic stuff was boring and I just did it because I knew it would increase my power over things that interested me, but if I didn't had this "aha-moment" in my youth, I couldn't bring up the motivation...

It's a great minimalistic interface, and clearly some thought went into the "silent teacher" theme. However, this is a completely ineffective way to learn coding. Coding is not rote memorization of how language constructs work, it's about applying language constructs toward bigger problems.

It's like getting aspiring artists to draw a bunch of stick figures and random shapes. They aren't learning anything that will help them paint a masterpiece, they're just learning to paint for the sake of painting.

My problems:

1. This doesn't teach you how to code, this teaches you how to read code and learn arithmetic logic that goes with programming. 2. You use Javascript as a base.

Really well executed.

This forces the reader to confront their misconceptions about what is going on by exploring edge cases. (number + string == ??). Teaching models that force you to guess when you are uncertain can create a deeper understanding by preventing hindsight bias. Everything seems obvious once you know the answer -- the hard part is convincing the student they would have gotten the question wrong before you told them.

Even if I had never tried to program before, I feel like it starts/progresses way to slowly. It gave me like a whole pages worth of questions about adding single digit integers or combining small strings.

I like the look and feel of it, I just think the content should be tweaked a little bit to pick up the pace. Maybe some hints they can look at if needed.

Also, multiple language support would be good.

How far does it go at the moment? And how far are you planning to make it go?

Very well done, congrats guys!

PS. Consider translating http://www.toxicode.fr/ into English for visitors from the US. Your services are in much demand over here. And get the .com too!

Since becoming an instructor, I love these tools to help reinforce what I'm teaching. Its rapid fire enough and randomized enough that you can fire off 5-10 small 'exercises' without having to build elaborate (in the student's mind) programs to practice the concept. The sequence of math to functions was great in my opinion. Hammer home the math, then repeat with a twist.

I will say arrays need makes a quick jump since the concept of starting counting at 0 is sometimes new to them.

If I were to use this, the features I'd love to see are the option to view it in different languages (I teach Python and Java). Also, someway of setting up practices and monitoring student activity would be nice; like, homework is 20 correct answers of math, variables, functions.

Very cool site!

I would love it if this hooked up to another side where you could come up with code-snippet based lessons (list variables at top with an array of example combinations). Move up/down the tree/chain if the error rate is too low/high.

This is honestly the best one of these I've seen. Decision paralysis is probably the biggest fault when starting out in programming. This exists with the specific purpose of unlearning that habit.

In case anybody is wondering why they're getting the string concatenation questions wrong, it's because you let your browser translate the page from French.

I hate being negative, but I have to say that I really don't think this an effective way to learn how to code for someone without some programming knowledge to begin with.

I just watched someone with no programming experience whatsoever try the problems. She's smart and well educated.

The basic arithmetic is (obviously) fine.

Basic variable assignment is fine, although the 'var' keyword doesn't really serve a purpose. It's completely meaningless to the non-programmer, and seeing as you can declare variables in the global scope in js without using it, I don't really get what it's doing here.

The first difficult problem is why

    '4' + '2'

is '42' and not '6'. The person I watched voiced a bit of frustration, then after a minute saw that 4 and '4' are different, and then breezed through the round. But she didn't learn anything at all about strings vs. integers or even variable types as a concept. She learned that, arbitrarily, when numbers are in inverted commas they should be concatenated when a '+' sign is used instead of added together. She didn't feel like she'd learned anything either. And without already knowing about types, about integers and strings, it is impossible to teach this concept intuitively because it is not intuitive. Someone taught that 4 + 2 = 6 and that '4' + '2' = '42' might very reasonably think that '42' - '2' = '4'.

Next was variable assignment order:

   var a = 0; a = 4; a + 3;

She got the "rule" of last-assignment-counts pretty quickly, but again, didn't get what the variable was actually doing. She just learned to ignore the first line and add the last two numbers together. The idea of 'a' being a variable wasn't communicated to her.

Then there's a huge jump to functions, with

    function hello (a, b) {
        return a + b;
    }
     
    hello(2, 4);

After some trial and error, she worked out how to answer these kinds of questions as well, but with no understanding at all of what the function was, what the return statement was, the idea of functions having arguments, etc. She just learned to add the two numbers at the bottom, and later to perform an operation on the two numbers at the bottom using the operator from a few lines higher. The process became "find the numbers, find the operator, ignore everything else".

Up to this point I had been completely silent and just watched, but now she began to give up, and we talked about how she'd found the experience. She didn't feel that she'd learned anything and didn't like the lack of feedback and explanation.

The next questions were about about length:

    var a = 'nudintm';
    a.length;

I really don't like this. So far, the user has only been exposed to functions, and the syntax and structure will still be unfamiliar in the best-case-scenario. From there, it's a huge leap to properties and the implied existence of objects. This problem is just so arbitrary without an understanding of what's going on. Why is there a period between 'a' and 'length'? Why does length not have '()' after it like hello() did a few problems earlier? We know the answers to these questions, the intended audience will not.

    var a = [9, 4, 'w'];
    a.length;

This is another huge leap, and it's a bit odd because it introduces arrays in a problem that doesn't really indicate anything at all about what an array is or what it's for. It's also a bad question because the user might add together the length of '9', '4' and 'w' and come up with 3, the correct answer, and then think to get the length of an array you just add the length of every element in the array.

I'll stop there. I admire the execution and the ambition of the project, but in its current form I really don't think it works well at all if the intended audience is people who don't know anything about programming. Users learn superficial patterns to get the correct answers without understanding the problems in any real way or learning anything about the structure or function of code.

I don't mean to be mean but some of these answers depend on what language you use.

For example

var a = '3'; var b = '4'; a + b;

Depending on the language may give you 7 or maybe give you 34.

So I just gave this link to my non-technical wife for the ultimate test. She is actually making pretty good progress. I'll update this as she progresses.

This is just what I was looking for to help one of the designers at my job learn about how variables and functions work. She's good with photoshop but her usefulness is seriously limited by her inability to write code - I've been trying to figure out how to get the basic concepts through to her gently.

This is fine as an introduction to javascript. It's terrible as an introduction to programming. I really dislike teaching language idiosyncrasies that get in the way of clear expression of logic. And the first few levels are basically nothing but javascript idiosyncrasies.

I like this approach, where it does explain anything, but lets you figure it out on your own by starting with the basics.

I think the functions should be renamed. function hello (a) would look like nonsense to a beginner. Give them names like addNumbers so they can piece it together.

As a gentle introduction to viewing code snippets and reading variables this is exquisite

Learning through dialogue feels very natural for languages, including programming languages.

The Little Schemer follows a similar approach-- a series of short questions that the reader is encouraged to answer, along with the book's answer to them.

This seems fun. I'd be interested to hear how people who have never programmed before react to, and cope with the 'puzzle'. I didn't find any information beside the game itself.

What happened to learning to code by reading K&R or some other book that explains how the machine works?