レオナ@reona396
デイリーコーディング お題「宇宙」
2021/02/18 18:44:12
ゆめかわいいキラキラ銀河✨🦄💜🌟
#Processing #p5js #プログラミング #dailycoding #generative #creativecoding… https://t.co/xZWyW0EGPK
drawingContext.filter = 'blur(100px)';
— レオナ (@reona396) February 18, 2021
↑
今回驚いたのはコイツの効能。
「見た目をいい感じにしてくれる」度合いが半端ないから頼りきりになっちゃいそう。
劇薬!禁断の果実!
というわけで本記事ではキラキラ✨ゆめかわいい🦄銀河のメイキングを書いていきます!
(なお、デイリーコーディング用のコードから少し手を入れました)
イメージはこんな感じ↓ですね。
ゆめかわいい 銀河 - Google 検索
こちらの描き方を参考にコーディングしました。
Tutorial - How to Draw a Galaxy by Sugary-Stardust on DeviantArt
ステップごとに様子がわかりやすいようにrandomSeed()を入れていますが、実際には入れなくてokです。
まずは適当なにょろにょろ線を描いていきます。
ランダムな太さの線でランダムな頂点位置のcurveVertexを描きます。
See the Pen
galaxy01 by reona396 (@reona396)
on CodePen.
にょろにょろ線を増やします。
See the Pen
galaxy02 by reona396 (@reona396)
on CodePen.
ちょっとおさまりが良すぎるので線がキャンバスからはみ出すように修正します。
See the Pen
galaxy03 by reona396 (@reona396)
on CodePen.
ゆめかわいいカラーセットを用意して背景色と線の色をランダムに設定します。
See the Pen
galaxy04 by reona396 (@reona396)
on CodePen.
ここが最大のポイント!
がっつりぼかします。
コイツが噂の禁断の果実です🍎
See the Pen
galaxy05 by reona396 (@reona396)
on CodePen.
異なるぼかし具合の白い点々を上から重ねます。
ラメとお星さまのイメージです🌟
See the Pen
galaxy06 by reona396 (@reona396)
on CodePen.
できあがりです!!
キャンバスの大きさや星の個数を調整したらこんな感じになります。

ぼかしがこれだけがっつり入れられて、しかも実行速度そんなに遅くないっていうのはホントありがたいですね!
ぜひゆめかわいい銀河描いてみてください〜🌟🦄🎀💜✨