(57)【要約】【課題】プログラミングを効果的に学習できるプログラミング学習システム、プログラミング学習用プログラム、およびプログラミング学習方法を提供する。【解決手段】プログラミング学習システム１として、メニュー機能部５３に、プログラミング学習画面１９０によりプログラミングにおける部分学習を行う部分学習処理に移行する種類別部分学習ボタン１３１と、複数の前記種類別部分学習ボタン１３１による部分学習の完了後に選択可能となる総合学習ボタン１３２とを備え、出題内容表示部と、前記コード入力部と、前記プレビュー表示部について、それぞれの大きさおよび配置を、学習する前記プログラミングコードの内容に応じて変化させる表示サイズ変更部５８を備えた構成とした。【選択図】図１０
2020140151.tif 000002
【特許請求の範囲】
【請求項１】
メニュー画面を表示するメニュー画面表示手段と、
出題内容を表示する出題内容表示部とプログラミングコードの入力を受け付けるコード入力部と入力結果を表示するプレビュー表示部を有する学習画面表示手段とを備え、
前記メニュー画面表示手段は、
前記学習画面表示手段によりプログラミングにおける部分学習を行う部分学習処理に移行する部分学習用選択部と、
複数の前記部分学習用選択部による部分学習の完了後に選択可能となる総合学習用選択部とを備え、
前記総合学習用選択部が選択されると、複数の前記部分学習用選択部による前記部分学習処理で学んだ全ての部分学習を総合的に用いて学ぶ総合学習処理に移行する構成であり、
前記出題内容表示部と、前記コード入力部と、前記プレビュー表示部について、それぞれの大きさおよび配置を、学習する前記プログラミングコードの内容に応じて変化させる表示サイズ変更手段を備えた
プログラミング学習システム。
【請求項２】
前記表示サイズ変更手段は、
前記プレビュー表示部を画面の左右のどちらか一方にて画面の上下方向の８０％以上を示す大きさで表示し、かつ、前記出題内容表示部と前記コード入力部を他方に上下に並べて表示する縦長プレビュー画面確認モードと、
前記プレビュー表示部を画面の上下のどちらか一方にて画面の左右方向の８０％以上を示す大きさで表示し、かつ、前記出題内容表示部と前記コード入力部を他方に上下に並べて表示する横長プレビュー画面確認モードとを有する
請求項１記載のプログラミング学習システム。
【請求項３】
前記学習画面表示手段における前記コード入力部は、
コードの入力ができるコード入力行を複数行表示し、
当該複数行のコード入力行のうち出題内容表示部により入力を求めているコード入力行のみを利用者が入力可能とし、その他のコード入力行を変更不可とする構成である
請求項１または２記載のプログラミング学習システム。
【請求項４】
コンピュータを、
メニュー画面を表示するメニュー画面表示手段と、
出題内容を表示する出題内容表示部とプログラミングコードの入力を受け付けるコード入力部と入力結果を表示するプレビュー表示部を有する学習画面表示手段として機能させるプログラミング学習用プログラムであって、
前記メニュー画面表示手段に、
前記学習画面表示手段によりプログラミングにおける部分学習を行う部分学習処理に移行する部分学習用選択部と、
複数の前記部分学習用選択部による部分学習の完了後に選択可能となる総合学習用選択部とを備えさせ、
前記出題内容表示部と、前記コード入力部と、前記プレビュー表示部について、それぞれの大きさおよび配置を、学習する前記プログラミングコードの内容に応じて変化させる表示サイズ変更手段を備えた構成である
プログラミング学習用プログラム。
【請求項５】
メニュー画面表示手段によりメニュー画面を表示し、
学習画面表示手段により、出題内容を出題内容表示部に表示しプログラミングコードの入力をコード入力部により受け付け入力結果をプレビュー表示部に表示するプログラミング学習方法であって、
前記メニュー画面表示手段に、
前記学習画面表示手段によりプログラミングにおける部分学習を行う部分学習処理に移行する部分学習用選択部と、
複数の前記部分学習用選択部による部分学習の完了後に選択可能となる総合学習用選択部とを備えさせ、
前記出題内容表示部と、前記コード入力部と、前記プレビュー表示部について、それぞれの大きさおよび配置を、学習する前記プログラミングコードの内容に応じて変化させる表示サイズ変更手段を備えた構成である
プログラミング学習方法。
【発明の詳細な説明】
【技術分野】
【０００１】
この発明は、プログラミングを学習できるプログラミング学習システム、プログラミング学習用プログラム、およびプログラミング学習方法に関するものである。
【背景技術】
【０００２】
従来、プログラミングなどの学習は、講師が生徒に知識を伝える形で行われる。その際に、コンピュータを実際に用いてプログラミングのコードを入力し、そのコードによる結果を表示させて、学ぶといったことも行われている。このような学習方法は、あらかじめ決められた曜日、時間に生徒が教室に通う必要がある。このため、忙しく日々のスケジュールもよく変わる社会人などには、定期的にきちんと通って学習を継続することが難しく、一度遅れるとついていくことがより難しいという問題点がある。
【０００３】
一方で、学習に関するシステムとして、そろばんネットワークシステムが提案されている（特許文献１参照）。このそろばんネットワークシステムは、複数のユーザ（生徒側）端末と双方向に通信可能に接続するサーバ機（塾側）を利用し、ユーザ端末にはそろばん問題を表示して解答入力を受けつけ、そろばん問題の解答と解答時間を関連付けて記憶し、解答、得点（正解率）および解答時間を含む成績をサーバ機に送信でき、成績リストを作成できるものとされている。これにより、誰でも自宅で好きな時間にそろばんを習得でき、実際のそろばんの試験や練習に近い形式で演習できるとされている。
【０００４】
しかしながら、このそろばんネットワークシステムは、単に出題し、解答の入力を受け付けるだけであり、学習効果を高める工夫に乏しいものであった。
【先行技術文献】
【特許文献】
【０００５】
【特許文献１】特開２００２−２２９４３６号公報
【発明の概要】
【発明が解決しようとする課題】
【０００６】
この発明は、上述した問題点に鑑み、プログラミングを効果的に学習できるプログラミング学習システム、プログラミング学習用プログラム、およびプログラミング学習方法を提供し、利用者の満足度を向上させることを目的とする。
【課題を解決するための手段】
【０００７】
この発明は、メニュー画面を表示するメニュー画面表示手段と、出題内容を表示する出題内容表示部とプログラミングコードの入力を受け付けるコード入力部と入力結果を表示するプレビュー表示部を有する学習画面表示手段とを備え、前記メニュー画面表示手段は、前記学習画面表示手段によりプログラミングにおける部分学習を行う部分学習処理に移行する部分学習用選択部と、複数の前記部分学習用選択部による部分学習の完了後に選択可能となる総合学習用選択部とを備え、前記出題内容表示部と、前記コード入力部と、前記プレビュー表示部について、それぞれの大きさおよび配置を、学習する前記プログラミングコードの内容に応じて変化させる表示サイズ変更手段を備えた構成であるプログラミング学習システム、プログラミング学習用プログラム、およびプログラミング学習方法であることを特徴とする。
【発明の効果】
【０００８】
この発明により、プログラミングを効果的に学習できるプログラミング学習システム、プログラミング学習用プログラム、およびプログラミング学習方法を提供することができる。
【図面の簡単な説明】
【０００９】
【図１】プログラミング学習システムのシステム構成を示すブロック図。
【図２】サーバの制御部が実行する機能の機能ブロック図。
【図３】マップ画面とイベント画面の説明図。
【図４】メニュー画面と学習モジュール購入画面の説明図。
【図５】ジェム一覧画面とブック一覧画面の説明図。
【図６】カード一覧画面とステータス画面の説明図。
【図７】プログラミング学習画面の説明図。
【図８】イベント画面の他の例を示す説明図。
【図９】部分学習と総合学習のプログラミング学習画面の説明図。
【図１０】プログラミング学習画面の説明図の説明図。
【発明を実施するための形態】
【００１０】
以下、この発明の一実施形態を図面と共に説明する。
【実施例】
【００１１】
図１は、プログラミング学習システム１のシステム構成を示すブロック図である。このプログラミング学習システム１は、１つの統一された世界観でゲームのように構成されている。すなわち、「プログラミング」を「魔法」として、失われた「魔法」（すなわち「プログラミング」）をユーザが発見・学ぶことで、危機に陥っている魔法学園を救うというストーリーになっている。したがって、プログラムを学ぶことがゲームを進めることと一致するように、ゲーム感覚でプログラミングを学べるように構成されている。
【００１２】
プログラミング学習システム１は、インターネット３に通信可能に接続されたサーバ２、および複数のユーザ端末４により構成されている。
【００１３】
サーバ２は、制御部２１、入力部２３、表示部２４、通信部２５、および記憶部２７を備えている。
ユーザ端末４は、制御部４１、入力部４３、表示部４４、通信部４５、音声出力部４６、および記憶部４７を備えている。
【００１４】
サーバ２は、サーバコンピュータで構成されており、ユーザ端末４はデスクトップパソコンまたはノートパソコン等のパーソナルコンピュータにより構成されている。
【００１５】
いずれもハードウェア要素としてＣＰＵとＲＯＭとＲＡＭ等で構成されて各種演算や制御動作を実行する制御部（２１、４１）、キーボードおよびマウスで構成されてユーザ操作による入力を受け付ける入力部（２３、４３）、液晶ディスプレイや有機ＥＬディスプレイ等で構成されて文字や図等の画像を表示する表示部（２４、４４）、ＬＡＮボードやＷｉＦｉユニット等で構成されて有線または無線での通信を実行する通信部（２５、４５）、および、ハードディスクやフラッシュメモリ等で構成されて情報の読み書きを許容する記憶部（２７、４７）を備えている。また、ユーザ端末４は、スピーカ等で構成されて音声を出力する音声出力部４６をさらに備えている。
【００１６】
サーバ２の記憶部２７は、ユーザ端末４からのアクセスを受け付けてプログラミングの学習を実行する学習用プログラム２７ａ（プログラミング学習用プログラム）と、学習用プログラム２７ａが使用する学習用データ２７ｂと、ユーザの情報を記憶するユーザデータ２７ｃとを記憶している。
【００１７】
学習用プログラム２７ａは、学習用データ２７ｂを用いて学習用のプログラムを実行する。この学習用プログラム２７ａは、学習用データ２７ｂとして記憶されている複数の種類別学習用データのうち、ユーザに購入された種類別学習用データを用いた学習のプログラムを実行する。
【００１８】
学習用データ２７ｂは、複数の種類別学習用データを記憶している。種類別学習データは、最も小さい単位である部分学習データで構成される種類別部分学習データ（ジェムデータ）と、部分学習データが複数集まったセット学習データで構成される種類別セット学習データ（サークルデータ）と、セット学習データが複数集まってストーリーと共に構成されている種類別ストーリー学習データ（ブックデータ）をそれぞれ複数記憶している。
【００１９】
ユーザデータ２７ｃは、ユーザＩＤやパスワードで構成されるユーザ識別データと、ユーザの氏名や住所や電話番号やＥメールアドレスで構成されるユーザ個人データと、クレジットカード番号や購入用のポイントなどの決済用のデータで構成される決済データと、購入したブックやジェム等の購入データと、ユーザのステータスを示すステータスデータと、ブックやジェム単位でどこまでクリアしたか（学習を進めたか）を示すクリアデータをユーザ別に記憶している。
【００２０】
ユーザ端末４は、ユーザの操作入力に応じて本システムにおける各種動作を実行するためのユーザプログラム４７ａと、本システムの利用に必要となるユーザデータ４７ｃとを記憶している。
【００２１】
この実施例では、ユーザプログラム４７ａとしては、インターネット上のホームページ等にアクセスするブラウザプログラムを用いる構成としているが、専用のユーザプログラムを用いる構成としてもよい。ユーザデータ４７ｃは、少なくともユーザＩＤなどのユーザを特定するためのデータが記憶されている。
【００２２】
図２は、プログラミング学習システム１のサーバ２の制御部２１がユーザ端末４からのアクセスに応答して学習用プログラム２７ａにより実行する機能の機能ブロック図である。図３〜図９は、各機能部（５１〜５７）によってユーザ端末４の表示部４４に表示させる各種画面の説明図である。
【００２３】
学習用プログラム２７ａを実行する制御部２１は、マップ機能部５１、イベント処理部５２（パズル問題出題手段）、メニュー機能部５３（メニュー画面表示手段）、学習モジュール購入機能部５４、学習モジュール管理機能部５５、ステータス機能部５６（学習レベル表示手段）、および学習機能部５７（学習画面表示手段）を有している。
【００２４】
マップ機能部５１は、図３（Ａ）に示すマップ画面１００を表示し、エリア１０２（１０２ａ，１０２ｂ，１０２ｃ）の選択を受け付ける。１つのエリア１０２が選択されると、そのエリア１０２に設定されている別の画面、例えば別のマップ画面１００、イベント画面１１０（図３（Ｂ）参照）また、メニュー画面１２０（図４（Ａ）参照）を表示する。
【００２５】
図示の４階のマップ画像１００の例では、エリア１０２ａ「４階の扉」が選択されると、イベント画面１１０（図３（Ｂ）参照）を表示し、エリア１０２ｂ「３階へ」が選択されると、３階のマップ画像１００（図示省略）を表示し、エリア１０２ｃ「５階へ」が選択されると、５階のマップ画像１００（図示省略）を表示する。
【００２６】
イベント処理部５２は、図３（Ｂ）に示すイベント画面１１０を表示し、イベントを進める。イベント画面１１０は、画面の大部分を占める背景画像１１１と、その背景画像１１１の前面に重ねて表示されるキャラクタ画像１１２と、キャラクタのセリフとしてメッセージが表示されるメッセージ画像１１３が表示される。
【００２７】
このイベント処理部５２は、ユーザがユーザ端末４の入力部４３によりエンターキーの押下やマウスクリック等の操作を行う毎に、メッセージ画像１１３を次のメッセージ画像１１３に切り替える、キャラクタ画像１１２を表示し、消去し、あるいは他のキャラクタへの切り替える、背景画像１１１を切り替えるといった処理を行い、ストーリーを進めて行く。
【００２８】
イベント処理部５２は、イベント画面１１０でイベント部分のストーリーを進めた後、マップ機能部５１、メニュー機能部５３、または学習機能部５７へ移行する。マップ機能部５１、メニュー機能部５３、および学習機能部５７のどれへ移行するかは、そのときのストーリーによりあらかじめ決定されている。
【００２９】
このマップ機能部５１とイベント処理部５２により、ユーザは、ロールプレイングゲームを楽しむようにしてプログラミングの学習を進めて行くことができる。すなわち、マップ画面１００で移動をしながら、イベント画面１１０でのイベントを進め、そのイベントを含めたストーリーの中で求められるプログラミングの知識を学習するという形で学ぶことができる。
【００３０】
メニュー機能部５３は、図４（Ａ）に示すメニュー画面１２０を表示し、メニュー処理を実行する。メニュー画面１２０は、ショップボタン１２４、ジェム一覧表示ボタン１２５（種類別部分学習一覧表示ボタン）、ブック一覧表示ボタン１２６（種類別ストーリー学習一覧表示ボタン）、カード一覧表示ボタン１２７、ステータス表示ボタン１２８、サークル表示領域１３４（種類別セット学習ユニット表示領域）、およびサークル表示領域切替ボタン１３５（種類別セット学習ユニット表示領域切替ボタン）を表示している。
【００３１】
ショップボタン１２４は、選択されると学習モジュール購入機能部５４を起動し、ブックやジェムやはがきの購入操作を受け付ける。
ジェム一覧表示ボタン１２５は、選択されると学習モジュール管理機能部を起動し、ジェムの管理操作を受け付ける。
【００３２】
ブック一覧表示ボタン１２６は、選択されると学習モジュール管理機能部５５を起動し、ブックの管理操作を受け付ける。
カード一覧表示ボタン１２７は、選択されると学習モジュール管理機能部５５を起動し、カードの管理操作を受け付ける。
【００３３】
ステータス表示ボタン１２８は、選択されるとステータス機能部５６を起動し、ステータスの確認を受け付ける。
サークル表示領域１３４は、複数のサークル１３０（種類別セット学習ユニット，セット学習部）を表示している。
【００３４】
各サークル１３０は、円環状に複数配置された種類別部分学習ボタン１３１（ジェム，部分学習用選択部）と、中央に１つ配置された総合学習ボタン１３２（総合学習選択部）とを有している。
【００３５】
種類別部分学習ボタン１３１または総合学習ボタン１３２がユーザの操作入力によって選択されると、学習機能部５７へ移行して後掲のプログラミング学習画面１９０（図７参照）を表示し、学習を進める。
【００３６】
種類別部分学習ボタン１３１が選択された場合は、学習機能部５７により部分学習処理を実行する。総合学習ボタン１３２が選択された場合は、その総合学習ボタン１３２の周囲の種類別部分学習ボタン１３１で学んだ部分学習を総合的に使用して学習する総合学習処理を学習機能部５７により実行する。
【００３７】
サークル表示領域切替ボタン１３５は、サークル表示領域１３４の表示内容を別の内容に切り替え、別のサークル１３０をサークル表示領域１３４内に表示する。
【００３８】
学習モジュール購入機能部５４は、図４（Ｂ）の学習モジュール購入画面１４０を表示する。学習モジュール購入画面１４０は、ブック選択タブ１４１ａ、ジェム選択タブ１４１ｂ、およびはがき選択タブ１４１ｃを有している。
【００３９】
ブック選択タブ１４１ａは、選択されると購入可能な種類別ストーリー学習データ（ブックデータ）の一覧画面を表示し、複数の購入用ボタン１４３を表示する。各購入用ボタン１４３は、種類別ストーリー学習データ（ブックデータ）を示し、画像、名称、および金額が表示されている。
【００４０】
ジェム選択タブ１４１ｂは、選択されると購入可能な種類別部分学習データ（ジェムデータ）の一覧画面を表示し、複数の購入用ボタン１４３を表示する。各購入用ボタン１４３は、種類別部分学習データ（ジェムデータ）を示し、画像、名称、および金額が表示されている。
【００４１】
はがき選択タブ１４１ｃは、選択されると購入可能なはがきデータ（パズル鍵データ）の一覧画面を表示し、複数の購入用ボタン１４３を表示する。各購入用ボタン１４３は、はがきデータ（パズル鍵データ）を示し、画像、名称、および金額が表示されている。
【００４２】
学習モジュール管理機能部５５は、メニュー画面１２０でジェム一覧表示ボタン１２５（種類別部分学習一覧表示ボタン）が選択された場合、図５（Ａ）に示すジェム一覧画面１５０（種類別部分学習一覧画面）を表示する。ジェム一覧画面１５０は、すべてのジェムを表示する全ジェム表示タブ１５１ａ、パソコンスキルに関するジェムを表示するパソコンジェム表示タブ１５１ｂ、メディアアートスキルに関するジェムを表示するメディアアートジェム表示タブ１５１ｃ、Ｗｅｂデザインスキルに関するジェムを表示するＷｅｂデザインジェム表示タブ１５１ｄ、およびゲームスキルに関するジェムを表示するゲームジェム表示タブ１５１ｅを備えている。
【００４３】
これにより、種類毎にジェムを表示できるようにしている。各表示タブ１５１（１５１ａ〜１５１ｅ）が選択されると表示する画面には、複数のジェムボタン１５３と、未クリアのみ表示ボタン１５５が表示される。
【００４４】
ジェムボタン１５３は、そのジェムの画像と名称、およびクリアの状態を表示している。クリアの状態は、最後まで完了させたか、ヒント無しで完了させたか等、そのジェムでの学習の度合いが分かる表示をしている。未クリアのみ表示ボタン１５５が選択されると、最後までクリアしていないジェムのジェムボタン１５３のみを表示する。
【００４５】
学習モジュール管理機能部５５は、メニュー画面１２０でブック一覧表示ボタン１２６が選択された場合、図５（Ｂ）に示すブック一覧画面１６０（種類別ストーリー学習一覧画面）を表示する。
【００４６】
ブック一覧画面１６０は、複数のブックボタン１６１が表示されている。各ブックボタン１６１は、ブックの画像と名称、およびクリアの状態を表示している。クリアの状態は、最後まで完了させたか、ヒント無しで完了させたか等、そのブックでの学習の度合いが分かる表示をしている。
【００４７】
学習モジュール管理機能部５５は、メニュー画面１２０でカード一覧表示ボタン１２７が選択された場合、図６（Ａ）に示すカード一覧画面１７０を表示する。カード一覧画面１７０は、ユーザが保有している通常のカードを一覧表示するカードリストタブ１７１ａと、ユーザが保有している特別なカードを一覧表示するスペシャルカードリストタブ１７１ｂを表示している。
【００４８】
カードリストタブ１７１ａが選択されると、カードボタン１７３として通常のカードの画像と名称が表示され、スペシャルカードリストタブ１７１ｂが選択されると、カードボタン１７３として特別なカードの画像と名称が表示される。
【００４９】
ステータス機能部５６は、図６（Ｂ）に示すステータス画面１８０（学習レベル表示画面）を表示し、ユーザのステータスを表示する。表示するステータスとしては、ユーザの全体でのレベルを示す全体ステータス１８１と、分野別のステータスを示す分野別ステータス１８２（１８２ａ〜１８２ｃ）を表示する。
【００５０】
全体ステータス１８１は、ユーザのランクと、そのランクの名称（例えばランク１であれば「見習い」）と、次のランクまでに必要な学習の何割まで進んでいるかを示すポイントおよびバーを表示する。
【００５１】
分野別ステータス１８２（１８２ａ〜１８２ｃ）は、その分野の名称（例えばＷＥＢデザインコース、メディアアートコース、ゲームコース等）と、その分野でのレベルと、その分野で次のレベルに到達するまでに必要な学習の何割まで進んでいるかを示すポイントおよびバーを表示する。
【００５２】
学習機能部５７は、図７に示すプログラミング学習画面１９０を表示する。プログラミング学習画面１９０は、プレビュー表示部１９１と、課題表示部１９４（出題内容表示部）と、コード入力部１９５を有しており、ヒントキャラクター１９２およびヒントメッセージ１９３を適宜表示するように構成されている。
【００５３】
プレビュー表示部１９１は、コード入力部１９５で入力されたプログラミングのコードを実行した結果を表示する。
【００５４】
課題表示部１９４は、プログラミングの学習のための課題を表示する。この課題は、何をするかを示すタイトルと（例えば「左上に円をつくろう」）、その説明文と、サンプルとなるコードが記載されている。
【００５５】
また、課題表示部１９４には、ヒントボタン１９４ａ（ヒント要求受付部）が設けられている。このヒントボタン１９４ａが選択されると、ヒントメッセージ１９３にヒントとなる説明が記載される。このヒントは複数段階に分けて用意（記憶）されており、ヒントボタン１９４ａが選択される毎により詳しくわかりやすい説明をヒントメッセージ１９３に表示する。
【００５６】
コード入力部１９５は、プログラミングのコードを入力する入力ウィンドウである。このコード入力部１９５は、複数行にわたってプログラミングのコードを表示および入力できる。ここで、表示するコードは必要な全ての行であるが、入力できる行は学習に関係のある行だけとなっている。
【００５７】
これにより、どこを学んでいるか一目でわかり、かつ、効率よく学習できるようにしている。
【００５８】
また、コード入力部１９５には、クリアボタン１９６が設けられている。このクリアボタン１９６が選択されると、学習機能部５７は、コード入力部１９５の表示をユーザが入力する前の初期表示に戻す。
【００５９】
学習機能部５７は、コード入力部１９５にコードが入力されると、それをリアルタイムで認識し、プレビュー表示部１９１を更新して反映させる。したがって、入力途中では、プレビュー表示部１９１に何も表示されない状態になることもあるが、正しく入力されるとプレビュー表示部１９１に正しく表示されるようになる。
【００６０】
また、学習機能部５７は、コード入力部１９５で入力された内容が、課題表示部１９４やヒントメッセージ１９３に表示したコードと少々差異が存在しても、その差異プログラミングにおいて許容される差異であれば許容する入力コード正誤判定処理を実行する。
【００６１】
具体的には、スペースの有無やスペースの個数の違い、表現の違いなどは受け入れる。また、コード入力部１９５で入力されたコード（値を含む）が、課題表示部１９４やヒントメッセージ１９３で示されたコード（値を含む）と違っていても、そのコード（値を含む）が成立するものであれば、入力されたコードに基づく結果をプレビュー表示部１９１に表示する。したがって、例えば円を作成するプログラムでサイズを間違えて大きく入力すると、その間違えた大きなサイズの円がプレビュー表示部１９１に表示される。
【００６２】
また、学習機能部５７は、図２に示す表示サイズ変更部５８（表示サイズ変更手段）を備えている。この表示サイズ変更部５８は、学習するプログラミングの内容に応じて、上述したプレビュー表示部１９１、課題表示部１９４、およびコード入力部１９５の各ウィンドウのサイズ（表示サイズ）および配置を変更する機能を有している。このサイズと配置の変更の詳細については後述する。  
これらの各機能部５１〜５７により、ロールプレイングゲームのストーリーを進めるように楽しみながら、プログラミングを学習していけるように構成されている。
【００６３】
図８は、イベント処理部５２によって実行するパズルイベントの画面の説明図である。
【００６４】
イベント画面１１０には、背景画像１１１の上にメッセージ画像１１３として“ＭＩＳＳＩＯＮ  「手がかり」から謎を解き、校内のどこかにある「あの３人」を探せ！”とメッセージを表示するとともに、ＯＫボタン１１４を表示する。ＯＫボタン１１４が選択されると、マップ機能部５１によりマップ画面１００（図３（Ａ）参照）を表示し、出題されたミッションをクリアするまでイベントが続く。
【００６５】
このとき、イベント画面１１０には、図示省略するヒントボタンを表示する。そして、ヒントボタンが表示されると、イベント処理部５２は、図８（Ｂ）に示すイベント画面１１０を表示する。このイベント画面では、例えばヒント表示部１１３と、「もっとヒントを見る」ボタン１１５と、謎解きのミッション（イベント）に戻るための戻るボタン１１６を表示する。
【００６６】
ヒント表示部１１３は、図８（Ｂ）に示すように、ポストカード情報表示部１１３ａ（パズル鍵）と、メモ情報表示部１１３ｂを並べて表示するなど、適宜の形式でヒントが表示される。ここで、ポストカード情報表示部１１３ａに表示されるのは、あらかじめユーザの自宅へはがき等によって送達されたポストカードに記載されているパズル鍵の情報である。
【００６７】
メモ情報表示部１１３ｂに表示されるのは、イベント処理部５２によるイベント中にイベント画面１１０等で表示されてユーザに与えられたメモである。このように、実物で送られるパズル鍵と、ソフトウェア上で表示されるメモとを組み合わせてパズルを解くことで、楽しさを倍増させている。
【００６８】
ヒント表示部１１３は、これに限らず、まず最初の段階では「ポストカードとメモをよく見比べよう」と文字だけで表示し、さらに「もっとヒントを見る」ボタン１１５が選択されると図示したようにポストカード情報表示部１１３ａと、メモ情報表示部１１３ｂを表示するとよい。
【００６９】
ここからさらに「もっとヒントを見る」ボタン１１５が選択されると、ポストカード情報表示部１１３ａのポストカードにメモ情報表示部１１３ｂのメモを重ねて表示する。そうして、メモの矢印の順番でポストカードの文字列を読めば、「げんかんへいきつぎになかにわさいごにほーる」、つまり「玄関へ行き、次に中庭、最後にホール」というパズルの回答が明瞭になる。
【００７０】
図９は、メニュー画面１２０（図４（Ａ）参照）において、１つのサークル１３０（種類別セット学習ユニット）の複数の種類別部分学習ボタン１３１（ジェム）で部分学習を進め、最後に総合学習ボタン１３２で部分学習をまとめた総合学習をする流れの例を画面により説明する説明図である。この例では、３つのジェム（部分学習）の後に総合学習をする構成としている。
【００７１】
メニュー画面１２０で１つ目の種類別部分学習ボタン１３１（ジェム）が選択されると、図９（Ａ）の画面構成図に示すように、学習機能部５７は、部分学習処理を開始して、まず、タイトル画面１８９を表示する。この例では、「円の魔法」として、円を作成するプログラムを学ぶことを示している。
【００７２】
マウスがクリックされるか、エンターキーが押下されると、学習機能部５７は、図９（Ｂ）に示すプログラミング学習画面１９０を表示する。このプログラミング学習画面１９０で、円を作成するコード「ｅｌｌｉｐｓｅ」を入力させて、そのコードの中の変数の意味も説明し、変化させて学ばせる。最後に、図９（Ｃ）に示すように、プログラミング学習画面１９０中に説明画像１９９を表示し、理解を深める。この説明画像１９９は、変数の意味を図解で分かりやすく表示している。
【００７３】
このようにして１つの部分学習（ジェム）が終了すると、メニュー画面１２０の１つ目の種類別部分学習ボタン１３１（ジェム）が暗い色（未完了表示）から明るい色（完了表示）に変化し、クリアした（部分学習処理が完了した）ことを示す。
【００７４】
メニュー画面１２０で２つ目の種類別部分学習ボタン１３１（ジェム）が選択されると、図９（Ｄ）の画面構成図に示すように、学習機能部５７は、部分学習処理を開始してタイトル画面１８９を表示する。この例では、「色の魔法」として、色を指定するプログラムを学ぶことを示している。
【００７５】
マウスがクリックされるか、エンターキーが押下されると、学習機能部５７は、図９（Ｅ）に示すプログラミング学習画面１９０を表示する。このプログラミング学習画面１９０で、色を指定するコード「ｆｉｌｌ」を入力させて、そのコードの中の変数の意味も説明し、変化させて学ばせる。なお、この例では、円の画像における縁の線を削除するコードも学ばせている。
【００７６】
このようにして２つ目の部分学習（ジェム）が終了すると、メニュー画面１２０の２つ目の種類別部分学習ボタン１３１（ジェム）が暗い色から明るい色に変化し、２つ目もクリアした（部分学習処理が完了した）ことを示す。
【００７７】
メニュー画面１２０で３つ目の種類別部分学習ボタン１３１（ジェム）が選択されると、図９（Ｆ）の画面構成図に示すように、学習機能部５７は、部分学習処理を開始してタイトル画面１８９を表示する。この例では、「マウスの魔法」として、マウスを使用するプログラムを学ぶことを示している。
マウスがクリックされるか、エンターキーが押下されると、学習機能部５７は、図９（Ｇ）に示すプログラミング学習画面１９０を表示する。このプログラミング学習画面１９０で、マウスを使用するコード「ｍｏｕｓｅＸ」および「ｍｏｕｓｅＹ」を入力させて、マウスを使用するコードを学ばせる。なお、この例では、透明度を制御するプログラムも学ばせる構成としている。
【００７８】
このようにして３つ目の部分学習（ジェム）が終了すると、メニュー画面１２０の３つ目の種類別部分学習ボタン１３１（ジェム）が暗い色から明るい色に変化し、３つ目もクリアした（部分学習処理が完了した）ことを示す。さらに、この３つで全ての部分学習（ジェム）が完了したことから、メニュー画面１２０において３つの種類別部分学習ボタン１３１（ジェム）の中心にある総合学習ボタン１３２が選択可能となる。
【００７９】
メニュー画面１２０で総合学習ボタン１３２が選択されると、図９（Ｈ）の画面構成図に示すように、学習機能部５７は、総合学習処理を開始してタイトル画面１８９を表示する。この例では、「サークルアート」として、これまでに部分学習で学んだ知識を総合したプログラムを学ぶことを示している。
【００８０】
マウスがクリックされるか、エンターキーが押下されると、学習機能部５７は、図９（Ｉ）に示すプログラミング学習画面１９０を表示する。このプログラミング学習画面１９０で、１つ目に学んだ円の位置と大きさを指定するコード、２つ目に学んだ色を指定するコード、３つ目に学んだマウスを使用するコードを全て使用して、３つの円で構成された図形がマウスの動作に合わせて移動し、かつ、位置によって色が変化するプログラムを作成させる。
【００８１】
このようにして、総合学習が完了すると、メニュー画面１２０において完了した総合学習ボタン１３２の上に「ＣＯＭＰＬＥＴＥＤ」と表示して総合学習処理が完了したことを示す完了表示をするため、その種類別セット学習データ（サークルデータ）の学習が完了したことを明瞭に示すことができる。
【００８２】
なお、追加の種類別部分学習データ（ジェムデータ）や種類別ストーリー学習データ（ブックデータ）が購入されるなどして、一度クリア（完了）した種類別セット学習データ（サークルデータ）に学習内容が追加された場合、円環（サークル）の表示を追加して２重（２回目の追加であれば３重）の円環とし、追加部分学習処理を実行できるようにする。この後は、種類別部分学習ボタン１３１（ジェム）を選択すると、その前の部分学習処理とは異なる追加学習処理を実行し、同じプログラミングコード若しくは同様の機能を持つプログラミングコードについてレベルアップした内容の学習を進める。
【００８３】
そして、追加の部分学習（ジェム）が完了すると種類別部分学習ボタン１３１（ジェム）に星のようなマークを表示（追加完了表示）すると良い。これにより、各部分学習（ジェム）について２周目の学習（次の学習）を行ったことを示すことができ、利用者も簡単に状態を確認することができる。この追加で行う部分学習（ジェム）は、同じ知識についての学習内容であってもより高度な内容とすることが好ましい。
【００８４】
ここで、本実施形態では、表示サイズ変更手段たる表示サイズ変更部５８を学習機能部５７に備えることにより、視覚的なわかりやすさを最大限に活用しつつ初心者でもストレスなく簡単に学んでいきながら、難しい課題にも簡単に解答できるようにしている。
以下、表示サイズ変更部５８の具体的な態様について説明する。
【００８５】
表示サイズ変更部５８は、図１０（Ａ）及び図１０（Ｂ）の各プログラミング学習画面構成図に示すように、学習内容によってウィンドウサイズを適宜変更し、視覚的に理解され易いレイアウトをとる。すなわち、表示サイズ変更部５８は、出題内容表示部たる課題表示部１９４と、コード入力部１９５と、プレビュー表示部１９１について、それぞれの大きさおよび配置を、学習するプログラミングコードの内容に応じて変化させる。
【００８６】
図１０（Ａ）は、プレビュー表示部１９１を画面の左右のどちらか一方（図示の例では左側）にて画面の上下方向の８０％以上を示す大きさで表示し、かつ、課題表示部１９４とコード入力部１９５を他方（図示の例では右側）に上下に並べて表示する縦長プレビュー画面確認モードのプログラミング学習画面１９０を図示している。この場合、プレビュー表示部１９１は、画面全体の横幅の４〜７割を占め、その残りの幅（６割〜３割）を上下に配置された課題表示部１９４とコード入力部１９５がそれぞれ占めている。この割合は、プレビュー表示部１９１の横幅が画面全体の横幅の半分より大きく７割未満とすることが好ましく、６割程度とすることが好適である。また、課題表示部１９４は、画面全体の高さ（縦幅）の３割〜７割とし、コード入力部１９５がその残りの高さ（７割〜３割）を占めている。この割合は、課題表示部１９４を画面全体の高さ（縦幅）の４〜６割程度とすることが好ましく、５割程度（画面全体の高さの半分程度）とすることが好ましい。このように、左右の一方にプレビュー表示部１９１、他方に課題表示部１９４とコード入力部１９５を上下に並べて表示することで、画面の上下方向に長く出力するようなプログミングを適切なプレビューと共に利用者に学習させることができる。また、プレビュー表示部１９１をできるだけ広くとることができるとともに、コード入力部１９５に入力する行数もできるだけ多く確保することができる。
【００８７】
図１０（Ｂ）は、プレビュー表示部１９１を画面の上下のどちらか一方（図示の例では上方）にて画面の左右方向の８０％以上を示す大きさで表示し、かつ、課題表示部１９４とコード入力部１９５を他方に上下に並べて表示する横長プレビュー画面確認モードのプログラミング学習画面１９０を図示している。この場合、プレビュー表示部１９１は、画面全体の高さ（縦幅）の３〜７割を占め、その残りの高さ（７割〜３割）を左右に配置された課題表示部１９４とコード入力部１９５がそれぞれ占めている。この割合は、プレビュー表示部１９１の横幅が画面全体の高さ（縦幅）の４割〜６割とすることが好ましく、５割程度とすることが好適である。また、課題表示部１９４は、画面全体の横幅の３割〜６割とし、コード入力部１９５がその残りの横幅（７割〜４割）を占めている。この割合は、課題表示部１９４を画面全体の横幅の３〜５割程度とすることが好ましく、４割程度とすることがより好ましい。すなわち、コード入力部１９５は、画面全体の７〜５割とすることが好ましく、６割程度とすることがより好ましい。このように、プレビュー表示部１９１を上下方向の一方に横幅８０％以上（好ましくは横幅全体）に表示し、課題表示部１９４とコード入力部１９５を他方に左右に並べて表示することで、画面の左右方向に長く出力するようなプログミングを適切なプレビューと共に利用者に学習させることができる。また、プレビュー表示部１９１を左右にできるだけ広くとることができるとともに、コード入力部１９５において１行に入力できる文字数もできるだけ多く確保することができる。このため、できるだけコード入力部１９５の横幅を確保して横長にプログラミング言語を記載することができ、長い条件文やパラメータが多い関数などの文字数の多いプログラミング文をできるだけ一行で表示することができる。
【００８８】
なお、学習画面表示手段におけるコード入力部１９５は、上述の通り、コードの入力ができるコード入力行を複数行表示し、当該複数行のコード入力行のうち出題内容表示部により入力を求めているコード入力行のみを利用者が入力可能とし、その他のコード入力行を変更不可とする構成である。
【００８９】
以上のようにして、表示サイズ変更手段たる表示サイズ変更部５８を備えることにより、視覚的なわかりやすさを最大限に活用しつつ初心者でもストレスなく簡単に学んでいきながら、難しいプログラミングを効率よく学ぶことが可能となる。すなわち、プログラミングの行数をできるだけ多くしたい場合や、プレビューで左右方向に広い範囲を確認したい場合等に、縦長プレビュー画面確認モードとすることができ、プログラミングにおける１行の文字数をできるだけ多く表示したい場合や、プレビューで上下方向に広い範囲を隠したい場合等に、横長プレビュー画面とすることができる。このため、学習するプログラミング内容に対して、各表示部（１９１，１９４）および入力部（１９５）のサイズを最も必要な方向の長さができるだけ長く確保できる配置にして、様々なプログラミングを適した画面配置およびサイズで学習できる。
【００９０】
このように、表示サイズ変更部５８（表示サイズ変更手段）を設けることで、視覚的なわかりやすさを最大限に活用しつつ初心者でもストレスなく簡単に学んでいきながら、難しい課題にも簡単に解答できるようになる。
【００９１】
また、表示サイズ変更部５８は、縦長プレビュー画面確認モードと、横長プレビュー画面確認モードとを有する、換言すれば切り替えることができる。  
すなわち、プレビュー表示部１９１を画面の左右のどちらか一方にて画面の上下方向の８０％以上を示す大きさで表示し、かつ、出題内容表示部たるとコード入力部１９５を他方に上下に並べて表示する縦長プレビュー画面確認モードと、プレビュー表示部１９１を画面の上下のどちらか一方にて画面の左右方向の８０％以上を示す大きさで表示し、かつ、出題内容表示部１９４とコード入力部１９５を他方に上下に並べて表示する横長プレビュー画面確認モードとを有することで、視覚的なわかりやすさを最大限に活用しつつ初心者でもストレスなく簡単に学んでいくことができる。
【００９２】
また、コード入力部１９５は、学習している部分の対象行のみ入力を受け付け、他の行については表示されているが入力を受け付けない構成であることにより、全行があることでの意味を理解し、かつ、学習しているピンポイントの部分だけを入力でき、容易に学ぶことができる。しかも、他の部分が入力不可であることにより、学習している部分とは異なる部分を編集してしまい、正しく戻せないといったことが生じることを防止できる。
なお、この発明は本実施形態に限られず他の様々な実施形態とすることができる。
【産業上の利用可能性】
【００９３】
この発明は、プログラミングの知識を教えるような産業に利用することができる。
【符号の説明】
【００９４】
１…プログラミング学習システム
２７ａ…学習用プログラム
５２…イベント処理部
５３…メニュー機能部
５６…ステータス機能部
５７…学習機能部
５８…表示サイズ変更部
１１３ａ…ポストカード情報表示部
１２０…メニュー画面
１３０…サークル
１３１…種類別部分学習ボタン
１３２…総合学習ボタン
１８０…ステータス画面
１９０…プログラミング学習画面
１９１…プレビュー表示部
１９４…課題表示部
１９５…コード入力部
１９６…クリアボタン
【図１】
2020140151.tif 000003
【図２】
2020140151.tif 000004
【図３】
2020140151.tif 000005
【図４】
2020140151.tif 000006
【図５】
2020140151.tif 000007
【図６】
2020140151.tif 000008
【図７】
2020140151.tif 000009
【図８】
2020140151.tif 000010
【図９】
2020140151.tif 000011
【図１０】
2020140151.tif 000012
【手続補正書】
【提出日】令和2年6月11日(2020.6.11)
【手続補正１】
【補正対象書類名】特許請求の範囲
【補正対象項目名】全文
【補正方法】変更
【補正の内容】
【特許請求の範囲】
【請求項１】
メニュー画面を表示するメニュー画面表示手段と、
出題内容を表示する出題内容表示部とプログラミングコードの入力を受け付けるコード入力部と入力結果を表示するプレビュー表示部を有する学習画面表示手段とを備え、
前記メニュー画面表示手段は、
前記学習画面表示手段によりプログラミングにおける部分学習を行う部分学習処理に移行する部分学習用選択部と、
複数の前記部分学習用選択部による前記部分学習処理で学んだ部分学習を総合的に用いて学ぶ総合学習処理に移行する総合学習用選択部を有し、
前記出題内容表示部と、前記コード入力部と、前記プレビュー表示部について、それぞれの大きさおよび配置を、学習する前記プログラミングコードの内容に応じて変化させる表示サイズ変更手段を備え、
前記学習画面表示手段は、プログラミング学習画面に前記出題内容表示部と前記コード入力部と前記プレビュー表示部を表示する構成であり、
前記表示サイズ変更手段は、
前記プレビュー表示部を前記プログラミング学習画面の左右のどちらか一方にて前記プログラミング学習画面の上下方向の８０％以上を示す大きさで表示し、かつ、前記出題内容表示部と前記コード入力部を他方に上下に並べて表示する縦長プレビュー画面確認モードと、
前記プレビュー表示部を前記プログラミング学習画面の上下のどちらか一方にて前記プログラミング学習画面の左右方向の８０％以上を示す大きさで表示し、かつ、前記出題内容表示部と前記コード入力部を他方に上下に並べて表示する横長プレビュー画面確認モードとを有し、
学習内容が画面の上下方向に長く出力するようなプログミングの場合または前記コード入力部に入力する行数をできるだけ多く確保する必要がある場合に前記縦長プレビュー画面確認モードで表示し、
前記学習内容が画面の左右方向に長く出力するようなプログミングの場合または前記コード入力部の横幅を確保して横長にプログラミング言語を入力させる必要がある場合に前記横長プレビュー画面確認モードで表示する構成である
プログラミング学習システム。
【請求項２】
前記部分学習用選択部は、１つ目のコードを学ばせる前記部分学習処理と、２つ目のコードを学ばせる前記部分学習処理と、３つ目のコードを学ばせる前記部分学習処理とを少なくとも実行させる構成であり、
前記総合学習用選択部は、前記１つ目のコードと前記２つ目のコードと前記３つ目のコードを全て使用する１つのプログラムを作成させる前記総合学習処理を実行させる構成である
請求項１記載のプログラミング学習システム。
【請求項３】
前記学習画面表示手段における前記コード入力部は、
コードの入力ができるコード入力行を複数行表示し、
当該複数行のコード入力行のうち出題内容表示部により入力を求めているコード入力行のみを利用者が入力可能とし、その他のコード入力行を変更不可とする構成であり、
前記入力を求めているコード入力行を学習に関係のある行だけとし、前記その他のコード入力行を、行の単位で前記コード入力行と異ならせる構成である
請求項１または２記載のプログラミング学習システム。
【請求項４】
コンピュータを、
メニュー画面を表示するメニュー画面表示手段と、
出題内容を表示する出題内容表示部とプログラミングコードの入力を受け付けるコード入力部と入力結果を表示するプレビュー表示部を有する学習画面表示手段として機能させるプログラミング学習用プログラムであって、
前記メニュー画面表示手段に、
前記学習画面表示手段によりプログラミングにおける部分学習を行う部分学習処理に移行する部分学習用選択部と、
複数の前記部分学習用選択部による前記部分学習処理で学んだ部分学習を総合的に用いて学ぶ総合学習処理に移行する総合学習用選択部とを備えさせ、
前記出題内容表示部と、前記コード入力部と、前記プレビュー表示部について、それぞれの大きさおよび配置を、学習する前記プログラミングコードの内容に応じて変化させる表示サイズ変更手段を備え、
前記学習画面表示手段は、プログラミング学習画面に前記出題内容表示部と前記コード入力部と前記プレビュー表示部を表示する構成であり、
前記表示サイズ変更手段は、
前記プレビュー表示部を前記プログラミング学習画面の左右のどちらか一方にて前記プログラミング学習画面の上下方向の８０％以上を示す大きさで表示し、かつ、前記出題内容表示部と前記コード入力部を他方に上下に並べて表示する縦長プレビュー画面確認モードと、
前記プレビュー表示部を前記プログラミング学習画面の上下のどちらか一方にて前記プログラミング学習画面の左右方向の８０％以上を示す大きさで表示し、かつ、前記出題内容表示部と前記コード入力部を他方に上下に並べて表示する横長プレビュー画面確認モードとを有し、
学習内容が画面の上下方向に長く出力するようなプログミングの場合または前記コード入力部に入力する行数をできるだけ多く確保する必要がある場合に前記縦長プレビュー画面確認モードで表示し、
前記学習内容が画面の左右方向に長く出力するようなプログミングの場合または前記コード入力部の横幅を確保して横長にプログラミング言語を入力させる必要がある場合に前記横長プレビュー画面確認モードで表示する構成である
プログラミング学習用プログラム。
【請求項５】
メニュー画面表示手段によりメニュー画面を表示し、
学習画面表示手段により、出題内容を出題内容表示部に表示しプログラミングコードの入力をコード入力部により受け付け入力結果をプレビュー表示部に表示するプログラミング学習方法であって、
前記メニュー画面表示手段に、
前記学習画面表示手段によりプログラミングにおける部分学習を行う部分学習処理に移行する部分学習用選択部と、
複数の前記部分学習用選択部による前記部分学習処理で学んだ部分学習を総合的に用いて学ぶ総合学習処理に移行する総合学習用選択部とを備えさせ、
前記出題内容表示部と、前記コード入力部と、前記プレビュー表示部について、それぞれの大きさおよび配置を、学習する前記プログラミングコードの内容に応じて変化させる表示サイズ変更手段を備え、
前記学習画面表示手段は、プログラミング学習画面に前記出題内容表示部と前記コード入力部と前記プレビュー表示部を表示し、
前記表示サイズ変更手段は、
前記プレビュー表示部を前記プログラミング学習画面の左右のどちらか一方にて前記プログラミング学習画面の上下方向の８０％以上を示す大きさで表示し、かつ、前記出題内容表示部と前記コード入力部を他方に上下に並べて表示する縦長プレビュー画面確認モードと、
前記プレビュー表示部を前記プログラミング学習画面の上下のどちらか一方にて前記プログラミング学習画面の左右方向の８０％以上を示す大きさで表示し、かつ、前記出題内容表示部と前記コード入力部を他方に上下に並べて表示する横長プレビュー画面確認モードとを有し、
学習内容が画面の上下方向に長く出力するようなプログミングの場合または前記コード入力部に入力する行数をできるだけ多く確保する必要がある場合に前記縦長プレビュー画面確認モードで表示し、
前記学習内容が画面の左右方向に長く出力するようなプログミングの場合または前記コード入力部の横幅を確保して横長にプログラミング言語を入力させる必要がある場合に前記横長プレビュー画面確認モードで表示する
プログラミング学習方法。


【手続補正２】
【補正対象書類名】明細書
【補正対象項目名】全文
【補正方法】変更
【補正の内容】
【発明の詳細な説明】
【技術分野】
【０００１】
この発明は、プログラミングを学習できるプログラミング学習システム、プログラミング学習用プログラム、およびプログラミング学習方法に関するものである。
【背景技術】
【０００２】
従来、プログラミングなどの学習は、講師が生徒に知識を伝える形で行われる。その際に、コンピュータを実際に用いてプログラミングのコードを入力し、そのコードによる結果を表示させて、学ぶといったことも行われている。このような学習方法は、あらかじめ決められた曜日、時間に生徒が教室に通う必要がある。このため、忙しく日々のスケジュールもよく変わる社会人などには、定期的にきちんと通って学習を継続することが難しく、一度遅れるとついていくことがより難しいという問題点がある。
【０００３】
一方で、学習に関するシステムとして、そろばんネットワークシステムが提案されている（特許文献１参照）。このそろばんネットワークシステムは、複数のユーザ（生徒側）端末と双方向に通信可能に接続するサーバ機（塾側）を利用し、ユーザ端末にはそろばん問題を表示して解答入力を受けつけ、そろばん問題の解答と解答時間を関連付けて記憶し、解答、得点（正解率）および解答時間を含む成績をサーバ機に送信でき、成績リストを作成できるものとされている。これにより、誰でも自宅で好きな時間にそろばんを習得でき、実際のそろばんの試験や練習に近い形式で演習できるとされている。
【０００４】
しかしながら、このそろばんネットワークシステムは、単に出題し、解答の入力を受け付けるだけであり、学習効果を高める工夫に乏しいものであった。
【先行技術文献】
【特許文献】
【０００５】
【特許文献１】特開２００２−２２９４３６号公報
【発明の概要】
【発明が解決しようとする課題】
【０００６】
この発明は、上述した問題点に鑑み、プログラミングを効果的に学習できるプログラミング学習システム、プログラミング学習用プログラム、およびプログラミング学習方法を提供し、利用者の満足度を向上させることを目的とする。
【課題を解決するための手段】
【０００７】
この発明は、メニュー画面を表示するメニュー画面表示手段と、出題内容を表示する出題内容表示部とプログラミングコードの入力を受け付けるコード入力部と入力結果を表示するプレビュー表示部を有する学習画面表示手段とを備え、前記メニュー画面表示手段は、前記学習画面表示手段によりプログラミングにおける部分学習を行う部分学習処理に移行する部分学習用選択部と、複数の前記部分学習用選択部による前記部分学習処理で学んだ部分学習を総合的に用いて学ぶ総合学習処理に移行する総合学習用選択部を有し、前記出題内容表示部と、前記コード入力部と、前記プレビュー表示部について、それぞれの大きさおよび配置を、学習する前記プログラミングコードの内容に応じて変化させる表示サイズ変更手段を備え、前記学習画面表示手段は、プログラミング学習画面に前記出題内容表示部と前記コード入力部と前記プレビュー表示部を表示する構成であり、前記表示サイズ変更手段は、前記プレビュー表示部を前記プログラミング学習画面の左右のどちらか一方にて前記プログラミング学習画面の上下方向の８０％以上を示す大きさで表示し、かつ、前記出題内容表示部と前記コード入力部を他方に上下に並べて表示する縦長プレビュー画面確認モードと、前記プレビュー表示部を前記プログラミング学習画面の上下のどちらか一方にて前記プログラミング学習画面の左右方向の８０％以上を示す大きさで表示し、かつ、前記出題内容表示部と前記コード入力部を他方に上下に並べて表示する横長プレビュー画面確認モードとを有し、学習内容が画面の上下方向に長く出力するようなプログミングの場合または前記コード入力部に入力する行数をできるだけ多く確保する必要がある場合に前記縦長プレビュー画面確認モードで表示し、前記学習内容が画面の左右方向に長く出力するようなプログミングの場合または前記コード入力部の横幅を確保して横長にプログラミング言語を入力させる必要がある場合に前記横長プレビュー画面確認モードで表示する構成であるプログラミング学習システム、プログラミング学習用プログラム、およびプログラミング学習方法であることを特徴とする。
【発明の効果】
【０００８】
この発明により、プログラミングを効果的に学習できるプログラミング学習システム、プログラミング学習用プログラム、およびプログラミング学習方法を提供することができる。
【図面の簡単な説明】
【０００９】
【図１】プログラミング学習システムのシステム構成を示すブロック図。
【図２】サーバの制御部が実行する機能の機能ブロック図。
【図３】マップ画面とイベント画面の説明図。
【図４】メニュー画面と学習モジュール購入画面の説明図。
【図５】ジェム一覧画面とブック一覧画面の説明図。
【図６】カード一覧画面とステータス画面の説明図。
【図７】プログラミング学習画面の説明図。
【図８】イベント画面の他の例を示す説明図。
【図９】部分学習と総合学習のプログラミング学習画面の説明図。
【図１０】プログラミング学習画面の説明図の説明図。
【発明を実施するための形態】
【００１０】
以下、この発明の一実施形態を図面と共に説明する。
【実施例】
【００１１】
図１は、プログラミング学習システム１のシステム構成を示すブロック図である。このプログラミング学習システム１は、１つの統一された世界観でゲームのように構成されている。すなわち、「プログラミング」を「魔法」として、失われた「魔法」（すなわち「プログラミング」）をユーザが発見・学ぶことで、危機に陥っている魔法学園を救うというストーリーになっている。したがって、プログラムを学ぶことがゲームを進めることと一致するように、ゲーム感覚でプログラミングを学べるように構成されている。
【００１２】
プログラミング学習システム１は、インターネット３に通信可能に接続されたサーバ２、および複数のユーザ端末４により構成されている。
【００１３】
サーバ２は、制御部２１、入力部２３、表示部２４、通信部２５、および記憶部２７を備えている。
ユーザ端末４は、制御部４１、入力部４３、表示部４４、通信部４５、音声出力部４６、および記憶部４７を備えている。
【００１４】
サーバ２は、サーバコンピュータで構成されており、ユーザ端末４はデスクトップパソコンまたはノートパソコン等のパーソナルコンピュータにより構成されている。
【００１５】
いずれもハードウェア要素としてＣＰＵとＲＯＭとＲＡＭ等で構成されて各種演算や制御動作を実行する制御部（２１、４１）、キーボードおよびマウスで構成されてユーザ操作による入力を受け付ける入力部（２３、４３）、液晶ディスプレイや有機ＥＬディスプレイ等で構成されて文字や図等の画像を表示する表示部（２４、４４）、ＬＡＮボードやＷｉＦｉユニット等で構成されて有線または無線での通信を実行する通信部（２５、４５）、および、ハードディスクやフラッシュメモリ等で構成されて情報の読み書きを許容する記憶部（２７、４７）を備えている。また、ユーザ端末４は、スピーカ等で構成されて音声を出力する音声出力部４６をさらに備えている。
【００１６】
サーバ２の記憶部２７は、ユーザ端末４からのアクセスを受け付けてプログラミングの学習を実行する学習用プログラム２７ａ（プログラミング学習用プログラム）と、学習用プログラム２７ａが使用する学習用データ２７ｂと、ユーザの情報を記憶するユーザデータ２７ｃとを記憶している。
【００１７】
学習用プログラム２７ａは、学習用データ２７ｂを用いて学習用のプログラムを実行する。この学習用プログラム２７ａは、学習用データ２７ｂとして記憶されている複数の種類別学習用データのうち、ユーザに購入された種類別学習用データを用いた学習のプログラムを実行する。
【００１８】
学習用データ２７ｂは、複数の種類別学習用データを記憶している。種類別学習データは、最も小さい単位である部分学習データで構成される種類別部分学習データ（ジェムデータ）と、部分学習データが複数集まったセット学習データで構成される種類別セット学習データ（サークルデータ）と、セット学習データが複数集まってストーリーと共に構成されている種類別ストーリー学習データ（ブックデータ）をそれぞれ複数記憶している。
【００１９】
ユーザデータ２７ｃは、ユーザＩＤやパスワードで構成されるユーザ識別データと、ユーザの氏名や住所や電話番号やＥメールアドレスで構成されるユーザ個人データと、クレジットカード番号や購入用のポイントなどの決済用のデータで構成される決済データと、購入したブックやジェム等の購入データと、ユーザのステータスを示すステータスデータと、ブックやジェム単位でどこまでクリアしたか（学習を進めたか）を示すクリアデータをユーザ別に記憶している。
【００２０】
ユーザ端末４は、ユーザの操作入力に応じて本システムにおける各種動作を実行するためのユーザプログラム４７ａと、本システムの利用に必要となるユーザデータ４７ｃとを記憶している。
【００２１】
この実施例では、ユーザプログラム４７ａとしては、インターネット上のホームページ等にアクセスするブラウザプログラムを用いる構成としているが、専用のユーザプログラムを用いる構成としてもよい。ユーザデータ４７ｃは、少なくともユーザＩＤなどのユーザを特定するためのデータが記憶されている。
【００２２】
図２は、プログラミング学習システム１のサーバ２の制御部２１がユーザ端末４からのアクセスに応答して学習用プログラム２７ａにより実行する機能の機能ブロック図である。図３〜図９は、各機能部（５１〜５７）によってユーザ端末４の表示部４４に表示させる各種画面の説明図である。
【００２３】
学習用プログラム２７ａを実行する制御部２１は、マップ機能部５１、イベント処理部５２（パズル問題出題手段）、メニュー機能部５３（メニュー画面表示手段）、学習モジュール購入機能部５４、学習モジュール管理機能部５５、ステータス機能部５６（学習レベル表示手段）、および学習機能部５７（学習画面表示手段）を有している。
【００２４】
マップ機能部５１は、図３（Ａ）に示すマップ画面１００を表示し、エリア１０２（１０２ａ，１０２ｂ，１０２ｃ）の選択を受け付ける。１つのエリア１０２が選択されると、そのエリア１０２に設定されている別の画面、例えば別のマップ画面１００、イベント画面１１０（図３（Ｂ）参照）また、メニュー画面１２０（図４（Ａ）参照）を表示する。
【００２５】
図示の４階のマップ画像１００の例では、エリア１０２ａ「４階の扉」が選択されると、イベント画面１１０（図３（Ｂ）参照）を表示し、エリア１０２ｂ「３階へ」が選択されると、３階のマップ画像１００（図示省略）を表示し、エリア１０２ｃ「５階へ」が選択されると、５階のマップ画像１００（図示省略）を表示する。
【００２６】
イベント処理部５２は、図３（Ｂ）に示すイベント画面１１０を表示し、イベントを進める。イベント画面１１０は、画面の大部分を占める背景画像１１１と、その背景画像１１１の前面に重ねて表示されるキャラクタ画像１１２と、キャラクタのセリフとしてメッセージが表示されるメッセージ画像１１３が表示される。
【００２７】
このイベント処理部５２は、ユーザがユーザ端末４の入力部４３によりエンターキーの押下やマウスクリック等の操作を行う毎に、メッセージ画像１１３を次のメッセージ画像１１３に切り替える、キャラクタ画像１１２を表示し、消去し、あるいは他のキャラクタへの切り替える、背景画像１１１を切り替えるといった処理を行い、ストーリーを進めて行く。
【００２８】
イベント処理部５２は、イベント画面１１０でイベント部分のストーリーを進めた後、マップ機能部５１、メニュー機能部５３、または学習機能部５７へ移行する。マップ機能部５１、メニュー機能部５３、および学習機能部５７のどれへ移行するかは、そのときのストーリーによりあらかじめ決定されている。
【００２９】
このマップ機能部５１とイベント処理部５２により、ユーザは、ロールプレイングゲームを楽しむようにしてプログラミングの学習を進めて行くことができる。すなわち、マップ画面１００で移動をしながら、イベント画面１１０でのイベントを進め、そのイベントを含めたストーリーの中で求められるプログラミングの知識を学習するという形で学ぶことができる。
【００３０】
メニュー機能部５３は、図４（Ａ）に示すメニュー画面１２０を表示し、メニュー処理を実行する。メニュー画面１２０は、ショップボタン１２４、ジェム一覧表示ボタン１２５（種類別部分学習一覧表示ボタン）、ブック一覧表示ボタン１２６（種類別ストーリー学習一覧表示ボタン）、カード一覧表示ボタン１２７、ステータス表示ボタン１２８、サークル表示領域１３４（種類別セット学習ユニット表示領域）、およびサークル表示領域切替ボタン１３５（種類別セット学習ユニット表示領域切替ボタン）を表示している。
【００３１】
ショップボタン１２４は、選択されると学習モジュール購入機能部５４を起動し、ブックやジェムやはがきの購入操作を受け付ける。
ジェム一覧表示ボタン１２５は、選択されると学習モジュール管理機能部を起動し、ジェムの管理操作を受け付ける。
【００３２】
ブック一覧表示ボタン１２６は、選択されると学習モジュール管理機能部５５を起動し、ブックの管理操作を受け付ける。
カード一覧表示ボタン１２７は、選択されると学習モジュール管理機能部５５を起動し、カードの管理操作を受け付ける。
【００３３】
ステータス表示ボタン１２８は、選択されるとステータス機能部５６を起動し、ステータスの確認を受け付ける。
サークル表示領域１３４は、複数のサークル１３０（種類別セット学習ユニット，セット学習部）を表示している。
【００３４】
各サークル１３０は、円環状に複数配置された種類別部分学習ボタン１３１（ジェム，部分学習用選択部）と、中央に１つ配置された総合学習ボタン１３２（総合学習選択部）とを有している。
【００３５】
種類別部分学習ボタン１３１または総合学習ボタン１３２がユーザの操作入力によって選択されると、学習機能部５７へ移行して後掲のプログラミング学習画面１９０（図７参照）を表示し、学習を進める。
【００３６】
種類別部分学習ボタン１３１が選択された場合は、学習機能部５７により部分学習処理を実行する。総合学習ボタン１３２が選択された場合は、その総合学習ボタン１３２の周囲の種類別部分学習ボタン１３１で学んだ部分学習を総合的に使用して学習する総合学習処理を学習機能部５７により実行する。
【００３７】
サークル表示領域切替ボタン１３５は、サークル表示領域１３４の表示内容を別の内容に切り替え、別のサークル１３０をサークル表示領域１３４内に表示する。
【００３８】
学習モジュール購入機能部５４は、図４（Ｂ）の学習モジュール購入画面１４０を表示する。学習モジュール購入画面１４０は、ブック選択タブ１４１ａ、ジェム選択タブ１４１ｂ、およびはがき選択タブ１４１ｃを有している。
【００３９】
ブック選択タブ１４１ａは、選択されると購入可能な種類別ストーリー学習データ（ブックデータ）の一覧画面を表示し、複数の購入用ボタン１４３を表示する。各購入用ボタン１４３は、種類別ストーリー学習データ（ブックデータ）を示し、画像、名称、および金額が表示されている。
【００４０】
ジェム選択タブ１４１ｂは、選択されると購入可能な種類別部分学習データ（ジェムデータ）の一覧画面を表示し、複数の購入用ボタン１４３を表示する。各購入用ボタン１４３は、種類別部分学習データ（ジェムデータ）を示し、画像、名称、および金額が表示されている。
【００４１】
はがき選択タブ１４１ｃは、選択されると購入可能なはがきデータ（パズル鍵データ）の一覧画面を表示し、複数の購入用ボタン１４３を表示する。各購入用ボタン１４３は、はがきデータ（パズル鍵データ）を示し、画像、名称、および金額が表示されている。
【００４２】
学習モジュール管理機能部５５は、メニュー画面１２０でジェム一覧表示ボタン１２５（種類別部分学習一覧表示ボタン）が選択された場合、図５（Ａ）に示すジェム一覧画面１５０（種類別部分学習一覧画面）を表示する。ジェム一覧画面１５０は、すべてのジェムを表示する全ジェム表示タブ１５１ａ、パソコンスキルに関するジェムを表示するパソコンジェム表示タブ１５１ｂ、メディアアートスキルに関するジェムを表示するメディアアートジェム表示タブ１５１ｃ、Ｗｅｂデザインスキルに関するジェムを表示するＷｅｂデザインジェム表示タブ１５１ｄ、およびゲームスキルに関するジェムを表示するゲームジェム表示タブ１５１ｅを備えている。
【００４３】
これにより、種類毎にジェムを表示できるようにしている。各表示タブ１５１（１５１ａ〜１５１ｅ）が選択されると表示する画面には、複数のジェムボタン１５３と、未クリアのみ表示ボタン１５５が表示される。
【００４４】
ジェムボタン１５３は、そのジェムの画像と名称、およびクリアの状態を表示している。クリアの状態は、最後まで完了させたか、ヒント無しで完了させたか等、そのジェムでの学習の度合いが分かる表示をしている。未クリアのみ表示ボタン１５５が選択されると、最後までクリアしていないジェムのジェムボタン１５３のみを表示する。
【００４５】
学習モジュール管理機能部５５は、メニュー画面１２０でブック一覧表示ボタン１２６が選択された場合、図５（Ｂ）に示すブック一覧画面１６０（種類別ストーリー学習一覧画面）を表示する。
【００４６】
ブック一覧画面１６０は、複数のブックボタン１６１が表示されている。各ブックボタン１６１は、ブックの画像と名称、およびクリアの状態を表示している。クリアの状態は、最後まで完了させたか、ヒント無しで完了させたか等、そのブックでの学習の度合いが分かる表示をしている。
【００４７】
学習モジュール管理機能部５５は、メニュー画面１２０でカード一覧表示ボタン１２７が選択された場合、図６（Ａ）に示すカード一覧画面１７０を表示する。カード一覧画面１７０は、ユーザが保有している通常のカードを一覧表示するカードリストタブ１７１ａと、ユーザが保有している特別なカードを一覧表示するスペシャルカードリストタブ１７１ｂを表示している。
【００４８】
カードリストタブ１７１ａが選択されると、カードボタン１７３として通常のカードの画像と名称が表示され、スペシャルカードリストタブ１７１ｂが選択されると、カードボタン１７３として特別なカードの画像と名称が表示される。
【００４９】
ステータス機能部５６は、図６（Ｂ）に示すステータス画面１８０（学習レベル表示画面）を表示し、ユーザのステータスを表示する。表示するステータスとしては、ユーザの全体でのレベルを示す全体ステータス１８１と、分野別のステータスを示す分野別ステータス１８２（１８２ａ〜１８２ｃ）を表示する。
【００５０】
全体ステータス１８１は、ユーザのランクと、そのランクの名称（例えばランク１であれば「見習い」）と、次のランクまでに必要な学習の何割まで進んでいるかを示すポイントおよびバーを表示する。
【００５１】
分野別ステータス１８２（１８２ａ〜１８２ｃ）は、その分野の名称（例えばＷＥＢデザインコース、メディアアートコース、ゲームコース等）と、その分野でのレベルと、その分野で次のレベルに到達するまでに必要な学習の何割まで進んでいるかを示すポイントおよびバーを表示する。
【００５２】
学習機能部５７は、図７に示すプログラミング学習画面１９０を表示する。プログラミング学習画面１９０は、プレビュー表示部１９１と、課題表示部１９４（出題内容表示部）と、コード入力部１９５を有しており、ヒントキャラクター１９２およびヒントメッセージ１９３を適宜表示するように構成されている。
【００５３】
プレビュー表示部１９１は、コード入力部１９５で入力されたプログラミングのコードを実行した結果を表示する。
【００５４】
課題表示部１９４は、プログラミングの学習のための課題を表示する。この課題は、何をするかを示すタイトルと（例えば「左上に円をつくろう」）、その説明文と、サンプルとなるコードが記載されている。
【００５５】
また、課題表示部１９４には、ヒントボタン１９４ａ（ヒント要求受付部）が設けられている。このヒントボタン１９４ａが選択されると、ヒントメッセージ１９３にヒントとなる説明が記載される。このヒントは複数段階に分けて用意（記憶）されており、ヒントボタン１９４ａが選択される毎により詳しくわかりやすい説明をヒントメッセージ１９３に表示する。
【００５６】
コード入力部１９５は、プログラミングのコードを入力する入力ウィンドウである。このコード入力部１９５は、複数行にわたってプログラミングのコードを表示および入力できる。ここで、表示するコードは必要な全ての行であるが、入力できる行は学習に関係のある行だけとなっている。
【００５７】
これにより、どこを学んでいるか一目でわかり、かつ、効率よく学習できるようにしている。
【００５８】
また、コード入力部１９５には、クリアボタン１９６が設けられている。このクリアボタン１９６が選択されると、学習機能部５７は、コード入力部１９５の表示をユーザが入力する前の初期表示に戻す。
【００５９】
学習機能部５７は、コード入力部１９５にコードが入力されると、それをリアルタイムで認識し、プレビュー表示部１９１を更新して反映させる。したがって、入力途中では、プレビュー表示部１９１に何も表示されない状態になることもあるが、正しく入力されるとプレビュー表示部１９１に正しく表示されるようになる。
【００６０】
また、学習機能部５７は、コード入力部１９５で入力された内容が、課題表示部１９４やヒントメッセージ１９３に表示したコードと少々差異が存在しても、その差異プログラミングにおいて許容される差異であれば許容する入力コード正誤判定処理を実行する。
【００６１】
具体的には、スペースの有無やスペースの個数の違い、表現の違いなどは受け入れる。また、コード入力部１９５で入力されたコード（値を含む）が、課題表示部１９４やヒントメッセージ１９３で示されたコード（値を含む）と違っていても、そのコード（値を含む）が成立するものであれば、入力されたコードに基づく結果をプレビュー表示部１９１に表示する。したがって、例えば円を作成するプログラムでサイズを間違えて大きく入力すると、その間違えた大きなサイズの円がプレビュー表示部１９１に表示される。
【００６２】
また、学習機能部５７は、図２に示す表示サイズ変更部５８（表示サイズ変更手段）を備えている。この表示サイズ変更部５８は、学習するプログラミングの内容に応じて、上述したプレビュー表示部１９１、課題表示部１９４、およびコード入力部１９５の各ウィンドウのサイズ（表示サイズ）および配置を変更する機能を有している。このサイズと配置の変更の詳細については後述する。  
これらの各機能部５１〜５７により、ロールプレイングゲームのストーリーを進めるように楽しみながら、プログラミングを学習していけるように構成されている。
【００６３】
図８は、イベント処理部５２によって実行するパズルイベントの画面の説明図である。
【００６４】
イベント画面１１０には、背景画像１１１の上にメッセージ画像１１３として“ＭＩＳＳＩＯＮ  「手がかり」から謎を解き、校内のどこかにある「あの３人」を探せ！”とメッセージを表示するとともに、ＯＫボタン１１４を表示する。ＯＫボタン１１４が選択されると、マップ機能部５１によりマップ画面１００（図３（Ａ）参照）を表示し、出題されたミッションをクリアするまでイベントが続く。
【００６５】
このとき、イベント画面１１０には、図示省略するヒントボタンを表示する。そして、ヒントボタンが表示されると、イベント処理部５２は、図８（Ｂ）に示すイベント画面１１０を表示する。このイベント画面では、例えばヒント表示部１１３と、「もっとヒントを見る」ボタン１１５と、謎解きのミッション（イベント）に戻るための戻るボタン１１６を表示する。
【００６６】
ヒント表示部１１３は、図８（Ｂ）に示すように、ポストカード情報表示部１１３ａ（パズル鍵）と、メモ情報表示部１１３ｂを並べて表示するなど、適宜の形式でヒントが表示される。ここで、ポストカード情報表示部１１３ａに表示されるのは、あらかじめユーザの自宅へはがき等によって送達されたポストカードに記載されているパズル鍵の情報である。
【００６７】
メモ情報表示部１１３ｂに表示されるのは、イベント処理部５２によるイベント中にイベント画面１１０等で表示されてユーザに与えられたメモである。このように、実物で送られるパズル鍵と、ソフトウェア上で表示されるメモとを組み合わせてパズルを解くことで、楽しさを倍増させている。
【００６８】
ヒント表示部１１３は、これに限らず、まず最初の段階では「ポストカードとメモをよく見比べよう」と文字だけで表示し、さらに「もっとヒントを見る」ボタン１１５が選択されると図示したようにポストカード情報表示部１１３ａと、メモ情報表示部１１３ｂを表示するとよい。
【００６９】
ここからさらに「もっとヒントを見る」ボタン１１５が選択されると、ポストカード情報表示部１１３ａのポストカードにメモ情報表示部１１３ｂのメモを重ねて表示する。そうして、メモの矢印の順番でポストカードの文字列を読めば、「げんかんへいきつぎになかにわさいごにほーる」、つまり「玄関へ行き、次に中庭、最後にホール」というパズルの回答が明瞭になる。
【００７０】
図９は、メニュー画面１２０（図４（Ａ）参照）において、１つのサークル１３０（種類別セット学習ユニット）の複数の種類別部分学習ボタン１３１（ジェム）で部分学習を進め、最後に総合学習ボタン１３２で部分学習をまとめた総合学習をする流れの例を画面により説明する説明図である。この例では、３つのジェム（部分学習）の後に総合学習をする構成としている。
【００７１】
メニュー画面１２０で１つ目の種類別部分学習ボタン１３１（ジェム）が選択されると、図９（Ａ）の画面構成図に示すように、学習機能部５７は、部分学習処理を開始して、まず、タイトル画面１８９を表示する。この例では、「円の魔法」として、円を作成するプログラムを学ぶことを示している。
【００７２】
マウスがクリックされるか、エンターキーが押下されると、学習機能部５７は、図９（Ｂ）に示すプログラミング学習画面１９０を表示する。このプログラミング学習画面１９０で、円を作成するコード「ｅｌｌｉｐｓｅ」を入力させて、そのコードの中の変数の意味も説明し、変化させて学ばせる。最後に、図９（Ｃ）に示すように、プログラミング学習画面１９０中に説明画像１９９を表示し、理解を深める。この説明画像１９９は、変数の意味を図解で分かりやすく表示している。
【００７３】
このようにして１つの部分学習（ジェム）が終了すると、メニュー画面１２０の１つ目の種類別部分学習ボタン１３１（ジェム）が暗い色（未完了表示）から明るい色（完了表示）に変化し、クリアした（部分学習処理が完了した）ことを示す。
【００７４】
メニュー画面１２０で２つ目の種類別部分学習ボタン１３１（ジェム）が選択されると、図９（Ｄ）の画面構成図に示すように、学習機能部５７は、部分学習処理を開始してタイトル画面１８９を表示する。この例では、「色の魔法」として、色を指定するプログラムを学ぶことを示している。
【００７５】
マウスがクリックされるか、エンターキーが押下されると、学習機能部５７は、図９（Ｅ）に示すプログラミング学習画面１９０を表示する。このプログラミング学習画面１９０で、色を指定するコード「ｆｉｌｌ」を入力させて、そのコードの中の変数の意味も説明し、変化させて学ばせる。なお、この例では、円の画像における縁の線を削除するコードも学ばせている。
【００７６】
このようにして２つ目の部分学習（ジェム）が終了すると、メニュー画面１２０の２つ目の種類別部分学習ボタン１３１（ジェム）が暗い色から明るい色に変化し、２つ目もクリアした（部分学習処理が完了した）ことを示す。
【００７７】
メニュー画面１２０で３つ目の種類別部分学習ボタン１３１（ジェム）が選択されると、図９（Ｆ）の画面構成図に示すように、学習機能部５７は、部分学習処理を開始してタイトル画面１８９を表示する。この例では、「マウスの魔法」として、マウスを使用するプログラムを学ぶことを示している。
マウスがクリックされるか、エンターキーが押下されると、学習機能部５７は、図９（Ｇ）に示すプログラミング学習画面１９０を表示する。このプログラミング学習画面１９０で、マウスを使用するコード「ｍｏｕｓｅＸ」および「ｍｏｕｓｅＹ」を入力させて、マウスを使用するコードを学ばせる。なお、この例では、透明度を制御するプログラムも学ばせる構成としている。
【００７８】
このようにして３つ目の部分学習（ジェム）が終了すると、メニュー画面１２０の３つ目の種類別部分学習ボタン１３１（ジェム）が暗い色から明るい色に変化し、３つ目もクリアした（部分学習処理が完了した）ことを示す。さらに、この３つで全ての部分学習（ジェム）が完了したことから、メニュー画面１２０において３つの種類別部分学習ボタン１３１（ジェム）の中心にある総合学習ボタン１３２が選択可能となる。
【００７９】
メニュー画面１２０で総合学習ボタン１３２が選択されると、図９（Ｈ）の画面構成図に示すように、学習機能部５７は、総合学習処理を開始してタイトル画面１８９を表示する。この例では、「サークルアート」として、これまでに部分学習で学んだ知識を総合したプログラムを学ぶことを示している。
【００８０】
マウスがクリックされるか、エンターキーが押下されると、学習機能部５７は、図９（Ｉ）に示すプログラミング学習画面１９０を表示する。このプログラミング学習画面１９０で、１つ目に学んだ円の位置と大きさを指定するコード、２つ目に学んだ色を指定するコード、３つ目に学んだマウスを使用するコードを全て使用して、３つの円で構成された図形がマウスの動作に合わせて移動し、かつ、位置によって色が変化するプログラムを作成させる。
【００８１】
このようにして、総合学習が完了すると、メニュー画面１２０において完了した総合学習ボタン１３２の上に「ＣＯＭＰＬＥＴＥＤ」と表示して総合学習処理が完了したことを示す完了表示をするため、その種類別セット学習データ（サークルデータ）の学習が完了したことを明瞭に示すことができる。
【００８２】
なお、追加の種類別部分学習データ（ジェムデータ）や種類別ストーリー学習データ（ブックデータ）が購入されるなどして、一度クリア（完了）した種類別セット学習データ（サークルデータ）に学習内容が追加された場合、円環（サークル）の表示を追加して２重（２回目の追加であれば３重）の円環とし、追加部分学習処理を実行できるようにする。この後は、種類別部分学習ボタン１３１（ジェム）を選択すると、その前の部分学習処理とは異なる追加学習処理を実行し、同じプログラミングコード若しくは同様の機能を持つプログラミングコードについてレベルアップした内容の学習を進める。
【００８３】
そして、追加の部分学習（ジェム）が完了すると種類別部分学習ボタン１３１（ジェム）に星のようなマークを表示（追加完了表示）すると良い。これにより、各部分学習（ジェム）について２周目の学習（次の学習）を行ったことを示すことができ、利用者も簡単に状態を確認することができる。この追加で行う部分学習（ジェム）は、同じ知識についての学習内容であってもより高度な内容とすることが好ましい。
【００８４】
ここで、本実施形態では、表示サイズ変更手段たる表示サイズ変更部５８を学習機能部５７に備えることにより、視覚的なわかりやすさを最大限に活用しつつ初心者でもストレスなく簡単に学んでいきながら、難しい課題にも簡単に解答できるようにしている。
以下、表示サイズ変更部５８の具体的な態様について説明する。
【００８５】
表示サイズ変更部５８は、図１０（Ａ）及び図１０（Ｂ）の各プログラミング学習画面構成図に示すように、学習内容によってウィンドウサイズを適宜変更し、視覚的に理解され易いレイアウトをとる。すなわち、表示サイズ変更部５８は、出題内容表示部たる課題表示部１９４と、コード入力部１９５と、プレビュー表示部１９１について、それぞれの大きさおよび配置を、学習するプログラミングコードの内容に応じて変化させる。
【００８６】
図１０（Ａ）は、プレビュー表示部１９１を画面の左右のどちらか一方（図示の例では左側）にて画面の上下方向の８０％以上を示す大きさで表示し、かつ、課題表示部１９４とコード入力部１９５を他方（図示の例では右側）に上下に並べて表示する縦長プレビュー画面確認モードのプログラミング学習画面１９０を図示している。この場合、プレビュー表示部１９１は、画面全体の横幅の４〜７割を占め、その残りの幅（６割〜３割）を上下に配置された課題表示部１９４とコード入力部１９５がそれぞれ占めている。この割合は、プレビュー表示部１９１の横幅が画面全体の横幅の半分より大きく７割未満とすることが好ましく、６割程度とすることが好適である。また、課題表示部１９４は、画面全体の高さ（縦幅）の３割〜７割とし、コード入力部１９５がその残りの高さ（７割〜３割）を占めている。この割合は、課題表示部１９４を画面全体の高さ（縦幅）の４〜６割程度とすることが好ましく、５割程度（画面全体の高さの半分程度）とすることが好ましい。このように、左右の一方にプレビュー表示部１９１、他方に課題表示部１９４とコード入力部１９５を上下に並べて表示することで、画面の上下方向に長く出力するようなプログミングを適切なプレビューと共に利用者に学習させることができる。また、プレビュー表示部１９１をできるだけ広くとることができるとともに、コード入力部１９５に入力する行数もできるだけ多く確保することができる。
【００８７】
図１０（Ｂ）は、プレビュー表示部１９１を画面の上下のどちらか一方（図示の例では上方）にて画面の左右方向の８０％以上を示す大きさで表示し、かつ、課題表示部１９４とコード入力部１９５を他方に上下に並べて表示する横長プレビュー画面確認モードのプログラミング学習画面１９０を図示している。この場合、プレビュー表示部１９１は、画面全体の高さ（縦幅）の３〜７割を占め、その残りの高さ（７割〜３割）を左右に配置された課題表示部１９４とコード入力部１９５がそれぞれ占めている。この割合は、プレビュー表示部１９１の横幅が画面全体の高さ（縦幅）の４割〜６割とすることが好ましく、５割程度とすることが好適である。また、課題表示部１９４は、画面全体の横幅の３割〜６割とし、コード入力部１９５がその残りの横幅（７割〜４割）を占めている。この割合は、課題表示部１９４を画面全体の横幅の３〜５割程度とすることが好ましく、４割程度とすることがより好ましい。すなわち、コード入力部１９５は、画面全体の７〜５割とすることが好ましく、６割程度とすることがより好ましい。このように、プレビュー表示部１９１を上下方向の一方に横幅８０％以上（好ましくは横幅全体）に表示し、課題表示部１９４とコード入力部１９５を他方に左右に並べて表示することで、画面の左右方向に長く出力するようなプログミングを適切なプレビューと共に利用者に学習させることができる。また、プレビュー表示部１９１を左右にできるだけ広くとることができるとともに、コード入力部１９５において１行に入力できる文字数もできるだけ多く確保することができる。このため、できるだけコード入力部１９５の横幅を確保して横長にプログラミング言語を記載することができ、長い条件文やパラメータが多い関数などの文字数の多いプログラミング文をできるだけ一行で表示することができる。
【００８８】
なお、学習画面表示手段におけるコード入力部１９５は、上述の通り、コードの入力ができるコード入力行を複数行表示し、当該複数行のコード入力行のうち出題内容表示部により入力を求めているコード入力行のみを利用者が入力可能とし、その他のコード入力行を変更不可とする構成である。
【００８９】
以上のようにして、表示サイズ変更手段たる表示サイズ変更部５８を備えることにより、視覚的なわかりやすさを最大限に活用しつつ初心者でもストレスなく簡単に学んでいきながら、難しいプログラミングを効率よく学ぶことが可能となる。すなわち、プログラミングの行数をできるだけ多くしたい場合や、プレビューで左右方向に広い範囲を確認したい場合等に、縦長プレビュー画面確認モードとすることができ、プログラミングにおける１行の文字数をできるだけ多く表示したい場合や、プレビューで上下方向に広い範囲を隠したい場合等に、横長プレビュー画面とすることができる。このため、学習するプログラミング内容に対して、各表示部（１９１，１９４）および入力部（１９５）のサイズを最も必要な方向の長さができるだけ長く確保できる配置にして、様々なプログラミングを適した画面配置およびサイズで学習できる。
【００９０】
このように、表示サイズ変更部５８（表示サイズ変更手段）を設けることで、視覚的なわかりやすさを最大限に活用しつつ初心者でもストレスなく簡単に学んでいきながら、難しい課題にも簡単に解答できるようになる。
【００９１】
また、表示サイズ変更部５８は、縦長プレビュー画面確認モードと、横長プレビュー画面確認モードとを有する、換言すれば切り替えることができる。  
すなわち、プレビュー表示部１９１を画面の左右のどちらか一方にて画面の上下方向の８０％以上を示す大きさで表示し、かつ、出題内容表示部たるとコード入力部１９５を他方に上下に並べて表示する縦長プレビュー画面確認モードと、プレビュー表示部１９１を画面の上下のどちらか一方にて画面の左右方向の８０％以上を示す大きさで表示し、かつ、出題内容表示部１９４とコード入力部１９５を他方に上下に並べて表示する横長プレビュー画面確認モードとを有することで、視覚的なわかりやすさを最大限に活用しつつ初心者でもストレスなく簡単に学んでいくことができる。
【００９２】
また、コード入力部１９５は、学習している部分の対象行のみ入力を受け付け、他の行については表示されているが入力を受け付けない構成であることにより、全行があることでの意味を理解し、かつ、学習しているピンポイントの部分だけを入力でき、容易に学ぶことができる。しかも、他の部分が入力不可であることにより、学習している部分とは異なる部分を編集してしまい、正しく戻せないといったことが生じることを防止できる。
なお、この発明は本実施形態に限られず他の様々な実施形態とすることができる。
【産業上の利用可能性】
【００９３】
この発明は、プログラミングの知識を教えるような産業に利用することができる。
【符号の説明】
【００９４】
１…プログラミング学習システム
２７ａ…学習用プログラム
５２…イベント処理部
５３…メニュー機能部
５６…ステータス機能部
５７…学習機能部
５８…表示サイズ変更部
１１３ａ…ポストカード情報表示部
１２０…メニュー画面
１３０…サークル
１３１…種類別部分学習ボタン
１３２…総合学習ボタン
１８０…ステータス画面
１９０…プログラミング学習画面
１９１…プレビュー表示部
１９４…課題表示部
１９５…コード入力部
１９６…クリアボタン