Code CodeしていないCoderDojoのお話

この記事は、CoderDojo Advent Calendar の8日目の記事に……なるはずでした!(ごめんなさい)

えー、初日からひどい記事を投稿しました。まんじゅ(´ん`)です。
しかしあまり反省してない。多分3年後とかに後悔してます。
今度こそ CoderDojo SapporoCoderDojo Sapporo East の様子の写真のストックとともに、
札幌圏のDojoのお話します。

「その前におみゃーさんは誰だ?」

CoderDojo SapporoCoderDojo Sapporo East の、

  • 広角写真担当

  • BGM担当

  • マニアックなお話担当

です。

「Code CodeしていないCoderDojo」とは?

コーディングしてないCoderDojoです。

もしかするともしかしてですが、札幌圏に関して言えば、一番 CoderDojo らしくないかもしれません。
なぜかと言うと、そんなコードをキーボードでゴリゴリ書いてるというNinjaが今の所いないですし、
だからといってキーボードでゴリゴリ書くプログラミングを強要するのも違う気がするので。

(筆者に関してはキーボードでゴリゴリ書くプログラミングの楽しさを伝導しているつもりですが、言語学とかデータ構造の話をついしてしまって、Ninjaにガン無視されるのが札幌圏のDojoのよくある風景です。)

さて、それでも Scratch とかで表現したい(特にイラストで)Ninjaが多いのも、弊Dojoの特徴かもしれません。
(もしかしたらコンピューターでできるオタクな遊びを、我々Mentorが上手く伝えられていないのかもしれませんが……)
ということで最近の筆者は、
「絵心に自信がなくてもイラストがなんとかなる遊び」
をプレゼンしてたりしてます。

絵心に自信がなくてもイラストがなんとかなる遊び

といっても大したことではなく、 Scratch のスプライトのど定番。 Scratch Cat の顔で遊ぶだけです。

Scratch Cat 含めたいくつかのスプライトは、ベクター形式なのですが、
筆者が思ってるより ベクター画像 というのは馴染みにくいらしく、以下の様なことがまま見受けられてました。
  • 一部分だけ色を塗りたいのに、同じ色の部分が全部塗りつぶされる

  • 線の書き方がわからない

  • 消しゴムで消せない

ということで、とりあえず1からベクター画像を描くのは抑えておいて、 Scratch Cat そのもののRemix
からやろうかということで、解説しながら Scratch Cat を(私の中では)かっこよくしたり、服と帽子を着せてみたりとかやってます。

そもそもの話 –みんな輪郭に凝りすぎやろ-

またセクション・タイトルが人をバカにしてるようで恐縮なのですが……そう思ってしまうんですよねえ。

まだ数回しかライブ・ペインティングしてないので、Ninjaに伝わりきってないところはありますので、
この場を借りて、私の画力・指導力共に上手くないイラスト講座を。

1. あたりをちょこちょこ

../../../_images/cap01.png

まず、輪郭を描きます。 と言ってもポイントになる部分だけです。

途中の線は脳内で補完しろ(ぉ

でもまずはそんなものですよ。いきなり
「うっしゃ! とてつもなく文句のつけようのないくらい正確な線を引いて、ビシッとした絵を描く!」
って肩肘張っちゃうから後で、
「えっ……私の絵、下手すぎ……」
ってなって、立体感出す気力がなくなります。

2. 最初の塗りはべっとり

../../../_images/cap02.png
それで、ちゃんとした形を作るのは、塗りの工程でやるんです。
といっても、まだこの工程では奥行き・立体感は出しません。まずベドーって、影絵を作ってしまいます。
「これが本当にうーまーあーじーな絵になるの?」
するんだよ、あとで。
端っから三次元のイメージを二次元で再現しようとするから、心がボキッと行っちゃうんですよ。
物事には一見遠回りでも、手順を踏んだほうがやりやすいことだってあると、おじ……オニイサン、思うよ!

3. 消しゴムで薄く薄く

../../../_images/cap03.png

はい、ここからようやく奥行き・立体感出していきます。

ここでのアイテムは、

  • 消しゴム

  • ティッシュ(擦筆)

  • (欲をいえば)練り消し

そして使用スキルは、

  • なでなで

  • トントン

うーん、ここ、ちょっとハードル高いと思った? まあ、やってみんしゃい。

この辺はその人の好み出ると思うけど、僕個人としては、
「むちゃくちゃ光の当たってるところをまず消して、そこから少しずつ光の当てる箇所を広げてく」
とやるといいと思います。
Tips: なんで鉛筆やペンは一色しか出せないと思ってるんだ?
../../../_images/tips.png

言い忘れてた。

鉛筆やシャープペンシル……ボールペンもかな? これらって白と黒しか表現できないって思ってないっす?

その固定概念におじゃましまーすっ!
上の図、見れるかな? 力の入れ方や、線と線の幅で、白と黒の間の色も表現できないこともないと思わない……? えっ、思わない?! orz

4. コントラスト(陰と光の差)を強くしてく

../../../_images/cap04.png

後は実物見るなり、脳内イメージと比較したりして、濃淡を鉛筆消しゴムをコロコロ持ち替えて調整します。

そうやって調整して調整して、最後に微調整して……。

../../../_images/cap05.png

完成!


まあ、こんな具合で描きます。

最初から、
「むちゃくちゃキレイな線をびしっと引いて、そこから色がはみ出ないように色をしっかり塗って……」
ってやってたら、描く前から神経すり減らしてどーすんの? って気になってしまいます。

てかなんでいきなりお絵描き講座はじめてしまったんだろ……。

とはいえ、ゼロからヒャクまでいきなりやっていくのって辛いよな

とりあえず蛇足の回収をすると、いきなり真っ白な紙なり渡して 1. あたりをちょこちょこ から始めると
「えぇ、あたりっていっても、わかんねえよ……」
と誰もがなるのは容易に想像してしまいます。
最近筆者は電子工作、特に自作キーボードに興味がありますが、いきなり、
「回路設計から初めて、 オリジナルキーボード作ろうね!」
と投げられたら、
「えぇ、何もわからんわぁ……、どんだけの電流流れるのかも、どんなパーツが必要かもわからんわぁ……」
となりますよ、そりゃあ。
しかし世の中素晴らしいことに、オープンソースのキーボードのデータが転がってたりします。
ErgoDox とか Let’s Split とか……ツクリタイナアァ……。
さて、蛇足のイラスト講座に話を戻しますと、場合によっては 2. 最初の塗りはべっとり まで予めやって、
「ふぃ、じゃあお手本通りにやってもやらなくてもいいけど、 3. 消しゴムで薄く薄く やって、それっぽいもの作ってみようか」

って言って、 絵を描くという一連の工程の、一部にフォーカスしてやっていく というのも必要なのかなと思ったりしました。 ちょっと投げっぱメンタリングしすぎてたかなと今更反省しております。

ライブリミックスは需要ある?

ということで、手本も見せずに、
「ほれ、やってみい」
と投げっぱにしてて、多分Ninjaたちとしては、
「えぇ……(困惑)」
ってなってたかもなあと思ったりしたり。
Scratch のコーディングでも、
「いや、そこ、”ブロックを作る”を使ったら、もっと読みやすくなるやん……」
って思ったりすることがままありますが、手本を見せてないから、使い方がわからんよなあ……と反省しつつも、
もしかして: メンターのエゴ?
とか思ったりもして、そこのさじ加減難しいわあ。と思ったりしてます。

蛇足: お手本見せれるDojoネタ

とりあえず筆者は、
「多趣味だが全部アマチュア」
なので、以下のネタがあります。
  • Scratchでのプログラミング

  • お絵かき(ラスター、ベクター)

  • DJ

  • 3Dモデリング(Blender)

  • シェルスクリプト遊び(シェル芸なんて高度なことはできませんが)

なにか見たいものがあれば、 CoderDojo SapporoCoderDojo Sapporo East にお越しください。

もしくは筆者を外タレMentorで呼んでええんですぜ……お給料がお給料日から1週間で蒸発するダメ人間だけど(明後日の方を向きながら)

CoderDojo Sapporo: http://coderdojo-sapporo.jp/ CoderDojo Sapporo East: https://www.facebook.com/coderdojo.sapporo/ CoderDojo: https://coderdojo.jp/ Scratch: https://scratch.mit.edu/ Scratch Cat: https://wiki.scratch.mit.edu/wiki/Scratch_Cat ベクター画像: https://ja.wikipedia.org/wiki/%E3%83%99%E3%82%AF%E3%82%BF%E5%BD%A2%E5%BC%8F