LESSON 01
🎮 ピクセルって何？
☆ ☆ ☆ ☆ ☆ ☆ ☆
50:00
PIXEL ART EDITOR
0 / 7 セクション完了かんりょう 0%
このページのもくじ
さいしょに
エディタをひらこう！

ドット絵えは 「エディタ」 という絵えを描かくツールをつかうよ。
まず下したのボタンをクリックして、エディタを開ひらいてみよう！

エディタはいつでもひらいたり・とじたりできるよ！
ページのいちばん上にある 「 エディタをひらく」 ボタンをクリックするだけ。
テキストだけ読よみたいときはとじておこう。
エディタをとじる
← このボタンが上うえにいつでもあるよ。
エディタが開あいているときはこう見みえるよ！
はじめに

ピクセルアート（ドット絵え）ってなに？

ゲームのキャラクターや背景はいけいを
よ〜く見みると…
小さな四角（マス）がたくさん集あつまって作つくられてるよ！
その1マスのことを 「ピクセル」 というんだ。
ピクセルを並ならべてつくる絵えが 「ピクセルアート」。
日本にほんでは 「ドット絵え」 ともよばれているよ！

おとこのこ
おんなのこ
↑ たった 64マスで作つくった顔かお！
この講座こうざで身みにつく「5つの力ちから」

ステップを1つずつクリアするたびに、力ちからがのびていくよ。
ぜんぶの回かいをクリアすると、5つの力ちからが 100% になる！

クイズ！ 8×8のドット絵えは何なんマスある？
SECTION 1
画面がめんの見みかたを知しろう
5分ぷん
観察力

ひだりの画面がめんがドット絵えエディタだよ。3つのエリアに分わかれているよ！

1 どうぐ
2 キャンバス
3 カラー
1
ツールバー（どうぐばこ）
ペン・けしごむ・バケツ・スポイト・選択せんたくのどうぐがあるよ
2
🖼️ キャンバス（絵えを描かくところ）
マスがならんでいるよ。ここにドット絵えを描かいていくよ！
3
カラーパネル（いろえらび）
R・G・Bのスライダーで色いろを作つくれるよ。パレットに保存ほぞんもできるよ
タブがあるよ！
右パネルの「カラー」「レイヤー」「キャンバス」タブを切きり替かえてみよう
SECTION 2
キャンバスを 8×8 にしよう
5分ぷん
空間の感覚

まずは 8×8（64マス） でドット絵えを体験たいけんしよう！
マスが大おおきくなって描かきやすくなるよ。

8 × 8 ＝ たて8マス × よこ8マス ＝ 64マス
1
右パネルの 「キャンバス」 タブをクリック
📸 スクリーンショット：キャンバスタブをクリック

images/s2-step1.png

2
「サイズ」から 「8」 をクリック
📸 スクリーンショット：「8」ボタンをクリック

images/s2-step2.png

3
「OK」を押おそう
「キャンバスをリセットします」と出でたら「OK」をクリックしよう
SECTION 3
ペンで1マスぬってみよう
5分ぷん
集中力

ツールバーの ペンマークを選えらんで、キャンバスのマスをクリックしてみよう！

1
ペンマーク をクリックして選えらぼう
クリックするとペンが青あおくなって選えらばれたサインだよ
📸 スクリーンショット：ペンツール選択状態

images/s3-step1.png

2
キャンバスの好すきなマスをクリックしよう
クリックしたマスに色いろがぬられたかな？
3
5マス以上いじょうぬってみよう！
クリックしたままマウスをうごかすと、スラスラ描かけるよ
まちがえたら？
Ctrl + Z で1つ前まえにもどれるよ！
けしごむ（🧽）を選えらべば消けせるよ
SECTION 4
色いろを変かえてみよう
5分ぷん
色の理解

R（赤あか）・G（緑みどり）・B（青あお）のスライダーをうごかしてみよう！

色のレシピ
赤：R=255, G=0, B=0
緑：R=0, G=187, B=0
青：R=0, G=0, B=255
黄：R=255, G=255, B=0
橙：R=255, G=136, B=0
はだ色：R=255, G=205, B=148
紫：R=204, G=102, B=255
スライダーを全部ぜんぶ右（255）で白しろ、 全部ぜんぶ左（0）で黒くろになるよ
好すきな色いろになったら「+」ボタンでパレットに保存ほぞんできるよ
📖 色いろのひみつ：たった3つの光ひかりでぜんぶの色いろができる！

パソコンの画面がめんは、あかい光ひかり(R)・みどりの光ひかり(G)・あおい光ひかり(B)の たった3つをまぜて、ぜんぶの色いろを作つくっているんだ。これを 「光ひかりの三原色（さんげんしょく）」っていうよ。

↑ 3つの光ひかりがかさなると、まんなかは白になるよ！

R
赤あか ＋ 緑みどり ＝ きいろ になる！
ふしぎだね。絵えのぐとはちがうんだ
G
緑みどり ＋ 青あお ＝ みずいろ になる！
スライダーでためしてみよう
B
赤あか ＋ 青あお ＝ むらさき になる！
3つまぜると白しろ、ぜんぶ0だと黒くろだよ
クイズ1：赤あか(R)と緑みどり(G)の光ひかりをまぜると、何色なにいろになる？
クイズ2：R・G・B ぜんぶを 0 にすると、何色なにいろになる？
SECTION 5
8×8 で顔かおを作つくろう！
15分ぷん
表現力

お手本てほんを見みながら、8×8マスで顔かおを作つくってみよう！

📋 お手本てほんのかお
おとこのこ
おんなのこ
はだ色いろ
こげ茶ちゃ（かみ）
白しろ（め）
黒くろ（ひとみ）
ピンク（ほっぺ）
赤あか（くち）
1
こげ茶ちゃ（R=64, G=37, B=0）で髪かみをぬろう
1・2・3行目ぎょうめは全部ぜんぶこげ茶ちゃ。4〜6行目ぎょうめの両端りょうはし2マスもこげ茶ちゃだよ
2
はだ色いろ（R=254, G=220, B=189）でかおをぬろう
4行目ぎょうめの内側うちがわ2マス・5〜7行目ぎょうめのかおのぶぶん・8行目ぎょうめの内側うちがわ6マス
3
目めを描かこう：白しろ（5行目ぎょうめ）→黒くろ（6行目ぎょうめ）
5行目ぎょうめの左右さゆうから3マス目に白しろ、6行目ぎょうめのおなじ位置いちに黒くろ（ひとみ）
4
ほっぺ（R=255, G=205, B=237）と口くち（R=190, G=17, B=18）を描かこう
7行目ぎょうめの両端りょうはしから2マス目にピンク、8行目ぎょうめのまんなか2マスに赤あか
✓
まゆげ・まつげなど好すきなパーツを足たしてみよう
まちがえたら Ctrl+Z でもどれるよ
バケツがべんり！
バケツ ツールなら、1クリックで広ひろいはんいをぬれるよ！
うまくいかないとき

・マスが細こまかくてぬりにくい → マウスのホイールをまわしてズームアップしよう

・リセットしたい → ツールバーの 🗑️ をクリックして「OK」

SECTION 6
色いろで印象いんしょうが変かわる！
10分ぷん
データの理解

さっきの顔かおと同おなじかたちで、色いろだけ変かえてみよう。
色いろがちがうだけで、全然ぜんぜん別べつのキャラクターみたいになるよ！

明るい色 → 元気・楽しい
つめたい色 → かなしい
ピンク → かわいい
緑 → 自然・落ち着く
1
バケツ ではだ色いろを変かえよう
バケツでクリックすれば、はだ色いろマスが一気いっきに変かわるよ
2
目め・口くちも好すきな色いろに変かえよう
3
PNG で保存ほぞんしよう
ツールバーの 「PNG保存ほぞん」ボタンで作品さくひんを保存ほぞんしよう！
📸 スクリーンショット：PNG保存ボタン

images/s6-save.png

BONUS
チャレンジ！！
ボーナスチャレンジ！

残のこり時間じかんで、8×8マスのオリジナルキャラを作つくってみよう！
下したのお手本てほんを見みながら描かいたり、自分じぶんなりにアレンジしてみよう！

お手本てほんギャラリー（見みながら描かいてね）
ほかにも、こんなのはどう？
動物のかおにしてみよう
ゆうれいやロボットを作ろう
好きな色で個性たっぷりに！
かんさつ力アップ！
第1回 クリア！
★★★★★★★

ドット絵の基本をマスターしたね！
すてきな作品ができたね。

トップにもどると、キャンバスの絵えはけされます。
もし保存ほぞんをわすれていたら、いったんこのウィンドウをとじて 「プロジェクト保存」してから、もう一どこのボタンをおしてね。