• Save
Mix Essentials, Serious Games With Silverlight
Upcoming SlideShare
Loading in...5
×
 

Mix Essentials, Serious Games With Silverlight

on

  • 1,736 views

Mix Essentials - Serious Games With Silverlight

Mix Essentials - Serious Games With Silverlight
Erik Vullings - TNO
André van der Plas - Macaw
Antoni Dol - Macaw

Statistics

Views

Total Views
1,736
Views on SlideShare
1,731
Embed Views
5

Actions

Likes
1
Downloads
0
Comments
0

1 Embed 5

http://www.slideshare.net 5

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Mix Essentials, Serious Games With Silverlight Mix Essentials, Serious Games With Silverlight Presentation Transcript

  • Serious Games in Silverlight Erik Vullings – TNO André van der Plas – Macaw Antoni Dol – Macaw May 28, 2009
  • Serious Games in Silverlight
    • Agenda
      • Functional view – Erik Vullings – TNO
      • Technical View – André van der Plas – Macaw
      • Design View – Antoni Dol – Macaw
  • The Problem
    • Strategic decisions based on gut feeling, and models (if any):
      • Work in isolation, in their own environment
      • PoV are not shared between stakeholders
      • Require much time to setup & update
    • During operations or crisis , much time is lost:
      • Obtaining a good situational awareness (what is vs. what if)
      • Discovering possible solutions
    • Training & Serious Games :
      • Train professionals & citizens with different types of games
  • MiReCol Vision
    • Support decision making by computing effects
    • Based on open source infrastructure and standards
    • Offer models as (licensed) Internet services to the public
    • And:
    • Mixing reality & virtual world (model/data-based predictions)
    • Coupling models
    • Generic platform, multiple levels of scale
    • Multiple users, each with their own view
    • Interactive usage
  • Strategic example: Embassy case DB M 1 M 2 M n++ … Rich Internet Application (Silverlight 3) … Police Firemen Community rep. … Public Internet (with authN/authZ) Web Server Publish/Subscribe Event Bus
    • Models:
    • Explosion impact, Gasmal, …
    • Traffic mgmt, CO 2 , Noise, …
    Virtual Earth Police DB
  •  
  • Why Silverlight?
    • Users expect slick designs
    • Scalability:
      • Easier to convert existing desktop GUIs to browser
      • Easier to add new models (using CAL a.k.a. Prism)
      • Integrate existing models (diff.languages)
      • Cross-browser availability
    • Staff @ TNO:
      • Much dev. exp, but little web app exp.
      • Not yet another IDE to learn (exp./licenses VS)
    • Personally:
      • I don’t like browser quirks, but I really like C#
  • Serious Games
    • 7 Functional Aspects for making them successful
  • 1. Truth vs. Perceived Truth
  • Modelling , Simulations & Games 101
    • What’s a model?
  • Modelling , Simulations & Games 101
    • What’s a model?
    Model Path Attitude Catwalk stroll Flood Model Rain Elevation Water level in city River level …
  • Modelling, Simulations & Games 102
    • What’s a simulation?
    Flood sim. Rain Elevation Water level in city at time T River level TIME Electricity Netwerk Telecom. Netwerk Other sims …
  • Modelling, Simulations & Games 103
    • What’s the truth?
    • Perceived truth?
  • Modelling, Simulations & Games 103
    • What’s the truth?
    • Example:
      • Water at city hall
      • World Forum blackout
      • Road flooded
    • Perceived truth?
    • Example:
      • Water at city border
      • No blackout reported
      • Road clear, used for evacuating citizens
  • 2. Game Effectiveness game rules Based on the model of Jeroen van Mastrigt (HKU) implementation social interaction declarative layer
  • 3. Keep the right level and pace “ Easy to learn, hard to master” Flow concept: Mihaly Csikszentmihalyi Game Flow Frustration Boredom Challenge Skill level Reflection Reflection Reflection Reflection Level 1 Level 2 Level 3 Level 4 Level .....
  • 4. Practice in a safe & relevant environment
  • 5. Efficiency
  • 6. Scalability #Users Costs Training Game
  • 7. Just in time, not just in case 1953
  • Serious Game
    • For professionals (mayor & staff)
    • For civilians: SafeCity
      • Improve a civilian’s chances of survival during a flood
  • Development Process
    • Define game phases
      • From preparation to after-care
    • Per phase, specify learning goals
    • Transform goals to game elements
    • Build game environment
      • Models & simulations represent reality
      • Model perceived truth
  • Serious Gaming a technical point of view “It’s all elementary (for developers)” André van der Plas – Macaw
  • SafeCity demo
  • Silverlight
    • .NET on the client
    • Designer/developer interaction
  • Serious Gaming – basic elements
    • Game engine | Game loop | Game data | Game display
  • Serious Gaming – basic elements
    • Game engine | Game loop | Game data | Game display
      • private Engine()
      • {
      • this.gameLoop = new GameLoopTimer();
      • this.gameLoop.Update += new UpdateHandler(GameLoop_Update); }
  • Serious Gaming – basic elements
    • Game engine | Game loop | Game data | Game display
    • public GameLoopTimer()
    • {
    • timer.Tick += timer_Tick;
    • }
    • private void timer_Tick(object sender, EventArgs e)
    • {
    • if (this.Update != null)
    • {
    • Update(this, new EventArgs());
    • }
    • }
  • Serious Gaming – basic elements
    • Game engine | Game loop | Game data | Game display
      • Domain entities
      • WCF
  • Serious Gaming – basic elements
    • Game engine | Game loop | Game data | Game display
      • Silverlight user controls
      • DeepEarth control
  • Serious Gaming – basic architecture Model Controller View Game engine Game loop Game data Game display
  • Serious Gaming – basic architecture Model Controller View City area clicked Update Info panel Update Current City area Broadcast New City area State Update State Request
    • Open Source
    • Silverlight 2.0
    • DeepZoom (multi scale image)
    • Tile sources for existing tile providers (OSM)
    • Map icons, map polygons, map layers
    • X,Y coordinates <-> Geocoordinates
  •  
  •  
  •  
  •  
  • Conclusion
    • Serious Games in Silverlight:
      • High productivity
      • Great fun 
  • </ Serious Gaming - a technical point of view> </“It’s all elementary (for developers)”>
  •  
  •  
  • Deep Orange Antoni Dol – Macaw A Design point of view
  • Serious Games in Silverlight
    • Agenda
      • Motivation
      • Design
      • Implementation
      • Distribution
  • Deep Orange – Why?
    • Training: creating insights in the effects from various product and marketing strategies
    • Intended for internal sales departments
    • How hard is it to win from the computer?
    • Provoke a discussion
  • Deep Orange - Motivation
    • Client wants to train employees in car insurance strategy using a Serious Game
    • Microsoft Developer needs time and attention for game engine and connecting models
    • Client realizes design is necessary => through Microsoft to Macaw
    • Technology was chosen (WPF-XAML)
    • Game was in development, but playing itself (!)
    • Take a few steps back: design GUI first!
  • UI Deep Orange - 1st Design
  • Deep Orange - Design
    • Color/Mood examples from books/objects
    • Small sketches
    • Meeting
    • Elaborate sketches
    • Meeting
    • Create detailed proposals in Illustrator
    • Meeting
    • All in 2 weeks
  • Small sketches
  • Small sketches
  • Elaborate sketches
  • Deep Orange - Structure
    • Start
    • Settings
      • Name
      • Avatar
      • Gender
    • Your Goal
    • Help
    • ©
    • Game
      • 15 minutes
      • Pausing
      • Ending
    • Product development
    • Client Offers
    • Profit & Loss
    • Strategy Radar
    • Result
    • Result
      • Replay
      • Exit
    • High Scores
    • Explanations
    • Credits
  •  
  •  
  •  
  • Deep Orange – XAML Implementation
    • High expectations, small amount of time
    • Convert Adobe Illustrator to XAML
    • Basic screen layout
    • ControlTemplates for Buttons, Sliders
    • ControlTemplate for HyperGrid
    • Sound?
    • All in 1 week
  •  
  • Deep Orange – C# Implementation
    • Game loop: a tick every 3 seconds
    • Daily builds, testing by client
    • Integrating UI en Game Engine using Data binding during a presentation of results.
    • Elements on invisible screens still clickable (significant transparency)
    • Controlling animations from code
    • In 3 Weeks
  •  
  • Deep Orange - Collaboration
    • Designer/Developer Collaboration
      • Visual Studio Team System
      • Repository via Internet
      • Initially work apart on UI and Engine
      • Continue working on parts of the UI while it is integrated with code
      • Autonomously including data binding to UI
  • Deep Orange – Demo
  • Deep Orange – Distribution
    • Distributed to the stakeholders
    • Followed by distribution to employees
    • Game instructions presentations to employees
  • Deep Orange – Instructions
  • Deep Orange – Instructions
  • Serious Games
    • Serious alternative for training
    • Many aspects to consider
    • Keep it interesting and relevant
    • Learn something useful
    • Cost effective in case of many users
  • Serious Games in Silverlight
    • Why Silverlight?
      • Code, Data and UI integrate really well
      • Designer, Developer collaborate really well
      • Online: No deployment or installation issues
      • Browser penetration growing: > 25%
    • Silverlight for Serious Games
      • Substantial graphical possibilities with XAML
      • Connecting to data models
      • Connecting to game engine in C#
    • Written especially for User Interface Designers
    • Dutch
    • Full Color
    • Color and Brushes
    • Document Layout , Text, Fonts and Typography
    • Shapes and Geometry
    • Screen Layout , UI Controls
    • Styles , Templates , Resources , Skins and Themes
    • Transformations, Animations, 3D , Bitmap Effects
    • Published: May 2008
    • Silverlight 3 project from beginning to end:
    • Design
    • Production
    • Programming
    • Publication
    • In Dutch
    • Expected: Q3 2009
    Silverlight 3
  • More information…
    • Contact:
      • [email_address]
      • André.van.der.Plas@macaw.nl
      • [email_address]
    • Read more: www.macaw.nl/seriousgames
    • Blogs: http://www.antonidol.nl
    • Thank you!