ホームページ >ウェブフロントエンド >jsチュートリアル >JSM プログラミング チャレンジで優勝した方法
プログラミングの課題が数多く存在する広大な世界の中で、JSM プログラミング チャレンジは開発者にとってスキルと創造性を披露する素晴らしい機会として際立っています。先月のテーマ「ビデオ ゲーム」は、参加者がゲーム開発の新たな境地を探求するエキサイティングなコンテストの舞台を設定しました。このブログ投稿では、この星間コーディング アドベンチャーで最終的に私を勝利に導いたゲーム、「Cosmic Explorer」をどのように作成したかを共有します。
ゲーム: コズミックエクスプローラー
コード: GitHub
JSM プログラミング チャレンジでは、参加者に「ビデオ ゲーム」という幅広いテーマが提示されました。私たちはビデオ ゲームをゼロから作成したり、ゲーム API を利用したり、既存のゲームのファン ページを構築したりする自由がありました。可能性は宇宙そのもののように無限でした。
ガールフレンド (ネタバレ注意、この挑戦では彼女が私の秘密兵器になりました) とブレインストーミング セッションを行った後、宇宙ベースのゲームの作成に着手することにしました。こうして、宇宙探査、遠くの惑星からの資源収集、敵船との戦いを中心としたゲーム「Cosmic Explorer」が誕生しました。
私が下した最も重要な決定の 1 つは、ゲーム開発ライブラリとして Phaser を選択することでした。これまで Web ゲームを作成したことがありませんでしたが、Phaser の機能に惹かれ、思い切って参加することにしました。この決定により、コンテスト中の私の最大の挑戦と最も重要な学習経験の両方の舞台が整いました。
// Example of initializing a Phaser game const config = { type: Phaser.AUTO, width: 800, height: 600, scene: { preload: preload, create: create, update: update } }; const game = new Phaser.Game(config);
ゲームを開発しながらフェイザーを学ぶことは、ワープスピードで小惑星フィールドをナビゲートするようなものでした。学習曲線は急峻で、時には宇宙に迷い込んだように感じました。しかし、作業が進むにつれて、物事がうまくいき始めました。私のコードは、きれいな星図というよりはスパゲッティに似ていたかもしれませんが、仕事は完了しました。
// Example of adding a sprite in Phaser function create() { this.add.image(400, 300, 'sky'); this.player = this.physics.add.sprite(100, 450, 'player'); this.player.setCollideWorldBounds(true); }
この挑戦は 24 日間続き、私は最初の立ち上げから 5 日後に旅を始めたと思っていました。この間ずっと、私はリラックスした態度で Cosmic Explorer の開発に取り組みました。インスピレーションを感じたときに取り組み、必要に応じて休憩を取りました。このアプローチにより、プロセスを楽しく続けることができ、燃え尽き症候群を防ぐことができました。
この挑戦を通じて、私はプログラミング ツールキットの新しい星座である Phaser を発見しました。このライブラリの使い方を学んだことで、これまで探索したことのなかった、ゲーム開発におけるまったく新しい可能性が開かれました。
Cosmic Explorer を他と区別したのは、ノスタルジーを誘うピクセル アート (私の素晴らしいガールフレンドがすべて作ってくれたので、間違いなく私を勝たせてくれました) と現代的なゲームプレイ要素の融合だったと思います。視差のある星の背景は没入感を生み出し、移動システムは多くのプレイヤーから賞賛されました。レトロなサウンドエフェクトは、審査員と選手の共感を呼ぶ魅力をさらに高めました。
// Example of creating a parallax background function create() { this.bg1 = this.add.tileSprite(0, 0, config.width, config.height, 'background1').setOrigin(0, 0); this.bg2 = this.add.tileSprite(0, 0, config.width, config.height, 'background2').setOrigin(0, 0); } function update() { this.bg1.tilePosition += 0.5; this.bg2.tilePosition += 1; } // This was not my solution, but the same principle. Check out the GitHub repo for the solution :)
同様のコーディングの冒険に着手しようとしている人たちへの私のアドバイスは次のとおりです:
Cosmic Explorer で JSM プログラミング チャレンジで優勝することは、広大なゲーム開発の中で信じられないほどの旅でした。それは私に新しいスキルを教え、自分の限界を押し広げ、そして最も重要なことに、コーディングの楽しさを思い出させてくれました。あなたがベテランの宇宙船長であっても、新人士官候補生であっても、同様の挑戦をすることをお勧めします。どのような新しい世界を発見できるかわかりません。
コーディングを楽しんでください。コンパイル時間が短くなり、バグが少なくなりますように!
以上がJSM プログラミング チャレンジで優勝した方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。