こんにちは！momomoです！
皆さんはイラストを描くことができますか？？
もちろん私はできません！！！！
でも「自分でいい味のある絵を作ってみたい」と思ったことはありませんか？
もちろん私は常に思ってます！！！！
私と同じ考えをしているのであれば是非こちらの記事をご覧ください。
ドット絵でイラストが描ける
まずドット絵というのは、一昔前のレトロゲームのような雰囲気のあるイラストのことです。
言い換えれば、「とても解像度が低いテレビ」のような特徴です。
こんな感じの絵柄です！
単調な作りにも関わらず、独特の味が出る作品になりますよね。
私が初めてドット絵を作った時も、簡単に作成することができました。
これなら、気軽に手を出せるし、完成したときの達成感も半端ないです！
極めればとても大きい作品を作っちゃうこともできると思います。
Piskel
ドット絵を作成するためのソフトで『Piskel』というものがあります。
安心の無料のソフトです！
私はこのソフトを使用してドット絵を作りましたが…
とっても使いやすくて助かってます！
今回はこの「Piskel」の基本操作方法を教えていきます！
Piskelのページを開く
Piskelは、Webアプリ版がありますが、なんとブラウザでも作業ができちゃうんです！
ですので、インストールする手間が省けて数秒で作業を開始することができます。
ちなみに私が使ったブラウザは「Google Chrome」です。
このような画面が開いたら、『Create Sprite』をクリックすると始められます。
全て英語で記載されているので自動翻訳の設定をするととても楽になりますよ！
『Sing In』というボタンがありますが、2021/08/01以降は新規アカウントを作成できなくなっているので、ブラウザでの作業をしましょう！
このような画面になっているでしょうか？
大体の操作で使うのは
この二箇所です。
はじめに左側のメニューの説明、次に右側のメニューの説明を下記で紹介していきます。
基本的な機能の説明
Add new frame
作成する画像を追加することができます。
追加することでパラパラ漫画のように動くイラスト（アニメーション）が作れます。
右上の四角い枠に実際にアニメーションの仕上がりが確認できます。
バーを動かすことでイラストの切り替わるスピードが変更します。
玉ねぎのアイコンは前後に描いたイラストが透けて見えるようになります。
Primary,Secondary
クリックするとカラーを選択できます。
最大で2色選択できます。
この後に紹介する『Color Picker』は選択したいカラーが作成している作品にある場合、その箇所をクリックするとカラーをコピーして『Primary』に自動的にそのカラーが選択された状態にしてくれます。
Pen tool
基本的にこれを選択してイラストを描いていきます。
メニューの上にある◾️でペンの太さを変えられます。
Paint bucket tool
囲まれている箇所を一気に塗りつぶしたいときに使用します。
１クリックで全てぬれるので便利です。
Eraser tool
カラーを消すことができます。
『Pen tool』と同様に、◾️で消す範囲の大きさを選べます。
Rectangle tool
ドラッグ&ドロップをすると自動で綺麗な長方形を作成してくれます。
Shiftを押したままドラッグ&ドロップすると正方形をつくってくれます。
Move tool
画面ないをクリックしながら動かすと、イラスト全体が移動します。
『Shift』を長押しで全てのレイヤーが移動します。
Rectangle Selection
ドラッグ&ドロップして選択した箇所をコピーペーストすることができ、また『Shift』を長押しの状態だと移動することができます。
コピーペーストのやり方はいつも一緒です！覚えておきましょう！
command+c →コピー
command+v →ペースト
ちなみに間違えてしまって時は
command+z →１つ前に戻る
Lighten
クリックすると元の色に光沢がつくような表現ができます。
Color picker
選択したカラーを自動的に『Primary』にペーストしてくれます。
Vertical Mirror pen
縦軸を中心として鏡のように描いたイラストを真似てくれます。
『command』を押しながら→横軸を中心としてイラストを真似る
『Shift』を押しながら→縦軸と横軸の両方を中心としてイラストを真似る
Paint all pixels of the same color
『Paint bucket tool』と似ていて、同じカラーの箇所だけ一気に塗りつぶすことができます。
Stroke tool
直線を描く際に使用します。
Cercle tool
ドラッグ&ドロップをすると自動で円を作成してくれます。
Shiftを押したままドラッグ&ドロップすると1:1の円をつくってくれます。
Shape selection
『Move tool』と機能が似ています。
同じ色の範囲の箇所を選択でき、『Shift』を押した状態で選択された箇所を動かすことができます。
また、コピーペーストもできます。
Lasso selection
基本的な機能は『Rectangle Selection』と同じです。
『Rectangle Selection』よりも細かな範囲を選択する際に使用します。
Dithering tool
市松模様のようなカラーリングになります。
設定の説明
設定の箇所は覚えていた方がいいところを抜粋してご紹介します。
PREFERENCES
Misc→Backgroundから背景の模様を選択できます。
イラストが見づらい場合はここで変更しましょう。
RESIZE
キャンバスのサイズの変更ができます。
アンカーを中心にサイズが大きくなったり小さくなったりするので、必要のある場合はアンカーを動かしてください。
SAVE
作成したデータをパソコン内に保存することができます。
『Save as .piskel』で保存するとPiskelのブラウザページで次回作業する時に開けば続きから始められます。
『Title』の所の名前が保存するファイル名となるのでわかりやすい名前にしておきましょう。（初期段階ではNew piskelと記載されています。）
EXPORT
作品が完成したら、基本的に『GIF』か『PNG』で書き出します。
『GIF』というのは簡易的なアニメーションのことです。
大体はループするものが多いですね。
『PNG』は静止画のことと覚えていただければ大丈夫です。
自分の作品に適したもので書き出しましょう。
IMPORT
『Browse .piskel files』からパソコン内に保存してある.piskelファイルを読み込むことができます。
Piskelの特徴のまとめ
- 数秒で始められる
- アプリをインストールせずにブラウザでも作業ができる
- GIFとPNGの両方が作れる
- アニメーションの変化を常に確認することができる
本当に私みたいな初心者でも操作にすぐ慣れましたし、作っていてとても楽しいと感じました。
ドット絵に感動…！
興味が湧いた方は是非トライして見てくださいね♩
