計算ブロック～プラクティス～ 📖

指定された数のブロックをうまく積み上げ、一定のルールに従ってブロック操作が行われた後に目的の解になるようにするというゲームです。2007年1月に行われた大学入試センター試験の「情報関係基礎」で出題された「数字や演算記号（＋，－，×）が書かれたいくつかのブロックを積み上げ、定められたルールに従って計算しながらブロックを操作して消していくゲームを作る」というプログラミング問題を土台にしています。問題中で取り上げられたプログラムは、ルールに従ってブロックのデータを操作する部分だけでしたので、その通りにプログラミングしたとしても、ゲームにはなりません。そこで、実際に遊ぶことができるゲームにしてみようと、この「計算ブロック」をつくってみました。プラクティス版は、ゲームの遊び方を理解し、問題に正解するためのブロックの積み方を練習するバージョンです。全部で30問の練習問題が出題されます。このゲームを遊ぶことで、計算力はもちろん、記憶力や集中力を養うこともできるかもしれません。ぜひ、挑戦してみてください！

プログラム: (→大)
#計算ブロック～プラクティス～ 描画中キャンバスの「背景色」に「#ccffcc」をDOMスタイル設定。 全描画クリア。 kai=0。seikai=0。pseikai=0。 keisan=0。kosuu=0。demo=0。 blk=0。num=1。maxnum=30。 flg=0。bcheck=0。fail=0。 B=[0,1,2,3,4,5,6,7,8,9,「＋」,「－」,「×」,「空」,「消」] N=[0,3,5,5,5,7,7,7,7,9,9,9,9,9,11,11,11,11,11,13,13,13,13,15,15,15,15,17,17,17,17] K=[0,1,1,0,0,1,0,2,2,0,0,2,2,2,1,0,2,2,3,0,2,3,3,2,2,3,3,2,3,3,3] T0=[[「空」,「空」,「空」,「空」,「空」,「空」,「空」,「空」], [「空」,「空」,「空」,「空」,「空」,「空」,「空」,「空」], [「空」,「空」,「空」,「空」,「空」,「空」,「空」,「空」], [「空」,「空」,「空」,「空」,「空」,「空」,「空」,「空」]] T=[[「空」,「空」,「空」,「空」,「空」,「空」,「空」,「空」], [「空」,「空」,「空」,「空」,「空」,「空」,「空」,「空」], [「空」,「空」,「空」,「空」,「空」,「空」,「空」,「空」], [「空」,「空」,「空」,「空」,「空」,「空」,「空」,「空」]] P=[[「空」,「空」,「空」,「空」,「空」,「空」,「空」,「空」], [「空」,「空」,「空」,「空」,「空」,「空」,「空」,「空」], [「空」,「空」,「空」,「空」,「空」,「空」,「空」,「空」], [「空」,「空」,「空」,「空」,「空」,「空」,「空」,「空」]] D1=[[2,「×」,2,1,「＋」,2,「空」,「空」], [「空」,「空」,「－」,3,「空」,「空」,「空」,「空」], [「空」,「空」,「空」,「×」,「空」,「空」,「空」,「空」], [「空」,「空」,「空」,「空」,「空」,「空」,「空」,「空」]] D2=[[2,「×」,4,3,2,「空」,「空」,「空」], [1,「－」,「×」,「－」,「空」,「空」,「空」,「空」], [「空」,「空」,「空」,「空」,「空」,「空」,「空」,「空」], [「空」,「空」,「空」,「空」,「空」,「空」,「空」,「空」]] D3=[[2,「×」,4,3,1,「空」,「空」,「空」], [「空」,3,「－」,「×」,5,「空」,「空」,「空」], [「空」,「空」,「×」,「－」,「空」,「空」,「空」,「空」], [「空」,「空」,「空」,「空」,「空」,「空」,「空」,「空」]] S=[[0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0]] もし、「到達番号」が存在するならば、 　　「到達番号」を開いてnumに代入。 ここまで。 場面=「タイトル」。 タイトル画面表示。 描画中キャンバスをマウス押した時には 　　mx=マウスX。my=マウスY。 　　場面で条件分岐 　　　　「積み込み」ならば、 　　　　　　もし、（mx>564）かつ（mx<764）かつ（my>20）かつ（my<140）ならば、 　　　　　　　　blk=(INT((my-20)/40))*5+INT((mx-564)/40)。 　　　　　　　　部品選択。 　　　　　　　　もし、（blk=14）ならば、 　　　　　　　　　　T=T0を配列複製。 　　　　　　　　　　置場表示。 　　　　　　　　　　ブロック配置。 　　　　　　　　　　blk=0。 　　　　　　　　　　部品選択。 　　　　　　　　ここまで。 　　　　　　ここまで。 　　　　　　もし、（mx>35）かつ（mx<764）かつ（my>156）かつ（my<519）ならば、 　　　　　　　　x=INT((mx-35)/91)。 　　　　　　　　y=3-INT((my-156)/91)。 　　　　　　　　T[y][x]=B[blk]。 　　　　　　　　置場表示。 　　　　　　　　ブロック配置。 　　　　　　ここまで。 　　　　　　もし、（mx>516）かつ（mx<611）かつ（my>558）かつ（my<588）ならば、＃計算する 　　　　　　　　実行前確認。 　　　　　　　　もし、（bcheck=1）ならば、 　　　　　　　　　　P=Tを配列複製。 　　　　　　　　　　場面=「計算中」。 　　　　　　　　　　計算実行。 　　　　　　　　違えば、 　　　　　　　　　　「#000099」に塗色設定。 　　　　　　　　　　「24px sans-serif」に描画フォント設定。 　　　　　　　　　　[38,582]へ「積んだブロックの数がまちがっています！」を文字描画。 　　　　　　　　　　置場表示。 　　　　　　　　　　ブロック配置。 　　　　　　　　　　ボタン配置下部。 　　　　　　　　　　blk=0。 　　　　　　　　　　部品選択。 　　　　　　　　ここまで。 　　　　　　ここまで。 　　　　　　もし、（mx>656）かつ（mx<751）かつ（my>558）かつ（my<588）ならば、＃改解する 　　　　　　　　ボタン群消去。 　　　　　　　　問題表示。 　　　　　　ここまで。 　　　　ここまで。 　　　　「タイトル」ならば、 　　　　　　もし、（mx>48）かつ（mx<193）かつ（my>86）かつ（my<120）ならば、 　　　　　　　　場面=「積み込み」。 　　　　　　　　ブロック積み。 　　　　　　ここまで。 　　　　　　もし、（mx>218）かつ（mx<363）かつ（my>86）かつ（my<120）ならば、 　　　　　　　　場面=「遊び方」。 　　　　　　　　遊び方表示。 　　　　　　ここまで。 　　　　　　もし、（mx>388）かつ（mx<533）かつ（my>86）かつ（my<120）ならば、 　　　　　　　　場面=「デモ中」。 　　　　　　　　デモ実行。 　　　　　　ここまで。 　　　　　　もし、（mx>724）かつ（mx<764）かつ（my>100）かつ（my<140）ならば、 　　　　　　　　「開始を第1問からにします。よろしいですか？」と二択。 　　　　　　　　もし、それがはいならば、 　　　　　　　　　　「到達番号」をローカルストレージキー削除。 　　　　　　　　　　num=1 　　　　　　　　ここまで。 　　　　　　ここまで。 　　　　ここまで。 　　　　「遊び方」ならば、 　　　　　　　　場面=「ルール」。 　　　　　　　　ルール表示。 　　　　ここまで。 　　　　「ルール」ならば、 　　　　　　全描画クリア。 　　　　　　場面=「タイトル」。 　　　　　　タイトル画面表示。 　　　　ここまで。 　　　　「正解」ならば、 　　　　　　もし、（mx>516）かつ（mx<611）かつ（my>558）かつ（my<588）ならば、 　　　　　　　　メッセージ消去。 　　　　　　　　場面=「積み込み」。 　　　　　　　　ブロック積み。 　　　　　　ここまで。 　　　　　　もし、（mx>656）かつ（mx<751）かつ（my>558）かつ（my<588）ならば、 　　　　　　　　全描画クリア。 　　　　　　　　場面=「タイトル」。 　　　　　　　　タイトル画面表示。 　　　　　　ここまで。 　　　　ここまで。 　　　　「失敗」ならば、 　　　　　　もし、（mx>516）かつ（mx<611）かつ（my>558）かつ（my<588）ならば、 　　　　　　　　メッセージ消去。 　　　　　　　　場面=「積み込み」。 　　　　　　　　ブロック積み。 　　　　　　ここまで。 　　　　　　もし、（mx>656）かつ（mx<751）かつ（my>558）かつ（my<588）ならば、 　　　　　　　　全描画クリア。 　　　　　　　　場面=「タイトル」。 　　　　　　　　タイトル画面表示。 　　　　　　ここまで。 　　　　ここまで。 　　　　「終了」ならば、 　　　　　　全描画クリア。 　　　　　　場面=「タイトル」。 　　　　　　タイトル画面表示。 　　　　ここまで。 　　ここまで。 ここまで。 #----------------------------------------------------- ●ブロック積みとは 　　T=Pを配列複製。 　　ボタン群消去。 　　メッセージ消去。 　　問題表示。 　　置場表示。 　　ブロック配置。 　　ボタン配置下部。 　　blk=0。 　　部品選択。 ここまで。 ●計算実行とは 　　「#000099」に塗色設定。 　　「24px sans-serif」に描画フォント設定。 　　[38,582]へ「計算とブロック操作を実行中です。」を文字描画。 　　1秒待つ。 　　ブロック確認。 　　置場表示。 　　ブロック配置。 　　ブロック処理。 　　結果表示。 ここまで。 ●デモ実行とは 　　ボタン群消去。 　　メッセージ消去。 　　「#000000」に塗色設定。 　　「22px sans-serif」に描画フォント設定。 　　[38,110]へ「デモンストレーション」を文字描画。 　　0.5秒待つ。 　　「#000099」に塗色設定。 　　「24px sans-serif」に描画フォント設定。 　　[38,582]へ「デモンストレーション中です。」を文字描画。 　　0.5秒待つ。 　　ブロック確認。 　　置場表示。 　　ブロック配置。 　　ブロック処理。 　　結果表示。 ここまで。 ●実行前確認とは 　　メッセージ消去。 　　bcheck=0。 　　ブロック移動。 　　置場表示。 　　ブロック配置。 　　1秒待つ。 　　kosuu=0。 　　yを0から3まで繰り返す 　　　　xを0から7まで繰り返す 　　　　　　もし、T[y][x]=「空」ならば、 　　　　　　　　S[y][x]=0 　　　　　　違えば、 　　　　　　　　もし、(T[y][x]=「＋」)または(T[y][x]=「－」)または(T[y][x]=「×」)ならば、 　　　　　　　　　　S[y][x]=「演算」 　　　　　　　　違えば、 　　　　　　　　　　S[y][x]=「数」 　　　　　　　　ここまで。 　　　　　　　　kosuu=kosuu+1。 　　　　　　ここまで。 　　　　ここまで。 　　ここまで。 　　もし、（kosuu=N[num]）ならば、 　　　　bcheck=1。 　　ここまで。 ここまで。 ●タイトル画面表示とは 　　「#000000」に塗色設定。 　　「36px sans-serif」に描画フォント設定。 　　[38,50]へ「計算ブロック」を文字描画。 　　「24px sans-serif」に描画フォント設定。 　　[270,50]へ「～プラクティス～」を文字描画。 　　ボタン配置上部。 　　0に線太設定。赤色に線色設定。赤色に塗色設定。 　　demo=（3の乱数）+1。 　　もし、（demo=1）ならば、T=D1を配列複製。 　　もし、（demo=2）ならば、T=D2を配列複製。 　　もし、（demo=3）ならば、T=D3を配列複製。 　　部品配置。 　　ブロック確認。 　　置場表示。 　　ブロック配置。 　　「#000099」に塗色設定。 　　「24px sans-serif」に描画フォント設定。 　　[38,582]へ「上の3つのボタンのどれかをクリックしてください。」を文字描画。 ここまで。 ●ブロック確認とは 　　kosuu=0。 　　yを0から3まで繰り返す 　　　　xを0から7まで繰り返す 　　　　　　もし、T[y][x]=「空」ならば、 　　　　　　　　S[y][x]=0 　　　　　　違えば、 　　　　　　　　もし、(T[y][x]=「＋」)または(T[y][x]=「－」)または(T[y][x]=「×」)ならば、 　　　　　　　　　　S[y][x]=「演算」 　　　　　　　　違えば、 　　　　　　　　　　S[y][x]=「数」 　　　　　　　　ここまで。 　　　　　　　　kosuu=kosuu+1。 　　　　　　ここまで。 　　　　ここまで。 　　ここまで。 ここまで。 ●ブロック処理とは 　　flg=0 　　(flg=0)の間 　　　　keisan=0 　　　　xを１から6まで繰り返す 　　　　　　もし、（S[0][x-1]=「数」）かつ（S[0][x]=「演算」）かつ（S[0][x+1]=「数」）ならば、 　　　　　　　　もし、（T[0][x]=「＋」）ならば、 　　　　　　　　　　T[0][x]=T[0][x-1]+T[0][x+1] 　　　　　　　　違えば、 　　　　　　　　　　もし、（T[0][x]=「×」）ならば、 　　　　　　　　　　　　T[0][x]=T[0][x-1]*T[0][x+1] 　　　　　　　　　　違えば、 　　　　　　　　　　　　もし、（T[0][x]=「－」）ならば、 　　　　　　　　　　　　　　T[0][x]=T[0][x-1]-T[0][x+1] 　　　　　　　　　　　　ここまで。 　　　　　　　　　　ここまで。 　　　　　　　　ここまで。 　　　　　　　　T[0][x-1]=「空」 　　　　　　　　T[0][x+1]=「空」 　　　　　　　　kai=T[0][x]。 　　　　　　　　もし、（kai<-999）または（kai>999）ならば、 　　　　　　　　　　flg=1。 　　　　　　　　ここまで。 　　　　　　　　keisan=keisan+1。 　　　　　　　　ブロック確認。 　　　　　　　　置場表示。 　　　　　　　　ブロック配置。 　　　　　　　　1秒待つ。 　　　　　　ここまで。 　　　　ここまで。 　　　　xを0から7まで繰り返す 　　　　　　もし、(T[0][x]=「空」)ならば、 　　　　　　　　yを0から2まで繰り返す 　　　　　　　　　　T[y][x]=T[y+1][x] 　　　　　　　　ここまで。 　　　　　　　　T[3][x]=「空」 　　　　　　ここまで。 　　　　ここまで。 　　　　ブロック確認。 　　　　置場表示。 　　　　ブロック配置。 　　　　もし、(keisan=0)ならば、 　　　　　　flg=1。 　　　　違えば、 　　　　　　2秒待つ。 　　　　ここまで。 　　ここまで。 ここまで。 ●ブロック移動とは 　　yを3から1まで1ずつ減らし繰り返す 　　　　xを0から7まで繰り返す 　　　　　　もし、(T[y-1][x]=「空」)ならば、 　　　　　　　　T[y-1][x]=T[y][x] 　　　　　　　　T[y][x]=「空」 　　　　　　ここまで。 　　　　ここまで。 　　ここまで。 ここまで。 ●（x,yへcの）ブロック描画とは 　　s=「｛c｝」の文字数。 　　3に線太設定。灰色に線色設定。白色に塗色設定。 　　[x,y,88,88]へ四角描画。 　　黒色に塗色設定。 　　「36px sans-serif」に描画フォント設定。 　　[x+40-s*10,y+58]へcを文字描画。 ここまで。 ●（x,yへrの）ボタン描画とは 　　2に線太設定。「#888888」に線色設定。「#eeffee」に塗色設定。 　　[x+r,y+r]へrの円描画。 　　[x+r*6,y+r]へrの円描画。 　　[x+r,y,r*5-5,r*2]へ四角描画。 　　0に線太設定。「#eeffee」に線色設定。「#eeffee」に塗色設定。 　　[x+r,y+2,r*5-5,r*2-4]へ四角描画。 ここまで。 ●ボタン配置上部とは 　　iを0から2まで繰り返す 　　　　40+170*i,80へ23のボタン描画。 　　ここまで。 　　「16px sans-serif」に描画フォント設定。 　　「#000000」に塗色設定。 　　[57,108]へ「ゲームをはじめる」を文字描画。 　　[234,108]へ「遊び方・ルール」を文字描画。 　　[405,108]へ「デモを見てみる」を文字描画。 ここまで。 ●ボタン配置下部とは 　　iを0から1まで繰り返す 　　　　500+140*i,555へ18のボタン描画。 　　ここまで。 　　「22px sans-serif」に描画フォント設定。 　　「#000000」に塗色設定。 　　[521,581]へ「計算する」を文字描画。 　　[661,581]へ「改解する」を文字描画。 ここまで。 ●ブロック配置とは 　　yを0から3まで繰り返す 　　　　xを0から7まで繰り返す 　　　　　　もし、T[y][x]<>「空」ならば、 　　　　　　　　bx=36+x*91。by=431-y*91。 　　　　　　　　bx,byへT[y][x]のブロック描画。 　　　　　　ここまで。 　　　　ここまで。 　　ここまで。 ここまで。 ●置場表示とは 　　0に線太設定。「#ccffcc」に線色設定。「#ccffcc」に塗色設定。 　　[25,150,750,381]へ四角描画。 　　1に線太設定。 　　「#888888」に線色設定。 　　yを0から4まで繰り返す 　　　　[35, 520-y*91]から[764, 520-y*91]まで線描画。 　　ここまで。 　　xを0から8まで繰り返す 　　　　[35+x*91, 156]から[35+x*91, 519]まで線描画。 　　ここまで。 　　0に線太設定。「#885555」に線色設定。「#885555」に塗色設定。 　　[25,520,750,25]へ四角描画。 ここまで。 ●問題表示とは 　　もし、（fail=0）ならば、 　　　　pseikai=seikai 　　　　keta=K[num] 　　　　ketaで条件分岐 　　　　　　0ならば、seikai=（101の乱数）-50。ここまで。 　　　　　　1ならば、seikai=（19の乱数）-9。ここまで。 　　　　　　2ならば、seikai=（（81の乱数）+10）*（（2の乱数）*2-1）。ここまで。 　　　　　　3ならば、seikai=（501の乱数）+100。ここまで。 　　　　ここまで。 　　　　もし、（N[num]<6）かつ（seikai<0）ならば、 　　　　　　seikai=seikai*(-1)。 　　　　ここまで。 　　　　もし、（seikai=pseikai）ならば、 　　　　　　もし、（seikai>0）ならば、 　　　　　　　　seikai=seikai-（5の乱数）-1。 　　　　　　違えば、 　　　　　　　　seikai=seikai+（5の乱数）+1。 　　　　　　ここまで。 　　　　ここまで。 　　ここまで。 　　「#000000」に塗色設定。 　　「22px sans-serif」に描画フォント設定。 　　[38,110]へ「第｛num｝問　ブロックを｛N[num]｝個積んで、解を｛seikai｝にせよ。」を文字描画。 ここまで。 ●結果表示とは 　　メッセージ消去。 　　「#000099」に塗色設定。 　　「24px sans-serif」に描画フォント設定。 　　もし、場面=「計算中」ならば、 　　　　もし、（kosuu=1）かつ（kai=seikai）ならば、 　　　　　　[38,582]へ「正解！　次の問題に進みます。」を文字描画。 　　　　　　もし、（num=maxnum）ならば、 　　　　　　　　完答処理。 　　　　　　違えば、 　　　　　　　　num=num+1。 　　　　　　　　numを「到達番号」に保存。 　　　　　　　　fail=0。 　　　　　　　　場面=「正解」。 　　　　　　ここまで。 　　　　違えば、 　　　　　　[38,582]へ「失敗！　同じ問題をやり直します。」を文字描画。 　　　　　　fail=1。 　　　　　　場面=「失敗」。 　　　　ここまで。 　　　　もし、（場面<>「終了」）ならば、 　　　　　　iを0から1まで繰り返す 　　　　　　　　500+140*i,555へ18のボタン描画。 　　　　　　ここまで。 　　　　　　「24px sans-serif」に描画フォント設定。 　　　　　　「#000000」に塗色設定。 　　　　　　[528,582]へ「続ける」を文字描画。 　　　　　　[668,582]へ「やめる」を文字描画。 　　　　ここまで。 　　ここまで。 　　もし、場面=「デモ中」ならば、 　　　　もし、（kosuu=1）ならば、 　　　　　　[38,582]へ「成功！　解は｛kai｝です。画面をクリックすると、はじめに戻ります。」を文字描画。 　　　　違えば、 　　　　　　[38,582]へ「失敗！　画面をクリックすると、はじめに戻ります。」を文字描画。 　　　　ここまで。 　　　　場面=「終了」。 　　ここまで。 ここまで。 ●部品配置とは 　　0に線太設定。「#888888」に線色設定。「#ffffff」に塗色設定。 　　[564,20,200,120]へ四角描画。 　　1に線太設定。 　　「#888888」に線色設定。 　　yを0から3まで繰り返す 　　　　[564, 20+y*40]から[764, 20+y*40]まで線描画。 　　ここまで。 　　xを0から5まで繰り返す 　　　　[564+x*40, 20]から[564+x*40, 140]まで線描画。 　　ここまで。 　　「#ffff00」に塗色設定。 　　[724,100,40,40]へ四角描画。 　　黒色に塗色設定。 　　「24px sans-serif」に描画フォント設定。 　　iを0から14まで繰り返す 　　　　x=i%5 　　　　y=INT(i/5) 　　　　x0=576 　　　　もし、（i>9）ならば、x0=573。 　　　　[x0+x*40,49+y*40]へB[i]を文字描画。 　　ここまで。 　　#[[755,120],[734,109],[734,131]]で多角形描画。 ここまで。 ●部品選択とは 　　部品配置。 　　x=blk%5 　　y=INT(blk/5) 　　3に線太設定。「#ff0000」に線色設定。 　　[564+x*40+1,20+y*40+1]から[564+x*40+39,20+y*40+1]まで線描画。 　　[564+x*40+39,20+y*40+1]から[564+x*40+39,20+y*40+38]まで線描画。 　　[564+x*40+39,20+y*40+38]から[564+x*40+1,20+y*40+38]まで線描画。 　　[564+x*40+1,20+y*40+38]から[564+x*40+1,20+y*40+1]まで線描画。 ここまで。 ●ボタン群消去とは 　　0に線太設定。「#ccffcc」に線色設定。「#ccffcc」に塗色設定。 　　[38,78,504,75]へ四角描画。 ここまで。 ●メッセージ消去とは 　　0に線太設定。「#ccffcc」に線色設定。「#ccffcc」に塗色設定。 　　[25,549,750,45]へ四角描画。 ここまで。 ●完答処理とは 　　メッセージ消去。 　　「#ffffff」に塗色設定。 　　「48px sans-serif」に描画フォント設定。 　　[140,220]へ「おめでとうございます！」を文字描画。 　　「#ff0000」に塗色設定。 　　[142,222]へ「おめでとうございます！」を文字描画。 　　「#000000」に塗色設定。 　　「24px sans-serif」に描画フォント設定。 　　[100,280]へ「あなたは、すべての問題に正解することができました。」を文字描画。 　　[123,320]へ「ぜひ、タイムトライアル版に挑戦してみてください！」を文字描画。 　　「#000099」に塗色設定。 　　「24px sans-serif」に描画フォント設定。 　　[38,582]へ「画面をクリックすると、はじめに戻ります。」を文字描画。 　　「到達番号」をローカルストレージキー削除。 　　num=1。 　　P=T0を配列複製。 　　場面=「終了」。 ここまで。 ●遊び方表示とは 　　ボタン群消去。 　　メッセージ消去。 　　置場表示。 　　1に線太設定。「#ffffff」に線色設定。 　　iを0から181まで繰り返す 　　　　[35,156+2*i]から[764, 156+2*i]まで線描画。 　　ここまで。 　　jを0から363まで繰り返す 　　　　[35+2*j, 156]から[35+2*j, 519]まで線描画。 　　ここまで。 　　「#000099」に塗色設定。 　　「24px sans-serif」に描画フォント設定。 　　[45,140]へ『「計算ブロック」の遊び方』を文字描画。 　　「16px sans-serif」に描画フォント設定。 　　lx=45。ly=180。 　　[lx,ly]へ『　「ブロックを7個積んで、解を80にせよ。」というような問題が出題されます。0から9までの』を文字描画。 　　[lx,ly+30]へ『「数字ブロック」と＋，－，×の「演算ブロック」が用意されていますので、それらのブロックを』を文字描画。 　　[lx,ly+60]へ『指定された数だけ積み上げます。右上の「道具箱」から置きたいブロックをクリックして選択し、』を文字描画。 　　[lx,ly+90]へ『8×4のマスのどこかをクリックすると、そのマスに選択したブロックを置くことができます。』を文字描画。 　　[lx,ly+120]へ『「空」を選択した場合は、クリックしたマスが空白に戻ります。「消」をクリックした場合は、』を文字描画。 　　[lx,ly+150]へ『置き場のすべてのマスが空白に戻ります。うっかりクリックしないように注意してください。』を文字描画。 　　[lx,ly+180]へ『　ブロックを積み終えたら、画面右下にあるボタン（計算する）をクリックします。すると、』を文字描画。 　　[lx,ly+210]へ『あるルールに従ってブロックが操作され、ブロックの個数が減っていきます。最終的に2つ以上の』を文字描画。 　　[lx,ly+240]へ『ブロックが残ってしまったら失敗です。1つのブロックだけが残ったら、そこに書かれている数が』を文字描画。 　　[lx,ly+270]へ『解となります。その解が問題で要求されている解と一致すれば、「正解」となります。』を文字描画。 　　[lx,ly+300]へ『　ブロック操作のルールは、はじめの画面の（デモを見てみる）をクリックしてみてください。』を文字描画。 　　[lx,ly+330]へ『ブロックが操作される様子を見ることができます。ルールの詳細は、次のページでご説明します。』を文字描画。 　　「24px sans-serif」に描画フォント設定。 　　[38,582]へ「画面をクリックすると、ブロック操作のルール説明に進みます。」を文字描画。 ここまで。 ●ルール表示とは 　　ボタン群消去。 　　メッセージ消去。 　　置場表示。 　　1に線太設定。「#ffffff」に線色設定。 　　iを0から181まで繰り返す 　　　　[35,156+2*i]から[764, 156+2*i]まで線描画。 　　ここまで。 　　jを0から363まで繰り返す 　　　　[35+2*j, 156]から[35+2*j, 519]まで線描画。 　　ここまで。 　　「#000099」に塗色設定。 　　「24px sans-serif」に描画フォント設定。 　　[45,140]へ『ブロック操作のルール』を文字描画。 　　「16px sans-serif」に描画フォント設定。 　　lx=45。ly=180。 　　[lx,ly]へ『1．ブロックは1段に8個まで並べることができ、4段まで積み上げることができます。』を文字描画。 　　[lx,ly+30]へ『2．「計算」によって3つのブロックを1つのブロックに置き換えます。』を文字描画。 　　[lx,ly+60]へ『3．「計算」は、最下段のみを対象とし、左端から順に計算可能な組み合わせを調べます。』を文字描画。 　　[lx,ly+90]へ『　計算可能な組み合わせは、「2つの数字ブロックの間に演算ブロックが1つある」という形の』を文字描画。 　　[lx,ly+120]へ『　3つのブロックのみとします。計算後は、中央の演算ブロックを計算結果の数値が書かれた数字』を文字描画。 　　[lx,ly+150]へ『　ブロックと置き換え、左右の数字ブロックは取り除きます。この作業を右端まで繰り返します。』を文字描画。 　　[lx,ly+180]へ『4．取り除かれたブロックがある場合は、その上のすべてのブロックを1マスずつ落下させます。』を文字描画。 　　[lx,ly+210]へ『5．最下段で一度も「計算」が成立しない場合、その時点で操作終了となります。』を文字描画。 　　[lx,ly+240]へ『6．計算結果は-999～999の範囲でなければなりません。その範囲から外れた場合、その時点で』を文字描画。 　　[lx,ly+270]へ『　操作終了となります。』を文字描画。 　　[lx,ly+308]へ『　ブロックが1つのみ残った状態となることを目指して、ブロックをうまく積んでください！』を文字描画。 　　[lx+620,ly+330]へ『Hanako.S』を文字描画。 　　「24px sans-serif」に描画フォント設定。 　　[38,582]へ「画面をクリックすると、はじめの画面に戻ります。」を文字描画。 ここまで。