狠狠撸

狠狠撸Share a Scribd company logo
@reona396
? @reona396 ( )
? 10
? web
(VR )
?
?
?
?
p5.js
function setup() {
createCanvas(400, 400);
}
function draw() {
background("#ccc");
circle(200, 200, 300);
}
p5.js
function setup() {
createCanvas(400, 400);
}
function draw() {
background("#ccc");
circle(200, 200, 300);
}
p5.js
// スケッチ全体の設定を書く関数
// 開始時に?度だけ実?される
function setup() {
// 400x400のサイズでキャンバスを作成
createCanvas(400, 400);
}
function draw() {
background("#ccc");
circle(200, 200, 300);
}
p5.js
function setup() {
createCanvas(400, 400);
}
// 描画にまつわる設定を書く関数
// 1秒間に60回実?される
function draw() {
// 背景?を#cccに設定
background("#ccc");
// 円を(200, 200)の位置に直径300pxで描画
circle(200, 200, 300);
}
p5.js
function setup() {
createCanvas(400, 400);
}
function draw() {
background("#ccc");
circle(200, 200, 300);
}
for
function setup() {
createCanvas(400, 400);
}
function draw() {
background("#ccc");
circle(40, 200, 40);
}
for
function setup() {
createCanvas(400, 400);
}
function draw() {
background("#ccc");
// 9個の円を並べる
for (let i = 0; i < 9; i++) {
circle(i * 40 + 40, 200, 40);
}
}
if
function setup() {
createCanvas(400, 400);
}
function draw() {
background("#ccc");
// 9個の円を並べ偶数奇数で?を変える
for (let i = 0; i < 9; i++) {
if(i % 2 == 0) {
fill("#AB39F5");
}
else {
fill("#F1CC4D");
}
circle(i * 40 + 40, 200, 40);
}
}
function setup() {
createCanvas(400, 400);
angleMode(DEGREES);
noStroke();
}
function draw() {
background("#000");
// 360個の?さな円を
// サインとコサインを使って花の形に配置
for (let i = 0; i < 360; i++) {
if (i % 2 == 0) {
fill("#AB39F5");
}
else {
fill("#F1CC4D");
}
let r = 180 * sin(i * 4);
let x = r * cos(i) + 200;
let y = r * sin(i) + 200;
circle(x, y, 10);
}
}
背景?は?。
?さな円を360個描く。
円の?は偶数番の時は紫、
奇数番の時は明るいオレンジ。
円の位置は下記の式にそって設定。
(iは円が何番?かのインデックス)
let r = 180 * sin(i * 4);
let x = r * cos(i) + 200;
let y = r * sin(i) + 200;
?
?
?
?
?
?
笔奥础苍颈驳丑迟冲20221019冲クリエイティブコーディングとは?
笔奥础苍颈驳丑迟冲20221019冲クリエイティブコーディングとは?
?
?
? fork
?
?
?
: SYM (@hyappy717)
: reona396
p5.js + Handsfree.js
https://twitter.com/reona396/status/1433351113978232833
?
?
?
? Web
?
?
?
?
? Web
?
Web +
? web +
?
?
? Kinect LeapMotion
?
? web
?
?
?
? 1
? 2
? 3
? 4
? 5, 6
? 1
? 2
? 3
? 4
? 5, 6
笔奥础苍颈驳丑迟冲20221019冲クリエイティブコーディングとは?
笔奥础苍颈驳丑迟冲20221019冲クリエイティブコーディングとは?
( )
?
? ( )
? /
笔奥础苍颈驳丑迟冲20221019冲クリエイティブコーディングとは?
笔奥础苍颈驳丑迟冲20221019冲クリエイティブコーディングとは?
笔奥础苍颈驳丑迟冲20221019冲クリエイティブコーディングとは?
笔奥础苍颈驳丑迟冲20221019冲クリエイティブコーディングとは?
笔奥础苍颈驳丑迟冲20221019冲クリエイティブコーディングとは?
https://twitter.com/reona396/status/1278317931655380992
/
3 1
/
?
?
?
?
:
: NFT
NFT
NFT
?
( ) NFT
?
NFT
?
T
?
?
?
? Web +
?
? NFT

More Related Content

Similar to 笔奥础苍颈驳丑迟冲20221019冲クリエイティブコーディングとは? (20)

情報編集(Web) HTML5 実践1 Canvas + Javascriptで図形を描く
情報編集(Web) HTML5 実践1 Canvas + Javascriptで図形を描く情報編集(Web) HTML5 実践1 Canvas + Javascriptで図形を描く
情報編集(Web) HTML5 実践1 Canvas + Javascriptで図形を描く
Atsushi Tadokoro
?
これからの闯补惫补厂肠谤颈辫迟の话
これからの闯补惫补厂肠谤颈辫迟の话これからの闯补惫补厂肠谤颈辫迟の话
これからの闯补惫补厂肠谤颈辫迟の话
Shogo Sensui
?
自作苍辞诲别.箩蝉フレームワークと苍驳颈苍虫を使ってラジオサイトを作ってみた
自作苍辞诲别.箩蝉フレームワークと苍驳颈苍虫を使ってラジオサイトを作ってみた自作苍辞诲别.箩蝉フレームワークと苍驳颈苍虫を使ってラジオサイトを作ってみた
自作苍辞诲别.箩蝉フレームワークと苍驳颈苍虫を使ってラジオサイトを作ってみた
Yuki Takei
?
ソーシャルアプリ勉强会(第一回资料)配布用
ソーシャルアプリ勉强会(第一回资料)配布用ソーシャルアプリ勉强会(第一回资料)配布用
ソーシャルアプリ勉强会(第一回资料)配布用
Yatabe Terumasa
?
HTML5 on ASP.NET
HTML5 on ASP.NETHTML5 on ASP.NET
HTML5 on ASP.NET
Fujio Kojima
?
Apache Torqueについて
Apache TorqueについてApache Torqueについて
Apache Torqueについて
tako pons
?
别苍肠丑补苍迟.箩蝉でゲーム制作をはじめてみよう
别苍肠丑补苍迟.箩蝉でゲーム制作をはじめてみよう别苍肠丑补苍迟.箩蝉でゲーム制作をはじめてみよう
别苍肠丑补苍迟.箩蝉でゲーム制作をはじめてみよう
Ryota Shiroguchi
?
厂别补蝉补谤プロジェクト彻底攻略
厂别补蝉补谤プロジェクト彻底攻略厂别补蝉补谤プロジェクト彻底攻略
厂别补蝉补谤プロジェクト彻底攻略
takezoe
?
社内勉強会資料(Varnish Module)
社内勉強会資料(Varnish Module)社内勉強会資料(Varnish Module)
社内勉強会資料(Varnish Module)
Iwana Chan
?
First sass
First sassFirst sass
First sass
Toshiaki Sasaki
?
Introduction new features in Spark 3.0
Introduction new features in Spark 3.0Introduction new features in Spark 3.0
Introduction new features in Spark 3.0
Kazuaki Ishizaki
?
From Swing to JavaFX - SwingからJavaFXへのマイグレーションガイド
From Swing to JavaFX  - SwingからJavaFXへのマイグレーションガイドFrom Swing to JavaFX  - SwingからJavaFXへのマイグレーションガイド
From Swing to JavaFX - SwingからJavaFXへのマイグレーションガイド
Yuichi Sakuraba
?
Jaws?横浜ハンズオンーCloudFormation w/ VPC 3/3
Jaws?横浜ハンズオンーCloudFormation w/ VPC 3/3Jaws?横浜ハンズオンーCloudFormation w/ VPC 3/3
Jaws?横浜ハンズオンーCloudFormation w/ VPC 3/3
Yasuhiro Araki, Ph.D
?
Next2Dで始めるゲーム開発 - Game Development Starting with Next2D
Next2Dで始めるゲーム開発  - Game Development Starting with Next2DNext2Dで始めるゲーム開発  - Game Development Starting with Next2D
Next2Dで始めるゲーム開発 - Game Development Starting with Next2D
Toshiyuki Ienaga
?
覚醒JavaScript -ES6で作るIsomophicアプリケーション-
覚醒JavaScript  -ES6で作るIsomophicアプリケーション-覚醒JavaScript  -ES6で作るIsomophicアプリケーション-
覚醒JavaScript -ES6で作るIsomophicアプリケーション-
Oonishi Keitarou
?
for Developer、 Microsoft Edge とInternet Explorer で 新しくサポートされるAPI
for Developer、Microsoft Edge とInternet Explorer で新しくサポートされるAPI for Developer、Microsoft Edge とInternet Explorer で新しくサポートされるAPI
for Developer、 Microsoft Edge とInternet Explorer で 新しくサポートされるAPI
Osamu Monoe
?
Progressive Framework Vue.js 2.0
Progressive Framework Vue.js 2.0Progressive Framework Vue.js 2.0
Progressive Framework Vue.js 2.0
Toshiro Shimizu
?
情報編集(Web) HTML5 実践1 Canvas + Javascriptで図形を描く
情報編集(Web) HTML5 実践1 Canvas + Javascriptで図形を描く情報編集(Web) HTML5 実践1 Canvas + Javascriptで図形を描く
情報編集(Web) HTML5 実践1 Canvas + Javascriptで図形を描く
Atsushi Tadokoro
?
これからの闯补惫补厂肠谤颈辫迟の话
これからの闯补惫补厂肠谤颈辫迟の话これからの闯补惫补厂肠谤颈辫迟の话
これからの闯补惫补厂肠谤颈辫迟の话
Shogo Sensui
?
自作苍辞诲别.箩蝉フレームワークと苍驳颈苍虫を使ってラジオサイトを作ってみた
自作苍辞诲别.箩蝉フレームワークと苍驳颈苍虫を使ってラジオサイトを作ってみた自作苍辞诲别.箩蝉フレームワークと苍驳颈苍虫を使ってラジオサイトを作ってみた
自作苍辞诲别.箩蝉フレームワークと苍驳颈苍虫を使ってラジオサイトを作ってみた
Yuki Takei
?
ソーシャルアプリ勉强会(第一回资料)配布用
ソーシャルアプリ勉强会(第一回资料)配布用ソーシャルアプリ勉强会(第一回资料)配布用
ソーシャルアプリ勉强会(第一回资料)配布用
Yatabe Terumasa
?
Apache Torqueについて
Apache TorqueについてApache Torqueについて
Apache Torqueについて
tako pons
?
别苍肠丑补苍迟.箩蝉でゲーム制作をはじめてみよう
别苍肠丑补苍迟.箩蝉でゲーム制作をはじめてみよう别苍肠丑补苍迟.箩蝉でゲーム制作をはじめてみよう
别苍肠丑补苍迟.箩蝉でゲーム制作をはじめてみよう
Ryota Shiroguchi
?
厂别补蝉补谤プロジェクト彻底攻略
厂别补蝉补谤プロジェクト彻底攻略厂别补蝉补谤プロジェクト彻底攻略
厂别补蝉补谤プロジェクト彻底攻略
takezoe
?
社内勉強会資料(Varnish Module)
社内勉強会資料(Varnish Module)社内勉強会資料(Varnish Module)
社内勉強会資料(Varnish Module)
Iwana Chan
?
Introduction new features in Spark 3.0
Introduction new features in Spark 3.0Introduction new features in Spark 3.0
Introduction new features in Spark 3.0
Kazuaki Ishizaki
?
From Swing to JavaFX - SwingからJavaFXへのマイグレーションガイド
From Swing to JavaFX  - SwingからJavaFXへのマイグレーションガイドFrom Swing to JavaFX  - SwingからJavaFXへのマイグレーションガイド
From Swing to JavaFX - SwingからJavaFXへのマイグレーションガイド
Yuichi Sakuraba
?
Jaws?横浜ハンズオンーCloudFormation w/ VPC 3/3
Jaws?横浜ハンズオンーCloudFormation w/ VPC 3/3Jaws?横浜ハンズオンーCloudFormation w/ VPC 3/3
Jaws?横浜ハンズオンーCloudFormation w/ VPC 3/3
Yasuhiro Araki, Ph.D
?
Next2Dで始めるゲーム開発 - Game Development Starting with Next2D
Next2Dで始めるゲーム開発  - Game Development Starting with Next2DNext2Dで始めるゲーム開発  - Game Development Starting with Next2D
Next2Dで始めるゲーム開発 - Game Development Starting with Next2D
Toshiyuki Ienaga
?
覚醒JavaScript -ES6で作るIsomophicアプリケーション-
覚醒JavaScript  -ES6で作るIsomophicアプリケーション-覚醒JavaScript  -ES6で作るIsomophicアプリケーション-
覚醒JavaScript -ES6で作るIsomophicアプリケーション-
Oonishi Keitarou
?
for Developer、 Microsoft Edge とInternet Explorer で 新しくサポートされるAPI
for Developer、Microsoft Edge とInternet Explorer で新しくサポートされるAPI for Developer、Microsoft Edge とInternet Explorer で新しくサポートされるAPI
for Developer、 Microsoft Edge とInternet Explorer で 新しくサポートされるAPI
Osamu Monoe
?
Progressive Framework Vue.js 2.0
Progressive Framework Vue.js 2.0Progressive Framework Vue.js 2.0
Progressive Framework Vue.js 2.0
Toshiro Shimizu
?

More from reona396 (18)

PCD Tokyo 2020 ワークショップ「Processingでクリエイティブコーダーデビュー!」資料
PCD Tokyo 2020 ワークショップ「Processingでクリエイティブコーダーデビュー!」資料PCD Tokyo 2020 ワークショップ「Processingでクリエイティブコーダーデビュー!」資料
PCD Tokyo 2020 ワークショップ「Processingでクリエイティブコーダーデビュー!」資料
reona396
?
PCD2019 TOKYO ワークショップ「2時間で!Processingでプログラミング入門」
PCD2019 TOKYO ワークショップ「2時間で!Processingでプログラミング入門」PCD2019 TOKYO ワークショップ「2時間で!Processingでプログラミング入門」
PCD2019 TOKYO ワークショップ「2時間で!Processingでプログラミング入門」
reona396
?
笔谤辞肠别蝉蝉颈苍驳について
笔谤辞肠别蝉蝉颈苍驳について笔谤辞肠别蝉蝉颈苍驳について
笔谤辞肠别蝉蝉颈苍驳について
reona396
?
p5.js について
p5.js についてp5.js について
p5.js について
reona396
?
笔谤辞肠别蝉蝉颈苍驳でジャバジャバ稼ぐ
笔谤辞肠别蝉蝉颈苍驳でジャバジャバ稼ぐ笔谤辞肠别蝉蝉颈苍驳でジャバジャバ稼ぐ
笔谤辞肠别蝉蝉颈苍驳でジャバジャバ稼ぐ
reona396
?
WordPress でプロフィールサイトをつくってみた
WordPress でプロフィールサイトをつくってみたWordPress でプロフィールサイトをつくってみた
WordPress でプロフィールサイトをつくってみた
reona396
?
プログラミング初心者さんにもオススメ!アートなプログラミング言語 笔谤辞肠别蝉蝉颈苍驳について
プログラミング初心者さんにもオススメ!アートなプログラミング言語 笔谤辞肠别蝉蝉颈苍驳についてプログラミング初心者さんにもオススメ!アートなプログラミング言語 笔谤辞肠别蝉蝉颈苍驳について
プログラミング初心者さんにもオススメ!アートなプログラミング言語 笔谤辞肠别蝉蝉颈苍驳について
reona396
?
Processing資料(10) リファレンス
Processing資料(10) リファレンスProcessing資料(10) リファレンス
Processing資料(10) リファレンス
reona396
?
Processing資料(9) モード
Processing資料(9) モードProcessing資料(9) モード
Processing資料(9) モード
reona396
?
Processing資料(8) 文字
Processing資料(8) 文字Processing資料(8) 文字
Processing資料(8) 文字
reona396
?
Processing資料(7) マウスとキーボード
Processing資料(7) マウスとキーボードProcessing資料(7) マウスとキーボード
Processing資料(7) マウスとキーボード
reona396
?
Processing資料(6) 様々な図形
Processing資料(6) 様々な図形Processing資料(6) 様々な図形
Processing資料(6) 様々な図形
reona396
?
Processing資料(5) 正弦波と極座標
Processing資料(5) 正弦波と極座標Processing資料(5) 正弦波と極座標
Processing資料(5) 正弦波と極座標
reona396
?
Processing資料(4) アニメーション
Processing資料(4) アニメーションProcessing資料(4) アニメーション
Processing資料(4) アニメーション
reona396
?
Processing資料(3) 色の指定
Processing資料(3) 色の指定Processing資料(3) 色の指定
Processing資料(3) 色の指定
reona396
?
Processing資料(2) 再帰
Processing資料(2) 再帰Processing資料(2) 再帰
Processing資料(2) 再帰
reona396
?
Processing資料(1) Processingの基本
Processing資料(1) Processingの基本Processing資料(1) Processingの基本
Processing資料(1) Processingの基本
reona396
?
プログラミング初心者さん歓迎! アートでデザインなプログラミング言語 Processing について
プログラミング初心者さん歓迎! アートでデザインなプログラミング言語 Processing についてプログラミング初心者さん歓迎! アートでデザインなプログラミング言語 Processing について
プログラミング初心者さん歓迎! アートでデザインなプログラミング言語 Processing について
reona396
?
PCD Tokyo 2020 ワークショップ「Processingでクリエイティブコーダーデビュー!」資料
PCD Tokyo 2020 ワークショップ「Processingでクリエイティブコーダーデビュー!」資料PCD Tokyo 2020 ワークショップ「Processingでクリエイティブコーダーデビュー!」資料
PCD Tokyo 2020 ワークショップ「Processingでクリエイティブコーダーデビュー!」資料
reona396
?
PCD2019 TOKYO ワークショップ「2時間で!Processingでプログラミング入門」
PCD2019 TOKYO ワークショップ「2時間で!Processingでプログラミング入門」PCD2019 TOKYO ワークショップ「2時間で!Processingでプログラミング入門」
PCD2019 TOKYO ワークショップ「2時間で!Processingでプログラミング入門」
reona396
?
笔谤辞肠别蝉蝉颈苍驳について
笔谤辞肠别蝉蝉颈苍驳について笔谤辞肠别蝉蝉颈苍驳について
笔谤辞肠别蝉蝉颈苍驳について
reona396
?
p5.js について
p5.js についてp5.js について
p5.js について
reona396
?
笔谤辞肠别蝉蝉颈苍驳でジャバジャバ稼ぐ
笔谤辞肠别蝉蝉颈苍驳でジャバジャバ稼ぐ笔谤辞肠别蝉蝉颈苍驳でジャバジャバ稼ぐ
笔谤辞肠别蝉蝉颈苍驳でジャバジャバ稼ぐ
reona396
?
WordPress でプロフィールサイトをつくってみた
WordPress でプロフィールサイトをつくってみたWordPress でプロフィールサイトをつくってみた
WordPress でプロフィールサイトをつくってみた
reona396
?
プログラミング初心者さんにもオススメ!アートなプログラミング言語 笔谤辞肠别蝉蝉颈苍驳について
プログラミング初心者さんにもオススメ!アートなプログラミング言語 笔谤辞肠别蝉蝉颈苍驳についてプログラミング初心者さんにもオススメ!アートなプログラミング言語 笔谤辞肠别蝉蝉颈苍驳について
プログラミング初心者さんにもオススメ!アートなプログラミング言語 笔谤辞肠别蝉蝉颈苍驳について
reona396
?
Processing資料(10) リファレンス
Processing資料(10) リファレンスProcessing資料(10) リファレンス
Processing資料(10) リファレンス
reona396
?
Processing資料(9) モード
Processing資料(9) モードProcessing資料(9) モード
Processing資料(9) モード
reona396
?
Processing資料(8) 文字
Processing資料(8) 文字Processing資料(8) 文字
Processing資料(8) 文字
reona396
?
Processing資料(7) マウスとキーボード
Processing資料(7) マウスとキーボードProcessing資料(7) マウスとキーボード
Processing資料(7) マウスとキーボード
reona396
?
Processing資料(6) 様々な図形
Processing資料(6) 様々な図形Processing資料(6) 様々な図形
Processing資料(6) 様々な図形
reona396
?
Processing資料(5) 正弦波と極座標
Processing資料(5) 正弦波と極座標Processing資料(5) 正弦波と極座標
Processing資料(5) 正弦波と極座標
reona396
?
Processing資料(4) アニメーション
Processing資料(4) アニメーションProcessing資料(4) アニメーション
Processing資料(4) アニメーション
reona396
?
Processing資料(3) 色の指定
Processing資料(3) 色の指定Processing資料(3) 色の指定
Processing資料(3) 色の指定
reona396
?
Processing資料(2) 再帰
Processing資料(2) 再帰Processing資料(2) 再帰
Processing資料(2) 再帰
reona396
?
Processing資料(1) Processingの基本
Processing資料(1) Processingの基本Processing資料(1) Processingの基本
Processing資料(1) Processingの基本
reona396
?
プログラミング初心者さん歓迎! アートでデザインなプログラミング言語 Processing について
プログラミング初心者さん歓迎! アートでデザインなプログラミング言語 Processing についてプログラミング初心者さん歓迎! アートでデザインなプログラミング言語 Processing について
プログラミング初心者さん歓迎! アートでデザインなプログラミング言語 Processing について
reona396
?

笔奥础苍颈驳丑迟冲20221019冲クリエイティブコーディングとは?