EEE436 / CS422 Final Presentation
Group 2
14.05.2010
Outline
 Team Members
 Project Overview
 Rules for Pictionary
 Game Architecture
 Server Side
 Client Side
 Flow Chart/Operational Summary
 Final Stage of the Prototype
 Possible Improvements
Coşkun, Dağ, Gürses, Mıdoğlu 1
Outline
 Team Members
 Project Overview
 Rules for Pictionary
 Game Architecture
 Server Side
 Client Side
 Flow Chart/Operational Summary
 Final Stage of the Prototype
 Possible Improvements
Coşkun, Dağ, Gürses, Mıdoğlu 2
Team Members
 Cemil Can Coşkun
Electrical and Electronics Engineering
Senior Student
Network setup
 Selin Dağ
Electrical and Electronics Engineering
Senior Student
GUI design
 İbrahim Gürses
Computer Engineering
Image
streaming
 Çise Mıdoğlu
Electrical and Electronics Engineering
Senior Student
Socket
programming
Senior Student
Coşkun, Dağ, Gürses, Mıdoğlu 3
Outline
 Team Members
 Project Overview
 Rules for Pictionary
 Game Architecture
 Server Side
 Client Side
 Flow Chart/Operational Summary
 Final Stage of the Prototype
 Possible Improvements
Coşkun, Dağ, Gürses, Mıdoğlu 4
Project Overview
 Undertaken as a requirement of the EEE436/CS422 course
 Multiplayer game: each player takes turns in drawing a picture on
the shared interface:
 Person who is drawing is called the artist. Other players
(guessers) try to guess what the picture is
 Guessers submit their guesses in written form to the artist. If
a guess is correct, the guesser who has submitted the guess
wins the tour, also earning the artist some points
 Intended to serve for recreation / entertainment purposes, useful
tool for increasing visual creativity
Coşkun, Dağ, Gürses, Mıdoğlu 5
Project Overview – Cont.
 Uses the ad-hoc network to which all players are connected. The
wireless connection is established using the IEEE 802.11 protocol
 Takes the internet-based games “iSketch” and “Yahoo Pictionary”
as examples
 Requires a minimum of 2 players connecting via their mobile
devices
 GUI: Multicolor sketch screen, text sending and receiving screen,
score, timer running backward from 60 seconds
Coşkun, Dağ, Gürses, Mıdoğlu 6
Project Overview – Cont.
 Code written in C#, platforms: Windows XP, Windows Vista,
Windows 7
 .NET framework is used (version 3.5), code developed with
Visual Studio 2008.
 No extra libraries were used. All libraries that are used are a part
of the .NET platform
 The design of an interface with .NET and GDI is easy with Visual
Studio 2008 by the help of the built in UI designer. However,
GDI has limited number of functionalities as Swing library
Coşkun, Dağ, Gürses, Mıdoğlu 7
Project Overview – Cont.
 .Net packages that were imported:
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Text;
using System.Windows.Forms;
using System.Diagnostics;
using System.IO;
using System.Net;
using System.Threading;
using System.Net.Sockets;
using System.Runtime.Serialization.Formatters.Binary;
using System.Net.NetworkInformation;
Coşkun, Dağ, Gürses, Mıdoğlu 8
Outline
 Team Members
 Project Overview
 Rules for Pictionary
 Game Architecture
 Server Side
 Client Side
 Flow Chart/Operational Summary
 Final Stage of the Prototype
 Possible Improvements
Coşkun, Dağ, Gürses, Mıdoğlu 9
Rules
 The game consists of 8 rounds where the artist is given a word to
draw, and the guessers try to guess it within 1 minute
 Artist receives 5 points if any of the guessers submit a correct
guess, and 0 points if no correct guesses are made within 1
minute
 The first player (guesser) to guess the target word correctly
receives 5 points
 Wrong guesses do not result in any point loss: a guesser can
submit as many guesses as he/she wishes
Coşkun, Dağ, Gürses, Mıdoğlu 10
Outline
 Team Members
 Project Overview
 Rules for Pictionary
 Game Architecture
 Server Side
 Client Side
 Flow Chart/Operational Summary
 Final Stage of the Prototype
 Possible Improvements
Coşkun, Dağ, Gürses, Mıdoğlu 11
Game Architecture
wireless ad-hoc network
(7 peers)
network host
game host
game host
Coşkun, Dağ, Gürses, Mıdoğlu 12
Game Architecture – Cont.
 Peer-to-peer (P2P) type architecture, each player takes turns in
becoming the server
 Simultaneous multimedia transfer is handled via serialization of the
bitmap image
 4 sockets are used in the overall process:
 1 for establishing the game [port: 11000]
 1 for sending and receiving the serialized bitmap image [port:
12000]
 1 for sending and receiving the guesses: address [port: 13000]
guess (string) + time stamp (integer) + IP
 1 for ending the game [port: 14000]
Coşkun, Dağ, Gürses, Mıdoğlu 13
Game Architecture – Cont.
Coşkun, Dağ, Gürses, Mıdoğlu 14
Game Architecture – Cont.
Server Side
• A normal member of the ad-hoc network becomes the server if:
• He/she starts the program (Pictionary.exe) and then chooses “Create
New Game” [game host]
• Enters an already existing game, plays for a while and then it
becomes his turn to draw [artist]
• Server determines the start of the game and tells it to clients:
• Randomly selects a word from a text database (“target word”)
• User interface allows the user to make a multicolor sketch
Coşkun, Dağ, Gürses, Mıdoğlu 15
Game Architecture – Cont.
Server Side
Coşkun, Dağ, Gürses, Mıdoğlu 16
Game Architecture – Cont.
Server Side
Coşkun, Dağ, Gürses, Mıdoğlu 17
Game Architecture – Cont.
Server Side
• Determines the end of the round:
• Keeps track of time (countdown)
• Keeps track of the scores
• At the end of the round:
• Determines if it is the last round (end of the game)
• Sends the score information to the next server
• Sends the summary of the round as a message to all players (winner,
time remaining, updated scores)
• Closes all sockets
• Becomes a client
Coşkun, Dağ, Gürses, Mıdoğlu 18
Game Architecture – Cont.
Client Side
• A normal member of the ad-hoc network becomes a client if:
• He/she starts the program (Pictionary.exe) and then chooses
“Connect to a Game” [default client]
• Establishes a game, plays for a round as the artist and then gives the
turn to another player [guesser]
• Receives an indicator at the beginning and resets its counter
• Simultaneously receives the bitmap image from the server
• Submits guesses in the form: guess (from user interface) + timestamp
(from system clock) + IP address
• Receives a message from the server at the end of the round
Coşkun, Dağ, Gürses, Mıdoğlu 19
Game Architecture – Cont.
Client Side
Coşkun, Dağ, Gürses, Mıdoğlu 20
Game Architecture – Cont.
Client Side
Coşkun, Dağ, Gürses, Mıdoğlu 21
Outline
 Team Members
 Project Overview
 Rules for Pictionary
 Game Architecture
 Server Side
 Client Side
 Flow Chart/Operational Summary
 Final Stage of the Prototype
 Possible Improvements
Coşkun, Dağ, Gürses, Mıdoğlu 22
Operational Summary
1.
2.
3.
4.
5.
6.
A person establishes an ad-hoc network (does not need
to be a player)
People connect to this wireless ad-hoc network
Those who wish to play Pictionary run the program
Among the people who run the program, those who wish
to start a new game click “Create New Game” and those
who wish to join an already existing game (if any) click
“Connect to a Game”
[Server] Broadcast a message with one’s own IP address
and wait for incomers
[Client] Use a dedicated listener to see if anyone is
broadcasting, list servers in the user interface
Coşkun, Dağ, Gürses, Mıdoğlu 23
Operational Summary
7.
8.
9.
10.
11.
12.
13.
14.
[Server] Start the round (user interface)
[Client] Wait until the server starts the game
[Server] Send all IP addresses to all players and indicate start
of the round
[Client] Reset timer when start of the game message is
received
[Server] Send bitmap image (update every 1 second)
[Client] Deserialize information to receive the bitmap image
[Client] Send the guesser’s guess in string form with time
stamp
[Server] Compare all guesses against the target word:
- determine the end of the round
- determine the winner’s IP and broadcast it in the network
Coşkun, Dağ, Gürses, Mıdoğlu 24
Outline
 Team Members
 Project Overview
 Rules for Pictionary
 Game Architecture
 Server Side
 Client Side
 Flow Chart/Operational Summary
 Final Stage of the Prototype
 Possible Improvements
Coşkun, Dağ, Gürses, Mıdoğlu 25
Prototype
 Setting up a wireless ad-hoc network
completed
completed
completed
 Establishing a new game
 Joining an already established game
 IP address broadcasting through the




network
Bitmap object serializing-deserializing
Text sending-receiving between 2 peers
Client Interface (text sending)
Server Interface (wait for players)
completed
completed
completed
completed
completed
Coşkun, Dağ, Gürses, Mıdoğlu 26
Prototype – Cont.
 Server Interface (display guesses)
 Role changing (server to client)
 Role changing (client to server)
 Exception handling in the runtime
completed
completed
completed
discarded
Coşkun, Dağ, Gürses, Mıdoğlu 27
Outline
 Team Members
 Project Overview
 Rules for Pictionary
 Game Architecture
 Server Side
 Client Side
 Flow Chart/Operational Summary
 Final Stage of the Prototype
 Possible Improvements
Coşkun, Dağ, Gürses, Mıdoğlu 28
Possible Improvements
 Database:
 Enhanced database (number of words)
 User interface development:
 Server interface (more drawing tools)
 Client interface (wait –game loading- screen)
 Application to other mobile devices (eg. Cell phones)
Coşkun, Dağ, Gürses, Mıdoğlu 29
The End
Thank you for listening.
Questions?