ニューラル ネットワーク に、いますぐブラウザー上で触れてみよう!
大丈夫、壊れたりしないから。好きにいじってみてね。

4 “手法” の選択: モデルの定義
5 “学習方法” の設計: モデルの生成
6 学習 : トレーニング

エポック(Epoch)

1 データ準備

2 問題種別

どのデータセットを使いますか?

3 前処理

入力層

入力データとして使いたい特徴を選択してください。

クリックすると、値を手動で編集できます。
重み/バイアス0.2
これは、この ニューロン (neuron) の出力内容です。マウスを載せると、右の出力の場所に拡大します。
出力は、変化する 重み と合成されます。重み (weights) は、線の太さで示されています。
4

出力層 ⇒ 7 評価

Train loss (損失)
Validation loss
Train acc (正解率)
Validation acc
データ / ニューロン (neurons) / 重み の値を色で表現。

8 テスト ⇒ 完成

X座標Y座標分類予測

えっと、ニューラル ネットワークって何?

データから学習するコンピュータープログラムを構築する技術のこと。「人間の脳の働き」を大ざっぱに真似たものです。
まず、「ニューロン」(neuron: 神経細胞)と呼ばれる単位機能を層(layer)の中に複数作成し、また層も複数作成したうえで、各層間でそれぞれのニューロンがメッセージをやり取りできるように結合(connections)させて、ネットワークを形成します。
次に、そのネットワークに問題を繰り返し与えて、解かせていきます。これが学習です。学習のたびに、正解に導く結合は強め、不正解に導く結合は弱めていくことで、問題に対して正解を答える精度(accuracy:正解率)が徐々に高まっていきます。逆に言うと、誤差(error、もしくはloss:損失)が小さくなっていくということです。

それぞれの色の意味は?

ニューラルネットワークの学習過程を視覚化するために、青色とオレンジ色を使っています。
色の使い方が微妙に異なる部分はありますが、基本的に、青色は「正の値」(positive values)を表し、オレンジ色は「負の値」(negative values)を表しています。

入力層(input layer)においては、データの点(points: 小さな円で表現されている)それぞれが、もともと青色かオレンジ色で着色されています([出力]のグラフ図を参照)。
つまり、各点が初めから「正の値」か「負の値」(正解ラベル)に対応付けられているということです。

隠れ層(hidden layers)においては、ニューロン間の結合の重み(weights)によって、線が着色されています。
青色の線は「正の重み」(positive weight)を表し、オレンジ色の線は「負の重み」(negative weight)を表しています。
正の重みとは、その線の接続元にあるニューロンから与えられた出力を、他のニューロンの入力として使用する可能性が高い(=発火を促進する)ということです。
逆に、負の重みとは、使用しない可能性が高い(=発火を抑制する)ということです。
線の色の濃さは、その結合の強度を表します。

出力層(output layer)においては、前述したように、データの点それぞれが、もともとの値(正解ラベル)に基づき、青色かオレンジ色で着色されています。
また、背景色が塗られた領域は、学習済みのネットワークによって出力された予測結果が「正」か「負」のどちらの領域に入るかを視覚的に表現しています。
背景色の濃さは、その予測結果の信頼度を表します。

何のライブラリを使っているの?

このページが提供するソフトウェアの目的は、教育用にニューラルネットワークを視覚化することです。これを実現するために独自に書いた、小さなニューラル ネットワーク ライブラリを使っています。実世界のアプリケーション向けには、TensorFlow ライブラリの利用を検討してください。

これはすごいね、他でも使っていい?

ぜひ、やってみてください! ニューラルネットワークが少しでもアクセスしやすく学びやすくなることを願って、GitHub(オリジナル版)、もしくは独自運用と日本語化を行っている Deep Insider による Fork 版 でオープンソース(Apache 2.0 ライセンス)にしています。このライセンスに従ってさえいれば、どんな使い方でも自由です。また、もし追加や変更の提案があれば、ぜひお知らせください

さらに、特定のトピックやレッスンに対応する Playground(実験場)として調整できるように、いくつかのカスタマイズ項目を提供しています。具体的には以下から、「表示したい機能」を選択するだけです。あとは、 このリンク を保存するか、 このページを再読み込み してください。


※注意: [損失関数]欄にある「平均二乗誤差」は、実際には「二乗和誤差」になっています。
 対応する記事での実装方法に合わせて、「平均二乗誤差」と表記しています。


※Tips 1: ページの枠デザインやテキスト部分を非表示にするには、下記のパラメーターに手動で修正してください。
 &hideText=false

※Tips 2: 各項目を非表示にするには、下記のパラメーターを手動で指定してください。
 &x_hide=true
 &y_hide=true
 &xSquared_hide=true
 &ySquared_hide=true
 &xTimesY_hide=true
 &sinX_hide=true
 &sinY_hide=true
 &prepare_hide=true
 &description_hide=true
 &cnum1_hide=true&cnum8_hide=true
 &numNodes1_hide=true&numNodes6_hide=true
 &epoch_hide=true
 ちなみに、上記のチェックボックスでは、<既存パラーメーター名>_hide = true が自動的に指定されます。これと同じことを手動でする必要があります。

※Tips 3: オリジナル版の重みやバイアスの値で初期化する場合は、下記のパラメーターを手動で指定してください。
 &initOrigin=true

※Tips 4: 乱数シードを指定するには、下記のパラメーターを手動で指定してください。
 &seed=0.12345

※Tips 5: 各パラメーターの初期値は以下のとおりです。
[問題種別]関連のパラメーター:
 【problem】 classification
 【dataset】 circle
 【regDataset】 reg-plane

[前処理/データ生成]関連のパラメーター:
 【percTrainData】 50
 【noise】 0
 【seed】 0.XXXXX(ランダム)

[学習とデータ]関連のパラメーター:
 【batchSize】 10
 【batchFull】 false

[入力(特徴)]関連のパラメーター:
 【x】 true
 【y】 true
 【xSquared】 false
 【ySquared】 false
 【xTimesY】 false
 【sinX】 false
 【sinY】 false

[隠れ層]関連のパラメーター:
 【networkShape】 4,2

[ニューロン]関連のパラメーター:
 【activation】 tanh

[リンク(重みとバイアス)]関連のパラメーター:
 【initOrigin】 false

[学習の実行]関連のパラメーター:
 【learningRate】 0.03
 【regularization】 なし(L1、L2)
 【regularizationRate】 0

[出力]関連のパラメーター:
 【showTrainData】 false
 【showValidationData】 false
 【showTestData】 false
 【discretize】 false

[全体表示]関連のパラメーター:
 【hideText】 false

クレジット

このページとソフトウェアは、Daniel Smilkov 氏 と Shan Carter 氏 が作成しました。
これは、多くの人の過去の成果を継承することで成り立っています。とりわけ Karpathy 氏の convnet.js デモと、Chris Olah 氏のニューラルネットワークに関する記事が役立っています。
また、元となるアイデアで助けていただいた D. Sculley 氏や、フィードバックと指導を頂いた Fernanda Viégas 氏と、Martin Wattenberg 氏、その他の Big PictureGoogle Brain チームの皆さんに、感謝を申し上げます。