Global game jam 2014 – Unity WebCam

Last weekend, my brother Will and I participated in the 2014 global game jam at the MIT location in Boston. I had a great time and met a lot of awesome people. It was amazing seeing what some of the teams were able to come up with in 48 hours. You can see the final presentations from the teams here:

(Will and I are on at the 35 minute mark.)

The theme of the Game Jam was “We don’t see things as they are, we see them as we are”, so we decided to take that very literally, and made a game called “Find yourself inside yourself”, where you have to navigate a trippy maze trying to find yourself. The game heavily relied on the webcam, which was used to dynamically set colors for the in-game scenery, as well as determine the behavior for the monsters in the game. Here’s how it worked:

Here’s the start method of the behavior which was placed on an empty game object in the scene:

void Start () {
 CamColors = new List<Color> ();
//load the webcamtexture, and stop it if it's already running
 _webcamTexture = new WebCamTexture ();
 _webcamTexture.Stop ();
 Textures = GameObject.FindGameObjectsWithTag ("WebCamTexture");
 foreach (var t in Textures) {

 t.renderer.materials[0].mainTexture = _webcamTexture;

_webcamTexture.Play ();
 TopColors = new List<Color32> ();
 InvokeRepeating ("GetPixels", 0, RefreshInterval);

The WebCamTexture tag denotes anything that I want to use when displaying the contents of the webcam. I was only able to get the webcam image to display on a unity primitive (sphere, plane, etc)

Below is the bit which figures out the coloring.

	public void GetPixels(){
		if (_webcamTexture == null) {

		CamColors.Clear ();
		TopColors.Clear ();

                //get an array of pixel colors
		var colors = _webcamTexture.GetPixels ();
		var count = 0;

                //running through all 600k pixels every few seconds didn't perform very well, so we're only taking every 200th pixel color (good enough for the gamejam)
		var skip = 200;
		var histogram = new Dictionary<Color, int> ();
		for (int i = 0; i < colors.Length; i+=skip) {
			var c = colors[i];
                        //only take the color if it's not really bright or really dark. This makes for more interesting colors than whites and blacks
			if(c.grayscale < .8f && c.grayscale > .1f){
					histogram = 1;
				} else {


                //do an inverse sort on the dictionary in order to figure out which colors are the most popular. If I had more time, I'd group the colors somehow and get more of an average color from the webcam, but it's a gameJam, and you never have time.
		var colorList = histogram.ToList ();
		colorList.Sort (delegate(KeyValuePair<Color, int> pair1, KeyValuePair<Color, int> pair2) {
			return pair2.Value.CompareTo(pair1.Value);

                //save the top 100 colors from the histogram
		var topColors = colorList
			.Take (100);
		foreach (var c in topColors) {


This method figures out (roughly) what the 100 most popular colors in the webcam image are.

Any ideas for how this could be done more efficiently? How I could have gotten a better color result? Let me know in the comments!

Share and Enjoy:
  • Reddit
  • Google Bookmarks
  • Twitter
  • StumbleUpon
  • Facebook
  • Yahoo! Buzz
  • Digg

Leave a Reply

Your email address will not be published.