brickout – Gameplay Coder

Added Brickout Game To GitHub

Hey guys,

The source code for one of the earlier games I created, Brickout, is now available on GitHub here. If you’re interested in looking at games under the hood, have a look!

This game is the first completed game using HTML5 + Phaser. To build the level, I used Tiled. I found level graphics on OpenGameArt from Matriax.

The bomb explosion animation was also on OpenGameArt, by Jetrel.

Meanwhile, I’m working on some new 2D games, made in either Phaser or Unity, so there’s more to come!

Like this:

The image above is a screenshot for a Unity game I’m currently working on. This is from the course on Udemy: Complete C# Unity Developer 2D: Learn to Code Making Games.

It’s the last project in the course (I’m almost done! YEAH! 💪🏿) , and it’s a tile-based, 2D, side-scrolling platformer, one of my favorite game genres, and I can’t wait to use all the skills I’ve learned in this course (and outside of it), to really go beyond the course material, and finish it! Though it’s gonna take me a while (AS IT SHOULD), because I have a lot planned for this game.

If I may digress for a moment: Speaking of finishing things, if you’re like me, and you find it challenging to sometimes finish your side projects, watch the following video.

John Sonmez talks about how to become a finisher and finish shit.

It’s from John Sonmez, founder of Bulldog Mindset, a company that helps people, particularly software developers, become better, stronger versions of themselves and get more out of life by improving their soft skills, mindset, philosophy, wealth, investing, and relationships. He also wrote a book called Soft Skills. It’s a great read; I invite you to give this book a read.

I’m also working on a simple RPG that will use an Active Time Battle System. I’ve always been a fan of battle systems in RPGs. I’m way more interesting the the working of battle systems than I am in the story lines. ⚔

Ever since I was introduced to the ATBS in Final Fantasy IV (and it was elaborated on in Final Fantasy VI), I’ve always been fascinated by it.

There is so much involved in this type of game, such as inventory, moving around in maps, stats, and the various intricacies involved in building a battle system.

This is a very exciting project, as I’ve never worked on an RPG before. Neither as side project (until now), or a client project – though I’d LOVE to work on a client’s RPG!

By the way, if you’re looking for a coder to help you build a 2D tile-based, single-player RPG, get in touch with me through this contact form, or e-mail me directly at cartrell@gameplaycoder.com. 😉

That’s it for now, guys. Take care,

– C. out.

P.S.: And should I survive all that, let’s not forget about card games, which I’m still considering specializing in. I want to make a battle card system (think collectible card game), that has mechanics similar to Yu-Gi-Oh!. It’s really the automation of the mechanics of this game that fascinate me. This will likely be THE most difficult game I’ve ever worked on, but I’m looking forward to the challenge.

Thunderjack! (HTML5 Version) and Phaser Editor

Hey there.

In addition to the Android version of Thunderjack! that I’m working on, I’ve also started a browser version, using HTML5. Flash is reaching its end-of-life, but browser games are still a thing. So, HTML5 is the next step for me, and I’ve been improving my skills to produce web-based games that do not use a plugin.

I found Phaser, an HTML5 game development library, and started learning it. This library is incredible! I’ve used it to create my first HTML5 game, Brickout.

Sure, I’m not the biggest fan of JavaScript (I took this course to get some quick JavaScript training), but that’s a relatively small hurdle to overcome – especially if you were like me – ego and attitude was keeping you from learning JavaScript.

I also wanted some sort of WYSIWYG IDE for designing the visual aspects of HTML5 games, similar to Adobe Flash/Animate. Eventually, I found the Phaser Editor.

Giving this software a try, I’m really liking most of what I’m finding with this editor. When you add visual objects the canvas scene, Phaser Editor generates the JavaScript code that creates those Phaser objects. No more having to hard-code things like the x/y positions of objects and line up your objects using trial and error.

You can even create custom, re-useable objects (known as prefabs in Phaser Editor), which can really facilitate the building process.

While the learning curve isn’t too steep, though I would have liked to see a tutorial that creates a game using the editor from scratch, rather than a pre-made game.

This editor also comes with its own JavaScript coding editor, with many of the standard features you’d expect from an editor, such as auto-completions, listing of JavaScript and Phaser API methods, code refactoring, and more.

Phaser Editor comes in two flavors: free and paid. The free version has some limitations, but not enough to stop you unless you’re building a massive game.

Overall, this is a very handy tool, and I’m excited about integrating it into my workflow as I add HTML5 game coding to my list of services.

More updates on Thunderjack! will be in the coming weeks. Stay tuned.

Talk to you soon.
– C. out.

[Gameplay] – Brickout

Play Brickout here!

Of course, I can make games like this for you too. If you’re interested, please get in touch with me by clicking here or e-mailing me directly at:
cartrell@gameplaycoder.com.

Thanks,

– C. out.

Brickout Is Ready!

Hey!

Brickout is finally ready for first release! Yeah!!

Only thing is… I need to figure out how to add a portfolio that my current theme can use!! Or, maybe switch themes. Welp, let me figure that part out.

In the meantime, here is a video play through, although I didn’t get very far, haha!

On to the next game project! Thanks for staying with me!

Of course, I can make games like this for you too. If you’re interested, please get in touch with me by clicking here or e-mailing me directly at:
cartrell@gameplaycoder.com.

Thanks,

– C. out.

Brickout: Polish Update

Hey there.

Polish can easily be overlooked when developing a game. It’s that last 10 percent or so where you smooth out the rough edges, focus on the intricacies of mechanics or functionality, and sharpen up audio, visuals and feedback. Polish is what can turn a bad game into a good game, and a good one into a great one, all else being equal.

A bit of progress has been made to add polish to Brickout. Let’s demonstrate what’s done so far.

Added particle effects to broken bricks.

Getting into Phaser’s particle system wasn’t too difficult. I created a simple graphic that represents a broken piece of the brick, and used that as the particle. Every brick has its particles that match its own color.

Extra Impact to Bomb Explosions

When a bomb explodes, it now produces a screen flash and tremor.

This one was a lot of fun to add. The flash made use of Phaser’s graphic primitive functionality. In this case, I used a colored rectangle that fills the entire screen.

The tremor was super-easy. Interestingly enough, there is a “shake” method on Phaser’s Camera object that you can call, and specify the intensity and duration of the tremor. In previous games I’ve made for clients, I’ve always had to do this manually, and I was expecting to do that here. Thankfully (or unfortunately, if you’re a crazy coder (: ), that’s a task I’m relieved of for this game. (:

There is also a “shattering” sound that is played if the bomb happens to clear any bricks within its blast area.

Saver Blocks Gradually Appear Instead of All at Once

When the saver bridge is forming itself, it now does so once brick at a time. So, you’re not out of the woods yet, and you can still lose a ball while the bridge is forming!

Also added particles to broken saver bricks as well.

Adding Labels to Identify the Item Collected

When you collect gems, an animated label will briefly appear. For some items, such as the bomb or saver bridge, this is not necessary.

Alright! Let’s see this shit in action! 😀

Now, more work to do!

– C. out.

Polishing Up Brickout

Hey what’s up!

The gameplay is pretty much done. Now it’s time to start polishing up the mechanics and effects. The next steps are:

– Adding particles to broken bricks (This means learning how to use Phaser’s particle system. Cool!)
– Adding a screen flash to bomb explosions. In addition to the a screen tremor, let’s add some impact to those bombs. (User of Phaser’s Graphics – draw primitives, specifically, the rectangle)
– Saver blocks appear gradually instead of all at once (Use of Phaser’s Timer system)
– Adding labels that say what power up item was just collected
– Adding particles to broken saver blocks
– When bricks are cleared with Color Match or Color Blast:
a) gradually destroy the blocks instead of all at once
b) add a screen tremor effect
c) add sound effect (different from the normal brick breaking)
– When serving the ball into play, give the player more control over where it goes. I plan on “sliding” the ball across the paddle, thus giving the player the opportunity to “aim” the ball. Check out this video:

– Adding game over when all lives (balls) are lost.

That should do it. After this, I’ll add a few more levels, and play around with balancing the items (rates of occurrence, duration and intensity of effects, and such [for game balance/feedback purposes]), do a bit more play-testing, then that should be it.

Almost there guys! Thanks for staying tuned, and comment if you’ve any questions on anything.

And for the record, yes, the game will be freely available to play on the site, as well as the source code being released.

Take care,

– C. out.

Sound Effects

What’s up, guys.

Brickout now has the sound effects added! I also snuck some of my jazzy musical skills into many of the sound effects.

A short video with the sounds is below. Things got a bit crazy around the 1:00 mark in the video! I think I’ma keep this aspect of the game design, though. Then it got really boring, trying to hit that LAST brick… dammit! >:D

But, I’m happy that with 41 sound effects added, most of them are done now. (:

Playing sounds using Phaser and its SoundManager class was easier than I thought! I still need to implement callback notifications when a sound has finished playing, because I will need that functionality a little later.

After watching the video, share your opinions in the comments below. I’m curious to know. Thanks!

– C. out.

Added Paddle Buff Items

Hey.

Got the last two items added today!

Paddle Buff: Represented by the blue gem, this item will extend the length of your paddle. This makes it easier for you to hit the ball. However, this effect is only temporary, because it only lasts for so many ball hits.

Paddle Nerf: This “item” you might wanna watch out and avoid. Masquerading as the magenta gem, it reduces the size of your paddle, making it harder to hit balls! But don’t worry; it’s effect is also only temporary. Hopefully, you can last long enough for it to wear off!

But I was thinking, maybe there can be some sort of other benefit while this effect is in active. Since it does create an extra challenge, you will gain bonus points for breaking bricks when your paddle is nerfed. What do you think? Let me know in the comments below!

So that should be it for the items. I don’t plan on adding any more, but if have anything good, let me know, and I’ll consider it.

So next are the oh so important sound effects. Time to give this game some personality!

– C. out.

Six New Effects Added

Hey.

I’ve been busy working on a bunch more effects to add to Brickout, and got the functionality for six more of them in the engine. Without further ado…

Saver

This item is represented by the blue crystal. When you collect it, a bridge of blocks will form underneath you. These bricks can save you by keeping you from losing a ball. But! (there’s always a “but”)… each brick can only be used once, and the bridge only lasts a short time.

Blitz Ball

Powered by the red crystal, this increases the size of your ball, allowing it to pummel straight through blocks! It only lasts a short time though, but you can do some serious damage with this. I can’t wait to polish up this son of a gun later on!

Bonus Points

What would an action game be without having a way to gain some bonus points? The cyan-colored crystal allows you to do just that. When you collect the first one, you earn an additional 500 points. With each successive crystal you earn, you’ll get an additional 500 added onto it. So 500, 1000, 1500, etc. It caps at 5000, and if you lose a life, it starts over at 500. I plan on allowing you to be able gain an extra life when you earn so many points on your score, so there’s an extra incentive to get lots of points!

Color Match

Similar to the Color Blast item, this one, powered by the light-blue crystal, allows yo to clear may bricks at once. However, this gem works a little differently. When collected, it affects the next ball that you hit. When that ball hits a brick, it clears all the bricks on the board of the same color. The effect can only be used once per gem.

Extra Ball (Life)

Another classic feature of most action games is the ability to gain extra lives. I already hinted there will be a way to do so by scoring points, but with this orange crystal, you gain an extra life immediately when you collect it.

New Ball

Last but definitely not least, is this purple gem. When you collect this, it introduces a new ball into play. Now you’ve got zany task of juggling two (or more) balls! If you miss one of them, you won’t lose any lives until you’ve lost all of them. If you’re good at this (as you can see, I suck at this shit), you can clear boards quickly. I might also add extra points functions here too, where the more balls you can juggle, the more points you get.

So that’s it for now. I’m almost done with the items; I have two or three more to add. Once they’re all in, I’ll start working on additional levels, adding sound effects, UI and polish. Takes a lot to make a fully-functional, polished game.

Thanks, and stay tuned!

– C. out.

Color Blast Item Added

Hey.

A new item has been added to Brickout. This item is called the “Color Blast”, and to get it you need to collect the purple gem.

What this item does it it will remove the bricks with the most common color. For example, in the demo video below, when the Color Blast gem is collected, it removes all the green bricks, because there are more green bricks than any other color of brick on the board.

This item was fairly easy to implement using the current code engine I’ve already built.

More items will be added soon, so keep watching!

– C. out.