Translating Blockly to "Icons" language (for young children)

[Octavi Estapé]

Hi,

As Blockly has been translated to Klingon, I am wondering if it can be translated to a language based only on icons (without text).

Icons is a universal language that is very easy to understand, even for small children that cannot read yet (3 to 5 years old).

Looking for something that can be used to introduce very young children to programming, I found ScratchJr (scratchjr.org). ScratchJr is an android and iPad App similar to Scratch and Blockly, but targeted to young children. The problem was that I didn't find the source code of ScratchJr.

Then I fell in love with Blockly and in one weekend I did something similar to ScratchJr:

http://oestape.github.io/blockly-junior/

My demo uses custom blocks made from scratch (using the block factory), so if I want to create all logical, mathematical and loop blocks, I have to do a lot of work (not only drawing the icons, but also the behavior of each icon).

I am wondering if there is a simpler approach:

• Translate Blockly to a language with only icons: each word would be translated to an Icon
  
• All existing blockly games (blockly-games.appspot.com) would be available for small children
  

¿How can I translate Blockly to a language with icons? I want to use big icons (32x32px) ¿Should I use Wingdings or create a new font? ¿Could I draw svg or png and use them directly?

Thanks,

Octavi

[Octavi]

Hi again,

I did more research.

360 million people (5% of the population) are 3, 4 or 5 years old. That is a lot! There are only 5 languages with more than 360 million speakers.

I would like to translate blockly-games (or at least the easiest ones) to a language that all this people could understand (eventually I would create new games).

My plan is the following:

• Create the icons using Inkscape. Drawing in Inkscape is fun.
  
• Create a new font with my icons. I haven't tried it, but fontastic.me seems to make this process easy.
  
• Add a new language to Blockly (I am not sure how to do that). 
  
• Each English word or sentence should be translated to one "character" (icon) of my new font. I think that most modern websites use this technique (I will have to update my website-building skills).

Any help or idea would be appreciated.

Octavi

[Octavi]

This is the font I have created with the icons of my demo: https://github.com/oestape/blockly-junior/raw/gh-pages/img/svg/font/fonts/blocklyjr.ttf

For now there are 23 icons, but is easy to make more.

Now I need to create a new language in Blockly and use this font.

[Neil Fraser]

This is totally awesome.  I've forwarded it to the Scratch team.

Also worth looking at is OzoBlockly:
  http://ozoblockly.com/editor

Check out level 1 for text-free blocks.

If you are hacking Blockly Games, don't use the master branch, it is old and doesn't build any more.  Use the 'pond' branch, that's the future.

--
You received this message because you are subscribed to the Google Groups "Blockly" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blockly+u...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

--

Neil Fraser
https://neil.fraser.name

[Octavi]

OK, I will use the pond branch. Thanks for the advice. When I have time, I will try to translate the Turtle game to the "icons language".

I would like that my children could program arduino robots with a simple programming language, but I haven't found a good solution for children of their age. I could buy factory-made robots with closed-source software, but arduino and open source is more fun.

OzoBlockly looks like very similar to what I want to do. It has a nice interface and I also like its "levels" approach (with novice, beginner, intermediate). The only problem is that I can't modify it to work with my DIY robots.

By the way, you are doing a very good job with Blockly and Blockly-games! If you accept new ideas, you could make a pond "world cup", where your duck fights with ducks programmed by other players. Maybe someone finds an algorithm that makes the duck unbeatable. There could be different "leagues" limiting the number or type of blocks that can be used.

Octavi

[Randy Stadham]

Hi,

Your blocks look great for the young children I teach. I too want to use the icon blocks to program the Arduino robots I have built for my students. I also wondering if the code could program the robots via Bluetooth on an android tablet.  I have build a drawing robot with a pin that draws but the programming is too hard for my young students.

Any help would be great getting my idea going.

Randy

[Octavi]

Hi Randy,

I am glad you like the icons.

For now this is only a useless demo, a proof of concept, but my idea is similar to yours. 

For now you can put the blocks together but they are not saved anywhere or sent to anywhere :( 

My idea was 

- create a program in Blockly, 

- send to Arduino either 

   (1) the individual commands or 

   (2) the complete program

- Then in Arduino 

   (1) execute the individual commands or 

   (2) run the program autonomously.

   

At first I thought of using Bluetooth because modules for Arduino are cheap (4$). But it is not straightforward to send messages using Bluetooth in Blockly (javascript in a browser usually doesn't hasBluetooth access).

Wifi is a much better option. I thought that Wifi shields were much more expensive than Bluetooth (around 20$), But today I have seen Wifi modules based on ESP8266 that cost 2$ and also there is NodeMCU that is something similar to a small Arduino with Wifi and costs around 5$! Moreover NodeMCU comes with a Lua interpreter, so you can write scripts and execute them without compiling anything in the IDE.

I don't have any NodeMCU, but it seems very promising. I would like to:

  - Program in Lua using Blockly

  - Send the program or the individual commands to NodeMCU

In fact maybe someone has already done something similar. Searching for Blockly, NodeMCU and Lua I found this post http://www.esp8266.com/viewtopic.php?f=22&t=2345 (there is a link to a video and a Github project that includes Blockly to program a NodeMCU in Lua).

It seems that you need to connect a serial cable to NodeMCU in order to program it. I think that it would be better to upload the program using the Wifi interface, but I don't know if that is possible.

Octavi

[Randy Stadham]

Hi Octavi,

Your right NodeMCU might be the best way to go when programming in a browser. What about converting Blocky to a android tablet?

>I don't have any NodeMCU, but it seems very promising. I would like to:

>  - Program in Lua using Blockly

>  - Send the program or the individual commands to NodeMCU

Could this be done in a Android tablet? I was thinking small children love tablets and it would be easy for them to place the blocks with there fingers.

I have seen it done here not quite Blocky code but it was done with easy to understand commands. http://www.instructables.com/id/BOXZ/

[Randy Stadham]

Hi Octavi,

After looking around more about Blocky code then how can I convert this code to your easy to ready blocks?

https://github.com/BlocklyDuino/BlocklyDuino


Randy

[Blake]

Another option is to use a Particle Photon (https://www.particle.io/) as it has a cloud api which you can pass C++ files and it will compile them and push the compiled binary down to a wifi connected Photon MCU.

The trouble is that the code (C++) requires strict type checking. You might be able to have a var type class similar to how Toebes did with his Java code generator.

https://github.com/toebes-extreme/blockly/blob/master/generators/java.js#L437-L1042

The folks at Zero Robotics figured out how to generate C++ code:

https://github.com/zrdev/zrdev.github.io

Hope this helps,

Blake

--

[William Moore]

==>Octavi et al...

There is now a BlocklyDuino implementation for the Amica, Lolin and Doit bands of NodeMCU boards and other similar ESP8266-based MCU board (WeMos D1/R2 board). This was developed by a guy in Tunisia, and is called "TUNIOT" (TUNisia Internet of Things). While the name could be better, I am quite satisfied with his current version of the software (well, maybe it still needs a bit of tweaking). Code blocks are included to allow you to attach to a WiFi AP, to create both WiFi HTTP server and client applications, as well as to connect to some 3rd party services for smart phone savvy apps. The default language on TUNIOT is English, and a series of English language tutorial videos are available through YouTube. Their system ignores eLua, and instead is based on Arduino C & IDE. It does require the Arduino ESP8266 Core, the installation of which is in the first video in the tutorial series I mentioned above. Once that is running, go to the TUNIOT server up on www.easycoding.tn (there will be two versions: BlocklyDuino-Enhanced for Arduino Uno MCUs, and TUNIOT. The TUNIOT icon will have the NodeMCU logo along with the word "TUNIOT" on it). If you know HTML and maybe CSS, then getting from the basic WiFI HTTP server generated by TUNIOT to a nice web page should be rather straight forward, but most of that work will be done with Arduino C (maybe with the assistance of an HTML/CSS web page generator program). 

Because the storage is so limited on the NodeMCU, I serve-up photos stored on other servers on the Internet. So, with a bit of creative web design you can put together a pretty functional webpage. I used a table of links (<a> tags) to create command buttons that the server could read and do things depending on which button I pressed like switching on & off LEDs, relays, etc. Just don't have the server reply to the client or you will break the HTTP connection. I have yet to explore web sockets for a persistent connection, but a bit of creative coding goes a long way. I think my technique (discovered by accident) is called "long polling". I save a copy of my server code here... http://paste2.org/m9GEN7v8. It was originally coded using TUNIOT and the actual web page was hand coded in HTML and inline CSS. Enjoy.

[phil cleaver]

Wow!

What an interesting thread!  Great work so far, I love this idea.  

[Andrew n marshall]

Regarding Scratch Jr and iconic interfaces, remember we have been working with the MIT Scratch team. Scratch Blocks is based on Blockly.  This is how we did the Snowflake activity of this past year's Santa Tracker.

--
Andrew

--
You received this message because you are subscribed to the Google Groups "Blockly" group.

To unsubscribe from this group and stop receiving emails from it, send an email to blockly+unsubscribe@googlegroups.com.

[phil cleaver]

@Octavi  You can get at bluetooth if you wrap your app as a Chrome App whixh is ok for windows, osx and linux, but not android unfortunately.

https://developer.chrome.com/apps/bluetooth

The most sensible option I think is to use Cordova with a bluetooth serial plugin.  This approach is quite easy.

Hope this helps

Giggles