Download - Qpic2017年度 第4回グラフィック講座
![Page 1: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/1.jpg)
![Page 2: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/2.jpg)
今日の予定•自己紹介•一枚絵の特徴•イラストソフトを用いたイラスト制作過程(メイン)•ちょっと実際に描いてみる•イラスト制作小技•絵の描くうえで役立つあれこれ
![Page 3: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/3.jpg)
自己紹介モノ(2回生)
•ハンネの由来:某消しゴム•趣味:ゲーム、イラストレーション•好きなゲーム:ポケットモンスター、モンスターハンター
ドラゴンクエスト、ファイナルファンタジー、電車でGO!、遊戯王 ETC…
~イカれたマイ・プロフ絵達~
![Page 4: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/4.jpg)
一枚絵について
![Page 5: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/5.jpg)
一枚絵
•ドット絵以上に作風色々
![Page 6: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/6.jpg)
一枚絵
•手段もいろいろ
![Page 7: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/7.jpg)
ゲームのグラフィックは…
ペンタブとイラストソフト中心
![Page 8: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/8.jpg)
制作の流れの一例紹介
このイラストの制作過程
を紹介します
使用ソフトは
<FireAlpaca>です。
![Page 9: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/9.jpg)
新しいキャンバスを作成
縦横比を設定する
![Page 10: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/10.jpg)
あらかじめ「レイヤ―」を複数作成
イラストソフトの強みの一つ
透明なフィルムを何枚も重ねるようなもの。正確な線画を描くときや、パーツ毎の描き分け・塗り分けにおいて便利!
![Page 11: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/11.jpg)
透明部分との境界作成
![Page 12: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/12.jpg)
塗り残し防止用土台
背景の透明色やよく使う色
以外の色の土台に塗ってお
くことで、塗り残しを発見しや
すくなります
![Page 13: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/13.jpg)
アタリ・ラフ(下書きの下書き)の作画
多少雑でもOK 。
あとで清書するうえでの手掛かりにさえなればよい。
![Page 14: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/14.jpg)
下書き① 「不透明度」を下げたラフレイ
ヤーの上に描く。
![Page 15: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/15.jpg)
下書き完成&キャラ絵フォルダ作成フォルダを設定することで、線画関係のレイヤーをラフ・下書きごと移動することが可能に
![Page 16: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/16.jpg)
線画作成① 画面を拡大、適切な「手ぶれ補正」をかけて清書
![Page 17: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/17.jpg)
線画作成②
![Page 18: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/18.jpg)
線画作成③
![Page 19: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/19.jpg)
線画作成(後からカバンを思いついた…)
![Page 20: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/20.jpg)
線画完成
![Page 21: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/21.jpg)
下書きレイヤーを透明化しました
![Page 22: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/22.jpg)
パーツ毎にフォルダ分けパーツ毎に「フォルダ」を作成することで、・塗り分け・パーツ移動&回転・不透明度変更が簡単になる。
![Page 23: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/23.jpg)
着色①・領域選択・キャンパス全体を基準にするなどして「塗りつぶし」をすると簡単。(塗り残しはペンで修正)
![Page 24: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/24.jpg)
着色②
![Page 25: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/25.jpg)
着色③
![Page 26: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/26.jpg)
着色完了&背景変更塗り残しのチェックがほぼ必要なくなったので、完成品に近づけてみる。
ソフトによっては「グラデーション」ツールがあるので活用
![Page 27: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/27.jpg)
陰・ハイライト塗り①
「領域選択ツール」を使って、塗るべき場所だけ選択。
「陰・ハイライト用レイヤー」をベースカラーの上に用意して、塗り分けの工夫をして塗る。
「クリッピング」をすると、下のレイヤーに描かれているものの不透明度に左右されるようになる。
塗りたい対象以外は線画もろとも半透明に
![Page 28: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/28.jpg)
陰・ハイライト塗り② 光源の位置を意識
![Page 29: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/29.jpg)
陰・ハイライト塗り③赤いチークは可愛さの象徴
(*´ω`*)
![Page 30: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/30.jpg)
陰・ハイライト塗り④
![Page 31: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/31.jpg)
陰・ハイライト塗り⑤ 大体描き終えました(と、思ってる)
![Page 32: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/32.jpg)
白枠付け
ここから先は飾りつけ… キャラクターが描かれている部分をすべて
選択し、「選択範囲の拡張」を行って、それ
をすべて白で塗りつぶしたのをキャラクター
レイヤーの下に持ってくることで、簡易版白
枠が完成。
![Page 33: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/33.jpg)
後方影同様に「影」(≠陰)を作成
レイヤーの重ね方を「乗算」にすることで、下のレイヤーに合わせた暗い明度に自動で計算される。
![Page 34: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/34.jpg)
細部調整して完成
個人的に星が好き☆
![Page 35: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/35.jpg)
制作の流れ まとめ
1.キャンパス、レイヤーを用意
2.ラフ、下書きを経て線画を描く
3.着色
4.陰・ハイライト ☆光源の意識
5.調整タイム ☆レイヤーの重ね方も工夫しよう
最終的に線画がいらなくなる描き方の場合は、下書きまでで良いかも
![Page 36: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/36.jpg)
☆大事な事
•求められていること・ものを描く•プログラマーと相談する•透過処理をする(PNG)
![Page 37: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/37.jpg)
実際に描いてみる
ちょっと
![Page 38: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/38.jpg)
小技紹介
![Page 39: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/39.jpg)
小技①
•パーツを分離する(胴体と腕など)→アニメーション作成で利用可能!
![Page 40: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/40.jpg)
応用例
![Page 41: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/41.jpg)
小技②
•色調補正
連続で表示することで七色のオーラに
![Page 42: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/42.jpg)
線画の色も変更線画を黒以外で描くことで、色調補正で色変更が可能になり、簡単に雰囲気が変更できる。
![Page 43: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/43.jpg)
絵の描く上で役立つあれこれ紹介
![Page 44: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/44.jpg)
デザインドール
• 3D人型モデルをポーズ、形を自由に変えてお手本にできるソフト。
• 有料ですが、無料版でも変形したモデルデータの保存ができないくらいで十分利用できます。
![Page 45: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/45.jpg)
使用例
![Page 46: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/46.jpg)
「絵の描き方について教えてくれる動画」
•某HIPHOPの大御所が自分の曲に合わせて(何故か)絵の描き方のいろはを教えてくれる(ネタ)動画。
著作権的にはちょっと危ない。
•ニコニコ動画の動画なので、会員登録が必要。動画IDは“SM20939758”
![Page 47: Qpic2017年度 第4回グラフィック講座](https://reader031.vdocuments.mx/reader031/viewer/2022021507/5a6770a17f8b9a8a378b4939/html5/thumbnails/47.jpg)
最後に
次回は「 」!
ドット絵・一枚絵ともにこれまでの内容を生かして
頑張ってください!※予定と異なる場合もあります
特定のテーマに合った作品(ドット・一枚絵)を
決められた制限時間内に完成させる会
これは去年の作品(テーマ:魔法)