※ 当ページには【広告/PR】を含む場合があります。
2021/11/17
2023/01/26
このページはブログ記事の中で解説したスクラッチ・アプリのまとめコーナーです。現在までのスクラッチ関連のブログの記事と取り上げてきたRPG風のスクラッチゲーム・『猫くえすと』(仮)の開発履歴をまとめていく内容になっています。気が向いたときにしか更新してません...。ゲームの完成はいつになることやら...ですが、スクラッチプログラミングに興味がある方は、以降の作成日記もご覧下さい。☆👇ゲームをスタートする場合にはStartボタンを押してください。ゲーム概要
RPG風のマップを表示してネコを動かすだけのプログラムです。
画面左下の十字キーで移動、右下の検索ボタンで現在のマップの地形を教えてくれます。
このプログラム開発の記事はタイルマップ生成拡張機能で作成方法を解説しています。
【Pschool厳選】Scratchを学べるオンライン・駅前プログラミングスクール５選
作成日記
プログラムの作成の取り組みや機能の更新履歴を時系列でまとめたリリース履歴兼プログラム作成記事へのリンク集です。関連記事のクイックリンクページ不定期で更新しているため、プログラムのバージョンが進むほど高度なプログラムになっていますのでご注意ください...。バージョン 1.1 (2023/01/26更新)
Svelte(Javascript)からのキーボード入力によるイベント処理と、requestAnimationFrameによる高度なアニメーションを行う手法を解説する。
【SvelteでRPGゲーム開発】requestAnimationFrameを使いながらアニメーションを意識したスプライトを操作するSvelteでRPG自作ゲームを作る際にブラウザへキー入力によるキャラクターのアニメーション付き操作を考えます。
バージョン 1.0 (2023/01/22更新)
ScratchでのRPGアプリケーションの開発を断念し、Svelte(Javascript)への完全移行を決意。プログラムの移植を進める最初の一歩として、簡単なマップをSvelteで作成する方法を検討する。【SvelteでRPGゲーム開発】マップ背景を表示する〜基本編SvelteでRPG自作ゲームを作る際にタイルマップをブラウザに簡単に表示させるためのテクニックを解説します。
バージョン 0.5 (2021/02/17更新)
スクラッチゲームにRPG風のアニメーション効果をつけたスプライトを移動させるためのエクステンションを作成する方法を解説。【Scratch拡張機能をJavascriptで自作】SVG画像からスプライトをアニメーション的に動かす拡張機能の作成方法clipPath要素・use要素を用いたSVGアニメーションをScratchアプリに組み込む拡張機能を自作してみます。
バージョン 0.4 (2021/02/10更新)
スクラッチゲームにRPG風のセリフウインドウを表示させるためのエクステンションを作成する方法を解説。【Scratch拡張機能をJavascriptで自作】RPG風の吹き出しを表示する拡張機能RPG風のタイルパターンを使ったマップを作成するScratch拡張機能をJavacriptプログラミングから完成させます。
バージョン 0.3 (2021/02/05更新)
スクラッチゲームにSVGマップを展開するエクステンションの作成方法を解説。【Scratch拡張機能をJavascriptで自作】svg画像からRPG風のマップを生成する拡張機能を作る〜拡張機能の実装③RPG風のタイルパターンを使ったマップを作成するScratch拡張機能をJavacriptプログラミングから完成させます。
バージョン 0.2 (2021/02/02更新)
タイル番号を記述したCSVテキストをファイル入力する形式で、自動でマップ形式のHtmlファイルに出力してくれるユーティリティをシェルスクリプトで作成する方法の解説。【Scratch拡張機能をJavascriptで自作】svg画像からRPG風のマップを生成する拡張機能を作る〜マップ作成編②Scratchの自作拡張機能で、RPGゲームのマップの種となるcsvファイルを使ってBase64化したタイルの画像を所定の座標に張り合わせるプログラムを作ります。
バージョン 0.1 (2021/02/01更新)
複数のSVGタイル画像(24px四方)から、プログラム的に張り合わせてRPG風マップを生成するエクステンションの作成方法を紹介。【Scratch拡張機能をJavascriptで自作】svg画像からRPG風のマップを生成する拡張機能を作る〜準備編①Scratchの自作拡張機能の例として、svg画像からRPGマップを直接内部でレンダリングする高度な拡張機能を作ってみます。
その他の関連テクニック (2020/12/16更新)
記事を通して共通して利用しているスクラッチ・エクステンション(拡張機能)の作成方法の基本を解説。【Scratch拡張機能・自作】文字からユニコード番号に変換するちょっとしたエクステンションを作るScratch-guiから、文字もしくは文字列からユニコード(16進数)に変換するための拡張機能を自作します。
