マウスだけでもプログラミングできる！（1）
- GUIベースの環境でプログラミングを始めよう -

非プログラマのためのプログラミング講座

鳥人間　郷田まり子
2009/9/10

非プログラマのためのプログラミング講座。MITが作った「Scratch」を使って、ねとらぼのITちゃんに枕投げをさせるまでを解説する

ITちゃんに枕投げの相手をしてもらうまで　

　「プログラミング」というと、皆さんはどのようなイメージをお持ちでしょうか。

　便利そうだけど専門知識が必要なうえに英語だらけで、自分には無理。そう思われている方は下の図を見てください。

　これはイギリスの小学生が、今回解説する「Scratch」というソフトで作った、立派な「目覚ましプログラム」です。

　この短いプログラムには、どのプログラムにも共通する基礎が詰まっているのですが、全く予備知識のない方でも、これがどのような機能を持つか大体見当がつくと思います。

　プログラムの基礎を理解し、コンピュータをより自由に操れるようになるということは、すべての人にとってとても大きな力となります。絵を描くとき、文章を書くとき、動画を作るとき。ちょっとプログラミングの力を借りるだけで、制作のスピードも作品のクオリティもぐっとアップします。

　この連載を通じて、下の動画のような、クリックに反応する機能を持ったアニメーションプログラムが作成できるようになります。「ねとらぼ」のアイコンでもおなじみのITちゃんに枕投げをさせるプログラムの仕方を説明していきます。

　文字の羅列でコンピュータに命令をする作業と同じことが、子供から大人まで、まるで図を描くような直感性で実現できる、そんな素晴らしいツールを使って、クールなソフトウェアを作り上げていきましょう。

非プログラマ向けの環境のいろいろ

　直感的プログラミングのためのツールのうち、有名なものとしては、

Scratch

　http://scratch.mit.edu/
びすけっと

　http://www.viscuit.com/
squeak（スクイーク）

　http://squeakland.jp/

　などが挙げられます。本連載ではその中でも、直感的な操作と、自分の作品を簡単に公開できる機能が世界中から支持されている "Scratch" を使用します。

　オリジナル素材を取り込んで10個程度の簡単な命令をつないでいる様子がこの動画。このシンプルな動きにさらにアレンジを加えると、マウスやキーボードでの操作に応答するなど、どんどんソフトウェアとしてパワーアップしていきます。

　では、プログラミングの世界に飛び込みましょう！

Scratch概要 - もともと教育用のプロジェクト -

　今回紹介する “Scratch”は、もともと子供の教育用として作られたツールです。開発者はマサチューセッツ工科大学（MIT）のミッチェル・レズニック教授。レゴをプログラム制御してロボットのようなものを作れる「レゴ・マインドストーム」のコンセプトをデザインした人物でもあります。

　「教育用」といっても、プログラマの育成が目的ではありません。

　「プログラマになりたい人も、そうでない人も、コンピュータを通じて、より豊かな創造力を手にすることができるように」といったコンセプトから作られたものです。

　「教育用のプログラムだから、作れるものもタカが知れている」……ということは一切ありません。「教わる」立場、「学習者」のレベルにとどまらずに創造を続けていけるようにと、柔軟性と拡張性に非常に優れており、多くの人が必要とするような機能はほぼ搭載されています。例えば、

自作の画像や音声を取り込んで表示し、動かす
通信をする
独自の変数や関数を使う

　さらには、

センサからの信号を解析する

　といったこともできます。初心者向けといえど、侮るなかれ。実際、Scratch で開発された素晴らしい作品が多く公開されています。イラストの得意な少女が作ったアドベンチャーゲームから、名作レトロゲーム「ドンキーコング」をそのまま移植した例もあります。人気作品一覧には懐かしゲームの再現から3D画像生成まで、クオリティの高い作品がずらりと並びます。脱線して遊び過ぎないように！

　http://scratch.mit.edu/channel/toploved

1-2-3

INDEX
マウスだけでもプログラミングできる！（1）非プログラマのためのプログラミング講座
	Page1 ITちゃんに枕投げの相手をしてもらうまで非プログラマ向けの環境のいろいろ Scratch 概要　- もともと教育用のプロジェクト -
	Page2 Scratchのインストール Windowsの場合 Mac OS Xの場合 Scratchの基本操作
	Page3 Scratchで“動き”をデザイン最初のプログラム引数を変える制御ブロックの使用次回予告

[an error occurred while processing this directive]

「デザインハック」コーナーへ

HTML5 + UX フォーラム新着記事

GASで棒、円、折れ線など各種グラフを作成、変更、削除するための基本 （2017/7/12）
　資料を作る際に、「グラフ」は必要不可欠な存在だ。今回は、「グラフの新規作成」「グラフの変更」「グラフの削除」について解説する
GET／POSTでフォームから送信された値をPHPで受け取る「定義済みの変数」【更新】 （2017/7/10）
　HTMLのフォーム機能についておさらいし、get/postメソッドなどの内容を連想配列で格納するPHPの「定義済みの変数」の中身や、フォーム送信値の取り扱いにおける注意点について解説します【PHP 7.1含め2017年の情報に合うように更新】
PHPのfor文＆ループ脱出のbreak/スキップのcontinue【更新】 （2017/6/26）
　素数判定のロジックからbreak文やcontinue文の利点と使い方を解説。for文を使ったループ処理の基本とwhile文との違い、無限ループなども併せて紹介します【PHP 7.1含め2017年の情報に合うように更新】
Spreadsheetデータの選択、削除、挿入、コピー、移動、ソート （2017/6/12）
　Spreadsheetデータの選択、挿入、削除、コピー、移動、ソートに使うメソッドの使い方などを解説する