すべてのカテゴリ

みなさんこんにちは。 小学2年生になる息子がいるのですが、 ポケモンが大好きです。 かつ、今後のICT教育を見据え、パソコンにはどんどん触れてほしいと思い、ポケモンアプリを開発しました。アプリのご紹介については過去のブログをご参考ください。今回はその中で、Pokemon Game Sound Libraryからのダウンロード方法、取得した音楽ファイルを再生するための実装方法など解説したいと思います。Pokemon Game Sound Libraryから音楽データを取得するまずは、Pokemon Game Sound Libraryにアクセスします。オープニング画面からBGMが流れます。(この時点でテンションが上がりませんか？w なお、常にサイトを開いている間は音楽が流れますのでPCの音量にはご注意ください！ダウンロードをクリックします。説明をよく読んで一番下の「ご利用のガイドラインはこちら」をクリックします。ガイドラインをよく読んで「ダウンロードはこちら」をクリックします。最後までスクロールすると、「利用規約に同意してダウンロードする」がアクティブになるのでクリックします。「ポケットモンスター　赤・緑」をクリックします。こちらの画面から好きな音楽をダウンロードします。開発環境についてまずは、開発環境については、過去ブログで触れてますのでそちらをご参考ください。実装についてまずは音楽ファイルの定数を宣言します。const OpeningMusic = "＜音楽ファイルの格納先＞" const GameMusic = "＜音楽ファイルの格納先＞" const Pok

みなさんこんにちは。小学2年生になる息子がいるのですが、ポケモンが大好きです。かつ、今後のICT教育を見据え、パソコンにはどんどん触れてほしいと思い、ポケモンアプリを開発することにしました。ゲームボーイカラー風ポケモンアプリ(エイチ)ttps://pokemon-app-ff27a.web.app/※リンクが貼れない仕様なので頭文字をカタカナにしてます。見た目はこんな感じです。仕様の詳細は以下の通りです。前提条件小学2年生だとPCでのマウス操作やキーボード入力もこれから頑張って習得していく時期かと思います。ですので、あくまでも子供たちに対してPCの操作に慣れてもらうことを目的としています。主な操作はクリック操作、テンキー入力、エンターキー入力をベースに作成しています。実装環境React × firebaseで実装しております。UIについてゲームボーイ世代大興奮(?)なゲームボーイカラーを模倣しております。画像は使用しておらず、フォントの選定からすべて実装で表現しております。ポケモンの情報についてPokemonAPIを使用してポケモンの画像と名前をランダムに表示しています。ポケモンのBGMについてPokemon Game Sound Libraryから音楽データを取得しています。初代ポケモン世代としては開発していく中でBGMを聞くのが一番楽しかったですｗフォントについてゲームボーイのフォントに近いDotGothic16を採用しています。ゲームの内容について小学2年生でも簡単な1桁同士のたしざん、ひきざん、かけざんを使用しています。ポケモンが大好きなお子様をお持ちのお父さんお母さん