Scratchでコンピュータグラフィックス・繰り返しと乱数

Scratchでコンピュータグラフィックス

・前回までの内容

　・第1回

　・第2回

繰り返しと乱数

昔話から始めますが、その昔、初めて買ったパソコンは国産機のMSX1パソコンでした。

MSXパソコンにはMSX BASICというプログラム言語が今でいうOSのような役割を持っており、パソコンを使うという事はBASIC言語を覚えるという事に他なりませんでした。

そんな時によく遊びでやっていたのが「POINT文で星空を描く」という単純なブログラムでした。

単純なのですが、乱数で描かれるドットが意外にもきれいで、更に毎回結果が異なるのも面白かったです。

Scratchにはドットを打つという構文は無いのですが、色々工夫して同じようなグラフィックを作ってみようと思います。

まず、以下のようにブロックを作ります。

新しいブロックとしては「スクリプト」の「制御」にある「・・・回繰り返す」です。

これは指定した回数その内側に入れ子になったブロックの内容を繰り返すというものです。

今回は500回繰り返した後、全てのプログラムを停止するように指定しました。

さらに繰り返しの中身を作っていきます。

いきなり今まで見たこともいないようなブロックがありますが、構造は簡単です。

先ず、前回使ったxとｙの座標を指定するブロックを繰り返しの内側にはめ込みます。

そして前回は座標として直接数字を入れていたのですが、今回は「スクリプト」の「演算」の項目から「・・・から・・・までの乱数」をそれぞれx,yの項目にはめ込みます。

これは、指定した範囲の乱数、ある意味不連続なでたらめな並びの数を発生させるブロックです。

今回はｘを-240～240に、ｙを-180～180にしています。

これはステージが中心から上下左右に増減して、端までの座標を範囲で示しているものです。

（例えば左上はx=-240,y=180となる訳です）

このスクリプトを実行するとキャラクタがステージ上の様々な位置に500回表示されて止まります。

キャラクタの位置を指定出来たら、描画の準備をします。

いつも通りペンを下して太さを指定しますが、ここにも新しいブロックを追加しています。

「ペンの色を・・・ずつ変える」です。

これは実行するたびにペンの色が変化していきます。値を大きくすると変化の幅が大きくなります。

では、描画をするブロックを追加します。

ここで変わっているのは、最初に使った「・・・歩動かす」の値を1にしているところです。

1歩動くとすると1ドットの点を描画してくれるのです。

ここまでの構造をおさらいすると、

・プログラム開始

・ある内容を500回繰り返す

　・内容はまず乱数でキャラクタの位置を指定する

　・描画の準備をしてペンを下す

　・1歩だけ動かして点を描く

　・ペンを上げて描画をやめる

・500回繰り返しが終われば全てを停止する

...という風になります。

では、最後にせっかくなので背景を黒にして夜空にしましょう。

中央の「スクリプト」のタブの隣にある「背景」をクリックすると、背景画像の描画になります。

左側の道具の中から「バケツ」を選んで、画面下側のカラーパレットから黒を選んでステージをクリックすると黒で塗りつぶされます。

これで背景色の指定が出来ました。

では、実行してみましょう。

目まぐるしくキャラクタが画面上を動き回り、その後に無数の色とりどりのドットが描かれるはずです。

今回は、座標を演算を繰り返す形で指定しました。

プログラムによる描画では様々な演算を用いて思いもよらない画像を作る事が出来るのです。

Scratchでコンピュータグラフィックス：四角を描く（座標を使う）

Scratchでコンピュータグラフィックス

・前回の内容

四角を描く（座標を使う）

前回、線を引くという事はできましたので、今回は図形を描いてみましょう。

描くのは単純な形状である四角形です。

このような形を描くためには何が必要でしょうか？

四角形を作っているのは4つの直線と4つの頂点ですね。

前回やったように線は「移動の軌跡」として描かれるので、敢えて指定してあげなければいけないのは「頂点の位置」になります。

今回は四角形の4つの頂点の「座標」を指定して描いてみましょう。

先ずはブロックを以下のように配置します。

新しいブロックは「動き」の「x座標を・・・にする」と「y座標を・・・にする」の二つです。

これは何をしているのかというと、プログラムを実行した際に、キャラクターを水平軸0の位置で垂直軸0の位置に移動させるという内容です。

算数のグラフで横・水平軸をX、縦・垂直軸をYとして「x=1,y=2」とか方眼紙で位置を取って折れ線グラフとか描いたのを覚えていますでしょうか？

という事はこれを実行するとx=0,y=0の「原点」にキャラクターを移動させる事ができます。

で、実際に動かしてみて分かると思いますが、キャラクタはステージの中央に表示されると思います。

Scratchでは原点の位置はステージの中央になります。

では次にペンの指定を行います。

先ずペンを下して描画状態にします。そしてペンの色を緑色にして、太さを目立つように10としてみました。これは前回のペンの操作と同じです。

更にこうつなげます。

スクリプトの「動き」から「x座標を・・・、y座標を・・・にする」を配置します。

これは先程のxとy座標を指定するブロックを一つにまとめたものです。（ですので、先程の記述にこれを使っても構いません）

するとこのようになります。

キャラクタが右の方に動いて線が描かれました。

y軸は0のままですがx軸は100増加しています。

この線はx=0からx=100の座標に水平に描かれた事になります。

更に続けます。

先程と同じブロックを追加してx座標を100、y座標を100に指定します。

実行するとこうなります。

キャラクタが垂直に上に移動しました。

直前のブロックでx=100になっていますので、水平位置100のまま動きません。

y=100に指定されましたので先程指定したy=0からy=100までの直線を描いた事になります。

更にこう続けます。

座標変更のブロックを二つ追加しました。

直前まででx=100,y=100の位置に移動していますので、3つ目のブロックでy軸はそのままでx軸を0に戻しています。という事はx=100からx=0の水平線が描かれる事になり、更に4つ目のブロックで最初の原点x=0,y=0に戻っていますので、y=100からy=0の垂直線が描かれます。

その後の処理は前回と同じです。

実行するとこうなります。

キャラクタが原点に戻り四角形が描かれました。

キャラクタをドラッグで少し移動させると最初の図のように四角形がちゃんとできているのが確認できるはずです。

このように形の頂点の座標の分だけブロックで水平・垂直軸を指定すれば色々な図形が描けるのが分かりますね。

色々試してみましょう。

更にここまでで分かる事にx軸に正の数を入れると原点より右に移動する、そしてy軸に正の数を入れると原点より上に移動するという事がありますね。

では、それぞれに「負の数」を入れるとどうなるでしょうか？

これも実際にやって確認してみてください。先程と反対の位置に四角が描かれるはずです。

Scratchでコンピュータグラフィックス01

Scratchでコンピュータグラフィックス

最近何かと話題のプログラミングツール「Scratch」。

簡単に子供でもプログラムが出来るという事で注目され、現在では外部に接続したロボットなどのマイコンプログラムも出来るようになったりと話題ですが、今回はもっと簡単な内容で「Scratch」を用いた「アルゴリズムを用いたコンピュータグラフィックス」をレクチャーしてみたいと思います。

Scratchの画面（Ver.2）

Scratchは様々な命令が記述されたブロックを組み合わせるような形でプログラミングをするソフトです。

画面右側がプログラムを記述する部分ですが、色々な色のブロックを組み合わせたものがあります。これがプログラム構文です。

様々な命令文は中央に並んでおり、ここから必要な物を右へドラッグしてくっ付けて行きます。

プログラムの結果は左の猫のイラストのある画面で表示されます。

今回はこの猫のイラストにプログラムで様々な命令をして動かしてみたいと思います。

線を描く

実際に画面上に線を引くプログラムを書いてみましょう。

まずは中央の「スクリプト」のところで「イベント」の項目を項目をクリックします。

下に表示されたブロックの中から「緑の旗がクリックされたとき」をマウスでドラッグして右の枠内に置きます。

これは左側のキャラクターが置かれている画面（ステージと言います）の右上にある緑の旗のマークを押すと、これ以下に接続される命令を実行するという「イベント」を表します。

では、画面に絵を描きますので、「スクリプト」の「ペン」から「ペンを下す」というブロックをドラッグして先ほどのブロックの下にくっ付けます。

そうすると、旗のマークがクリックされると絵を描くためにペンを用意するという一連の動作がプログラムできました。

このように「AをすればBをする」というような関係性を構築して行くのです。

では、更にペンの設定、つまり「どのようなペンを使うのか」を指定して行きます。

「スクリプト」の「ペン」から更に以下のように追加します。

「ペンの色を・・・にする」は描画色を選ぶ事ができます。

間の四角の部分をクリックすると、マウスポインタの先にある色をクリックで取る事ができます。（今回は「スクリプト」の「その他」をクリックしました。）

「ペンの太さを・・・にする」はペン先の太さの設定ができます。

数字を変更すれば太くも細くもできます。

更にこのように続けます。

「スクリプト」から「動き」の項目の中の「・・・歩動かす」を追加します。

これは、線を引くとき手にペンを持って「動かす」ようにペン先を移動させてその軌跡を描画するために追加します。

このスクリプトは初期状態ではステージ上の猫のキャラクタに記述されていますので、実行すると猫が現在位置から10歩移動して、その後に線が描かれるという事になります。

最後に以下のように続けます。

「スクリプト」の「制御」の項から「すべてを止める」と指定します。

これで一連の動作を終了して、プログラムを停止する事ができます。

この時にプログラムは終了するのですが、キャラクタの位置は実行後のままですので、繰り返して緑の旗をクリックすると、どんどん右の方向へキャラクタが移動してその後に線が描画されるのが確認できるはずです。

このように「どのような手順で結果を導き出すのか」という事を何らかの形にしたものを「アルゴリズム」と言い、Scratchではブロックの重ね方でその「手順」を作成して行くのです。

近況色々

最近、日曜日の無料相談会を都合で中止したりしておりました。
今週は行います。5/29（日）の10：30～教室でお待ちしております。
教室の運営の詳細はホームページのスケジュールカレンダをご参照ください。

前回のブログアップ以降、だいぶ前に投稿したGIMPのトーンカーブの記事が段々と閲覧数が伸びて行き、現在は完全に逆転して参照ページのトップになっております。
不思議です。なぜにトーンカーブのみ、それも急速に。レベル補正なんかは全然反応ないのに。
何でしょうね、どこかの学校とかで「これ見とけ」とか。あるいはレポートかな？
以前個人でやってたブログでは、前期末辺りに「世界の中心で愛を叫んだけもの」について書いた記事が急激に伸びる事がありましたので。
当ブログにはコメント機能がありますので、よろしければ「レベル補正・トーンカーブの続き早よ」などのご意見を頂ければ、多分頑張りますので。よろしくお願いいたします。

先日、受講されている方の御自宅にマシントラブルのヘルプに行きました。
おそらくと思ってはいましたが、やはりWindows10の自動インストールのトラブルでした。
インストール中に強制終了した為か、ちゃんとインストールできなくなっていたので、クリーンインストールとアプリケーション他の環境復元を行いました。
個人的な意見ですが、Windows10にプリンタやソフトが対応していればアップグレードする方が今後の事を考えると良いと思います。
と言うのも、Windows10以降はMacOSXと同じようにベースシステムは同じで機能の追加や変更などを行うようなアップグレードを行いますので。そういう意味で「最後のWindows」とも呼ばれているようですが。（MacOSXは既に登場してから15年以上このようなアップグレードを繰り返しています）
7から移行しても基本的な操作が同じなので8の時の様な混乱は無いと思いますし...。

で、その作業のお礼としてお菓子やらお酒やら食事を頂いたりしました。
ちゃんとお代は頂いていますので気を使っていただく事もないのですが、心遣いを頂くのはそれはそれで嬉しい事でもあります。
個人レッスンという事で距離感が近いという事もありますが、贈与経済がどうも成立しつつある感じが興味深いというか。
色々ありがとうございます。

最後に、6月のスケジュールも大体決定して更新してあります。
ご確認ください。

梅雨の前の晴れ間ですね

沖縄の方は梅雨入りしたとか。
そろそろこちらもジメジメした天気が続くようになるのでしょうか？

菜畑駅前に紫陽花が咲き始めていました。
同じ株から違う色の花が出来るもんなんですね。

教室の方はGW明けから受講される方が増えておりまして、うれしい限りです。
PCの基本的な操作から動画編集、Youtubeの利用にネットショップ運営サポート、グラフィックツールの使い方など本当に多岐多様なニーズに出来る限りお答えしております。
特にWebサイトのリニューアルのサポートは私としても受注仕事としてやらせてもらって、先日納品しましたが、ここまで対応の幅が広がったんだなと5年間という時間をしみじみと感じております。

どんな小さな事でも対応させていただきますので、お気軽にお問い合わせください。
ご連絡お待ちしております。

「Windows Live メール 2012」を利用した“Outlook.com”のメール送受信が不可能に(via窓の杜）

・「Windows Live メール 2012」を利用した“Outlook.com”のメール送受信が不可能に

Windows Live メールはWindows7に提供されているメールソフトでWindowsLiveMail（旧Hotmail・現Outlook.com）のMicrosoftのフリーメールサービスやその他のメールサービス・RSSを一括で取得できます。
なのでユーザーも多いかと思います。
（OfficeユーザーはOutlookを使用する人も多いかと思いますが）

現在のWindows10はメールアプリが異なるので記事にあるMicrosoftのクラウドサービス「Office365」の影響は受けないようですが、今だなおWindows7を使い続ける方には難儀な問題になりそうです。

WebメールのOutlook.comでメールは継続使用できるものの、メールソフトを使いたいという方はThunderBirdなど別のメールアプリへの移行を考えないといけないでしょうね。

ようやく気分が落ち着いて？

新年度の授業が開始して一週間チョットになります。
やっと気分的にパターンが出来て来て落ち着いてきたかなという感じです。
特に教室以外での業務が大きく変わったり手探り状態だったりというところも中々へヴィーなのですが、始まる事が始まらなかったり、努力が実らなかったり、努力してもしょうがない事でダメージを食らったり、と思えば、意外なところから新しい事が始まったりと、何か自分の力でコントロールできない事に翻弄されているような気分で、うちに戻ると魂の抜け殻状態になっていたりしております。

ところで今週の相談会は金曜日と日曜日です。
午前中の早い時間に予約が入っておりますが、昼前からは空いておりますので、パソコンやタブレットなどで分からない事がある方は、気軽にお越しください。

最近はAdobeの月割のサブスクリプションの事もあってか、特にIllustratorやPhotoshopでの「ドキュメント作成」に関して質問を受ける事が多くなってきた気がします。
Officeでは対応しきれない細かなヴィジュアル表現がビジネスの場でも必要になってきたのでしょうね。
また、ホームページ/Webサイト、更にはブログなどのWebサービスの利用のご質問も多いです。
これはサービスによって使い方が大きく異なるせいもあるでしょう。

当教室は一緒に問題に向かって考え・解決するというスタンスも取ります。
是非、何かありましたらご連絡ください。

一週間程前に咲き始めた八重桜。

もうだいぶ散り始めていますが、花水木とか藤の花とか世界が色めきだってくる季節ですね。

5年目です

当教室もいつの間にか5周年となっておりまして、細々と5年続いたかと何となく思いつつ、5年と言えば普通は５ヶ年計画最後の年であるからして、正念場でもある訳ですが。

昨年の後半より、私の請負の別業務の内容が大きく変わったので、比較的に教室の出入りが増え、それに連れて若干ですが教室への問い合わせや来訪が少し増えたようにも思います。

１年も先の事など想像もできませんが、少しでもプラスの要因が増えます事を期待しつつ、精進したいと思っております。

で、そんな４月のスケジュールがほぼ確定しておりますので、詳しくはホームページのスケジュールをご確認ください。

大まかには週前半は半日から終日予約不可で木曜日以降は一日予約可能という状況になっております。

今年は竜田川の治水工事でいつも菜の花が満開になっていた河原が無くなってしまっています。

が、別の河原が今、菜の花でいっぱいになっています。

竜田川の桜も今年はバラバラに咲いていましたが、ようやく一斉に満開となったようですね。

ただ、今週末までが見ごろかなとも思います。

4月スケジュール見切り公開中です

4月の予定を公開しました。
特に何もない空欄の部分は予約可能な曜日になっています。
現在のところ、平日だと月曜の午後と水曜の午前が予約不可になっており、それ以外は暫定的ですが可能となっています。
おそらく、あと一日分毎週予約不可になるかと思います。ですので、空いている日に予約受付させていただいた後に日程変更をお願いする事があるかと思います。
新年度直前の慌ただしい状態という事で、ご了承願えればと思います。

スケジュールは教室ホームページ、またはブログ右カラムの開講スケジュールをご参照ください。

竜田川も桜が徐々に咲き始めました。
段々と春が近づいてきているようです。

Windows10の授業資料公開

4月からの講師業のために作成していたWindows10の基本操作マニュアルを公開します。

というのも、最初機種選定をPCで考えていたのですが、Macintoshになりそうなので、Mac版をこれを元にまた作り直す事になりそうなのです。
まぁ、両方使えるので良いんですが。

多分、これは日の目を見る事は無くなると思いますので、Windows10の乗り換え促進の意味も込めて、公開しておきます。

一応公開はしますが、画像・文章などの著作権は放棄しておりませんので、ご注意を。
個人的使用に関しては特に良識の範囲でお使いください。

・デジタルメディア演習01
（別ウィンドウ・タブで表示されます）

春めいてきました

3月もいつの間にか下旬に入り、来週末は新年度4月の始まりですね。

私も教室以外に請け負っている仕事が大きく変わるので、期待と不安で一杯ですが、全てが丸く収まる事を期待しつつ、どんな一年になるのか考えながらソワソワしております。

2月～3月は今年は非常に余裕があり、教室の人の出入りも多くなっております。

相変わらずの細々とした運営ですが、5年目突入前にやっと人目に付くようになって来たのかなとも思っていたりします。

4月のスケジュールはまだ未定部分がありますので、徐々に確定部分から埋めていこうと思っています。
現在受講されている方、これから行ってみようと思われている方もホームページのスケジュール表を御確認下さい。

後、今週の無料相談会は金曜日3/25のみです。
ご質問などありましたら、是非お越しください。

竜田川の菜の花も少し咲き始めてきました。
今年は一番群生していた河原が、治水工事でさらわれて無くなってしまったので、寂しくなるなと思っていましたが、他の川辺でしっかりと根を張っているようです。
来週か再来週には竜田川沿いが桜で満開になるでしょう。

教室PCをWindows10にアップグレードしました

3月の中旬にもなりましたし、7月で無料アップグレードが終了するWindows10に教室のPCを変更しました。

今のところ何の問題もなく使えています。
個人で使っているウルトラモバイルはタッチパネルのモニターなのでタブレットモードで使用していますが、教室の方はデスクトップモードで動作させています。

Windows7と同じようにスタートボタン・スタートメニューが出ますのであまり違和感なく使えるんじゃないでしょうか？
また、Windows8ユーザーにはチャームの削除など機能的に異なる部分がいくらか見受けられますが、大きく操作性を損ねる点は少なく、これも移行しやすいかと思います。

Windows10に関しては、またこのブログでとあるコンテンツを公開してみようかと画策しております。
お楽しみに。

Windows10最大の個人的な改善ポイントはやはり「仮想デスクトップ」でしょうか。

MacOSには比較的早い段階で採用されていましたし、Linuxディストリビューションでも当たり前の機能としてあったのに、Windowsだけ頑なに無かったんですよね。

これは複数のデスクトップを設定できて、それぞれに違うアプリなどを起動できるようになっているのです。

一度この便利さを知ると、これ無しでは生きて行けないほどです。

仮想デスクトップの採用で今までほぼ同じ機能だったアプリケーションの切り替えショートカットキー「Windowsキー＋Tab」「Altキー＋Tab」の機能が大きく変わりました。

Windows10ではAlt+Tabで起動する全てのアプリとウィンドウを表示し、Windowsキー+Tabで「現在表示しているデスクトップの起動アプリとウィンドウ全ての表示と切り替えそして終了」ができるようになっています。

Webサイトを作っています

次回の無料相談会は3/11（金）となります。日曜はありませんのでご注意下さい。

今日は相談会だったので教室に一日詰めておりました。

で、昨年末に来られた方の御依頼でその方の企業ページをリテイクしている所です。

データを確認しますと数年前に古いWebページ編集ソフトを用いて作った痕跡が見られ、現在の標準的な作られ方やWeb標準と呼ばれる仕様に合わない状態でした。

ですので、シンプルな文書構造で再構築して、レイアウトを整える作業をしています。

Webデザインはかつては直感的にWebページ編集ソフトを用いてHTMLやCSSなどの言語をよく分からなくても何となく作るような表現重視型が多かったように思います。

現在はGoogleのWebアプリに見られるようなプラットフォーム化したWebサイトが一般化してきたこともあって、内容重視型、コンテンツ重視型のサイトが一般的かと思います。

これは、ブログなどに見られるように、インターネットが情報メディアとして日常に浸透して来たことに由来し、いわゆる「インフォメーションデザイン」を作り手は常に考えなければならなくなっていると考えています。

そういう事では再度、Webサイトのコンセプトから煮詰めなおして「リニューアル」というのが良いのでしょうけれど、今回はあくまでも不具合修正がメインですので、それは又の機会に。

まぁ、技術的には「リニューアル」とさほど変わらない状態にはなるかと思いますが。

このようなご相談を受けて出来る限りの事をやって行くのが当教室の手法のように考えております。

何でも出来るという訳ではありませんが、何かお手伝い出来ることがあればお伺いいたしますので、ご相談下さい。

3月は余裕がありますので、今のうちかな？とも思いますです。はい。

3月のスケジュール公開中です

教室の3月分の開講可能スケジュールを公開しています。
ご連絡をおとりになる際のご参考にどうぞ。
また、無料相談のスケジュールも併せて表記しております。
詳細はホームページにて御確認下さい。

2月は色々と教室としては賑やかになった月でした。
短期集中でホームページとネットショップをレクチャーしたり、画像制作をしたり。
いろいろな相談に来られる方、マシンメンテナンスなどなど、結構教室に詰めていたように思います。

長期に渡ってネットショップ開設のサポートをさせて頂いている方は、2店舗目に挑戦されるようですし、本当に色々な事が集中していたように思います。

来月は4月からの講師業のスタートになり、3月はその準備に費やす事になるかと思います。
なので、平日もレッスン・ご相談に割り当てる時間の余裕はありますので、お気軽にご連絡下さい。

教室の裏山に今年も椿が咲いています。

山茶花っぽい色なのですが、花がボトリと落ちますのでおそらく椿でしょう。

（山茶花は花びらが一枚ずつ落ちます）

今週の無料相談会

毎週金曜と隔週日曜に行っている無料相談会ですが、今週は金曜日のみの開催になります。
で、更に午後より出張レッスンが入っていまして、1時から3時半頃は教室に居りません。
その点御了承下さい。

学校の方へ出講するのは4月からですので、現在は比較的時間に余裕があります。
無料相談日以外でも、有料になりますがご相談をお伺いできますので、お気軽にご連絡下さい。

今週は月と木以外は教室のレッスンが入っていて、久しぶりに賑やかになっております。

先日、何度かWebに関するご相談をされていた「トゥールブランシュ」さんがお店のパンをまたもや沢山持って来てくれました。
（実際にはアシの早い惣菜パンを教室のある実家で食べてもらったのでもうチョット多かったようです）

その時に教室に居りませんでしたのでお礼を言いそびれました。
いつもありがとうございます。

奥にあるメープルラウンドという円筒形のパンが人気で、梅田の伊勢丹でも販売されているそうです。
美味しいですよ。

しかし、お野菜を頂いたり、コピ・ルアクを頂いたり、パンを頂いたりとすっかり贈与経済の方が授業料よりスムーズに動いているんじゃないかと思っていたりします。

あ、余程の事がない限り頂けるものは頂く方針ですので、安心してお持ち下さい。
ただ、私が返せるものはノウハウや知識だけですが...。（苦笑）

2月・3月分スケジュールを更新しました

前回が年始の挨拶でしたので一ヶ月程ブログ放置してました。
すいません。

今週の無料相談会は金曜と日曜日になります。
お問い合わせも幾つか受けております。
両日とも10：30～17：00まで教室にはおりますので、お気軽にお越しください。

また、無料相談の予定も含めた2月と3月分のスケジュールも公開しました。
ご参考下さい。（ホームページへ移動）

2月・3月は急な予定変更もありますので、併せてTwitterの方も御確認下さい。

さて、最近は空の写真ばかり撮っております。
冬の空気感は良いですよね。

2016年、明けましておめでとうございます！

新年明けましておめでとうございます。
本年も「なのはなパソコン教室」をよろしくお願いいたします。

正月明けの1/4（月）より予約可能となります。
無料相談会は1/8（金）が今年最初の回になります。

是非ご利用ください。