1
00:00:01,257 --> 00:00:03,709
Sprite Editor はアトラスやスプライトシートのように

2
00:00:03,709 --> 00:00:07,689
複数の要素を持つ画像を取得して個別の

3
00:00:07,689 --> 00:00:10,338
スプライトに分割するためのツールです

4
00:00:14,002 --> 00:00:16,277
この時 画像の Sprite Mode は必ず Multiple（複数）に

5
00:00:16,277 --> 00:00:18,277
指定しておきましょう

6
00:00:19,371 --> 00:00:21,371
これを Single に設定してしまうと

7
00:00:21,371 --> 00:00:24,443
Sprite Editor ウィンドウでは扱えなくなってしまいます

8
00:00:24,943 --> 00:00:29,033
スプライト / スプライトモード / スプライトタイプの詳細については

9
00:00:29,033 --> 00:00:31,033
下記リンク先の情報を参照してください

10
00:00:32,306 --> 00:00:34,679
Sprite Mode が Multiple に指定されていると

11
00:00:34,679 --> 00:00:37,000
Sprite Editor というボタンがインスペクターの

12
00:00:37,000 --> 00:00:39,000
テクスチャインポーターに表示されます

13
00:00:40,011 --> 00:00:43,300
このボタンをクリックして Sprite Editor を開きます

14
00:00:45,292 --> 00:00:47,445
なお Sprite Editor はこの他に メニュー操作

15
00:00:47,445 --> 00:00:50,452
Window > Sprite Editor でも開けます

16
00:00:52,665 --> 00:00:55,568
Sprite Editor ウィンドウは標準の Unity ウィンドウなので

17
00:00:55,568 --> 00:00:58,529
他のウィンドウと同様に扱ったりドッキングしたりできます

18
00:01:00,217 --> 00:01:02,536
Sprite Editor では目的の要素を

19
00:01:02,536 --> 00:01:04,673
クリック & ドラッグ操作で選択すると

20
00:01:04,673 --> 00:01:06,423
スプライトを作成できます

21
00:01:06,785 --> 00:01:10,531
ここで選択した矩形選択部分が独立したスプライトとして作成されます

22
00:01:11,445 --> 00:01:13,445
矩形選択の形はその矩形を

23
00:01:13,445 --> 00:01:15,445
クリック & ドラッグして自由に変更できます

24
00:01:16,567 --> 00:01:19,856
句形の内側をドラッグすれば位置の調整が可能で

25
00:01:20,605 --> 00:01:24,286
四隅をや四辺をドラッグすればサイズ変更が可能です

26
00:01:29,095 --> 00:01:31,095
またピボットポイントギズモをドラッグすれば

27
00:01:31,095 --> 00:01:33,318
スプライトのピボットポイントも変更できます

28
00:01:37,062 --> 00:01:39,981
スプライトの選択中には Sprite Editor 右下に

29
00:01:39,981 --> 00:01:41,981
Sprite パネルが表示され

30
00:01:41,981 --> 00:01:44,607
詳細を確認することができます

31
00:01:45,614 --> 00:01:47,614
Name はスプライトの名前

32
00:01:48,542 --> 00:01:51,731
名前は元画像の名前と

33
00:01:51,731 --> 00:01:54,364
スライスされた順番（0 スタート）を

34
00:01:54,364 --> 00:01:55,944
組み合わせて作られます

35
00:01:56,615 --> 00:01:58,203
Position は画像上でのスプライトの

36
00:01:58,203 --> 00:02:00,203
位置をピクセルで表示します

37
00:02:00,924 --> 00:02:04,153
X と Y はスプライトの始点を定義し

38
00:02:04,153 --> 00:02:06,153
画像の左下からスプライトの左下までの

39
00:02:06,153 --> 00:02:08,805
距離で示されます

40
00:02:09,606 --> 00:02:11,955
W と H はスプライトの

41
00:02:11,955 --> 00:02:13,955
始点からの幅と高さを示します

42
00:02:16,416 --> 00:02:18,416
Trim ボタンは要素周辺の

43
00:02:18,416 --> 00:02:20,306
余分なスペースを切り落とし

44
00:02:20,306 --> 00:02:22,978
無駄のないきっちりとした矩形を作ります

45
00:02:25,334 --> 00:02:27,334
Pivot はスプライトのピボットポイントを定義します

46
00:02:27,986 --> 00:02:30,291
ドロップダウンには四隅や各四辺の中央が

47
00:02:30,291 --> 00:02:32,995
既定の設定として用意されています

48
00:02:34,269 --> 00:02:36,269
Custom はカスタムピボットポイントを

49
00:02:36,269 --> 00:02:38,890
Custom Pivot で数値指定する時に使用します

50
00:02:40,496 --> 00:02:42,300
Sprite Editor の上部にはこの他にも

51
00:02:42,300 --> 00:02:43,859
次のようなツールが揃っています

52
00:02:44,552 --> 00:02:46,203
Slice メニュー

53
00:02:46,896 --> 00:02:48,896
Revert および Apply ボタン

54
00:02:49,672 --> 00:02:51,672
RGB アルファトグルボタン

55
00:02:52,683 --> 00:02:54,683
ズームスライダー

56
00:02:56,550 --> 00:03:00,140
Slice メニューは画像から自動的にスプライトを

57
00:03:00,140 --> 00:03:02,785
切り出して作成する時に使用します

58
00:03:03,731 --> 00:03:07,018
種類は Automatic と Grid の 2 種類です

59
00:03:07,960 --> 00:03:10,499
Automatic はアトラスのように 大きさの

60
00:03:10,499 --> 00:03:12,499
異なる要素を切り出す時に最も有効です

61
00:03:13,648 --> 00:03:15,648
画像中の要素検出は周囲の

62
00:03:15,648 --> 00:03:17,939
空白スペースに基いて自動的に行われます

63
00:03:18,659 --> 00:03:20,896
このため 各スプライトはトリムされた

64
00:03:20,896 --> 00:03:22,146
状態となります

65
00:03:23,065 --> 00:03:26,301
Automatic を選択した場合 Minimum Size は

66
00:03:26,301 --> 00:03:29,123
各スプライトの最小サイズを定義します

67
00:03:30,051 --> 00:03:32,697
この値を大きくしすぎると 最小サイズを満たさない

68
00:03:32,697 --> 00:03:34,697
小さな要素が並んでいるような場合に

69
00:03:34,697 --> 00:03:36,780
ひとつの大きなスプライトとして

70
00:03:36,780 --> 00:03:38,780
検出されてしまう可能性があります

71
00:03:39,667 --> 00:03:41,667
Pivot は画像からスライスされる

72
00:03:41,667 --> 00:03:43,585
全スプライトのデフォルトピボットポイントを

73
00:03:43,585 --> 00:03:45,115
設定します

74
00:03:46,085 --> 00:03:49,644
Sprite パネルと同じくここでもドロップダウンから

75
00:03:49,644 --> 00:03:52,683
四隅や各四辺の中央が既定値として用意されています

76
00:03:54,689 --> 00:03:57,750
カスタムピボットポイントを設定する場合はスプライトのスライスが終わってから

77
00:03:57,750 --> 00:03:59,750
スプライトを選択して Sprite パネルから

78
00:03:59,750 --> 00:04:01,750
ピボットポイントを変更するか

79
00:04:01,750 --> 00:04:04,054
エディター上で直接調節します

80
00:04:05,645 --> 00:04:07,825
Method は既存のスプライトを Sprite Editor ウィンドウで

81
00:04:07,825 --> 00:04:10,060
どう扱うかを指定するオプションです

82
00:04:10,988 --> 00:04:13,334
Delete Existing は既存のスプライトをすべて

83
00:04:13,334 --> 00:04:15,705
新規スプライトで置き換えます

84
00:04:16,649 --> 00:04:18,842
Smart は既存のスプライトを保持・調整しながら

85
00:04:18,842 --> 00:04:21,329
スプライトの新規作成を試行します

86
00:04:22,240 --> 00:04:24,240
Safe は既存のスプライトに一切

87
00:04:24,240 --> 00:04:26,685
変更を加えず 新規スプライトを作成します

88
00:04:28,909 --> 00:04:31,944
各オプションを正しく設定したら Slice ボタンをクリックすると

89
00:04:31,944 --> 00:04:34,695
画像が個別スプライトにスライスされます

90
00:04:35,963 --> 00:04:39,232
スライスした後は各スプライトが個別に編集可能になります

91
00:04:41,486 --> 00:04:44,094
なおスプライトシートは全要素が同一サイズであることを

92
00:04:44,094 --> 00:04:46,784
前提として作成されているものなので

93
00:04:46,784 --> 00:04:49,508
Slice Type を Automatic にしてしまうと

94
00:04:49,508 --> 00:04:52,352
各スプライトの細かな差異と

95
00:04:52,352 --> 00:04:54,352
周辺の空白スペースの変化により

96
00:04:54,352 --> 00:04:57,161
スプライトが均一に切り出されない可能性があります

97
00:04:58,371 --> 00:05:01,777
このため均一要素を含むスプライトシートの場合には

98
00:05:01,777 --> 00:05:03,777
Slice Type を Grid にします

99
00:05:05,948 --> 00:05:09,202
Pixel Size はグリッドの大きさをピクセル単位で指定します

100
00:05:10,489 --> 00:05:13,151
Pivot は画像からスライスされる

101
00:05:13,151 --> 00:05:16,136
全スプライトのデフォルトピボットポイントを指定します

102
00:05:16,136 --> 00:05:19,235
カスタムピボットポイントを設定する場合はスプライトのスライスが終わってから

103
00:05:19,235 --> 00:05:21,595
スプライトを選択して Sprite パネルから

104
00:05:21,595 --> 00:05:24,956
ピボットポイントを変更するか エディター上で直接調節します

105
00:05:25,926 --> 00:05:28,340
各オプションを正しく設定したら Slice ボタンをクリックすると

106
00:05:28,340 --> 00:05:30,895
画像が個別スプライトにスライスされます

107
00:05:32,017 --> 00:05:35,341
スライスした後は各スプライトが個別に編集可能になります

108
00:05:36,199 --> 00:05:38,990
スライスを完了して内容を保存するには

109
00:05:38,990 --> 00:05:40,990
Apply をクリックします

110
00:05:41,421 --> 00:05:44,454
変更内容を破棄する場合には Revert をクリックします

111
00:05:46,487 --> 00:05:48,487
RGB アルファトグルスイッチは Sprite Editor 上での

112
00:05:48,487 --> 00:05:51,587
表示をカラー画像とアルファチャンネル表示で

113
00:05:51,587 --> 00:05:54,146
切り替えることで細部を確認しやすくして

114
00:05:54,146 --> 00:05:56,849
エッジの手動調整を支援します

115
00:05:57,929 --> 00:06:01,418
ズームスライダーは画像のズーム制御に使用します

116
00:06:03,589 --> 00:06:05,589
画像の編集が正常に完了して

117
00:06:05,589 --> 00:06:07,589
変更が適用されると

118
00:06:08,089 --> 00:06:10,494
Project ウィンドウでアセットが更新されます

119
00:06:12,164 --> 00:06:14,566
その後は新しいスプライト / スプライト群は

120
00:06:14,566 --> 00:06:17,082
画像の下に子 / 子のグループとして

121
00:06:17,082 --> 00:06:18,579
表示されます

122
00:06:19,292 --> 00:06:21,833
Project ビューでサムネイルを表示中に子項目を

123
00:06:21,833 --> 00:06:24,676
表示したい時は下向き矢印をクリックしてください

124
00:06:26,639 --> 00:06:30,136
子項目はそれぞれ画像の中の使用可能なスプライトを示します

125
00:06:30,981 --> 00:06:32,662
これらスプライトはプロジェクト内で

126
00:06:32,662 --> 00:06:35,459
個別に使用することも グループ化して

127
00:06:35,459 --> 00:06:37,459
たとえばキャラクターを構成したり あるいは

128
00:06:38,139 --> 00:06:40,776
アニメーションとして使ったりできます