こんばんわ。
世の中は聖夜というやつでしょうか。
私は今日も明日も明後日も聖夜もパソコンのモニタがパートナーです。
ということで、聖夜のエントリー行ってみましょう。
今日のエントリーは、
「プロ生ちゃん Advent Calendar 2014(http://qiita.com/advent-calendar/2014/pronama-chan)」
の12月24日分のネタです。
ホントはクリスマスイベントに絡めたプロ生ちゃんとハァハァするアプリ開発やろうと思ったんですけど、間に合わず・・・。
とりあえず、素材だけは準備できたので、素材の準備過程と、素材の制作ツールの紹介をしてみたいと思います。
さて、昨今は3Dでモデリングして開発環境に取り込むなんてことがフツーの行われていて、正直昭和40年代生まれのワタクシとしてはなんとかうまく利用したい(でも時間ない)と、作画の良さもまだまだ・・・と思いたいジレンマで葛藤しつつ、レガシーなドロー系ツールで画像作成にいそしんでおります。
いつかは3Dの画像作成ツールを上手く利用したい・・・と思いつつ。
昨日のMavoroshi_Oniさんによる”プロ生ちゃん Advent Calendar 2014”
「Spineでプロ生ちゃんに動いてもらう(http://qiita.com/Mavoroshi_Oni/items/5317f83b23fd76ef9b6b)」
にて紹介されていたのは、2Dのグラフィックにモーションを付けるツール「Spine」でしたが、タイムリーにもその素材作りとしても、まだまだドロー系ソフトは必要だ!と、このエントリーを綴ることにいたしました。
私は、アプリの画面やアイテムなどの画像に始まってちょっとしたプレゼンテーションからフライヤー制作、ありとあらゆる画像制作を「Inkscape」というドローソフトを使っています。
「Inkscape」の利点としては
1.Illustratorと同様の操作感で基本的な画像制作ができる
2.SVGという汎用フォーマットで利用できる
3.軽い
4.タダである
のあたりがあげられます。
AdobeのIllustratorはドローツールとしては最高峰、至れり尽くせりの高機能さですが、
如何せん高価であることがネックです。
そもそも我々のようなエンジニアにとって「絵を描くこと」は直接売上の上がるものではなく、あくまで成果物の一部であるわけなので、最低限の機能をできる限りコストをかけずに利用できることはとても重要なのです。
さて、今回当初はプロ生ちゃんとクリスマスイブにハァハァするWindosPhoneアプリを作る予定が諸般の事情で一歩間に合わずになりました。
そのアプリ製作の過程で、プロ生ちゃんのイメージが必要になるのですが、以下のような条件があります。
1.最近の高画質なスマホでも絵が乱れないこと。(高解像度)
2.表情を変化させるので、何パターンかの表情を作成できること
3.クリスマスに会ったイメージであること
1.についてはネットで利用可能とされている画像は絵師さんによって提供されておりますが、気に入った絵に対してすべて「2」が提供されているわけでもなく、またそれが「3.」の要件を満たすわけでもないので、「なら描くべか」となるわけです。
元絵から描いてもいいのですが、今回はなるべくイメージを崩さなようにということで
既存のイラスト(Character Design/Illust: Ixy)から、上記の要件を満たす絵を起こすことにします。
ここで登場するのが「Inkscape」なわけです。
元絵を下書きに、「Inkscape」でベジエを使ってトレースし、必要な「2」や「3」を追加しつつ、最終的には画像を出力していくというわけです。
一つ一つ画像で解説すると大変なので、元絵から完成までを録画してみました。
https://www.youtube.com/watch?v=2S7qPxH7LFs
ということで、ドローソフトなので、解像度に依存せず元絵をどんな解像度でも出力できるようになりました。かつ、レイヤーの表示非表示でアイテムを付け加えたり、表情を変更したり、また特定の顔のパーツだけを取り出すことも可能となります。
元絵からクリスマス用に着せ替え
元絵から顔を抜き出して表情変更
そして冒頭の絵は、背景を変更してみたものです。
使い方の詳しい説明などは以下のサイトなどを参考にしていただければよいかと。
(投げやりですみません・・・。)
オフィシャル
Inkscape(日本語に対応しています。)
https://inkscape.org/ja/
わかりやすいチュートリアル
「InkscapeでDesign」
http://inkscapedesign.web.fc2.com/
プロ生ちゃん(Character Design/Illust: Ixy)
プロ生ちゃん(暮井 慧) | プログラミング生放送
壁紙集(元ネタ拝借元)
壁紙 | プログラミング生放送