直線 ドラッグで直線を引きます(「描画サイズ」で線の太さを変更することができます)。 四角形 ドラッグで四角形を描きます(選択範囲がある場合はその中だけに描きます)。 塗りつぶし クリックしたドットと隣り合う同じ色のエリアを選択色で塗りつぶします(選択範囲がある場合はその中だけを塗りつぶします)。 色を取得 クリックしたドットの色(パレット)を選択色に設定します。 チェックをいれると、カーソルの近くに現在使用しているツールのアイコンを表示します。 チェックを外すとアイコンは表示されなくなります。 この時、描画エリアをドラッグすると点線の枠が表示され、その中が選択範囲となります。 範囲選択中は枠の中のみ描画・移動・変形が適用されます。 ドットの 移動 クリックしたボタンの方向に選択範囲を1ドットずつ移動します(選択範囲がない場合は全体を移動します)。 上下反転 選択範囲を上下反転します(選択範囲が無い場合は全体を反転します)。 左右反転 選択範囲を左右反転します(選択範囲が無い場合は全体を反転します)。 ・画面いっぱいに合わせたい場合は「縦横比を無視して画面に合わせる」にチェックを入れてください。 ・256色より多い色が使われている画像は256色以下に減色する必要がありますので、色数を設定して「減色」をクリックしてください。 サイズ変更 ・ドット絵全体のサイズを変更します(左上が基準になります)。 ・一部を切り抜く場合は範囲選択を行ってから「サイズ変更」をクリックしてください。 パレット整理 ・パレットをドラッグで入れ替えたり、ドット絵に使用されていないパレットを削除できます。
次の直線 ドラッグで直線を引きます(「描画サイズ」で線の太さを変更することができます)。 四角形 ドラッグで四角形を描きます(選択範囲がある場合はその中だけに描きます)。 塗りつぶし クリックしたドットと隣り合う同じ色のエリアを選択色で塗りつぶします(選択範囲がある場合はその中だけを塗りつぶします)。 色を取得 クリックしたドットの色(パレット)を選択色に設定します。 チェックをいれると、カーソルの近くに現在使用しているツールのアイコンを表示します。 チェックを外すとアイコンは表示されなくなります。 この時、描画エリアをドラッグすると点線の枠が表示され、その中が選択範囲となります。 範囲選択中は枠の中のみ描画・移動・変形が適用されます。 ドットの 移動 クリックしたボタンの方向に選択範囲を1ドットずつ移動します(選択範囲がない場合は全体を移動します)。 上下反転 選択範囲を上下反転します(選択範囲が無い場合は全体を反転します)。 左右反転 選択範囲を左右反転します(選択範囲が無い場合は全体を反転します)。 ・画面いっぱいに合わせたい場合は「縦横比を無視して画面に合わせる」にチェックを入れてください。 ・256色より多い色が使われている画像は256色以下に減色する必要がありますので、色数を設定して「減色」をクリックしてください。 サイズ変更 ・ドット絵全体のサイズを変更します(左上が基準になります)。 ・一部を切り抜く場合は範囲選択を行ってから「サイズ変更」をクリックしてください。 パレット整理 ・パレットをドラッグで入れ替えたり、ドット絵に使用されていないパレットを削除できます。
次の新年明けましておめでとうございます。 メンターの林です。 Scratchで作品を作ると、ぱっと見の作風が似てきます。 多くの場合、スクラッチ内のコスチューム画像加工ツールを使った手書きイラストか、Scratch Cat 例のネコ に代表される標準の画像ライブラリを利用するからです。 Dojoでパソコンで絵を描けるようになりたい、ペンタブレットが欲しいという話もちらほら聞いたり、(女の子が多い印象) 何かいい方法がないかと考えていました。 普段の仕事ベースの知識だと、Photoshopとか、Adobe系のソフトばかりで、小学生には気軽にお勧めできないし、OS標準の画像エディターはイマイチ使いづらい。 そこで、ドット絵作成ソフトを家のパソコンに入れて子供に渡してみたら、かなり好印象。 小学2年生の娘もそれなりに使いこなしてオリジナルキャラを作っています。 マインクラフトとか、レゴとか、アイロンビーズとか、子供はピクセルアートに反応しやすいんですかね?そこはそこでちょっと興味深いですが ということでドット絵作成ソフトと、Scratchへの取り込み方法を紹介したいと思います。 ドット絵作成ソフトを用意する 無料もしくは低価格で、操作が簡単そうなドット絵作成ソフトをいろいろ試してピックアップしてみました。 前提として私自身ドット絵の経験はほとんどありません。 Windowsはドット絵エディタ「EDGE エッジ 」-[無料]• 「EDGE」のダウンロードはこちら• Windows 10 でも動作しています。 Macの人は「Pixen」日本語化版 — [無料]• こちらからダウンロードできます。 PCブラウザ上で動作する「ミニドット絵メーカー2」-[無料]• 「ミニドット絵メーカー2」はインストール不要でブラウザ上で動作するドット絵作成ツール。 FLASHで動作し、右クリックが使えないのが、残念ですがとりあえず試すには良いかもしれません。 作成した画像は、パソコン内に保存します。 Windows用として紹介した「EDGE」の作者がiOS版として有料で公開しています。 Androidもいろいろあるらしい 試していないですが、Androidで利用出来るドット絵ソフトもいろいろあるようです。 ドット絵を書いてみよう ソフトの準備ができたら、ドット絵を書いてみます。 mac用Pixenで猫を書いている図 大枠の流れは、• 虫眼鏡ツールなどでキャンパスを拡大して、画面いっぱいに表示する• パレットから色を選んで、ペンツールで、ポチポチとドットを打ってお絵かきをする• 作成した画像はPNG形式で書き出してパソコンに保存する。 その際、背景色は透過するようにする。 といった流れです。 背景を透過させるのが最初は難しいかもしれません。 ソフトによって• EDGEは透明にしたい色をパレットから指定(背景色を指定)• Pixenは何も塗っていない部分を透明にする など方法が異なる場合があります。 そのような場合は意図的に、• 背景色は使っていない色に塗り替える• 同じ色でも微妙に異なる色に塗りなおす。 など調整が必要になります。 今回は詳細説明は省略しますが、「EDGE」を元に説明したサイトがあったので、見てください。 慣れてきたら• 「レイヤー」機能を使うと、画像を重ねて表示しながら、絵のバリエーションを増やせます。 アニメーション用のコマ絵を増やしたり、キャラの着せ替えをするとき便利です。 「下絵」を取り込むと、参考画像をレイヤーとして表示しながら、上からドット絵が描けます。 左クリックと右クリックを使い分けると効率よく作業できます。 EDGEは左クリックで着色、右クリックで、既存のドットから色を吸い取る機能があります。 キャンパスサイズは途中で変更できます。 という機能も使ってみましょう。 Scratchに取り込んで動かそう。 PNG形式で画像を作成したら、Scratchに画像を取り込んでみます。 以下図の赤丸部分を押して、保存したPNG画像を呼び出してください。 そんな時は、「みため」の命令ブロックで、大きさを変えてください。 大きくなりました。 複数のバリエーションを作って、コスチュームを切り替えれば、アニメーションができます。 実際スクラッチ上で動作している状態はここにアップしました。 ぜひ試してみてください。 作品の幅も広がると思います。 ドット絵をScratchで使う話は以上です。 おまけ 1 前回の記事、でも書きましたが、ドット絵は方眼ノートを使って書くこともできます。 英語ですが、YouTubeの「DrawKidsDraw」という子供向けチャンネルで、手書きでのドット絵の作成の動画が公開されています。 有名キャラクターの作成方法などがあるので、今回のツールを使う場合でも参考になるかもしれません。 おまけ 2 Scratchとは連動しづらいかもしれませんが、今回の記事を書く中で、3Dで高品質なドット絵を作成できるソフトを見つけました。 なんとレンダリング機能もあるみたいです。 今度ちょっと触ってみたいと思います。
次の