May 18 2017 meetup presentation

1. Do you want to
build a level?
(Yes, you do)

2. So you have a level idea
- Where to start?

3. So you have a level idea
- Where to start?
- Story / Objective

4. So you have a level idea
- Where to start?
- Story / Objective
- Shaping the level:

5. So you have a level idea
- Where to start?
- Story / Objective
- Shaping the level:
- Pull from personal experiences

6. So you have a level idea
- Where to start?
- Story / Objective
- Shaping the level:
- Pull from personal experiences
- Pull from other sources

7. So you have a level idea
- Where to start?
- Story / Objective
- Shaping the level:
- Pull from personal experiences
- Pull from other sources
- Concept artist

8. Reference hunting!!
- Not just for artists

9. Reference hunting!!
- Not just for artists
- Helps influence gameplay

10. Reference hunting!!
- Not just for artists
- Helps influence gameplay
- Real-world or imaginary references

11. Reference hunting!!
- Real-world setting - factory

12. Reference hunting!!
- Real-world setting - factory

13. Reference hunting!!
- Real-world setting - factory

14. Reference hunting!!
- Real-world setting - factory

15. Reference hunting!!
Other references - surrealist paintings

16. Reference hunting!!
Other references - surrealist paintings

17. Reference hunting!!
Other references - surrealist paintings

18. Reference hunting!!
Other references - surrealist paintings

19. Reference hunting!!
Imaginary references - other games/movies

20. Reference hunting!!
Imaginary references - other games/movies

21. Reference hunting!!
Imaginary references - concept art

22. Got dat ref
- Next Step? Level Blockout

23. Got dat ref
- Next Step? Level Blockout
- Why:

24. Got dat ref
- Next Step? Level Blockout
- Why:
- Test gameplay and environment quickly

25. Got dat ref
- Next Step? Level Blockout
- Why:
- Test gameplay and environment quickly
- Find gems / problems, test scale

26. Got dat ref
- Next Step? Level Blockout
- Why:
- Test gameplay and environment quickly
- Find gems / problems, test scale
- Waaaaaaaaaaaay easier to make big changes

27. Got dat ref
- Next Step? Level Blockout
- Why:
- Test gameplay and environment quickly
- Find gems / problems, test scale
- Waaaaaaaaaaaay easier to make big changes
- Helps give artist direction

28. Level blocking
- Plan in 2D if wanted

29. Level blocking
- Plan in 2D if wanted
- Photoshop / pencil + paper

30. Level blocking
- Plan in 2D if wanted
- Photoshop / pencil + paper
- Build rough layout in Unity

31. Level blocking
- Plan in 2D if wanted
- Photoshop / pencil + paper
- Build rough layout in Unity
- Recommend Probuilder vs. stock unity

32. Level blocking
- Plan in 2D if wanted
- Photoshop / pencil + paper
- Build rough layout in Unity
- Recommend Probuilder vs. stock unity
- Put shapes with direct influence on gameplay

33. Level blocking
- Plan in 2D if wanted
- Photoshop / pencil + paper
- Build rough layout in Unity
- Recommend Probuilder vs. stock unity
- Put shapes with direct influence on gameplay
- Floors/walls/ceiling for line of sight and readability

34. Level blocking
- Plan in 2D if wanted
- Photoshop / pencil + paper
- Build rough layout in Unity
- Recommend Probuilder vs. stock unity
- Put shapes with direct influence on gameplay
- Floors/walls/ceiling for line of sight and readability
- Forget the deco

35. Level blocking
- Plan in 2D if wanted
- Photoshop / pencil + paper
- Build rough layout in Unity
- Recommend Probuilder vs. stock unity
- Put shapes with direct influence on gameplay
- Floors/walls/ceiling for line of sight and readability
- Forget the deco
- unless it influences gameplay

36. Example - level blocking

37. Level blocking - things to consider
- Landmarks

38. Level blocking - things to consider
- Landmarks
- Give short / medium / long term goals

39. Level blocking - things to consider
- Landmarks
- Give short / medium / long term goals
- Help with orientation

40. Level blocking - things to consider
- Landmarks

41. Level blocking - things to consider
- Landmarks

42. Level blocking - things to consider
- Landmarks
- Give short / medium / long term goals
- Help with orientation
- Variety
- Turning, verticality

43. Level blocking - things to consider
- Variety
- Turning, verticality

44. Level blocking - things to consider

45. Level blocking - things to consider

46. Level blocking - things to consider
- Landmarks
- Give short / medium / long term goals
- Help with orientation
- Variety
- Turning, verticality
- Sightlines
- Player sees only what you want them to

47. Level blocking - things to consider
- Landmarks
- Give short / medium / long term goals
- Help with orientation
- Variety
- Turning, verticality
- Sightlines
- Player sees only what you want them to
- Focus on something

48. Level blocking - things to consider
- Sightlines

49. Level blocking - things to consider
- Sightlines

50. Level blocking - things to consider
- Landmarks
- Give short / medium / long term goals
- Help with orientation
- Variety
- Turning, verticality
- Sightlines
- Player sees only what you want them to
- Focus on something
- Hide info, encourage exploration

51. Level blocking - things to consider
- Landmarks
- Give short / medium / long term goals
- Help with orientation
- Variety
- Turning, verticality
- Sightlines
- Player sees only what you want them to
- Focus on something
- Hide info, encourage exploration
- Cover

52. Got dat level block
- Handoff to artist with story + reference

53. Got dat level block
- Handoff to artist with story / reference
- But if it’s you:

54. Got dat level block
- Handoff to artist with story / reference
- But if it’s you:
- Now deck the level with props right?!??!

55. Got dat level block
- Handoff to artist with story / reference
- But if it’s you:
- Now deck the level with props right?!??!
- No

56. Got dat level block
- Handoff to artist with story / reference
- But if it’s you:
- Now deck the level with props right?!??!
- No
- Please no

57. Got dat level block
- Handoff to artist with story / reference
- But if it’s you:
- Now deck the level with props right?!??!
- No
- Please no

58. Got dat level block
- Handoff to artist with story / reference
- But if it’s you:
- Now deck the level with props right?!??!
- No
- Please no

59. Got dat level block
- Handoff to artist with story / reference
- But if it’s you:
- Now deck the level with props right?!??!
- No
- Please no

60. Art blockout

61. Art blockout
- Why:
- Flesh out scene quickly

62. Art blockout
- Why:
- Flesh out scene quickly
- Figure out specific assets

63. Art blockout
- Why:
- Flesh out scene quickly
- Figure out specific assets
- Test scale of props/level

64. Art blockout
- Why:
- Flesh out scene quickly
- Figure out specific assets
- Test scale of props/level
- Test composition

65. Ref hunting - Round 2

66. Ref hunting - Round 2

67. Ref hunting - don’t feel shy
- Seriously, don’t worry about copying others

68. Ref hunting - don’t feel shy
- Seriously, don’t worry about copying others
- All ideas come from somewhere

69. Ref hunting - don’t feel shy
- Seriously, don’t worry about copying others
- All ideas come from somewhere
- Combine ideas from many places

70. Ref hunting - don’t feel shy
- Seriously, don’t worry about copying others
- All ideas come from somewhere
- Combine ideas from many places
- Steal from one - copycatting

71. Ref hunting - don’t feel shy
- Seriously, don’t worry about copying others
- All ideas come from somewhere
- Combine ideas from many places
- Steal from one - copycatting
- Steal from many - inspiration!

72. Art blockout - Shapes!
- Start with rough asset shapes
- We see these first when looking at something

73. Art blockout - Shapes!
- Start with rough asset shapes
- We see these first when looking at something
- Focus on variety

74. Art blockout - Shapes!
- Start with rough asset shapes
- We see these first when looking at something
- Focus on variety
- In Unity
- Use basic shapes
- Combine them into prefabs

75. Art blockout - Shapes!
- Start with rough asset shapes
- We see these first when looking at something
- Focus on variety
- In Unity
- Use basic shapes
- Combine them into prefabs
- No 3D training needed!!!!!!!!!!!!!!!!!!!!!

76. Art blockout - Prefab examples

77. Art blockout - Prefab examples

78. Art blockout - Prefab examples

79. Art blockout - Foliage example

80. Art blockout - Foliage example

81. Art blockout - Foliage example

82. Art blockout - Foliage example

83. Art blockout - Example

84. Art blockout - Shapes!
- Good idea to keep populating your scene until
comfortable

85. Art blockout - Shapes!
- Good idea to keep populating your scene until
comfortable
- Once done, you can make a list of all assets you need

86. Art blockout - Colors!
- Apply simple materials to prefabs

87. Art blockout - Colors!
- Apply simple materials to prefabs
- Google textures/colors for terrain

88. Art blockout - Color example

89. Art blockout - Lighting!
- Add directional light for sun/moon

90. Art blockout - Lighting!
- Add directional light for sun/moon
- Focus on visibility of paths for now

91. Art blockout - Lighting!
- Add directional light for sun/moon
- Focus on visibility of paths for now
- We’ll come back to this during composition

92. Art blockout - Lighting example

93. COMPOSITION!!!
- Structure of an image

94. COMPOSITION!!!
- Structure of an image
- So

95. COMPOSITION!!!
- Structure of an image
- So
- Freaking

96. COMPOSITION!!!
- Structure of an image
- So
- Freaking
- Important

97. COMPOSITION!!!
- Structure of an image
- So
- Freaking
- Important

98. COMPOSITION!!!
- Structure of an image
- So
- Freaking
- Important
- Centuries-old tricks
- Mainly used in painting/architecture
- Naturally work for films/games

99. Comp. - Leading Lines
- Lines lead the eye

100. Comp. - Leading Lines
- Lines lead the eye
- Literal lines

101. Comp. - Leading Lines
- Lines lead the eye
- Literal lines

102. Comp. - Leading Lines
- Lines lead the eye
- Literal lines

103. Comp. - Leading Lines
- Lines lead the eye
- Literal lines
- Implied lines

104. Comp. - Leading Lines
- Lines lead the eye
- Literal lines
- Implied lines

105. Comp. - Leading Lines
- Lines lead the eye
- Literal lines
- Implied lines

106. Comp. - Negative Space
- Helps define walkable areas

107. Comp. - Negative Space
- Helps define walkable areas

108. Comp. - Negative Space
- Helps define walkable areas

109. Comp. - Negative Space
- Helps define walkable areas

110. Comp. - Negative Space
- Helps define walkable areas

111. Comp. - Frames
- Draw attention to frame interior

112. Comp. - Frames
- Draw attention to frame interior
- Can use as travel markers

113. Comp. - Frames
- Draw attention to frame interior
- Can use as travel markers

114. Comp. - Frames
- Draw attention to frame interior
- Can use as travel markers

115. Comp. - Contrast
- Make important things stand out

116. Comp. - Contrast
- Make important things stand out
- Interactive vs. static

117. Comp. - Contrast
- Make important things stand out
- Interactive vs. static
- Ground vs. wall

118. Comp. - Contrast
- Make important things stand out
- Interactive vs. static
- Ground vs. wall

119. Comp. - Contrast
- Make important things stand out
- Interactive vs. static
- Ground vs. wall
- Edge Highlights

120. Comp. - Contrast
- Make important things stand out
- Interactive vs. static
- Ground vs. wall
- Edge Highlights

121. Comp. - Contrast
- Make important things stand out
- Interactive vs. static
- Ground vs. wall
- Edge Highlights
- Lighting
- From dark to light
- Light the waaaaay!

122. Comp. - Lighting for everything!!!
- Lighting for leading lines

123. Comp. - Contrast
- Lighting for negative space

124. Comp. - Contrast
- Lighting for framing

125. Comp. - Contrast
- Lighting for interactive objects

126. Comp. - Contrast
- Lighting for edge highlights

127. Comp. - Motion
- Motion draws attention

128. Comp. - Motion
- Motion draws attention

129. Squint test

130. Squint test
- Take a pic, squint your eyes

131. Squint test
- Take a pic, squint your eyes
- If something’s standing out, is it important?

132. Squint test
- Take a pic, squint your eyes
- If something’s standing out, is it important?
- Be rigorous for high-intensity moments

133. Squint test -good example

134. Squint test -good example

135. Squint test -bad example

136. Squint test -bad example

137. Putting it all together

138. Putting it all together

139. Putting it all together

140. Putting it all together

141. Putting it all together

142. Putting it all together

143. Putting it all together

144. Whewwwweweeweweww...
- Reference hunting
- Gameplay + art

145. Whewwwweweeweweww...
- Reference hunting
- Gameplay + art
- Level blockout
- Problems sooner, change easier, direction for artist

146. Whewwwweweeweweww...
- Reference hunting
- Gameplay + art
- Level blockout
- Problems sooner, change easier, direction for artist
- Landmarks, variety, sightlines

147. Whewwwweweeweweww...
- Reference hunting
- Gameplay + art
- Level blockout
- Problems sooner, change easier, direction for artist
- Landmarks, variety, sightlines
- Art blockout
- Problems sooner, change easier, asset list, test
comp.

148. Whewwwweweeweweww...
- Reference hunting
- Gameplay + art
- Level blockout
- Problems sooner, change easier, direction for artist
- Landmarks, variety, sightlines
- Art blockout
- Problems sooner, change easier, asset list, test
comp.
- Build rough shapes, colors, lighting

149. Whewwwweweeweweww...
- Reference hunting
- Gameplay + art
- Level blockout
- Problems sooner, change easier, direction for artist
- Landmarks, variety, sightlines
- Art blockout
- Problems sooner, change easier, asset list, test
comp.
- Build rough shapes, colors, lighting
- Composition
- Tricks for guiding the player

150. Whewwwweweeweweww...
- Reference hunting
- Gameplay + art
- Level blockout
- Problems sooner, change easier, direction for artist
- Landmarks, variety, sightlines
- Art blockout
- Problems sooner, change easier, asset list, test
comp.
- Build rough shapes, colors, lighting
- Composition
- Tricks for guiding the player

151. Further Reading
- The Importance of Nothing: Using Negative Space
- Youtube GDC talk

152. Further Reading
- The Importance of Nothing: Using Negative Space
- Youtube GDC talk
- Everything I learned about level design I learned from
Disneyland
- Youtube GDC

153. Further Reading
- The Importance of Nothing: Using Negative Space
- Youtube GDC talk
- Everything I learned about level design I learned from
Disneyland
- Youtube GDC
- Game maker’s Toolkit: Why Nathan Drake doesn’t
need a compass
- Youtube

154. Further Reading
- The Importance of Nothing: Using Negative Space
- Youtube GDC talk
- Everything I learned about level design I learned from
Disneyland
- Youtube GDC
- Game maker’s Toolkit: Why Nathan Drake doesn’t
need a compass
- Youtube
- Interior Design and Environment Art: Mastering Space,
mastering place

155. 3D Crash Course
- 1-day 8-hour workshop, beginners/intermediates
- Full 3D pipeline, making realistic hylian shield
- Laptop loans
- June 3rd, $55 Early bird tickets, see meetup for details

156. Questions / comments