SlideShare a Scribd company logo
1 of 28
ドットえこうざ
ぱわぽ作成:yossy
使用ソフト:EDGE
サイズ:64x64
早速描いていきます。
サイズは64x64で新規作成します。
アクションゲームなどで等倍で動かすならこれくらい
かもう少し小さい48x48が自分の中では普通ですね。
ドットえこ
うざ
・新規作成
初期状態だと背景の色が黒くなっているので、上の
アイコンからカラーパレットを開き、パレットの一番
左上の透過色を適当な色にします。
これから描くのに使わない色が好ましいです。
ドットえこ
うざ
・準備
パレットの一番左上は「透過色」とよばれる透明部分
にあたる色です。
それに対してパレットの右下に表示されている色は
「背景色」といいます
ドットえこ
うざ
・注意!
背景色はパレット上で右クリックすることで指定する
ことができますが、ほぼ透過色と一緒にして変えるこ
とはありません!
ドットえこ
うざ
・注意!
パレット上を間違って右クリックしてしまうと絵を
移動させたときにこのように背景色が残ってしまい
ます。
よくあるミスなので気を付けましょう。
ドットえこ
うざ
・注意!
またちょっと寄り道。
キャンバスをドット単位で区切ってるこれは「グリッ
ド」とよばれるものです。
図のアイコンでつけたり消したりできます。
邪魔だと思ったら消しちゃってもよいです。
ドットえこ
うざ
・準備
さてさてようやく線画にとりかかります。
この辺は実際の画力も関わってきますので日々練習
あるのみ、ですね…
イラストをスキャンしたりアタリをとったりする人も
いますがドット絵のときは自分はあまりやりません。
ドットえこ
うざ
・線画
ドット絵はその性質上斜線や曲線が苦手です。
しかし描くときにこれらの線を使わない絵はほぼない
のです。
主にドットを階段みたいに置いていくことでそれっぽ
く描くことができます。
ドットえこ
うざ
・線画コツ
階段に置くドットの数を規則的にすると図の右のよう
に直線っぽくなります。
階段のドット数をだんだん減らし、その後垂直方向に
ドット数を増やしていくと、左の図のように曲線っぽ
くなります。
ドットえこ
うざ
・線画コツ
直線を組み合わせると図の一番左みたいなカクカクし
た曲線になります。
なめらかな曲線やまっすぐな線が描きたいと思ったら
こうやってみるとよいでしょう。
なおEDGEには直線・曲線ツールも一応あります。
ドットえこ
うざ
・線画コツ
とりあえずぱぱっと線画を仕上げます。
今回は魔女っ娘ちゃんです。
カラーパレットの隣の隣のアイコンを押すとポジショ
ンウインドウが出てきて等倍の様子を見ながら作業
できます。
ドットえこ
うざ
・線画
ファミコンサイズとは違いこのサイズになってくると
画力不足をごまかしきれなくなってくるので、
練習するなりして手書きでもある程度描けるようにな
っておいたほうがよいです。
ドットえこ
うざ
・線画
線画ができたら細かいところを修正していきます。
線が1ドットより太くなってたら削っていきます。
左が修正前で右が修正後です。
赤丸の部分が削れてるのがわかりますかね…?
ドットえこ
うざ
・線画修正
突然ですがここでクイズです!
横をむいたネズミっぽいのがおりますが、耳がちょっ
と不自然です。
どこをどうしたら自然な丸い耳になるでしょう
ドットえこ
うざ
・線画修正
正解は右上をちょっと削ってあげればよいのです。
図の真ん中のように赤い部分を削って青い部分にド
ットをおくだけでなめらかになります。
ドットえこ
うざ
・線画修正
ではではカラーパレットに色を作って塗っていきま
しょう。
ドットならよほどのことがない限り塗りつぶしツール
できれいに塗れると思います。
なんか一気にファンタジー感減ったような…
ドットえこ
うざ
・着色
さらにすべての色に一段階影をつけてみました。
それっぽくなってきましたね。
それでは影のつけ方を簡単に。
ドットえこ
うざ
・影付け
影はもちろん光源があるほうと反対側にできます。
図のように丸い面のときは、光が当たっている部分が
丸くなるようにするとそれっぽくなります。
ドットえこ
うざ
・影付け
角ばった物体の時は面ごとに色を塗っていくとよい
です。
光源に面が近いほど色は明るくなります。
ドットえこ
うざ
・影付け
へこんでる面の影をつけるときは逆に、光源に近い
部分ほど色は暗くなります。
メカのような無機物のドット絵を描くときに特に
よく使います。
ドットえこ
うざ
・影付け
アンチエイリアス、というテクニックがあります。
色と色の境目にその中間色を置くことでなめらかに
見せる手法です。
図の竜の目あたりにけっこう使われてますね。
ドットえこ
うざ
・影付け
アンチエイリアスは効率よく使うと美しいドット絵が
描けますが使いすぎは禁物です。
図の右の丸のようにすべての色の境目を中間色でうめ
ると逆に汚くなります。
真ん中のようにほどほどにするのがよいでしょう。
ドットえこ
うざ
・影付け
また、タイリングと呼ばれる影付け手法もあります。
ある色のドットをまばらに置いて密度を変えることで
グラデーションするというものです。
色数節約のほか、布や毛皮みたいな質感を出すことも
できます。ただとてもめんどいです。
ドットえこ
うざ
・影付け
続きです。
若干影を追加してアウトラインを塗りました。
個人的にはけっこう重視してるところです。
この工程で印象がだいぶ変わります。
ドットえこ
うざ
・アウトライン
着色
基本的には内側の色よりちょっと暗い色で塗ります。
形がはっきりしながらも真っ黒の時より柔らかな
印象になります。
髪の毛のてっぺんのアウトラインのように一本の線
にも明暗をつけるのが最近のお気に入りです。
ドットえこ
うざ
・アウトライン
着色
残ってた黒のアウトラインもカラーパレットを調整
して赤っぽくしました。
着色前と比べると劇的びふぉーあふたーです。
ドットえこ
うざ
・アウトライン
着色
というわけでこれでひとまず完成です。
ご視聴ありがとうございました。
ドットえこ
うざ
・完成!

More Related Content

What's hot

スマートフォンゲーム企画書制作のポイント
スマートフォンゲーム企画書制作のポイントスマートフォンゲーム企画書制作のポイント
スマートフォンゲーム企画書制作のポイントTetsuya Kimura
 
汎用なNeural Network Potential「Matlantis」を使った新素材探索_2022応用物理学会_2022/3/22
汎用なNeural Network Potential「Matlantis」を使った新素材探索_2022応用物理学会_2022/3/22汎用なNeural Network Potential「Matlantis」を使った新素材探索_2022応用物理学会_2022/3/22
汎用なNeural Network Potential「Matlantis」を使った新素材探索_2022応用物理学会_2022/3/22Matlantis
 
ドコモオープンイノベーションの取り組みと提供APIのIoT展開について
ドコモオープンイノベーションの取り組みと提供APIのIoT展開についてドコモオープンイノベーションの取り組みと提供APIのIoT展開について
ドコモオープンイノベーションの取り組みと提供APIのIoT展開についてAPI Meetup
 
Polar符号および非対称通信路の符号化について
Polar符号および非対称通信路の符号化についてPolar符号および非対称通信路の符号化について
Polar符号および非対称通信路の符号化についてj_honda
 
LPデザインに関して〜作成のセオリーとコツ〜
LPデザインに関して〜作成のセオリーとコツ〜LPデザインに関して〜作成のセオリーとコツ〜
LPデザインに関して〜作成のセオリーとコツ〜典子 松本
 
続・パワポは「最後」に開く-もっとみがく!プレゼン資料作成術「大掃除編」
続・パワポは「最後」に開く-もっとみがく!プレゼン資料作成術「大掃除編」続・パワポは「最後」に開く-もっとみがく!プレゼン資料作成術「大掃除編」
続・パワポは「最後」に開く-もっとみがく!プレゼン資料作成術「大掃除編」Michiyo Fukada
 
ゲームデザイナーのためのキャラクター表現&コンセプトメイキング:抜粋版
ゲームデザイナーのためのキャラクター表現&コンセプトメイキング:抜粋版ゲームデザイナーのためのキャラクター表現&コンセプトメイキング:抜粋版
ゲームデザイナーのためのキャラクター表現&コンセプトメイキング:抜粋版小林 信行
 
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司schoowebcampus
 
サウンド実装の手間を省くための CRI ADX2 UnityAudio完全に理解した
サウンド実装の手間を省くための CRI ADX2 UnityAudio完全に理解したサウンド実装の手間を省くための CRI ADX2 UnityAudio完全に理解した
サウンド実装の手間を省くための CRI ADX2 UnityAudio完全に理解したTakaaki Ichijo
 
Pythonistaで始めるiOSプロトタイプ開発
Pythonistaで始めるiOSプロトタイプ開発Pythonistaで始めるiOSプロトタイプ開発
Pythonistaで始めるiOSプロトタイプ開発Yusuke Muraoka
 
機械学習は化学研究の"経験と勘"を合理化できるか?
機械学習は化学研究の"経験と勘"を合理化できるか?機械学習は化学研究の"経験と勘"を合理化できるか?
機械学習は化学研究の"経験と勘"を合理化できるか?Ichigaku Takigawa
 
深層学習向け計算機クラスター MN-3
深層学習向け計算機クラスター MN-3深層学習向け計算機クラスター MN-3
深層学習向け計算機クラスター MN-3Preferred Networks
 
【GTMF2018TOKYO】ScriptableRenderPipelineでアプリに最適な描画をしよう
【GTMF2018TOKYO】ScriptableRenderPipelineでアプリに最適な描画をしよう【GTMF2018TOKYO】ScriptableRenderPipelineでアプリに最適な描画をしよう
【GTMF2018TOKYO】ScriptableRenderPipelineでアプリに最適な描画をしようUnity Technologies Japan K.K.
 
Unityとアセットツールで学ぶ「絵づくり」の基礎 ライト、シェーダー、イメージエフェクト
Unityとアセットツールで学ぶ「絵づくり」の基礎 ライト、シェーダー、イメージエフェクトUnityとアセットツールで学ぶ「絵づくり」の基礎 ライト、シェーダー、イメージエフェクト
Unityとアセットツールで学ぶ「絵づくり」の基礎 ライト、シェーダー、イメージエフェクト小林 信行
 
【新卒採用】会社紹介資料.pdf
【新卒採用】会社紹介資料.pdf【新卒採用】会社紹介資料.pdf
【新卒採用】会社紹介資料.pdfssuser4916cf1
 
Icml2018読み会_overview&GANs
Icml2018読み会_overview&GANsIcml2018読み会_overview&GANs
Icml2018読み会_overview&GANsKentaro Tachibana
 
事例で学ぶデザインの原則 by Life is Tech !
事例で学ぶデザインの原則 by Life is Tech !事例で学ぶデザインの原則 by Life is Tech !
事例で学ぶデザインの原則 by Life is Tech !Naoki Kanazawa
 

What's hot (20)

スマートフォンゲーム企画書制作のポイント
スマートフォンゲーム企画書制作のポイントスマートフォンゲーム企画書制作のポイント
スマートフォンゲーム企画書制作のポイント
 
汎用なNeural Network Potential「Matlantis」を使った新素材探索_2022応用物理学会_2022/3/22
汎用なNeural Network Potential「Matlantis」を使った新素材探索_2022応用物理学会_2022/3/22汎用なNeural Network Potential「Matlantis」を使った新素材探索_2022応用物理学会_2022/3/22
汎用なNeural Network Potential「Matlantis」を使った新素材探索_2022応用物理学会_2022/3/22
 
ドコモオープンイノベーションの取り組みと提供APIのIoT展開について
ドコモオープンイノベーションの取り組みと提供APIのIoT展開についてドコモオープンイノベーションの取り組みと提供APIのIoT展開について
ドコモオープンイノベーションの取り組みと提供APIのIoT展開について
 
厚生労働分野におけるAI技術の利活用について
厚生労働分野におけるAI技術の利活用について厚生労働分野におけるAI技術の利活用について
厚生労働分野におけるAI技術の利活用について
 
Polar符号および非対称通信路の符号化について
Polar符号および非対称通信路の符号化についてPolar符号および非対称通信路の符号化について
Polar符号および非対称通信路の符号化について
 
LPデザインに関して〜作成のセオリーとコツ〜
LPデザインに関して〜作成のセオリーとコツ〜LPデザインに関して〜作成のセオリーとコツ〜
LPデザインに関して〜作成のセオリーとコツ〜
 
続・パワポは「最後」に開く-もっとみがく!プレゼン資料作成術「大掃除編」
続・パワポは「最後」に開く-もっとみがく!プレゼン資料作成術「大掃除編」続・パワポは「最後」に開く-もっとみがく!プレゼン資料作成術「大掃除編」
続・パワポは「最後」に開く-もっとみがく!プレゼン資料作成術「大掃除編」
 
032815 DBM Schedule Development Workshop
032815 DBM Schedule Development Workshop032815 DBM Schedule Development Workshop
032815 DBM Schedule Development Workshop
 
ゲームデザイナーのためのキャラクター表現&コンセプトメイキング:抜粋版
ゲームデザイナーのためのキャラクター表現&コンセプトメイキング:抜粋版ゲームデザイナーのためのキャラクター表現&コンセプトメイキング:抜粋版
ゲームデザイナーのためのキャラクター表現&コンセプトメイキング:抜粋版
 
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司
 
サウンド実装の手間を省くための CRI ADX2 UnityAudio完全に理解した
サウンド実装の手間を省くための CRI ADX2 UnityAudio完全に理解したサウンド実装の手間を省くための CRI ADX2 UnityAudio完全に理解した
サウンド実装の手間を省くための CRI ADX2 UnityAudio完全に理解した
 
Pythonistaで始めるiOSプロトタイプ開発
Pythonistaで始めるiOSプロトタイプ開発Pythonistaで始めるiOSプロトタイプ開発
Pythonistaで始めるiOSプロトタイプ開発
 
機械学習は化学研究の"経験と勘"を合理化できるか?
機械学習は化学研究の"経験と勘"を合理化できるか?機械学習は化学研究の"経験と勘"を合理化できるか?
機械学習は化学研究の"経験と勘"を合理化できるか?
 
深層学習向け計算機クラスター MN-3
深層学習向け計算機クラスター MN-3深層学習向け計算機クラスター MN-3
深層学習向け計算機クラスター MN-3
 
【GTMF2018TOKYO】ScriptableRenderPipelineでアプリに最適な描画をしよう
【GTMF2018TOKYO】ScriptableRenderPipelineでアプリに最適な描画をしよう【GTMF2018TOKYO】ScriptableRenderPipelineでアプリに最適な描画をしよう
【GTMF2018TOKYO】ScriptableRenderPipelineでアプリに最適な描画をしよう
 
Unityとアセットツールで学ぶ「絵づくり」の基礎 ライト、シェーダー、イメージエフェクト
Unityとアセットツールで学ぶ「絵づくり」の基礎 ライト、シェーダー、イメージエフェクトUnityとアセットツールで学ぶ「絵づくり」の基礎 ライト、シェーダー、イメージエフェクト
Unityとアセットツールで学ぶ「絵づくり」の基礎 ライト、シェーダー、イメージエフェクト
 
【新卒採用】会社紹介資料.pdf
【新卒採用】会社紹介資料.pdf【新卒採用】会社紹介資料.pdf
【新卒採用】会社紹介資料.pdf
 
Blenderとコード
BlenderとコードBlenderとコード
Blenderとコード
 
Icml2018読み会_overview&GANs
Icml2018読み会_overview&GANsIcml2018読み会_overview&GANs
Icml2018読み会_overview&GANs
 
事例で学ぶデザインの原則 by Life is Tech !
事例で学ぶデザインの原則 by Life is Tech !事例で学ぶデザインの原則 by Life is Tech !
事例で学ぶデザインの原則 by Life is Tech !
 

More from 九州大学物理研究部2015

ドット絵講座メイキング(わたがし)
ドット絵講座メイキング(わたがし)ドット絵講座メイキング(わたがし)
ドット絵講座メイキング(わたがし)九州大学物理研究部2015
 
Qpic第四回グラフィック講座 デザインとゲームのUIについて考えてみよう。
Qpic第四回グラフィック講座 デザインとゲームのUIについて考えてみよう。Qpic第四回グラフィック講座 デザインとゲームのUIについて考えてみよう。
Qpic第四回グラフィック講座 デザインとゲームのUIについて考えてみよう。九州大学物理研究部2015
 

More from 九州大学物理研究部2015 (13)

Qpic2017年度 第7回グラフィック講座
Qpic2017年度 第7回グラフィック講座Qpic2017年度 第7回グラフィック講座
Qpic2017年度 第7回グラフィック講座
 
Qpic2017年度 第6回グラフィック講座
Qpic2017年度 第6回グラフィック講座Qpic2017年度 第6回グラフィック講座
Qpic2017年度 第6回グラフィック講座
 
Qpic2017年度 第5回グラフィック講座
Qpic2017年度 第5回グラフィック講座Qpic2017年度 第5回グラフィック講座
Qpic2017年度 第5回グラフィック講座
 
Qpic2017年度 第4回グラフィック講座
Qpic2017年度 第4回グラフィック講座Qpic2017年度 第4回グラフィック講座
Qpic2017年度 第4回グラフィック講座
 
Qpic2017年度 第3回グラフィック講座
Qpic2017年度 第3回グラフィック講座Qpic2017年度 第3回グラフィック講座
Qpic2017年度 第3回グラフィック講座
 
Qpic2017年度 第1回グラフィック講座
Qpic2017年度 第1回グラフィック講座Qpic2017年度 第1回グラフィック講座
Qpic2017年度 第1回グラフィック講座
 
Qpic2017年度 第2回グラフィック講座
Qpic2017年度 第2回グラフィック講座Qpic2017年度 第2回グラフィック講座
Qpic2017年度 第2回グラフィック講座
 
ドット絵講座メイキング(わたがし)
ドット絵講座メイキング(わたがし)ドット絵講座メイキング(わたがし)
ドット絵講座メイキング(わたがし)
 
Qpic第四回グラフィック講座 デザインとゲームのUIについて考えてみよう。
Qpic第四回グラフィック講座 デザインとゲームのUIについて考えてみよう。Qpic第四回グラフィック講座 デザインとゲームのUIについて考えてみよう。
Qpic第四回グラフィック講座 デザインとゲームのUIについて考えてみよう。
 
ドット絵講座メイキング(ちくわ)
ドット絵講座メイキング(ちくわ)ドット絵講座メイキング(ちくわ)
ドット絵講座メイキング(ちくわ)
 
第三回グラフィック講座スライド
第三回グラフィック講座スライド第三回グラフィック講座スライド
第三回グラフィック講座スライド
 
第ニ回グラフィック講座スライド
第ニ回グラフィック講座スライド第ニ回グラフィック講座スライド
第ニ回グラフィック講座スライド
 
第一回グラフィック講座スライド
第一回グラフィック講座スライド第一回グラフィック講座スライド
第一回グラフィック講座スライド
 

ドット絵講座メイキング(yossy)