Getting Started with Fun Coding.
先日、このアドベントカレンダーで9日目にnagayamaさんがYouTube配信をしているのを見て書きたくなり、速攻でよし書こうと思い立ったが吉日w
書いてみたcodingが今年一番Instagramで反応が良かったので、初心者さん向けに書いてみました。
start...
わたしは今、動画編集の傍らMicrosoftのAzureの勉強をしているところです。
p5.jsは、ほぼほぼ趣味で週に2〜3回多い時で毎日codingしていました。
現在は(忙しいと言い訳)、勉強や仕事もお陰さまでさせて頂いているので書く時間が中々ない状況です^^;
なのでリハビリも兼ねて、openProcessingを開いて"create a Sketch"からスタートいつもならキャンバスのサイズとかdraw関数のところは一旦削除して、好きなサイズ好きな形を書こうと思ってから書き始めていました。
今回は、リバビリということでそのまま作成w
ellipse()をいろいろここからforkして行ってもいいなーなんて考えてスタートしました。
わからなくなったりしたら、自分の過去に書いたコードを見返したり、ほかの方が書いているコードを参考にしたり、p5のreferenceをみたりしてどんどん書きたい方向に進んでいきます。
そして、エラーを恐がって思いついたことをやらずにいるよりは試してみて変えていく。想像してることをどうやったら出来るかを探す!
これが良きかなと今のところ思っていますw
今回、久しぶりに書いたコードもいつものopenProcessingにも公開していますが、初心者向けにここにも記述します。
openProcessingを使うといいことあるよ
function setup() {
createCanvas(windowWidth, windowHeight);//画面サイズ
background(100);//背景色
}
function draw() {
ellipse(mouseX, mouseY, 20, 20);//楕円の描画
}
最初は上記のコードが表示されます。
ここからがスタートですね(๑′ᴗ‵๑)
これは今、グレーっぽい色の背景に左上から登場した楕円(ellipse)がマウスの動きに合わせてたくさん描画がされるというイメージのモノになります。
これを…
function setup() {
createCanvas(windowWidth, windowHeight);
colorMode(HSB);
background(184, 100, 82);
}
function draw() {
drawingContext.shadowOffsetX = 15;//x軸
drawingContext.shadowOffsetY = -15;//y軸
drawingContext.shadowBlur = 30;
drawingContext.shadowColor = color(344, 91, 100, 0.08);//シャドーの色
ellipse(mouseX, mouseY, random(50, 50));//楕円
fill(56, 100, 98);//楕円の内部の色
stroke(317, 78, 93);//楕円のフチの色
}
ほとんど変えずに、背景の色や楕円(ellipse)の色を変更したり楕円にシャドーを付けたりして描画させました。
もうこれだけで最初のコードとは違う自分が書いたコードでプログラミングがお絵描きしてくれますw
簡単ですね(°▽°)ワーイ!
他にもdraw関数の中に書くか、setup関数の中に書くかでも描画されるモノが変わってきます。
中に書いてある数字を大きくしたり小さくしたり、−+表記をくわえて書いたりしても変わったりするのでやってみてください。理解するコツは一か所だけ変えてみることです😊
わたしも先輩方からいろいろと教わって書けるようになりました。open processingにはたくさんの先輩方たちのコードが公開されています。参考書を読んでみたり、YouTubeで見たり、自分の合った方法でGenerative artを描いてみる。続けてみる。
続けやすい方法でやってみて毎日じゃなくても、継続出来ることで良いことある気がします(๑′ᴗ‵๑)
寒い日に外に出たく無い人でも、とにかく出不精でもw
パソコンがあればすぐに出来る趣味になります。そこで出会える人たちも沢山います✨
ぜひ!
急遽、書くことを決意してしまったので拙いものとなってしまいました。
10周年を迎えたアドベントカレンダーに参加出来て、書くことが出来、2020年は本当にいろんなことに挑戦と参加が出来た年になれました!(よかった😌これも皆さんのお陰です✨)
最後までお読みいただき、ありがとうございましたꉂ(ˊᗜˋ*)
明日はいよいよクリスマス🎅🎄
次回の記事は「#つぶやきprocessing」でもおなじみ
はぅ君さんにバトンをお渡ししまーす(๑′ᴗ‵๑)✨
現在、福岡でプログラミンなどの勉強したり、フリーランスとして活動中です。温かい目で見守って頂けますと幸いです。 よろしくお願いします⋆。˚ ༘*