あゆむアプリ 進捗21

問題画面の大まかな構成を作成しました。



この画面について説明致します。



① 問題文表示（赤枠内のエリア）
問題文や解答欄，解答入力欄，正解の解説を表示します。例えば、進捗12の時計の問題や，進捗14の１０よりも大きい数字の問題を、このエリアに表示します。

② タイトル表示
ステージ名称や、その他の補足情報を表示します。

③ 残り時間タイマー
このステージに設定された制限時間の残り時間を表示します。

④ 正答数
このステージの正答数を表示します。（「ポイント数」を表示して、正解時は＋１ポイント，不正解時は－１ポイントのようにするのもいいかもしれません。）

⑤ こたえるボタン
①で解答を入力してからこのボタンを押し、正否判定を行います。

⑥ つぎへボタン
次の画面状態に移行します。

③の残り時間タイマーについて、当初は進捗9のように横長で表示する予定でしたが、問題文を表示するエリアの縦横比などを考慮して、③④ともに縦長で表示します。
また、例えば進捗12と進捗14のように、問題内容や解答の入力方式の違いにより、①エリアの見た目や操作感はそれぞれの場合で異なったものとなります。一方で、②～⑥の見た目や操作感は、どんな問題であっても（ほぼ）一定にして一貫性を図ります。

次のサンプル動画は、画面下部の「正解のとき」を指定したときは正解の解答を入力している状態，「不正解のとき」を指定したときは不正解の解答を入力している状態であるものとして、それぞれの状態で「こたえる」ボタンを押したときの挙動を示しています。



（前回記事）あゆむアプリ 進捗20

＜お問い合わせ＞
このブログの管理者へのお問い合わせは、こちらからお願い致します。

あゆむアプリ 進捗20

各ステージの課題を解いたときに、正解数や正解率，解答に要した時間などに基づいて合否判定を行い、合格すると次のステージに挑戦できるようにします。また、合格した場合は、成績に基づいてメダルを獲得できるようにします。獲得したメダルは、その個数や色に応じて、隠し要素が登場する、関所のようなところを通過できるようになる（一定の成績に到達しないと先に進めない）、などのシナリオの分岐条件とすることを想定しています。

メダルは、ゴールド，シルバー，ブロンズの他に、ゴールドよりも位が高いプラチナを作成しました。



赤，緑，青の成分を、それぞれ０～２５５の２５６段階で調整し、ちょうどいい比率を探し当てながら色をつくります。グラデーションをつけることにより、メタリックな色調となるようにしました。

（前回記事）あゆむアプリ 進捗19

＜お問い合わせ＞
このブログの管理者へのお問い合わせは、こちらからお願い致します。

あゆむアプリ 進捗19

進捗18で作成したマップの機能を拡張しました。あらかじめ用意しておいた別エリアのマップ情報も読み込めるようにして、画面上のキャラクターが、それぞれのマップ間で移動できる仕組みを作成しました。





このサンプルは、次の３つのマップで構成されています。

上段：地上エリア


中段：地下エリア


下段：地底エリア


マップ上にある階段は、それぞれ Ａ－Ａ'，Ｂ－Ｂ'，Ｃ－Ｃ' 間でつながっており、キャラクターが階段のオブジェクトに到達すると、他のマップに移動することができます。また、画面上のマップが切り替わるときに、黒い前景をフェードイン、フェードアウトさせる効果を加えました。プレイヤーは、課題をクリアしながら、広い世界の中を冒険しているような感覚で学習アプリを楽しむことができます。

（前回記事）あゆむアプリ 進捗18
（次回記事）あゆむアプリ 進捗20

＜お問い合わせ＞
このブログの管理者へのお問い合わせは、こちらからお願い致します。

あゆむアプリ 進捗18

進捗15の記事に記載しましたように、進捗6で作成したマップの内部仕様を変更しました。進捗16，進捗17で作成した画像を用いて、マップを作成し直しました。





また、マップの設定ファイルを読み込み、その内容に基づいてマップを表示する仕組みを作成しました。設定ファイルにて、マップ上に表示させるオブジェクトの種類（道路や城の画像など）や、その位置，大きさ，回転の度合いなどを指定し、これらのオブジェクトを組み合わせて１つのマップを表示します。この仕組みにより、プログラムのコードを変更することなく、マップを微調整したり、全く異なるマップを作成したりすることもできます。

右下のボタンを押すことにより、そのステージの問題（進捗12，進捗14など）に遷移する仕組みを作成していきます。

（前回記事）あゆむアプリ 進捗17
（次回記事）あゆむアプリ 進捗19

＜お問い合わせ＞
このブログの管理者へのお問い合わせは、こちらからお願い致します。

あゆむアプリ 進捗17

学習アプリのマップで使用する城の画像を作成しました。



バリエーションに富んだマップを作成するためには、さらに多くの画像を作成する必要がありますが、必要最低限の画像は揃いました。一旦、アプリ上で画像を組み合わせてマップを表示するための仕組みを作成していきます。

（前回記事）あゆむアプリ 進捗16
（次回記事）あゆむアプリ 進捗18

＜お問い合わせ＞
このブログの管理者へのお問い合わせは、こちらからお願い致します。