【Processing】noStrokeの使い方【優しい雰囲気の作品がつくれるようになる】

2024年5月5日2024年6月18日

URLをコピーしました！

ワタタク

Processingで図形の輪郭線をなくして、優しい雰囲気の表現ができるようにするにはどうしたらいいんだろう？

調べたところ、noStrokeを使えば、図形の輪郭線をなくして、柔らかい表現ができることが分かりました。

色にもよりますが、見ると心が落ち着く作品をつくることができるようになります。

英語が苦手なProcessing初心者さんのために、英語の読み方や意味からnoStrokeについて解説しています。

ワタタク

noStrokeを使いこなせるようになりますよ～。

この記事を書いた人

ワタタク

プロフィール

クリエイティブコーディング初心者が、アーティストとして活躍するまでの上達の過程を発信
コンセプトは「クリエイティブコーディング1万時間の歩き方」
参考にしてもらえるブログにするため、Processingを独学で勉強して共有中

【Processing】noStrokeの英語の読み方と意味

英語のnoStrokeについて
英語の読み方	ノーストローク
英語の意味	輪郭線なし

英語の「no」は、ないという意味、strokeは「一筆の動き」という意味の2つを合わせると「一筆の動きがない」。

僕は人筆の動きを輪郭線とも言えると思っていまして、「一筆の動きがない」ということを輪郭線がないと訳しています。

ワタタク

英語の語源。

なんのためにProcessingでnoStrokeを使うの？

ProcessingでnoStrokeを使う理由5つ

輪郭線がない作品（非線形表現）をつくるため
優しい表現をするため
現実に近い表現をするため
抽象的な表現をするため
作品から感情を伝えやすくするため

上記の③の現実に近い表現についての解説。

僕たちが実際に見ている物や風景には、マンガのような黒い輪郭線がないです。

輪郭線をなくすことで、より現実に近い表現ができるようになるということ。

ProcessingのnoStrokeは、どのようなアートのジャンルで使うの？

ProcessingのnoStrokeを使用するアートのスタイル3つ

印象派
抽象表現
フォトリアリズム

ワタタク

輪郭線のない表現をするときは、上記の「①②③のどれか　有名作品」と検索すると、つくる作品のアイデアを見つけやすい。

【Processing】noStrokeの使い方

noStrokeの書き方
書き方	noStroke();
効果	図形の輪郭線がなくなる

ワタタク

1行書くだけ。

【Processing】noStrokeを実際に入力したコードと画像

//noStrokeで優しい表現をする

size(1000, 1000);
background(255);

//輪郭線をなくす
noStroke();

//淡いピンク色にする
fill(255, 0, 0, 70);

//左上の楕円
ellipse(300, 300, 500, 500);

//右下の楕円
ellipse(700, 700, 500, 500);

上記コードの画像

【Processing】noStrokeで輪郭線をなくした後に、別の図形には輪郭線をつける方法

noStrokeで輪郭を消した図形のあとのコードに、strokeを書けば、輪郭線のある図形が描かれます。

関連記事：【Processing】strokeで輪郭線の色を変える方法【黒以外の色にしてみたら、新鮮な気持ちになれた】

//noStrokeで輪郭線をなくした後に、別の図形では輪郭線をつける

size(1000, 1000);
background(255);
fill(255, 0, 0, 70);//淡いピンク色にする

//左上の楕円
noStroke();//輪郭線をなくす
ellipse(300, 300, 500, 500);

//右下の楕円
stroke(0);//輪郭をつける
ellipse(700, 700, 500, 500);