Code your own Black Panther: Wakanda Forever game using MakeCode Arcade!

Start with this great tutorial, and then customize or build your own totally new game using the excellent art assets provided.

The game build in this guide also includes optional NeoPixel Vibranium Gauntlet blasts when run on the PyGamer!

Parts

Angled shot of Adafruit PyGamer for MakeCode Arcade, CircuitPython or Arduino.
What fits in your pocket, is fully Open Source, and can run CircuitPython, MakeCode Arcade or Arduino games you write yourself? That's right, it's the Adafruit...
Out of Stock
Adafruit NeoPixel LED Strip with 3-pin JST PH Connector lit up rainbow
Plug in and glow, this Adafruit NeoPixel LED Strip with JST PH Connector has 30 total LEDs in a "60 LED per meter" spacing,...
$12.50
In Stock

If making a DIY NeoPixel Y-splitter, you'll need two JST PH 2mm 3-pin socket cables, and one JST PH 2mm 2-pin plug cable.

Angled shot of JST PH 3-Pin Socket to Color Coded Cable - 200mm
This cable will let you turn a JST PH 3-pin cable socket into 3 individual tinned wires. These are great to match up with our JST 3-PH cables, for extending and connecting...
$0.95
In Stock
Angled shot of JST PH 3-pin Plug-Plug Cable - 100mm long.
This cable is a little over 100mm / 4" long and fitted with JST-PH 3-pin connectors on either end. We dig the solid and compact nature of these connectors and the...
$0.75
In Stock
Mini Oval Speaker with Short Wires
Hear the good news! This wee speaker is a great addition to any audio project where you need 8 ohm impedance and 1W or less of power. We particularly like...
$1.95
In Stock
Lithium Ion Polymer Battery 3.7v 350mAh with JST 2-PH connector and short cable
Lithium-ion polymer (also known as 'lipo' or 'lipoly') batteries are thin, light, and powerful. The output ranges from 4.2V when completely charged to 3.7V. This...
$5.95
In Stock
Adafruit PyGamer Acrylic Enclosure Kit
You've got your PyGamer, and you're ready to start jammin' on your favorite arcade games. You gaze adoringly at the charming silkscreen designed by Ada-friend...
$12.50
In Stock
Angled shot of 10 plastic button caps colored reddish-orange, yellow, white, and black.
These Reese's Piece's lookin' bits fit perfectly on top of tactile buttons with 2.4mm square tops and give a satisfying 8mm diameter surface area for your fingers to...
$0.95
In Stock

or:

Adafruit PyGamer Starter Kit with PCB, enclosure, buttons, and storage bag
Please note: you may get a royal blue or purple case with your starter kit (they're both lovely colors)What fits in your pocket, is fully Open...
Out of Stock

Start Here

If you're new to MakeCode Arcade, check out this intro as well as some of these Learn Guides on making games with MakeCode Arcade.

You can also check out this great video playlist from Microsoft's MakeCode team, as well as the MakeCode Arcade Game of the Week series.

Wakanda Forever Game

Click the button below to open the game in the MakeCode Arcade site in your web browser (it should open into a new window).

You can play the game in the browser and then continue below if you want to see how it's made and customize it.

Click on the Edit Code button in order to customize the code.

Extensions

Some extensions are used to add functionality to the program. From the Advanced category section, in the Extensions item, the following are added:

  • Sprite scaling to allow re-sizing of the character sprites
  • Background scroll to create multi-plane camera background layers
  • Light to use NeoPixel strips
  • Feather to add the Feather pins necessary to plug NeoPixel strips into the PyGamer hardware

Title Sequence Function

A function called title sequence is used to place all of the opening title blocks in a single place that can be called from the main startup block when the game begins.

The text sprite blocks create the three lines of text, "Black Panther", "WAKANDA", and "FOREVER".

The sound block creates an ascending alert tone.

BG Layers Setup Function

Using the Background Scroll extension, a set of different background layers are created -- these were extracted from the tutorial image using copy, paste, and erase!

This give the game the illusion of depth using the parallax effect. 

NeoPixel Setup Function

Add the Light extension to MakeCode Arcade. 

First, open the Advanced category section and click on the Extensions item.

Next, click on the light extension, which adds the blocks we need.

Click the Light category to see the available blocks. Now you can click on the "..." category under Light to get the NeoPixel strip blocks.

Create a function called NeoPixel setup and add the strip blocks shown here.

Vibranium Gauntlet Blast Function

This function will be called when the NeoPixel strand shoots a blast -- this is done by advancing the bright "photon" pixel by three, and doing so ten times. The strand has 30 LEDs, so this will blast forward through the whole strip.

Character Setup Function

In this function, the two character sprites are created and defined as "player" and "enemy", which are tags that are used for other behaviors later.

The character sprites are then scaled up in size to make them appear bigger on screen.

Shuri's position is set at the start, and the "stay on screen" flag is set on so she can't be moved off screen.

Namor is set to follow Shuri with a speed of 40.

Finally, Shuri is set to be controlled with the d-pad at a velocity of 100 on x and 220 on y.

gaming_wfg7.jpg

gaming_wfg8.jpg

On Start

The on start loop runs once at the beginning of the game to set up or run a number of commands and functions.

The started flag is set to false in order to prevent the a button from firing projectiles until the game has started.

The title sequence function is run, followed by the BG setup function.

Then, after a short pause, the title text sprites are removed from the screen, and then a long text is shown that says "Battle Namor! But don't get hit!!".

The character setup function is run, and Shuri's life counter is set to 10.

The started variable is set to true, and then the NeoPixel setup and Vibranium Gauntlet blast functions are called.

Namor Projectile Loop

All forever loops are run continuously once the game has started. This one is used to have Namor fire projectiles at Shuri at a randomized interval.

Namor Motion Constraint

Since the follow loop is running constantly to have Namor move toward Shuri in both x and y, we want to limit that motion to only the y axis. This is done here by setting Namor's x position to 138 constantly.

Fire Button

Whenever the button is pressed, the check is made to see if the game has started (based on the state of the started variable).

Then, if that check passes, a projectile is emitted from Shuri's sprit, and sent on the x-axis at a velocity of 225 vx.

When the projectile hits a wall or sprite it is destroyed.

Each time the projectile is fired the Vibranium Gauntlet blast function is called to light up the NeoPixel strip.

Shuri Hit

If Shuri is hit by Namor's projectile, her life count decrements by one, a sound effect is played, and Namor's position is reset to a random location on the y-axis.

Namor Hit

When Namor is hit by Shuri's projectile, the score is incremented by 1, a sound effect is played, and Namor's position is reset.

Shuri Wins

When the score reaches 10, the player wins! Namor is destroyed, a "We are safe!" text is displayed, and Shuri proclaims, "WAKANDA FOREVER".

Then, the confetti effect plays, and the game is set to over with the WIN condition.

Next Steps

Ready to up your game? For an added challenge, now try to add features, such as extra life power-ups, add new levels, and adjust the difficulty!

Here's how to assemble the laser cut acrylic case for the PyGamer. The kit comes with seven pieces of acrylic, and four screws and nuts. You've got ten button caps to pick from (you'll pick four), and you'll also want to connect the speaker and battery for the full portable experience.

Prep

If you haven't already, remove the clear plastic screen protector film from the PyGamer display.

Paper Protection

Remove the protective paper backing from both sides of all the acrylic pieces.

Speaker

Plug the speaker into the speaker port on the PyGamer.

Then, remove the white oval plastic ring to expose the adhesive and press the speaker to the PyGamer where the silkscreen oval outline indicates.

Battery

Plug the battery into the on-board connector. Very carefully, bend the wires so that the battery fits the spot shown.

Button Caps

Pick four of the button caps and click them into place on the square shafts of the buttons. Which color combo will you choose?!

Case Layers

The case assembly is pretty simple. Place the clear top side piece on as shown.

Next, place the smoked gray piece on.

Spacers

Flip the board over, then place the four spacer pieces onto the back as shown.

Backing

The last piece to go on is the thin bottom layer with the Feather header cutouts.

Fasteners

Push the four screws through from front to back, being sure they go through the holes in all layers and the PyGamer.

Screw on the nuts to secure things. Hand tight is fine -- you don't want to crack anything by using excessive force.

That's all there is to it -- you're ready to play with your PyGamer in its excellent, stylish case!

First, follow this page to load the game onto your PyGamer or PyBadge.

Plug the NeoPixel strip into the 3-pin JST connector marked D3 as shown here.

Turn on the PyGamer and the game will start. Once you get past the loading screens, the NeoPixels will light up.

Advance DIY Double Strand Hack

Double Blasters

Despite being listed in the NeoPixel strip pin list, the D2 JST plug can't be used in MakeCode Arcade at the moment. However, there's another way to use double Vibranium Gauntlet blaster strips! Since NeoPixels can run in parallel, a DIY wire y-splice will do the trick. See this guide for more on wire splicing.

Here, the ground, 3.3V and data pins from the D3 JST port have been spliced to two adapter cables.

By plugging in a pair of strips to the adapter, you get twice the NeoPixel action! They will run identically to each other, which works well in this case.

This guide was first published on Nov 22, 2022. It was last updated on Mar 08, 2024.