さぁTilemapを始めよう！

by RyotaMurohoshi

Slide 1

Slide 1 text

̵ͫ͗TilemapΨতΗΞ͜Ѻ by @RyotaMurohoshi 2018/01/31(࿜) Gotanda.unity #4

Slide 2

Slide 2 text

Asset Store΁ͩΩ΀ίψϐϕ͘͢ΠΔͯ

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

όαϸ΄ኮ؟ίψϐϕѺ

Slide 8

Slide 8 text

෯ᇇ΄Asset Store΁΅ ϓμφώϰѿϫϓϷίϸ > 2DόαϸϫϐϤ ͹ͼθϓρϷΘ͘ΠΔͭ͵Ѻ h"ps:/ /www.assetstore.unity3d.com/jp/?stay#!/search/page=1/sortby=popularity/query=category:140

Slide 9

Slide 9 text

Ꭵ୵ኮ؟(όαϸ)Ψ෇ͣ払Η͵ϫϐϤ όαϸϫϐϤ ͚ΣΩ΀οЄϭͽֵΥ΢ͼ͚Δͯ

Slide 10

Slide 10 text

Ϥ϶ϐϕϢζЄϭοЄϭ

Slide 11

Slide 11 text

䜐ኼτϬϲϹЄτϴЀοЄϭ

Slide 12

Slide 12 text

ϺЄν϶αμοЄϭ

Slide 13

Slide 13 text

ͳͭͼ ϺЄϸϤϹαЀνοЄϭ

Slide 14

Slide 14 text

զڹ΄Unityͽ΅ͩ΄Ξ͜΀οЄϭݻͧ΁ όαϸϫϐϤΨ֢Ρ΄΅ಋ樌͢͡͡ΠΔͭ͵

Slide 15

Slide 15 text

• ֜㮆Θ֜㮆ΘSpriteRendererΨᯈᗝͯΡ • όαϸϫϐϤ΄AssetΨAsset Storeͽ揮͹ͼ̵ֵ͚ොΨ憝͞Ρ • όαϸϫϐϤτφϓϭΨᛔ֢ͭͼϮЀϓϗЀφͯΡ

Slide 16

Slide 16 text

Unity 2017.2ͽTilemap͢䌙فͫ΢ όαϸϫϐϤΨֵ͹͵οЄϭ͢ ;ͼΘ֢ΠΚͯͥ΀ΠΔͭ͵

Slide 17

Slide 17 text

Ք෭΅ϔϯΨԻ͞ͺͺ̵ ̵̿ͫ͗TilemapΨতΗΞ͜Ѻ̀;氂ͭͼ Tilemap΄च๜䯤౮ᥝᔰ;ֵ͚ොΨ奧ՕͭΔͯ

Slide 18

Slide 18 text

Ք෭΄ρЄϸ ̿Tilemapֵ͚তΗ΄݇ᘍ΁΀͹͵Ѻ̀ ͹ͼ௏͹ͼΘΟ͜

Slide 19

Slide 19 text

ᛔ૩奧Օ

Slide 20

Slide 20 text

@RyotaMurohoshi

Slide 21

Slide 21 text

㮆Ո᪁ޱ樄咲ᘏͽͯѺ ͩΩ΀οЄϭΨ֢͹ͼ͚ΔͯѺ

Slide 22

Slide 22 text

No content

Slide 23

Slide 23 text

No content

Slide 24

Slide 24 text

No content

Slide 25

Slide 25 text

෭๜Android΄տ Unity᮱ͽͩΩ΀ͩ;Κ͹ͼΔͯ • UniBook6 Hello Programmable Tile! • UniBook8 TilemapConverterͽ਍ΌTilemap΄πЄϖ • ଙ๛LT2016 TileMapEditor΅͚͚ʹѺ Θ͜ݘͥ΀͹͵ΩͽΌ͹ͷΙͧ抎Δ΀ͥͼ͚͚ͽͯѺ

Slide 26

Slide 26 text

Ք෭֢ΡΘ΄Ѻ

Slide 27

Slide 27 text

ϔϯ : 奧Օ

Slide 28

Slide 28 text

๜氂

Slide 29

Slide 29 text

UnityϝЄυϴЀ • Tilemap΅Unity 2017.2ͽ䌙ف • ͵Ͷ奞͚͡ද࠺独ץྋͫ͢΢ͼ͚Ρ΄ͽ̵๋ෛUnityവ䅏

Slide 30

Slide 30 text

Tilemap΅͚ͥͺ͡΄䯤౮ᥝᔰΨ奲ΕݳΥͱͼֵ͜ 1. Sprite(ኮ؟) 2. Tileίψϐϕ 3. Tile Pallete 4. Tile樛昧οЄϭηϣυδμϕ

Slide 31

Slide 31 text

Tilemap΄䯤౮ᥝᔰ΄奧Օ ΅ͮΔΠ

Slide 32

Slide 32 text

ᥝᔰ1 Sprite(ኮ؟) • Tilemap΄1ψϸ(๋ੜ΄Ꭵ୵毎ऒ)΁ᤒᐏͯΡኮ؟ίψϐϕ • ͚ͥͺ͡戔ਧΨͯΡ஠ᥝ͘͢Π • ஠ᥝͶ͹͵Οړۆ • Pixel Per Unit • Collider

Slide 33

Slide 33 text

ᥝᔰ2 Tileίψϐϕ • Tileμ϶φ΄ίψϐϕ(ScriptableObject) • SpriteΨ݇ᆙͭ͵Π̵ᜋ΄ఘ䁭Ψכ೮ͭ͵ΠͯΡ • Tilemapͽ΅ͩ΄TileίψϐϕΨTilemapӾ΄ψϸ΁ᯈᗝ • Tileμ϶φ΄憭μ϶φ΅TileBaseμ϶φ • TileBaseμ϶φΨ姅ಥͭ͵μ϶φΨ֢Π̵͚Σ͚ΣͽͣΡ

Slide 34

Slide 34 text

΀ΩͽTileAsset?ϮϷϐϕ΅Ҙ ψϸ΁΅Spriteͽ΅΀ͥTileΨᗝͥ ͘Ρኮ؟Ψ૧๊ͭ͞͵͚;ͣ΁̵ Tile΄݇ᆙͯΡSpriteΨ૧๊ͭ͞ΡͶͧͽOKѺ

Slide 35

Slide 35 text

ᥝᔰ3 TilePallete • TileίψϐϕΨጭ梍ͯΡϞϹϐϕ • τЄЀӤ΁TilePallete΁ጭ梍ͭ͵TileίψϐϕΨ晝䝑ͭᯈᗝͯΡ • Ꭵ୵ൈኮ̵晝䝑̵ڷᴻ̵䂍ΠͺΌͭ΀Ϳ΄ϯЄϖ晝䝑Θ • ϤϺυδμϕٖ΁΅Tilemap΄ϤϹϢήϣ;ͭͼכਂͫ΢Ρ • Tile Pallete Windowͽ䜷͜

Slide 36

Slide 36 text

ᥝᔰ4 Tile樛昧οЄϭηϣυδμϕ • ͩͩΔͽ奧Օͭ͵Κͺ΅ίψϐϕͽτЄЀӤ΁΅ᗝ͡΀͚ • τЄЀӤ΁΅ེ΄ԫͺΨ֢౮ • GridοЄϭηϣυδμϕ • TilemapοЄϭηϣυδμϕ

Slide 37

Slide 37 text

Tilemap΅͚ͥͺ͡΄䯤౮ᥝᔰΨ奲ΕݳΥͱͼֵ͜ 1. Sprite(ኮ؟) 2. Tileίψϐϕ 3. Tile Pallete 4. Tile樛昧οЄϭηϣυδμϕ

Slide 38

Slide 38 text

Tilemap΄䯤౮ᥝᔰ΄奧Օ ͠ΥΠ

Slide 39

Slide 39 text

ͩͩ͡Ο΅ϔϯΨԻ͞ͺͺ Κ͹ͼ͚ͣΔͯѺ

Slide 40

Slide 40 text

ͩͩ͡Οच๜ጱ΀Tilemap΄ֵ͚ො ΅ͮΔΠ

Slide 41

Slide 41 text

1: Sprite΄ӥ伛㯪

Slide 42

Slide 42 text

1: Sprite΄ӥ伛㯪 (1) ϪαЀϕ΅ • 1䶅΄ኮ؟΁愢හ΄Sprite͘͢΢Άړۆ • Pixels Per UnitΨ晒ڔ΁ • ColliderΨ抠ෆ

Slide 43

Slide 43 text

ϔϯ

Slide 44

Slide 44 text

Pixels Per Unit • Sprite͢τЄЀͽൈኮͫ΢͵檭΄य़ͣͫΨ抠ෆͯΡ • UnityӤͽ΄槱ͫ1΁ፘ୮ͯΡϡμψϸහ • 1旽͢32ϡμψϸ΄ኮ؟͘͢͹͵;ͭͼ̵ • Pixels Per Unit͢32 : य़ͣͫ΅1 • Pixels Per Unit͢16 : य़ͣͫ΅2 • ྋො୵΄ኮ؟΀Ο1旽΄ϡμψϸහΨPixels Per Unit΁

Slide 45

Slide 45 text

Sprite Editor΄Edit Physics Shape Sprite΄Collider΄εϐυΨ抠℄Ѻ Tilemapͽ΄ള᥶ڣਧ͚͚͢ఽͮ΁Ѻ h"ps:/ /qiita.com/RyotaMurohoshi/items/a4944ba2f4fd7c00e8ec

Slide 46

Slide 46 text

No content

Slide 47

Slide 47 text

Step 2

Slide 48

Slide 48 text

2 : TilePallete΄֢౮

Slide 49

Slide 49 text

ϔϯ

Slide 50

Slide 50 text

2 : TilePallete΄֢౮ 1. ϮϘϲЄ΄ Window > Tile PalleteΨ晝䝑 2. Tile Pallete Window΄ૢӤ΄̿Create New Pale5èΨೀӥ 3. Name΁ϞϹϐϕݷΨفێͭCreateϩόЀΨೀͯ

Slide 51

Slide 51 text

Step 3

Slide 52

Slide 52 text

3 : TileAsset΄֢౮

Slide 53

Slide 53 text

3 : TileAsset΄֢౮ Tilepallete΁spriteΨϖ϶ϐν&ϖϺϐϤͽ Tileίψϐϕ֢౮&TileίψϐϕΨPallete΁ጭ梍Ѻ

Slide 54

Slide 54 text

Step 4

Slide 55

Slide 55 text

4 : οЄϭηϣυδμϕ΄֢౮

Slide 56

Slide 56 text

4 : οЄϭηϣυδμϕ΄֢౮ Create > 2D Object > Tilemapͽ GridοЄϭηϣυδμϕ; TilemapοЄϭηϣυδμϕ͢Ѻ

Slide 57

Slide 57 text

ϔϯ

Slide 58

Slide 58 text

ͳ΢ʹ΢΄πЀϪЄϕ΄抍ก

Slide 59

Slide 59 text

GridπЀϪЄϚЀϕ • Cell Size : ψϸ΄य़ͣͫ • Cell Gap : ψϸ;ψϸ΄ᵐ樌΄य़ͣͫ • Cell Swizzle : Tilemap΄ଘᶎҁϔϢζϸϕ΅XYଘᶎ) ͩ΄戔ਧ΅̵ͯΏͼ΄ৼTilemapοЄϭηϣυδμϕ΁䌏ͭͼ晒䖕

Slide 60

Slide 60 text

TilemapRendererπЀϪЄϚЀϕ ൈኮ戔ਧΨݪΠSpriteRenderer;و᭗΄殻ፓΨ೮ͺ • Sor%ng Layer • Order In Layer • Mask Interac%on ᙧวϹαϱЄ独ڹᶎϹαϱЄͳͭͼκϰ϶μόЄҁSpriteRenderer҂Ε͵͚΁ൈኮ殼ଧΨګகͽͣΡ

Slide 61

Slide 61 text

TilemapπЀϪЄϚЀϕ Ϳͩ΁Ϳ΄Tile͘͢Ρ΄͡΄ఘ䁭Ψ೮ͺ ᜋΚίЀθЄ΀Ϳ΄ൈኮ独ᯈᗝ΁樛ͯΡ戔ਧ殻ፓΘ

Slide 62

Slide 62 text

Step 5

Slide 63

Slide 63 text

5 : Tilemap΄ൈኮ

Slide 64

Slide 64 text

ϔϯ

Slide 65

Slide 65 text

5 : Tilemap΄ൈኮ1 • Ac$ve Tilemap͢䌏᨝Tilemap΁΀͹ͼ͚Ρ͡嘦扯 • ϣ϶τίαπЀΨ晝䝑 • ൈኮͭ͵͚όαϸΨ晝䝑

Slide 66

Slide 66 text

5 : Tilemap΄ൈኮ2 Scene Windowͽ ൈኮͭ͵͚䁰ಅ΁θЄϊϸΨ㵕ͭ͡ૢμϷϐμ ׎ڥ΀䱛ᚆΚτϴЄϕθϐϕΨ洑ֵͭͼιЀιЀϫϐϤΨ֢Σ͜Ѻ

Slide 67

Slide 67 text

τϴЄϕθϐϕ1 • s : 塅㾨晝䝑 • m : 塅㾨晝䝑ͭ͵᮱ړΨᑏ㵕 • b : 晝䝑Ӿ΄όαϸͽൈኮ • u : Ꭵ୵䂍ΠͺΌͭ • g : 毎ऒ䂍ΠͺΌͭ • shi+ / d : ڷᴻ

Slide 68

Slide 68 text

τϴЄϕθϐϕ2 • Ctrl(Wim) / Cmd(Mac) Θͭͥ΅ i : φϪαϕ毎ऒ晝䝑 • . (Win) / } (Mac) 䦒懯ࢧΠ90ଶࢧ敢 • , (Win) / { (Mac) ݍ䦒懯ࢧΠ90ଶࢧ敢 • Shi; + . (Win) / Shi; + } (Mac) ࣮ፗොݻݍ敢 • Shi; + , (Win) / Shi; + { (Mac) ࿜ଘොݻݍ敢

Slide 69

Slide 69 text

Step 6

Slide 70

Slide 70 text

Step 6 : Collider΄戔ਧ • TilemapCollider΄՞Ө • CompositeCollider΄՞Ө • TilemapCollider΄Used By CompositeΨON Sprite΄Physics Shape΄戔ਧͩͩ͢ͽኞͣΡѺ

Slide 71

Slide 71 text

ͩͩΔͽͽच๜ጱ΀Tilemap΄ֵ͚ො 奰ΥΠ

Slide 72

Slide 72 text

͚ͥͺ͡愆᪃抍ก

Slide 73

Slide 73 text

戔ਧΨૡॢͯ΢Ά̵Isometric΀TilemapΘ֢΢ΡѺ

Slide 74

Slide 74 text

No content

Slide 75

Slide 75 text

ϔϯ

Slide 76

Slide 76 text

• Grid • Cell Size : 0.75 • Scale : 0.5 • Tilemap • Transform Rota

Slide 77

Slide 77 text

TilemapοЄϭηϣυδμϕ΅愢හ̵ϹαϱЄΨ֢ΡѺ

Slide 78

Slide 78 text

ϔϯ

Slide 79

Slide 79 text

͚ͥͺ͡愆᪃抍ก ͠ΥΠ

Slide 80

Slide 80 text

Θ͹;䮭΁TilemapΨ֢Σ͜Ѻ ͯͯ͠Η϶αϣ϶Ϸ

Slide 81

Slide 81 text

2d-extras

Slide 82

Slide 82 text

2d-extras • Unityلୗ϶αϣ϶Ϸ • GitHub΄Unity-Technologies/2d-extras΁ • 2D͹ͼݷڹͶͧͿΔͶTileͭ͡΀͚ΞѺ • ͘Ρᑕଶ౮ᆧͭ͵Ο̵ίψϐϕφϕί΁ᤈͥΟ͚ͭ h"ps:/ /github.com/Unity-Technologies/2d-extras

Slide 83

Slide 83 text

2d-extras΄Ӿ΄μ϶φᗭ᩻͢䔶ێѺ ͚ͥͺ͡奧ՕѺ

Slide 84

Slide 84 text

TerrainTile

Slide 85

Slide 85 text

ϔϯ

Slide 86

Slide 86 text

ͩ΢ཿͭͥ΀͚ͽͯ͡Ѻ

Slide 87

Slide 87 text

֢ΠොѺ

Slide 88

Slide 88 text

TerrainTile΄惾㯎 • ScriptableTile΄1圵 • TerrainTile΅TileBaseΨ姅ಥͭ͵μ϶φ • 15圵΄SpriteΨጭ梍ͯΡ • ޮ㾨΄Tile΄ᇫ丆΁ݳΥͱͼ͚͚ఽͮ΁SpriteΨᤒᐏ • ᇫ丆΁ݳΥͱͼSprite圵气晝䝑 • ᇫ丆΁ݳΥͱͼSpriteΨࢧ敢

Slide 89

Slide 89 text

TerrainTile΄惾㯎 15圵΄Sprite΅ྋͭͥ戔ਧͭ΀͚;͚ͧ΀͚ 托ͭͥ΅ӥΨ h"ps:/ /qiita.com/RyotaMurohoshi/items/1629c50a9d9f70f31c83

Slide 90

Slide 90 text

ColorSmoothBrush

Slide 91

Slide 91 text

ColorSmoothBrush΄ֵ͚ො 1. TintedTilemapτδЄύЄͽMaterialΨ֢౮ 2. ↑ΨTilemap΁՞Ө 3. BrushΨTintedBrush΁ͭͼ̵ᜋΨ戔ਧ 4. Scene WindowͽᜋΨ䂍Π͵͚䁰ಅΨμϷϐμ

Slide 92

Slide 92 text

՜΁Θ׎ڥ΀Brush • LineBrush : 娄Ψ୚ͧΡΚͺ • Cordina1eBrush : θЄϊϸ͘͢Ρ;ͩΣ΄ଷ䰤͢Υ͡ΡΚͺ • PrefabBrush : ೰ਧͭ͵ϤϹϢήϣΨψϸ΁ᯈᗝͽͣΡΚͺ