Game Design 2
                     Lecture 4: Layering & Separation




http://www.comu346.com                           d...
Errata and News

• Did everyone get last week’s tutorial?
• Reading for Colour lecture online now.
• Audio for Colour lect...
Reading

• Tufte pages 53 - 66
• http://bit.ly/l4dlight (Left 4 Dead use of light)
• http://bit.ly/worldofgootour (video)
Flatland

• Flatland: A Romance of Many Dimensions
• 1884 Novel by Edwin A. Abbott
• Contemplates how world would look to
...
Triangle in 2D
Triangle in 1D
Sphere in 1D
3D represented in 2D
Data Visualisation

• Life is navigated in 3D
• Mathematics can portray xD
• All(most all) of our displays are 2D
• How do...
“Escaping this flatland is the essential task of
          envisioning information”




                              Tufte...
Information

• simple or complicated
• detailed or sparse
• analogue or digital
Design
• understandable or confusing
• clear or cluttered
• the point of design is to reveal detail and
  complexity
• the...
Harmonising Elements
• Careful layout diminishes 1 + 1 = 3 clutter
• Avoid ‘active negative space’
• Words have fewer desc...
Negative Space
1+1=3
Subtle Differences
• All differences mean something
Games Examples

• 2D & 3D games use layering & separation
  to communicate with player.
• HUD is layered on top of game wo...
Madden 10
Championship Manager
Left 4 Dead
World of Goo
Game Design 2 - Lecture 4 - Layering and Separation
Game Design 2 - Lecture 4 - Layering and Separation
Game Design 2 - Lecture 4 - Layering and Separation
Game Design 2 - Lecture 4 - Layering and Separation
Game Design 2 - Lecture 4 - Layering and Separation
Game Design 2 - Lecture 4 - Layering and Separation
Game Design 2 - Lecture 4 - Layering and Separation
Game Design 2 - Lecture 4 - Layering and Separation
Game Design 2 - Lecture 4 - Layering and Separation
Game Design 2 - Lecture 4 - Layering and Separation
Game Design 2 - Lecture 4 - Layering and Separation
Game Design 2 - Lecture 4 - Layering and Separation
Game Design 2 - Lecture 4 - Layering and Separation
Game Design 2 - Lecture 4 - Layering and Separation
Game Design 2 - Lecture 4 - Layering and Separation
Game Design 2 - Lecture 4 - Layering and Separation
Upcoming SlideShare
Loading in …5
×

Game Design 2 - Lecture 4 - Layering and Separation

1,167 views
1,062 views

Published on

Lecture 4 for the Caledonain University course COMU346 which covers data visualisation and games interface design.

Keynote Version

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,167
On SlideShare
0
From Embeds
0
Number of Embeds
56
Actions
Shares
0
Downloads
31
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Game Design 2 - Lecture 4 - Layering and Separation

  1. 1. Game Design 2 Lecture 4: Layering & Separation http://www.comu346.com dfarrell@davidlearnsgames.com
  2. 2. Errata and News • Did everyone get last week’s tutorial? • Reading for Colour lecture online now. • Audio for Colour lecture up tonight hopefully.
  3. 3. Reading • Tufte pages 53 - 66 • http://bit.ly/l4dlight (Left 4 Dead use of light) • http://bit.ly/worldofgootour (video)
  4. 4. Flatland • Flatland: A Romance of Many Dimensions • 1884 Novel by Edwin A. Abbott • Contemplates how world would look to lesser and greater dimensions
  5. 5. Triangle in 2D
  6. 6. Triangle in 1D
  7. 7. Sphere in 1D
  8. 8. 3D represented in 2D
  9. 9. Data Visualisation • Life is navigated in 3D • Mathematics can portray xD • All(most all) of our displays are 2D • How do we map data to 2D? • One technique is layering and separation
  10. 10. “Escaping this flatland is the essential task of envisioning information” Tufte, Envisioning Information, Page 13
  11. 11. Information • simple or complicated • detailed or sparse • analogue or digital
  12. 12. Design • understandable or confusing • clear or cluttered • the point of design is to reveal detail and complexity • the data is never at fault • the user is never at fault
  13. 13. Harmonising Elements • Careful layout diminishes 1 + 1 = 3 clutter • Avoid ‘active negative space’ • Words have fewer descenders than ascenders • Curved text is hard to read
  14. 14. Negative Space
  15. 15. 1+1=3
  16. 16. Subtle Differences • All differences mean something
  17. 17. Games Examples • 2D & 3D games use layering & separation to communicate with player. • HUD is layered on top of game world • Games like Half Life 2 & Shadow of the Colossus foreshadow future events through use of background
  18. 18. Madden 10
  19. 19. Championship Manager
  20. 20. Left 4 Dead
  21. 21. World of Goo

×