*disclaimer
449078
[HSP]
英語教育研究のためのプログラミング:HSPの基礎テキスト
TOC
00. プログラミングのココロ --- HSP3を例に ---
01. 文字、ボタン、ラベルと画像
02. 変数、条件と繰返し、サブルーチン
03. 配列、繰り返し、データの記録と保存など
04. 画像と音声の取り扱い、それとメッセージボックス
05. 応用例:リスニング教材、解答時間の記録、ディクテーション
06. 音声の録音と外部ファイルからのデータ取り込み
07. マルチメディア教材の応用例:複数の画像の操作と「透明」ボタン
08. 学習効果の分析:学習の前後における平均点の推移
00. プログラミングのココロ --- HSP3を例に ---
2022-05-26 sugiura@nagoya-u.jp
はじめに
プログラミングとは、命令を書いていくこと。
- 「アイデア(したいこと)を、どう表現したら良いか」
「プログラミング言語」
- 表現に使える「単語」と「文法」を知る。
- 言語」によって「単語」と「文法」が違う。
プログラミングで頭を使うところ
- 「単語」と「文法」を、どう組み合わせたら表現できるか。
- アイデアを、どういうふうに考えると表現しやすいか。
上達のコツ
- 参考書を手元におく
『オフィシャル HSP3でつくる!はじめてのプログラミングHSP3.6+3Dish入門』
- 「決まり文句」を覚える
- 自分のノートを作る
- 授業中、何を聞いてもよいですが、
- 聞いたことは必ずノートに書いてください。
- 同じことを二度聞いてはいけません。
HSPの特徴:なぜこんなマイナーなプログラミング言語を使うのか?
- もともと個人がコンピューターゲームを作るために作られた言語
- 英語の教材開発に必要な要素は、ゲーム開発に必要な要素と同じ
メリット
- 個人向け (大規模開発には向かない)
- 敷居が低い:使えるようになるまでが簡単(クリックしてインストールするだけ)
- 実行プログラムが簡単にできる(メニューから選ぶだけ)(HSP使ってない人も実行できる)
- 必要に応じて拡張できる
- 無料
注意点
- Windows用が基本
- 命令を文字で書いていく (GUIで「部品」を並べるわけではない)
- 事実上、日本でしか使われていない
- Windowsが日本語でない場合
- 地域と言語を日本・日本語に設定する
Documents in English
https://www.onionsoft.net/hsp/v36en/doclib/hsp3win.html
http://lhsp.s206.xrea.com/index.en.html
HSPのダウンロードとインストール
https://hsp.tv/idman/download.html
- 「Free Download HSP」をクリック
- ダウンロードしたファイル「hsp36.exe」をダブルクリックしてインストール
「WindowsによってPCが保護されました」と出たら、 「詳細情報」をクリックして、確認して、 「実行」する
注意点
- Windowsのファイルの拡張子を表示するように設定しておくこと
- HSPスクリプトエディタ―の「ツール」>「オプション」で、
- 左のメニューの「エディタ」>「表示」で、
- 「非文字の可視化」をすべてチェックを入れて表示するように設定
HSPの使い方
命令を書いて、実行する
- HSPスクリプトエディタ を起動する。
- 開いた画面に、命令(スクリプト)を書いていく。(例: mes "Hello")
- 命令を書いたら「メニュー」の「HSP」から「コンパイル+実行」を選んで、実行
- 「メニュー」>「ファイル」>「名前を付けて保存」
- 保存した場所を覚えておいてね
書いた命令を「コンパイル」して実行ファイルを作成する
- 「メニュー」の「HSP」から「実行ファイル自動作成」を選ぶ
- スクリプトファイルが保存されているフォルダー内に「hsptmp.exe」という実行ファイルができている
- このファイルがあなたが開発した「ソフトウェア」です。名前は適当に変えてよいです。
HSPの表記法
- 命令は、半角英数文字で。
- 「目的語」(引数)をとる命令もある。
- 原則、一文一命令。文末は「改行」
- (「:」(コロン)でつなげて「複文」にしてもよい。)
- コメントを書いておくこともできる。日本語OK。
- 「;」以降(より右側)はコメント
- 書く時の習慣:インデントで「レベル」をわけて見やすくする。
- 半角スペース
- タブ
- ★全角スペースはだめ!
命令の実行
1. 命令は、上から順番に実行されていく。(流れていくイメージ)
2. 命令は「段落」ごとに「ラベル」(見出し)をつけておく。
- ラベルの名前は、半角英数文字で、適当につける。
- ラベルの前に「*」をつける。(例: *step1)
- ラベルはインデントしない。
3.「段落」単位で順序を変えて実行させることもできる。 (流れを変える)
goto 行き先のラベル名
goto *step3
01. 文字、ボタン、ラベルと画像
01.1 HSPの基礎1:文字、ボタン、ラベル
HSPの練習 「プレゼンテーション」
- サンプルスクリプト: presentation.hsp(161)
作業手順
- HSPスクリプトエディターを起動する
- presentation.hsp ファイルを開く。
- 「ファイル」で「名前を付けて保存」(自分でフォルダーを決めておく)
- メニュー「HSP」から「コンパイル+実行」
コマンドの説明
- 文字列は引用符で囲む
- メニュー「ヘルプ」から「HSPキーワード検索」
pos font mes button stop cls wait end
- コメント「;」を使って、部分的に命令を実行しないようにしてある。
color
- 色の指定: R, G, B (それぞれ0から255の範囲で)
http://www.peko-step.com/tool/colorchart.html
checkColor.hsp
boxf
- 四角に塗りつぶす。colorで色を指定してから、これで範囲を指定(座標:左上・右下)
- コロン「:」を使って、二つの命令を一行に
ブロック(段落)ごとの流れを考える
*ラベル
で、ブロックに見出しをつけて、
button "Start", *step1
で行き先を指定する
「実行ファイル自動作成」
- ソースコードと同じフォルダー内に作成される「hsptmp.exe」
- 出来上がったファイル名(hsptmp)は自由に変えてよい。
- これを作っておけば、HSPがインストールされてないPCでも実行可能。
01.2 画像の利用
- サンプルスクリプト:presenPictures.hsp(131)
- 画像ファイルは、スクリプトと同じフォルダーに入れる。
- 例)flower.jpg(1227)
picload "ファイル名", オプション
- オプション
- 1 を指定して画像を表示
picload "flower.jpg", 1
- 事前に、表示する座標を指定する。
pos 200, 300 picload "flower.jpg", 1
画像の取り扱い
- Windowsの「ペイントツール」で手を加える。大きさ調整など。
- 「ツール」>「ペイントツールを開く」で開く。
- 画像ファイルは、HSPのスクリプトと同じフォルダーに保存すること。
01.3 簡単な教材「Fraction」
- bunsuu.hsp
bunsuu.hsp(67)
今日の課題
- 上で見たスクリプトをもとに、自己紹介、研究紹介、絵本、教材等を作ってください。
- これだけでも「文字」と「絵」を使った「教材」ができますね。
https://sugiura-ken.org/wiki/