soundsのところに音があったので、作ってみたものです。
イメージとしては、よくおもちゃコーナーにある、小さな子ども用のおもちゃのピアノです。
工夫したところとしては、鍵盤の絵です。
鍵盤の種類は三種類、
描いてみて、押したときに、左右の枠が少し太くなり、下に長く伸ばすと押した感じに見えることがわかりました。（上図の右側がそれぞれ鍵盤を押したときのframe）
音の長さに合わせて背景の音符が流れるようにして、音が流れている感じを出してみました。
// Main console.log("Hello EnchantJS!!"); var assets = [ "images/back_mountain.png", "images/kati_land.png", "images/kati_tanuki.png", "images/title.png",// タイトル "sounds/coin.mp3", "sounds/jump.mp3", "images/cf307/kennbanmigi.png", "images/cf307/kennbanhidari.png", "sounds/piano1_1do.mp3", "images/cf307/kennbannaka.png", "sounds/piano1_2re.mp3", "images/cf307/backonpu1.png", "images/cf307/kennbanhidari.png", "sounds/piano1_3mi.mp3", "sounds/piano1_4fa.mp3", "sounds/piano1_5so.mp3", "sounds/piano1_6ra.mp3", "sounds/piano1_7si.mp3", "sounds/piano1_8do.mp3", ]; function gameStart(){// ゲーム画面 scene = gameManager.createGameScene(); core.replaceScene(scene); core.resume(); //========== // ここから //========== scene.backgroundColor = "#00ffff"; // 背景 var background1 = new ExSprite(320, 480); background1.image = core.assets['images/cf307/backonpu1.png']; scene.addChild(background1); background1.x = 0; background1.y = -480; var background2 = new ExSprite(320, 480); background2.image = core.assets['images/cf307/backonpu1.png']; scene.addChild(background2); // ド var kennbanmigi = new ExSprite(40, 104); kennbanmigi.image = core.assets["images/cf307/kennbanmigi.png"]; scene.addChild(kennbanmigi); kennbanmigi.x = 0; kennbanmigi.y = 480 - 104; // タップ kennbanmigi.addEventListener(Event.TOUCH_START, function(){ kennbanmigi.frame = 1; var sound = core.assets['sounds/piano1_1do.mp3'].clone(); sound.play(); }); // タップ終了 kennbanmigi.addEventListener(Event.TOUCH_END, function(){ kennbanmigi.frame = 0; }); // レ var kennbannaka = new ExSprite(40, 104); kennbannaka.image = core.assets["images/cf307/kennbannaka.png"]; scene.addChild(kennbannaka); kennbannaka.x = 40; kennbannaka.y = 480 - 104; // タップ kennbannaka.addEventListener(Event.TOUCH_START, function(){ kennbannaka.frame = 1; var sound = core.assets['sounds/piano1_2re.mp3'].clone(); sound.play(); }); // タップ終了 kennbannaka.addEventListener(Event.TOUCH_END, function(){ kennbannaka.frame = 0; }); // ミ var kennbanhidari = new ExSprite(40, 104); kennbanhidari.image = core.assets["images/cf307/kennbanhidari.png"]; scene.addChild(kennbanhidari); kennbanhidari.x = 40 + 40; kennbanhidari.y = 480 - 104; // タップ kennbanhidari.addEventListener(Event.TOUCH_START, function(){ kennbanhidari.frame = 1; var sound = core.assets['sounds/piano1_3mi.mp3'].clone(); sound.play(); }); // タップ終了 kennbanhidari.addEventListener(Event.TOUCH_END, function(){ kennbanhidari.frame = 0; }); // ファ var fa = new ExSprite(40, 104); fa.image = core.assets["images/cf307/kennbanmigi.png"]; scene.addChild(fa); fa.x = 40 + 40 + 40; fa.y = 480 - 104; // タップ fa.addEventListener(Event.TOUCH_START, function(){ fa.frame = 1; var sound = core.assets['sounds/piano1_4fa.mp3'].clone(); sound.play(); }); // タップ終了 fa.addEventListener(Event.TOUCH_END, function(){ fa.frame = 0; }); // ソ var so = new ExSprite(40, 104); so.image = core.assets["images/cf307/kennbannaka.png"]; scene.addChild(so); so.x = 40 + 40 + 40 + 40; so.y = 480 - 104; // タップ so.addEventListener(Event.TOUCH_START, function(){ so.frame = 1; var sound = core.assets['sounds/piano1_5so.mp3'].clone(); sound.play(); }); // タップ終了 so.addEventListener(Event.TOUCH_END, function(){ so.frame = 0; }); // ラ var ra = new ExSprite(40, 104); ra.image = core.assets["images/cf307/kennbannaka.png"]; scene.addChild(ra); ra.x = 40 + 40 + 40 + 40 + 40; ra.y = 480 - 104; // タップ ra.addEventListener(Event.TOUCH_START, function(){ ra.frame = 1; var sound = core.assets['sounds/piano1_6ra.mp3'].clone(); sound.play(); }); // タップ終了 ra.addEventListener(Event.TOUCH_END, function(){ ra.frame = 0; }); // シ var si = new ExSprite(40, 104); si.image = core.assets["images/cf307/kennbanhidari.png"]; scene.addChild(si); si.x = 40 + 40 + 40 + 40 + 40 + 40; si.y = 480 - 104; // タップ si.addEventListener(Event.TOUCH_START, function(){ si.frame = 1; var sound = core.assets['sounds/piano1_7si.mp3'].clone(); sound.play(); }); // タップ終了 si.addEventListener(Event.TOUCH_END, function(){ si.frame = 0; }); // ド var do8 = new ExSprite(40, 104); do8.image = core.assets["images/cf307/kennbanmigi.png"]; scene.addChild(do8); do8.x = 280; do8.y = 480 - 104; // タップ do8.addEventListener(Event.TOUCH_START, function(){ do8.frame = 1; var sound = core.assets['sounds/piano1_8do.mp3'].clone(); sound.play(); }); // タップ終了 do8.addEventListener(Event.TOUCH_END, function(){ do8.frame = 0; }); // 画面がタップされたら scene.addEventListener(Event.TOUCH_START, function(){ background1.tl.clear(); background2.tl.clear(); console.log("音符よ動け！！"); background1.tl.moveBy(0, 480 * 24 / 150, 24); background2.tl.moveBy(0, 480 * 24 / 150, 24); if(background2.y >= 480){ console.log("スクロールして！！"); background2.y = background1.y - 480; } if(background1.y >= 480){ background1.y = background2.y - 480; } }); //========== // ここまで //========== } function getRandom(start, end) { return start + Math.floor( Math.random() * (end - start + 1)); } function titleStart(){// タイトル画面 var scene = gameManager.createTitleScene(); core.replaceScene(scene); core.pause(); scene.on(enchant.Event.TOUCH_START, function(){gameStart();}); } //========== // EnchantJS enchant(); var gameManager; var core; var scene; window.onload = function(){ gameManager = new common.GameManager(); core = gameManager.createCore(320, 480); core.preload(assets); core.onload = function(){titleStart();}; core.start(); }