# Extra Effects Extension

**URL:** <https://forum.makecode.com/t/extra-effects-extension/22002>\
**Category:** Arcade\
**Tags:** extension\
**Created:** [August 22, 2023, 4:26pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002 "2023-08-22T16:26:30Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![sylvancircle](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/sylvancircle/32/15811_2.png) [@sylvancircle](https://forum.makecode.com/u/sylvancircle)\
**Post date:** [August 22, 2023, 4:26pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/1 "2023-08-22T16:26:30Z")

</div>

I made an extension for some customizable splashy particle effects:  
 ![extra-effects](https://us1.discourse-cdn.com/flex020/uploads/makecode/original/2X/9/9da2fb6d96ecfa7afc3ebf90a5baee406f376899.gif)

It is available here: [https://github.com/alexszeto/extra-effects](https://github.com/alexszeto/extra-effects)

It’s generally good for sparks and explosions, but there’s enough settings to repurpose the effects into something completely different. Here’s an example:

> **[Firestarter](https://arcade.makecode.com/S25961-93672-24496-79526)**
>
> Made with ❤️ in Microsoft MakeCode Arcade.

Let me know if this is useful/confusing. If you have made some custom effects with this that you’re proud of, do showcase it here! I’d love to see what effects people are able to make with this.

---

<div class="post-metadata">

**Author:** ![jnegative](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/jnegative/32/10173_2.png) [@jnegative](https://forum.makecode.com/u/jnegative)\
**Post date:** [August 22, 2023, 4:35pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/2 "2023-08-22T16:35:45Z")

</div>

This is pretty cool! I’m excited to try it out on some of my upcoming games!

---

<div class="post-metadata">

**Author:** ![Luke](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/luke/32/32519_2.png) [@Luke](https://forum.makecode.com/u/Luke)\
**Post date:** [August 22, 2023, 5:36pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/3 "2023-08-22T17:36:15Z")

</div>

This is really cool but it would be super helpful if there were some notes on the code explaining what are/how to use the blocks.

---

<div class="post-metadata">

**Author:** ![randomuser](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/randomuser/32/32505_2.png) [@randomuser](https://forum.makecode.com/u/randomuser)\
**Post date:** [August 22, 2023, 8:35pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/4 "2023-08-22T20:35:51Z")

</div>

Stunning! I love it!

---

<div class="post-metadata">

**Author:** ![sylvancircle](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/sylvancircle/32/15811_2.png) [@sylvancircle](https://forum.makecode.com/u/sylvancircle)\
**Post date:** [August 23, 2023, 6:04pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/5 "2023-08-23T18:04:15Z")

</div>

I know that the help text from right clicking / tap and holding the blocks are missing - I was still learning how other extensions did that and I’ll have to add those later. Or do you mean you’d just like some comments in the example project (or just an easier to understand project) to help explain the blocks better?

… it’s probably both, isn’t it?

---

<div class="post-metadata">

**Author:** ![SoftTalker](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/softtalker/32/10776_2.png) [@SoftTalker](https://forum.makecode.com/u/SoftTalker)\
**Post date:** [August 23, 2023, 6:16pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/6 "2023-08-23T18:16:14Z")

</div>

Best extension of the year

---

<div class="post-metadata">

**Author:** ![Luke](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/luke/32/32519_2.png) [@Luke](https://forum.makecode.com/u/Luke)\
**Post date:** [August 24, 2023, 6:31am UTC](https://forum.makecode.com/t/extra-effects-extension/22002/7 "2023-08-24T06:31:47Z")

</div>

You don’t have to do both!! I was talking about this:

> [@sylvancircle](#):
>
> Or do you mean you’d just like some comments in the example project (or just an easier to understand project) to help explain the blocks better?

---

<div class="post-metadata">

**Author:** ![Gideon\_loves\_cats](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/gideon_loves_cats/32/13863_2.png) [@Gideon\_loves\_cats](https://forum.makecode.com/u/Gideon_loves_cats)\
**Post date:** [August 24, 2023, 6:36am UTC](https://forum.makecode.com/t/extra-effects-extension/22002/8 "2023-08-24T06:36:11Z")

</div>

This is my new favorite extension!!!

---

<div class="post-metadata">

**Author:** ![sylvancircle](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/sylvancircle/32/15811_2.png) [@sylvancircle](https://forum.makecode.com/u/sylvancircle)\
**Post date:** [August 25, 2023, 7:28am UTC](https://forum.makecode.com/t/extra-effects-extension/22002/9 "2023-08-25T07:28:01Z")

</div>

Okay, I turned the example into more of a tutorial thing (and found some bugs). Hopefully this is more helpful. If it’s becoming overwhelming because there’s even more code, I can cut the example down to the most important bits and put the full demo/tutorial somewhere else.

---

<div class="post-metadata">

**Author:** ![Luke](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/luke/32/32519_2.png) [@Luke](https://forum.makecode.com/u/Luke)\
**Post date:** [August 25, 2023, 4:39pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/10 "2023-08-25T16:39:20Z")

</div>

Thanks a lot!

---

<div class="post-metadata">

**Author:** ![AbstractDesigner](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/abstractdesigner/32/22531_2.png) [@AbstractDesigner](https://forum.makecode.com/u/AbstractDesigner)\
**Post date:** [August 28, 2023, 4:33pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/11 "2023-08-28T16:33:08Z")

</div>

_instantly bookmarks topic_

---

<div class="post-metadata">

**Author:** ![Luke](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/luke/32/32519_2.png) [@Luke](https://forum.makecode.com/u/Luke)\
**Post date:** [August 28, 2023, 4:42pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/12 "2023-08-28T16:42:06Z")

</div>

Same lol

---

<div class="post-metadata">

**Author:** ![sylvancircle](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/sylvancircle/32/15811_2.png) [@sylvancircle](https://forum.makecode.com/u/sylvancircle)\
**Post date:** [August 29, 2023, 4:52pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/13 "2023-08-29T16:52:40Z")

</div>

The latest version had been updated to 3.x.x, which means… breaking changes ☹

I get that breaking changes are frustrating to fix, so I have looked up and down the extension to make sure this is (close to) the last time I make breaking changes. There’s definitely still room for additions, though!

The break happens if you used the custom effect data block and try to upgrade from 2.x.x to 3.x.x. To fix the broken effects:

- replace `__createPixelRange` with `createPercentageRange`. The percentage is then multiplied by the diameter of the effect when it is being created. Because the hidden default diameter is 48 and the old system uses radius instead of diameter for the pixel range, the conversion formula from the pixel numbers to the percentage number is `pixel / 24 * 100`.
- replace `__createTimeRange` with `createTimeRange`. since these functions do appear in the block to javascript conversions, they should be searchable like all the others.
- add the value for `monoColor` between the color table array and the size table array. By default it should be `false`.

On the bright side:

- having custom spread use percentage of diameter means the size of the custom effect can change on the fly as it is being created, just like presets.
- almost every attribute of an effect data can be modified using blocks, so it’s a lot easier to tweak a preset instead of mostly replicating a preset just to change one or two things using the custom effect block.
- tweaks to spread more evenly at the start, then move more accurately to the distance even after deceleration.
- minor settings like mono color in case the two tone effect doesn’t work with your custom color rotation, and you still want big circle particles, and adjustable z depth so effects can start behind sprites.

The example had been updated to reflect the 3.x.x changes. I also made some tiny changes to the effects within the demo so there’s a little more variety and they look a little better than before.

---

<div class="post-metadata">

**Author:** ![Sarge](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/sarge/32/19590_2.png) [@Sarge](https://forum.makecode.com/u/Sarge)\
**Post date:** [August 29, 2023, 5:39pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/14 "2023-08-29T17:39:18Z")

</div>

> [@sylvancircle](#):
>
> breaking changes

Tip for releasing updates that would break old features: instead of implementing the new behaviour straight into the old methods, create a new method and put the changes there. Above the old method, add the `//% deprecated=true` tag, which will mark the block as deprecated. That way, users can now use the new blocks, and old blocks will be removed from the toolbar, but they will remain in projects that use them, meaning updating to the new version will not immediately break them.

---

<div class="post-metadata">

**Author:** ![sylvancircle](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/sylvancircle/32/15811_2.png) [@sylvancircle](https://forum.makecode.com/u/sylvancircle)\
**Post date:** [August 31, 2023, 4:28pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/15 "2023-08-31T16:28:35Z")

</div>

Good idea. I’ll keep that in mind next time, thanks!

---

<div class="post-metadata">

**Author:** ![goldtopaz](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/goldtopaz/32/28622_2.png) [@goldtopaz](https://forum.makecode.com/u/goldtopaz)\
**Post date:** [August 31, 2023, 7:54pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/16 "2023-08-31T19:54:19Z")

</div>

ok I know, I know that I didn’t even read the title but can you make custom effects?

---

<div class="post-metadata">

**Author:** ![sylvancircle](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/sylvancircle/32/15811_2.png) [@sylvancircle](https://forum.makecode.com/u/sylvancircle)\
**Post date:** [August 31, 2023, 10:38pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/17 "2023-08-31T22:38:25Z")

</div>

You can make custom effects, yes. You can play through the example to see some custom effects. There’s limits to what you can make, but if you have an idea what you’re looking for, I can let you know if it’s possibly to create using the existing blocks.

---

<div class="post-metadata">

**Author:** ![BoostedGames](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/boostedgames/32/29419_2.png) [@BoostedGames](https://forum.makecode.com/u/BoostedGames)\
**Post date:** [September 26, 2023, 6:30pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/18 "2023-09-26T18:30:30Z")

</div>

Oh my god, I haven’t seen this! I’ll try to use this for my games!

---

<div class="post-metadata">

**Author:** ![AbstractDesigner](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/abstractdesigner/32/22531_2.png) [@AbstractDesigner](https://forum.makecode.com/u/AbstractDesigner)\
**Post date:** [October 2, 2023, 6:18pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/19 "2023-10-02T18:18:20Z")

</div>

How does this man still not have the Member badge…

---

<div class="post-metadata">

**Author:** ![Sarge](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/sarge/32/19590_2.png) [@Sarge](https://forum.makecode.com/u/Sarge)\
**Post date:** [October 2, 2023, 7:14pm UTC](https://forum.makecode.com/t/extra-effects-extension/22002/20 "2023-10-02T19:14:40Z")

</div>

Idk I guess he kind of just appears, drops the best creations known to man and just dips for like 5 months… he isn’t super active on the forums

[Next page](https://forum.makecode.com/t/extra-effects-extension/22002.md?page=2)
