
遊べるドット絵『迷路』その2~自由研究で「遊べるものをつくろう」④
自由研究と称して(?)挑戦している「遊べるドット絵」作りも、もう4回目。今回は、前回挑戦した『迷路』作りを、もう少し発展させてみます。
前回の題材は「練習用」にかけて『若葉マーク』にしましたが、今回はもうちょっと「作りたくなる」ものがいいので『猫』にします。
一応断っておきますが、ぼくはべつに"猫好き"ではないので、個人的な好みで猫を選んだわけではありません。ほんとですよ。ほんとですってば!
迷路化するのに合っている題材として、あまり細長くなくて、同じ色の面積が広いもの、そしてできればたくさんのひとに愛されいて丸い感じのものはないかな……と考えたところ、そこに猫のドット絵があったのです。猫を選んだのではなく、猫に選ばれたのです。幸せになりたくば、壺は捨て、鍋を買わねばなりませぬ(以下略)。
なお今回迷路化する猫のドット絵は、"猫の日"に作成したGIFアニメ『ヒトリニシナイデ』の茶トラくん(野良)です。もともと枠とサイズを決めて描いたものではないのですが、結果的に20x20ドットにおさまるものとなっています。
前回とは違うタイプの迷路設計
「前回は16x16ドットでは小さすぎるから32x32ドットにしたのに、なぜ今回は20x20ドットなんて小さいサイズに?」と気付いた方は賢い!
前回作成した若葉マークは、1マスを道or壁にして迷路を構成しましたが、あの方法では広い迷路を作ろうとするとドット絵全体を大きくしなければなりません。しかし大きくすればするほどドット絵らしさが損なわれていくので、今回はドット絵そのものを大きくしないで済む方法で迷路化しようというわけです。
まずはドット絵を縦横3倍に拡大します。
そして、その中央の1ドットを白点にします(外壁となるフチドリ線は除く)。
うーん。なんだかJPEGさん→(.;゚;:益:;゚;.) みたいになってしまいましたね。許せない……許せない……。
おっと失礼しました、怨念が漏れ出てしまいましたね。
話を戻します。
勘の良い方はもうお気づきだと思いますが、あとは白点同士をつなげていけば道ができ、迷路を作れます。
すべてのマスを道+壁として使えるため、この方法で作れる迷路の広さは、事実上前回の方法(道or壁方式)の約2倍となります。
入口&出口を決める
前回同様、ルートを決めていく前に、入口と出口を決めます。
「口から入って、お尻から出る」にしたらわかりやすかったのですが、お食事中の方に叱られることも考えられます。
そこで、ちょうど良さそうな位置にある「耳から入って、尻尾から出る」ことにしました。きっと缶詰をキコキコする音が聞こえてきて、尻尾をピーンと立てるストーリーなのです。野良猫のくせに! なんて考えながら、耳に入口、尻尾に出口を作って白線を引きます。
直線化すべきポイントを抽出
茶トラのドット絵はフチドリ線を除くと3色でできていますが、縦線・横線になっている部分を断ち切って進むルートにしてしまうと、元のドット絵の構造が活かされず、「らしさ」が薄まってしまいます。そこで、縞模様の部分など、まっすぐ進むべき場所は、直進するように白線でつなげておきます。
なお、耳の先、手足の先等のまっすぐ進むしかない場所も、直進するものとします。
正解ルートを決める
前回の狭い迷路では「正解ルートを先に決めると、間違いルートが短くわかりやすすぎになる」という事情があったので、正解ルートを作る余地は残しつつも間違いルートを先に作っていきました。しかし今回は余裕があるので、先に正解ルートを中心に作っていきます。
なお、ここで「やっぱエプロンは触らないと」と啓示がありましたので、頭をゴシゴシして→エプロン(喉の下の▽部分)にタッチ→鼻先をもぞもぞして→腹部もふもふ→足先つまんで→尻尾を包むように掴む、という"なでなで黄金ルート"にしました。まあ普通ならエプロンと腹部を触るとまず噛みつかれますが、缶詰に期待しているときならきっとセーフです。
猫をなでなでするのは、いつもうまくいくとは限らない高難度ゲームみたいなものですから、これはまさに「猫のゲーム化」と言えますね(?)。
残りを間違いルートで埋める
あとは残った白点をつなげて、間違いルートを決めます。
こうしてみると、直線化の手順が活きているのがわるかと思います。白線部分だけ見ても猫っぽくなっており、マヤ遺跡あたりに祭られていてもおかしくないのではないでしょうか。
配色を調整して完成
作業の都合で道の色を白線にしていましたが、そのままというわけにはいきませんので、元のマスの色に近い色に変えます。
んー。でも元のドット絵が黄色系なので、これでは見やすくありません。全体の色を調整します。
ボディの茶色を少し暗めにし、フチドリ線の色は逆に少し明るくしてコントラストを下げました。遠目に見ればただのドット絵で、よく見れば迷路を進んでいけるとわかる感じにできたのではないかと思います。
これにて完成です。
今回の「3倍迷路化方式」なら、かなり簡単にドット絵を迷路化できます。ぜひ、みなさんもドット絵迷路に挑戦してみてください!
なお、前回・今回と、せっかく作ったサイコロのことを忘れていました。次回は、サイコロを活かした「遊べるドット絵」を作ってみようと思います!