こんにちはダダです
Processingで線、図形、配色などの基本的な内容は少しずつ理解できてきたので
線、図形、配色を利用した作品を作っていきましょう
今回は、Processingを使用して国旗を書いて作品を作っていきましょう
注意点
この記事はProcessingのPython設定で作成しております
Java設定だとエラーが出るので注意してください
設定方法がわからない方は、以下の記事を参考にしてみてください
タイトルテキスト
Processingでプログラミング言語をpythonでどんなものが描けるの???
今回は以下のような国旗を書いていきました
![](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2021/05/2021-05-06-2.png?resize=874%2C637&ssl=1)
![](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2021/05/2021-05-06-3.png?resize=868%2C623&ssl=1)
![](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2021/05/2021-05-07-2.png?resize=876%2C629&ssl=1)
![](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2021/05/2021-05-07-3.png?resize=877%2C626&ssl=1)
![](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2021/05/2021-05-07-5.png?resize=890%2C635&ssl=1)
![](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2021/05/2021-05-07-7.png?resize=878%2C602&ssl=1)
各国旗の書き方をサンプルコードと一緒に見ていきましょう
国旗を書いてみよう
ではさっそく書いていきましょう
日本
![](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2021/05/2021-05-06-2.png?resize=874%2C637&ssl=1)
参考コード
1 2 3 4 |
size(900, 600) background(255, 255, 255) fill(255, 0, 0) ellipse(450, 300, 300, 300) |
![ダダ](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2024/03/187-2.jpg?resize=100%2C100&ssl=1)
これは、背景を白くして、真ん中に赤い円の図形を書いて完成です
バングラディッシュ
![](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2021/05/2021-05-06-3.png?resize=868%2C623&ssl=1)
ポイント
- 背景は深い緑
- 中心の赤丸は若干左より
しらなんだー
参考コード
1 2 3 4 |
size(900, 600) background(4, 116, 4) fill(255, 0, 0) ellipse(400, 300, 300, 300) |
![ダダ](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2024/03/187-2.jpg?resize=100%2C100&ssl=1)
日本の国旗と似たいますが、若干異なる部分があるので注意してね
フランス
![](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2021/05/2021-05-07-2.png?resize=876%2C629&ssl=1)
ポイント
- 背景を三分割ができなかったので資格を3つ作る
- 枠をなしにする。
参考コード
1 2 3 4 5 6 7 8 9 10 |
size(900, 600) fill(0, 0, 255) noStroke() rect(0, 0, 300, 600) fill(255, 255, 255) noStroke() rect(300, 0, 300, 600) fill(255, 0, 0) noStroke() rect(600, 0, 300, 600) |
![ダダ](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2024/03/187-2.jpg?resize=100%2C100&ssl=1)
フランス国旗は、四角を3つ色をつけて作りました
四角を2つで作る方法もあるので試してみてね!!
ドイツ
![](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2021/05/2021-05-07-3.png?resize=877%2C626&ssl=1)
ポイント
- フランスのやり方で横にした
- 赤と緑で黄色になった
参考コード
1 2 3 4 5 6 7 8 9 10 |
size(900, 600) fill(0, 0, 0) noStroke() rect(0, 0, 900, 200) fill(255, 0, 0) noStroke() rect(0, 200, 900, 200) fill(255, 255, 0) noStroke() rect(0, 400, 900, 200) |
![ダダ](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2024/03/187-2.jpg?resize=100%2C100&ssl=1)
ドイツ国旗は、フランス国旗の横にしたバージョンです
配色も違うので、違いを楽しんでね!!
スウェーデン
![](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2021/05/2021-05-07-5.png?resize=890%2C635&ssl=1)
ポイント
- 背景を黄色にして四角を4つ作るか
- 背景を青にして黄色い十字架を作るか
- 背景を青にして黄色い十字架を作る方がコードを書く量が少ないので黄色い十字架を作る
参考コード
1 2 3 4 5 6 7 8 |
size(900, 600) background(0, 185, 255) fill(255, 255, 0) noStroke() rect(0, 250, 900, 100) fill(255, 255, 0) noStroke() rect(300, 0, 100, 600) |
ノルウェー
![](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2021/05/2021-05-07-7.png?resize=878%2C602&ssl=1)
ポイント
- スウェーデンの中にさらに十字架を入れた形
- 十字架の真ん中を取るのが若干難しかった
- コードが長くなってきたので少し分割して見やすくした
参考コード
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
size(900, 600) background(255, 0, 0) fill(255, 255, 255) noStroke() rect(0, 250, 900, 100) fill(255, 255, 255) noStroke() rect(250, 0, 100, 600) fill(0, 0, 255) noStroke() rect(275, 0, 50, 600) fill(0, 0, 255) noStroke() rect(0, 275, 900, 50) |
モルディブ
![](https://i0.wp.com/dsdiary.blog/wp-content/uploads/2021/05/2021-05-09-2.png?resize=883%2C627&ssl=1)
ポイント
- 三日月は白い丸に背景の緑色と同じ色の丸を重ねて三日月に見えるようにする
- モルディブ行ってみたい
- コードが長くなってきたので少し分割して見やすくした
参考コード
1 2 3 4 5 6 7 8 9 10 11 12 |
size(900, 600) background(255, 0, 0) noStroke() fill(5, 121, 23) rect(150, 100, 600, 400) fill(255, 255, 255) ellipse(450, 300, 300, 300) fill(5, 121, 23) ellipse(500, 300, 300, 300) |
まとめ
今回は今までの復習も込めて国旗を作って見ました
線、図形、配色がわかると作品ができるので、あなたもなにか作って楽しみながらプログラミングをしていきましょう
次は関数について学んでいきましょう
関連記事
本気でプログラマーを目指している方へは、プログラミングのスクールをオススメしております。
中でも TechAcademy テックアカデミーをオススメしており、 TechAcademy テックアカデミーの実績として、
多くの会員がエンジニアとして巣立ってきました。数年前より、学生エンジニアという存在が物凄く注目されるようになっており、
メガベンチャーもこぞって、サマーインターンを実施、プログラミングを叩ける人材を青田刈りしています。
この職種は、学歴、学部、全く関係なく、プログラミング開発経験やその熱量がモノをいいます。
私より上の世代では、「エンジニアは3K」「ただの職人」「うつ病になりやすい」「35歳限界説」など
良いイメージを持っていないかと思います。
逆に若手のエンジニアは恵まれた環境に安心してキャリアを崩すといったこともあります。
そのあたりについて、いろいろと聞いてきましたので、
近くに若いエンジニアがいらっしゃるのであれば、助言するときに参考になるかと思います。
以下のリンクから【自宅で現役エンジニアから学べる TechAcademy テックアカデミー】に無料相談が出来るので以下のリンクから無料相談をしてみてください