共通のソースプログラムでiOS用とAndroid用のアプリを作れるThunkableX（その１）

*最後にある【ご参考事項】を補強しました。2018-6-28

これまでずっと利用してきたMIT App Inventor for AndroidとThunkableですが、限時点でThunkableの方に、大きな進展がありますので、それを試行してみます。注目点はいくつかあるのですが、共通のひとつのソースプログラム（デザインとブロック）を用いて、iOS上でもAndroid上でも実行できる！これが最大のポイントです。

さっそく、画像認識アプリを作ってみます。３つのパートの構成にしました。初級向けには、最初のPart A (または、Part A + Part B）だけでもよいかと思います。

• Part A：スマホで認識させたいものを撮影する。それをMicrosoft Recognizerに送って、何が写っているかの認識結果（英文）を表示させる。
• Part B：これと同じですが、撮影済みのPhoto Libraryにある画像も認識させる。
• Part C：認識結果に、評点と感想（コメント）を付ける。それを後で仲間とシェアするために、Media DBとRealTime DB（Firebase）に格納する。

以下に、そのソースプログラム（デザイン部とブロック部）を示します。以下がその全てです。

画像認識アプリのデザイン部

画像認識アプリのブロック部

このソースプログラム全体は、以下に公開していますので、詳細はそちらをご覧ください。ご自分のgmailアカウントに入っている状態で、下記リンクをクリックすると、自動的に、ThunkableXのプロジェクトとして、上記のソースプログラムが設定されます。

https://x.thunkable.com/copy/3a30e4c6b8b976811b85aef29bfac2e8

このソースプログラムを、iPhone用とAndroid用にビルドして、それぞれ実行させた例を以下に示します。

共通ソースプログラムからビルドして実行した例

Part Cでは、各人が色々なものを撮影して、仲間同士でその結果を検討するために、認識結果とその人の評点、コメント（意見）を保存します。撮影画像の保存は、Media DBというものに格納します。その格納場所を示すURLとその他の情報を、RealTime DB（Firebase）に格納します。

撮影画像のMedia DBへの格納例

認識結果やユーザ評点などのRealTime DBへの格納例

【ご参考事項】

今回の試行で気がついたことなどを、ご参考までに記します。

1. 上記に公開しているソースでは、Media DBとRealTIme DBを利用するためのAPIキー情報などは削除してあります。生徒らに、Part Cを使わせる場合には、管理者がこれらのAPIキーなどを取得して各人に設定させる必要があります。
2. これら２つのDBの設定については、 下記をご覧ください。Thunkable Docs→「Thunkable Cross Platform X」→「Create」→「Components」→「Data」→RealTimeDB, Media DB
3. 従来のAndroid用のThunkable(Thunkable Classic)と比べて、今回のThunkableXは、使えるセンサー類の少なさが目立ちます。またExtensions機能もありません。しかし、そうだとしても、iOSにも共通に使えるようになったメリットは非常に大きいです。不足の機能も順次追加されていくはずです。
4. iOS用のビルドには、現時点では、10分〜15分程度かかります。したがって、一定の完成度になるまでは、Live Testを使う方がよいです。WiFi環境下で、PCとiOSを接続して、リアルタイムにプログラム修正、実行ができます。Live Testには、Apple Storeにある「Thunkable Live」が必要です（→下図参照）。
5. iOSのビルド結果は、メールで通知されます。それをiOSで（PCではなく）受信して、示されたリンクをクリックするだけでインストールされます。しかしながら、現時点では、iOS側にダウンロードできるのは、１アプリに限定されています。別のアプリをダウンロードすると置き換わってしまいます。
6. iOSにビルドしたファイルをインストールする際に「信頼されていないソフト...」が表示される場合があります。「設定」→「一般」→「プロファイルとデバイス管理」ヘ進み、「Rappidly Inc」を「信頼する」にして下さい。
7. Android用にも、Live Testは使えますので重宝します。そのためには、Google Playストアにある「Thunkable Live」が必要です（→下図参照）。ビルドを行う場合、通常ほぼ直ちに結果が返ってきますが、PC側にダウンロードされるので、それをメールか、Dropboxなどを経由してAndroidにインストールする必要があるようです。
8. 今回のThunkableXと、従来のThunkableおよびMIT App Inventorとのソースレベルの互換性はほぼ全面的に失われています。iOSとの共通化のためには、全面的に設計を見直す必要があったとのことです。その意気込みは高く評価したいと思います。

Live Testに必要なアプリ

ScratchでAI（人工知能）を教えるプロジェクト

Scratchは、小中高生向けのコンピュータサイエンス、プログラミング教育に益々利用が広がっているようです。大学のオープンキャンパスなどでも活用されています。そのScratchですが、外部ボードや機器との連携を強化するextensionsなどを装備したScratch-Xにも注目が集まっています。現在まだ実験版（ベータ版）のようですが。

このScratch-Xで、ゲームなどのプログラミングをさらに進めて、AI（人工知能）も教えるプロジェクトがありました。Deep Learningを使う訳ですが、もちろん、その理論や詳細な手順は見せません。IBM Watsonを利用していて、Visual RecognizerやAssistantサービスを呼び出すようになっていますが、Scratchのブロックで包み込んでいます。

https://offspring.lifehacker.com/teach-your-kid-machine-learning-with-these-free-lessons-1826836113/amp?__twitter_impression=true

Machine Learning Projects (ScratchX)
https://machinelearningforkids.co.uk/#!/worksheets

子供にもAIの活用技術に親しんでもらおう、という意図のようです。公開されているプロジェクトのうちの「コンピュータとのじゃんけん」を実際にやってみました。手の画像の認識をAIで行うということです。

• 自分の手で、グー、チョキ、パーの3つをそれぞれ10回づつWebカメラでとる。
• それにラベルを付けて、Watsonに学習させる。
• かんたんな「じゃんけんの勝ち負けのルール」をScratchで作る。
• 新たな手の画像（グー、チョキ、パーのどれか）を与えてボタンを押す。
• コンピュータの手と比較して勝ち負けの結果がでる。

Deep Learningを利用したScratch-Xのじゃんけんアプリ

注意書きとして、「手を撮影するとき、自分の顔が映らないようにしてね」とあります。顔画像がどこかで悪用される危険性の回避のためです。このようなことも子供の時から教えておいた方がよい。ちょっと技術の負の面が出て来ているわけですが。

手の画像にラベル付けして学習させるという例でしたが、汎用性があります。例えば、手書きに文字認識も同様に行えるわけです。
Deep Learningの勉強、学習、研究の環境は色々出回っていますが、このScratch-Xによるものも教育面で可能性があるのではないでしょうか。

BackPropagation in Neural Network with an Example (XOR) Using Multiple Micro:bits

In this article I would like to attempt Backpropagation in a neural network using micro:bit.

Back propagation in a neural network made with micro:bits

In the previous article, I used micro:bit to construct a neural network and took up the recognition of XOR using it.

http://sparse-dense.blogspot.com/2018/06/microbittwo-layer-perceptronxor.html

At that time, since we used the neural network weights completely learned about z = XOR (x, y), the value of z for any input pair (x, y) could be calculated with only one forward propagation.

As before, I use micro:bit neural network again. But at this time, the Backpropagation which is the foundation of Deep Learning is applied. In general, it takes a long time to learn in a neural network, since it requires repetition of forward propagation and backward propagation many times. So, here we use some good (but not complete) weights that we got before from another projects, as initial weight values. Starting from that, we should complete weights update within a small number of iterations, even on the micro:bit neural network. Please check the actual operation with the following video:

This video is also published on Youtube:
https://youtu.be/tsYr01lQ_HY

Weight updates to recognize XOR are required for the four cases of input (1, 1), (1, 0), (0, 1), (0, 0). Successively for all these cases, updates should be repeated until the error (difference between the answer and the evaluated value z) becomes smaller than the tolerance (here, 0.1). However, for the sake of simplicity, we only show weight updates for the first case x = 1, y = 1 in this demonstration. It converged after 5 iterations.

Please note that the neurons (micro:bit) of the Hidden layer and Output layer display eastward arrows or westward arrows depending on whether they are in Forward or in Bacward. Also, after the Backward is over, button A on micro:bit is pressed before Forward starts. This is to ensure the proper timing between receive and send on micro:bit radio.

Consturuct a neural network (multilayer perceptrons) using micro:bit

notice:
This article treats only forward propagation, whereas, backward propagation is also demonstrated in another article. -> Please see here.

Let's learn the basics of neural networks using micro:bit. Understanding deepens by actually programming. For neural network learning to solve various tasks, back propagation is generally required. Learning with this back propagation requires considerably long time calculations. It is not realistic to do this with such a tiny microbit with low computing power, even though it is not impossible. Therefore, here we will try forward calculation only, using the edge weights of the already learned neural network. Even so, you can experience some of the important points of the neural network.

Neural network with micro:bit

　this illustrates evaluation of z = XOR(1,1) = 0

One thing to notice here is that one microbit plays a role of one neuron. By doing so, you can have an image that is close to real neurons. Here, XOR (Exclusive OR) is the problem. z = XOR (x, y) shows 1 only if either x or y is exclusively 1. Otherwise the value of z is 0. In the microbit, JavaScript and MicroPython can be used, but here we use MicroPython. The reason is that microbit JavaScript currently does not support calculation of float type data. Float type operation is mandatory for calculation of Neural network. Also, neurons (microbit) exchange signals with each other. For that we use send / receive on radio. This is not Bluetooth. Additionally, as the activation function, we use the sigmoid function.

The weights of the edge used above are the results of being learned by the following NetLogo program that is based on the following one:

• Wilensky, U. (1999). NetLogo. http://ccl.northwestern.edu/netlogo/. Center for Connected Learning and Computer-Based Modeling, Northwestern University, Evanston, IL.       

The red line denotes a negative value, the blue line denotes a positive value, and the thickness shows the magnitude of the absolute value.

Weights used in the above example were obtained by this NetLogo  simulation

Please see the video for an actual operation example.

https://youtu.be/PPUcsXgCnZ4

In the first half, z = XOR (x, y) is calculated where x = 1, y = 1, and then the value 0.0178... was obtained, so that "0" was finally displayed. On the other hand, the second half is the case of x = 1 and y = 0. Now that 0.9852... has been obtained, "1" was displayed as the final result of z.

神奈川工科大学のある厚木市三田でもホタルが見られるようです

蛍（ホタル）の季節が近づいてきました。神奈川工科大学は、厚木市下荻野にありますが、実は、大学の敷地の東側半分ほどは、下荻野ではなく三田という地区になっています。三田は、その名のとおり、水田地帯だったはずです。いまでも水田はありますが、十数年前と比べると激減しています。その大半は、資材置き場や、駐車場、宅地になりつつあります。カエルの鳴き声が年々弱くなっていることも、それを反映しています。

神奈川工科大学情報学部棟（黄色の矢印）が遠くに見える水田地帯。

近年激減してしまったが、今は、ちょうど田植えの季節

神奈川工科大学から東の方へ降りた、三田の水田のあたりには、まだホタルがいるようです。ホタルの放流活動も行われているのかも知れません。以下のような看板が出ていました。貴重なホタルを大切にしましょうということですね。

厚木市三田に残るホタルの生息地