Shibajuku Hanabi 2020
![](https://shibajuku.net/wp/wp-content/uploads/2020/09/c845459fec8ba349ccf1e3320d82dfb0-1-1380x976.png)
- Launch
- Period
- 2週間
- Soft
- language
![](https://shibajuku.net/wp/wp-content/uploads/2020/11/51985442e7fa6a2d33106860b007b34e-1-1024x724.png)
どうもこんにちは。しばたです。
夏の終りにブラウザ内に花火を打ち上げました。
コロナを吹き飛ばす。
2020発のブラウザ花火。
今年はコロナの影響で、多くの花火大会が中止になりました。
僕には実際に花火を作ったり、花火を打ち上げたりするスキルはありませんが、ブラウザの中でなら打ち上げることができるかもと思い今回サロンメンバーたちで「花火大会をしよう」という話になり、作成することになりました。
僕も作ってみました。
![](https://shibajuku.net/wp/wp-content/uploads/2020/11/c8c53a6eadd3dd615967719c29df5447-1024x696.png)
赤、青、緑の花火がブラウザを彩る。自分で打ち上げることも可能。
花火は自然にあがるようにしていて、最初はポツポツと静かに打ち上がるのですが、50発目から徐々にテンポアップしていき、ストーリー性を意識した緩急をつけた各色の花火がクライマックスの2020発へと向かいます。
花火は自分で打ち上がることも可能で、好きな色の花火を好きなタイミングで打ち上げてみて下さい。
![](https://shibajuku.net/wp/wp-content/uploads/2020/11/d6755cd36e8ee536f4321eb842f9c489-1024x698.png)
サロンメンバーのみなさんも作ってくれました。
サロンメンバーのみなさんも「どうやって花火つくる?」ってとこから、サンプルを作ってみたり、JavaScriptのライブラリを使ってみたり、試行錯誤しながら作っていきました。
誰でもカスタムできるようにJavaScriptのClassを作ってくださったサロンメンバーもいます。
![](https://shibajuku.net/wp/wp-content/uploads/2020/11/dfb2d8a90830997b0d3c609ecbf78ea9-954x1024.png)
全ての花火が打ち終わったら、コロナが吹き飛べばいいな。
2020発の花火が全て打ち上がったら、コロナも終わればいいな・・・そんな思いを込めて作りました。
ぜひ、最後までお楽頂ければ嬉しいです。
![](https://shibajuku.net/wp/wp-content/uploads/2020/11/8582b7974507b94e3631866b4222c767-1024x696.png)