電子マネーのカードを利用する社会を、プログラミングを通して学習していきます。電子マネー(自分でチャージした分だけ使える「プリペイド式」)を利用することで実行される処理には、どのようなことが行われているのかを学んでいきます。
チャージから始まり、コンビニエンスストアで電子マネーを利用するまでを疑似体験しながら、必要な処理や含まれる条件による分岐処理、お金の流れはどのようになっているのかを学習します。
情報化社会では、コンピュータを利用する「利用者(消費者)」という立場とそのコンピュータを開発した「生産者(販売会社)」という立場が存在することを意識して学ぶことは非常に大切なことです。
また、今回のプログラムではステージを「画面」に見立て、他の様々なプログラムでも利用できる『画面切り替え(画面制御)』を同時に学ぶことで、汎用性の高い思考力を磨くことができるかと思います。
■ 全体設計(画面遷移図) |
■ プログラム処理概要 |
1.メニュー画面の[入金(チャージ)]ボタン押下で、チャージ画面を表示する。 スプライト画像が押されたら、ステージ(背景)を切り替える。 2.メニュー画面上のすべてのボタンを非表示にし、チャージ画面上のすべてのボタンを表示する。 ※ 以下、画面が切り替わるたびに同様のスプライト表示非表示制御処理を実行する。 3.チャージ画面で、チャージ金額を選択し、入力された金額(入力値)を[残高]変数に格納する。 チャージ金額と入力値が等しければ、チャージ完了メッセージを表示し、メニュー画面に戻る。 等しくなければ、チャージキャンセル処理を実行する。 4.メニュー画面の[商品選択]ボタン押下で、商品選択画面を表示する。(表示制御) 5.商品選択画面の[商品]ボタン押下で、[精算]変数に商品金額を加算する。(商品の複数選択可) [お支払い]ボタン押下で、精算画面を表示する。(表示制御) 6.精算画面で、カードリーダーに電子マネーカードをタッチすると、精算金額と残高を比較する。 残高不足の場合、不足メッセージを表示し、商品選択画面に戻る。(表示制御) 残高不足がなければ、[残高]変数から[精算]変数を差し引き、メニュー画面に戻る。(表示制御) ※このメニュー画面というものを作成しておくと、機能拡張という発想が容易になります。 新たなメニューボタンを増やし、それを押すと新たな画面が表示されるという発想です。 例えば今回のサンプルプログラムでは、「残高照会」や「自動販売機での購入」などが考えられます。 |
■ 画面(ステージ)設計 | |
▼メニュー画面 [入金(チャージ)]ボタンの配置 ① ボタン押下で「入金」画面を表示する 実際にはステージ(背景)を切り替える [商品購入]ボタンの配置 ② ボタン押下で「商品選択」画面を表示する ※空白スペースは予約スペースとして、新たにボタン (機能拡張)を追加するために空けています。 |
|
▼入金(チャージ)画面 ① 電子マネーカードを挿入口に挿入する ② チャージ金額ボタンを押す ③ 入力ボックスを表示し、数値を入力することで実際にお金を入れたようにみせる ④ 入金完了メッセージを表示する 入力金額に過不足があればメッセージを表示 ⑤ 過不足がなければ[残高]変数に入力値を格納 ⑥ メニュー画面に戻る ・ [戻る]ボタン:メニュー画面に戻る ・ [キャンセル]:挿入したカードを返却する |
|
▼商品選択画面 ① [商品]ボタンを押す(複数選択可) ② [精算]変数に当該商品の料金を加算する [商品]ボタン再押下で[精算]変数を減算する ③ [お支払い]ボタンを表示する ④ [お支払い]ボタン押下で[精算]画面を表示する ・ [戻る]ボタン:メニュー画面に戻る ・ [キャンセル]:[精算]変数をゼロクリアする [お支払い]ボタンを非表示にする |
|
▼精算画面 ① 精算金額を画面に表示する ② 電子マネーカードを表示する ③ 電子マネーカードをカードリーダーにタッチする [残高]変数から[精算]変数を差し引く ④ 残高が不足していれば不足メッセージを表示する 商品選択画面に戻る ⑤ 残高に不足がなければ「ありがとうございました」 と表示し、メニュー画面に戻る ・ [戻る]ボタン:商品選択画面に戻る |
入金(チャージ)プログラムのフローチャートだけですが、以下のようになります。プログラムからフローチャートを描くのは難しいですが、児童の習得レベルに応じて「チャレンジ課題」としても良いかもしれません。
▼続きはこちら
前掲のレジ精算のプログラムに対して、条件を追加したフローチャートを完成させましょう。 【課題】あなたは、スーパーで買い物をする。それをセルフではなく、 レジ係のいるレジで精算する。 【条件】ただし、割引対象の商品も […]
▼続きはこちら 前掲のレジ精算のプログラムに対して、条件を追加したフローチャートを完成させましょう。 【課題】あなたは、スーパーで買い物をする。それをセルフではなく、 レジ係のいるレジで精算する。 【条件】ただし、 […]
課題:あなたは各駅停車の電車に乗って、目的地A駅で降りる。 【指導1】前提条件として、『あなたと電車の動作をそれぞれ分けて描くこと。電車に乗ったところから スタートする。ただし、乗り換えはなく、A駅は終点ではない […]
課題:あなたは路線バスに乗って、目的地A停留所で降りる。 【指導1】前提条件として『あなたと路線バスの動作をそれぞれに分けて描くこと。路線バスに乗るところからスタートする。ただし、運賃は乗車時に支払い、乗り換えはなく、A […]
救命措置の流れ(AEDの使用と心肺蘇生) 次は、アンプラグド・プログラミングの題材にふさわしい「救命措置の流れ(AEDの使用と心肺蘇生)」です。順番が違った、やるべきことが抜けた、判断を間違えた場合、救える命も救えなくな […]
課題:あなたは横断歩道を“安全に”渡ります。 これまで、アンプラグド・プログラミングの課題の問題点を解消すべく、レーンやステップを組み合わせたフローチャートの描き方を述べてきましたが、次は、交差点の横断歩道を“安全”に渡 […]