Home [Interview] How Zynga Is Transforming Games With HTML5

[Interview] How Zynga Is Transforming Games With HTML5

Social gaming platform Zynga takes a lot of flak for its overbearing management practices and obsession with metrics over user experience. While those rumors may or may not be true, there is more to Zynga than calculating sessions lengths and daily average users. In fact, Zynga’s Germany branch is one of the global leaders in HTML5 development and creating dynamic mobile Web games. We chatted with Zynga Germany CTO Paul Bakaus about how Zynga approaches HTML5, what are the limitations of the spec and if we will ever see a Facebook app store.

Zynga has a variety of open source HTML5 projects in GitHub along with several new HTML5 game releases, including Words With Friends and Zynga Poker Mobile Web. As many Web-based game developers will tell you, those are not easy to create. See below for our interview with Bakaus and what Zynga is doing to move the HTML5 spec and ecosystem forward.

One of the things that I don’t recommend doing right now because it is just a matter of market share is going for WebGL. So, actual 3-D games have proved complicated at this point and it is also because the WebGL spec isn’t completely reading for consumption at this point, I think. Other than that I think today, even though there are some rough edges with the HTML5 spec because it wasn’t really created with games in mind, I think it is the right time now to start doing games. I don’t think anyone should stop building games right now or being kept up by people who say HTML5 is not ready.

Zynga’s HTML5 Products

There are now four HTML5-based Zynga games on the market: Words With Friends, FarmVille Express, Zynga Poker Mobile Web and CityVille Express. These games deliver load times comparable to native apps and, “utilize HTML5 tools such as WebSockets and CSS3 to deliver a seamless gaming experience and create fluid animations without slowing down game-play,” according to the company.

But there is more to Zynga’s contributions to HTML5 than just games. Its open source repository includes the Zynga Jukebox that helps game developers deal with the multi-layer audio limitations of HTML5 along with the Zynga Viewporter that has an essence of responsive design to it, fitting apps to the browsers they are in. One of the biggest problems, as Bakaus describes below, in HTML5 is seamless scrolling. The Zynga Scroller aims to eliminate that problem. Everybody talks about the great native scrolling in apps like Path. Bakaus hopes to give HTML5 the same capability.

Check out our interview with Bakaus below.

On background

A little bit about my background. I’m actually a developer myself. I started as a UI developer and back then we specialized in JavaScript and UI and many years ago I joined the jQuery team, one of my first gigs, and became the creator of jQuery UI. So back then John Resig asked me if I could build the UI for jQuery. Started jQuery UI got a lot of notice from jQuery UI and started learning how JavaScript works and how people use elements on the Web and how to drive it with a reasonable performance. I then moved on to consumer projects in Japan to transform Flash applications to JavaScript and finally I started Dextrose in 2010 with a friend of mine for the purpose of creating HTML5 games.

Back then we were looking for the creation of a full blown HTML5 game community and realized that the tech was there but it wasn’t any shared tech build so we started building an HTML5 engine prototype that was called Aves Engine that would really show the world what we could do with HTML5. We put up YouTube videos and I was talking at conferences about it and really made a lot of impact back then as really the first (tie)-based HTML5 engine that would show what they Web could still offer in the future.

Later that year Zynga acquired us to work on the full blown product. So, we threw away our prototype and started from scratch for the real solution for game systems to use. So, now when we are in a place where we have built up our development studio here in Germany that focuses on delivering HTML5 tech for the whole company and we are producing tech of the future here. It is a lot of research and a lot of fun as well.

A lot of challenges of course but right now we are really at a point where we have a full blown engine. We started it in house and what we can do is super exciting and let’s hope that we can get out a lot of what we are doing here soon.

Zynga’s philosophy on HTML5

Every decision we make on tech is really to connect people through our games. So, we are really want to bring our games to anywhere our players are. I think there is not a conscious decision for one tech or another, it is really what can deliver the job best. At this point we really are looking at HTML5 to drive a lot of this because HTML5 gives us a lot of advantages that native and Flash programs just cannot give us. The cross-platform aspect of it, bringing the game to many people on different platforms is really what is killing it for us.

Also, usually you would have to port an existing game that runs on Web and native to smartphones and tablets and maybe something else as well. We don’t have to do with that HTML5 and that is super exciting.

Limitations of HTML5 for games

There are a couple of limitations, to be honest. There are certainly sound issues. Sound is still a trouble for many game devs. One of the things that I don’t recommend doing right now because it is just a matter of market share is going for WebGL. So, actual 3-D games have proved complicated at this point and it is also because the WebGL spec isn’t completely reading for consumption at this point, I think. Other than that I think today, even though there are some rough edges with the HTML5 spec because it wasn’t really created with games in mind, I think it is the right time now to start doing games. I don’t think anyone should stop building games right now or being kept up by people who say HTML5 is not ready. I think, you know, if you look back to the [1980s] when people were first creating games for the Atari and Commodore 64, we got so much less possibilities back then and people were really creative in creating games. There is so much more we can do already in HTML5 and I think the only thing left is developers jumping on it and trying not to be scared away. I think now is the time to build games.

What is keeping developers from embracing HTML5 right now?

I think there are a couple of reasons. One of them is for classical game engineers to jump on the open web stack might prove a little bit difficult because it is a completely different environment. Before, if you have been working on an XBox game for instance, there wouldn’t be any resolution difference or platform differences. There would be any cross platform code you would have to write. Writing a completely different code, not writing event-driven code like you would do with JavaScript. It is simply a very different mindset to start with.

Another big reason is that HTML5 wasn’t created with games in mind. HTML itself is really a presentational language originally meant to do documents. That is one of the things we are doing now as well, to actively work with the vendors in the W3C to work with game engineers and push for the spec in terms of game development. I think a lot of people are still scared by the fact that it is not a language that was created for game. I think that is mostly the reason.

I don’t think there will be a time where you point to a certain time in history where you can say “this is the first time HTML5 was done.” I think the time is now to create those things. The Web is not something that comes in release cycles. The Web is growing always and we have seen that with the current browsers and the new iterations at the browser level, the vendor level.

On app stores and ecosystem – Does Zynga have plans for an app store?

I can’t disclose any plans that we have at this point for the future. But, I definitely think it is the right time build really cool solutions to serve apps on the Web. Like the Chrome Web store. Mozilla has its own Web store now. I am excited about those services. At the same time there are ways to bundle apps for the native app source. You can have solutions like PhoneGap or appMobi to really put your HTML5 game, the same code that runs on the browser, and put it into native platform and serve it in the App Store and such.

I think that there is ways that you can serve both at the same time so that is super helpful. As you’re aware probably, Facebook itself is kind of like an app platform and has been a really awesome ecosystem for us. I don’t see it as critical as many HTML5 engineers out there.

Facebook said at f8 last that it has no plans on an “app repository.

It depends on what you call an app repository, I guess. Right now, Facebook has launched an HTML5 version of mobile and you can actually launch apps on their HTML5 versions nowadays which is pretty cool. While there may not be an overview page that gives you access to apps it [Facebook] is still kind of an app store.

How does Zynga view the opportunities around HTML5 vis-a-vis its reliance on the Facebook platform? Is it a way to distance itself or diversify itself?

I don’t think it is a matter of that actually. That really is not a reason we jumped on HTML5. Whether you are doing Flash or HTML5 or native code you could still use Facebook or not use Facebook. Other than that I cannot really describe our plans with Facebook. You know, we have a very healthy relationship with them and I am sure it will continue to be like that in the future.

What is the next step for Zynga in terms of HTML5 games and what does the roadmap for 2012 look like?

Well, we have a lot of tricks up our sleeves, that is for sure. And a lot of prototyping to do and a lot of great stuff. Unfortunately, I cannot disclose any future products that we are releasing. But one of the things that you should definitely take a look at is our open source repositories. So, from a technology perspective, we started open sourcing tech that is in our games at github.com/zynga that will drive our current or future games. We will be allowing to continue more future code there that can help game devs but can also show you a vision of what we can do. So, there will be a lot of interesting stuff in 2012 and beyond from out games perspective.

One of the prototypes that we have released is the Zynga Jukebox that is one piece of a shared tech that we built on HTML5. That has been a pretty good success story since the Jukebox is being used on Words With Friends already. If you check out Words With Friends on Facebook, which is built on HTML5, this one is actually using that open source product. I know of other situations where some of our plugins are used. This is the essence of what we are doing here, essentially, built into small components.

There are two others there. One is called Zynga Jukebox which is meant to bring HTML5 audio to game developers across devices. The next one is the Zynga Viewporter which makes resolution and view port handling on smartphones much easier which is another pain point for many engineers. Finally we released the Zynga Scroller which is an implementation of a scrolling element like the fact many people highlighted the fact that smooth scrolling in Path is awesome. And I agree. But, I am positive we can have the same smooth scrolling affect in HTML5 with the Zynga Scroller. It really brings us the capabilities that people would only know from native apps before.

What are the best tools that Zynga uses or you could point developers to when developing HTML5 games?

Tooling is still actually a pain point. I agree. So, I don’t have a perfect answer right now. We are not running IDEs but are working with text editors. We are also writing our own tools. I think we are at a point right now where every HTML5 game developer still codes in there. The tool vendors out there simply don’t know what people need. So, eventually, game developers have to write their own tools before putting them in indigenous libraries. I think that is really what is needed. At this point I have seen a lot of great experiments like Mobi Edge or Sencha’s tools. I am reading them all on a monthly basis to see where the direction is going. There is a lot of passion and engineers working on this right now trying to solve these issues. We are not there yet. I don’t know the definite solution for game engineers for tooling. Let’s see what happens.

How long down the road before HTML5 Web apps for the browser and for mobile really hit an inflection point for popularity like the native ecosystem has?

You know what? Officially the spec says something like a couple of years. That is the usual way to do things because final spec is taking a very long time at the W3C level to major but that doesn’t keep anyone from doing stuff and I don’t think it should. So, HTML5 and what people think about HTML5, they don’t really think about HTML but also CSS3 and JavaScript extensions. So, it is a whole mindset, a whole buzzword that people will raise. I don’t think there will be a time where you point to a certain time in history where you can say “this is the first time HTML5 was done.” I think the time is now to create those things. The Web is not something that comes in release cycles. The Web is growing always and we have seen that with the current browsers and the new iterations at the browser level, the vendor level. So, if you look at Google Chrome or Firefox, you see those weekly release cycles nowadays where you see those crazy revisions of versions. I think we are now at Firefox 10 and Chrome is at 16 or 17 and that is great because when you talk to engineers that work on new game specs or features on Google Chrome, for instance, they tell you they can have something prototyped in weeks and out there for everyone to use in a matter of months which wouldn’t be possible a few years ago.

So, that shows me that there isn’t any reason to wait. If you want to start using something now, you should because you have an overlap of 75% of HTML5 capable browsers that update almost monthly. So, there is no point in waiting for a certain spec to finish. You can just start using it right now.

About ReadWrite’s Editorial Process

The ReadWrite Editorial policy involves closely monitoring the tech industry for major developments, new product launches, AI breakthroughs, video game releases and other newsworthy events. Editors assign relevant stories to staff writers or freelance contributors with expertise in each particular topic area. Before publication, articles go through a rigorous round of editing for accuracy, clarity, and to ensure adherence to ReadWrite's style guidelines.

[Interview] How Zynga Is Transforming Games With HTML5

Social gaming platform Zynga takes a lot of flak for its overbearing management practices and obsession with metrics over user experience. While those rumors may or may not be true, there is more to Zynga than calculating sessions lengths and daily average users. In fact, Zynga’s Germany branch is one of the global leaders in HTML5 development and creating dynamic mobile Web games. We chatted with Zynga Germany CTO Paul Bakaus about how Zynga approaches HTML5, what are the limitations of the spec and if we will ever see a Facebook app store.

Zynga has a variety of open source HTML5 projects in GitHub along with several new HTML5 game releases, including Words With Friends and Zynga Poker Mobile Web. As many Web-based game developers will tell you, those are not easy to create. See below for our interview with Bakaus and what Zynga is doing to move the HTML5 spec and ecosystem forward.

One of the things that I don’t recommend doing right now because it is just a matter of market share is going for WebGL. So, actual 3-D games have proved complicated at this point and it is also because the WebGL spec isn’t completely reading for consumption at this point, I think. Other than that I think today, even though there are some rough edges with the HTML5 spec because it wasn’t really created with games in mind, I think it is the right time now to start doing games. I don’t think anyone should stop building games right now or being kept up by people who say HTML5 is not ready.

Zynga’s HTML5 Products

There are now four HTML5-based Zynga games on the market: Words With Friends, FarmVille Express, Zynga Poker Mobile Web and CityVille Express. These games deliver load times comparable to native apps and, “utilize HTML5 tools such as WebSockets and CSS3 to deliver a seamless gaming experience and create fluid animations without slowing down game-play,” according to the company.

But there is more to Zynga’s contributions to HTML5 than just games. Its open source repository includes the Zynga Jukebox that helps game developers deal with the multi-layer audio limitations of HTML5 along with the Zynga Viewporter that has an essence of responsive design to it, fitting apps to the browsers they are in. One of the biggest problems, as Bakaus describes below, in HTML5 is seamless scrolling. The Zynga Scroller aims to eliminate that problem. Everybody talks about the great native scrolling in apps like Path. Bakaus hopes to give HTML5 the same capability.

Check out our interview with Bakaus below.

On background

A little bit about my background. I’m actually a developer myself. I started as a UI developer and back then we specialized in JavaScript and UI and many years ago I joined the jQuery team, one of my first gigs, and became the creator of jQuery UI. So back then John Resig asked me if I could build the UI for jQuery. Started jQuery UI got a lot of notice from jQuery UI and started learning how JavaScript works and how people use elements on the Web and how to drive it with a reasonable performance. I then moved on to consumer projects in Japan to transform Flash applications to JavaScript and finally I started Dextrose in 2010 with a friend of mine for the purpose of creating HTML5 games.

Back then we were looking for the creation of a full blown HTML5 game community and realized that the tech was there but it wasn’t any shared tech build so we started building an HTML5 engine prototype that was called Aves Engine that would really show the world what we could do with HTML5. We put up YouTube videos and I was talking at conferences about it and really made a lot of impact back then as really the first (tie)-based HTML5 engine that would show what they Web could still offer in the future.

Later that year Zynga acquired us to work on the full blown product. So, we threw away our prototype and started from scratch for the real solution for game systems to use. So, now when we are in a place where we have built up our development studio here in Germany that focuses on delivering HTML5 tech for the whole company and we are producing tech of the future here. It is a lot of research and a lot of fun as well.

A lot of challenges of course but right now we are really at a point where we have a full blown engine. We started it in house and what we can do is super exciting and let’s hope that we can get out a lot of what we are doing here soon.

Zynga’s philosophy on HTML5

Every decision we make on tech is really to connect people through our games. So, we are really want to bring our games to anywhere our players are. I think there is not a conscious decision for one tech or another, it is really what can deliver the job best. At this point we really are looking at HTML5 to drive a lot of this because HTML5 gives us a lot of advantages that native and Flash programs just cannot give us. The cross-platform aspect of it, bringing the game to many people on different platforms is really what is killing it for us.

Also, usually you would have to port an existing game that runs on Web and native to smartphones and tablets and maybe something else as well. We don’t have to do with that HTML5 and that is super exciting.

Limitations of HTML5 for games

There are a couple of limitations, to be honest. There are certainly sound issues. Sound is still a trouble for many game devs. One of the things that I don’t recommend doing right now because it is just a matter of market share is going for WebGL. So, actual 3-D games have proved complicated at this point and it is also because the WebGL spec isn’t completely reading for consumption at this point, I think. Other than that I think today, even though there are some rough edges with the HTML5 spec because it wasn’t really created with games in mind, I think it is the right time now to start doing games. I don’t think anyone should stop building games right now or being kept up by people who say HTML5 is not ready. I think, you know, if you look back to the [1980s] when people were first creating games for the Atari and Commodore 64, we got so much less possibilities back then and people were really creative in creating games. There is so much more we can do already in HTML5 and I think the only thing left is developers jumping on it and trying not to be scared away. I think now is the time to build games.

What is keeping developers from embracing HTML5 right now?

I think there are a couple of reasons. One of them is for classical game engineers to jump on the open web stack might prove a little bit difficult because it is a completely different environment. Before, if you have been working on an XBox game for instance, there wouldn’t be any resolution difference or platform differences. There would be any cross platform code you would have to write. Writing a completely different code, not writing event-driven code like you would do with JavaScript. It is simply a very different mindset to start with.

Another big reason is that HTML5 wasn’t created with games in mind. HTML itself is really a presentational language originally meant to do documents. That is one of the things we are doing now as well, to actively work with the vendors in the W3C to work with game engineers and push for the spec in terms of game development. I think a lot of people are still scared by the fact that it is not a language that was created for game. I think that is mostly the reason.

I don’t think there will be a time where you point to a certain time in history where you can say “this is the first time HTML5 was done.” I think the time is now to create those things. The Web is not something that comes in release cycles. The Web is growing always and we have seen that with the current browsers and the new iterations at the browser level, the vendor level.

On app stores and ecosystem – Does Zynga have plans for an app store?

I can’t disclose any plans that we have at this point for the future. But, I definitely think it is the right time build really cool solutions to serve apps on the Web. Like the Chrome Web store. Mozilla has its own Web store now. I am excited about those services. At the same time there are ways to bundle apps for the native app source. You can have solutions like PhoneGap or appMobi to really put your HTML5 game, the same code that runs on the browser, and put it into native platform and serve it in the App Store and such.

I think that there is ways that you can serve both at the same time so that is super helpful. As you’re aware probably, Facebook itself is kind of like an app platform and has been a really awesome ecosystem for us. I don’t see it as critical as many HTML5 engineers out there.

Facebook said at f8 last that it has no plans on an “app repository.

It depends on what you call an app repository, I guess. Right now, Facebook has launched an HTML5 version of mobile and you can actually launch apps on their HTML5 versions nowadays which is pretty cool. While there may not be an overview page that gives you access to apps it [Facebook] is still kind of an app store.

How does Zynga view the opportunities around HTML5 vis-a-vis its reliance on the Facebook platform? Is it a way to distance itself or diversify itself?

I don’t think it is a matter of that actually. That really is not a reason we jumped on HTML5. Whether you are doing Flash or HTML5 or native code you could still use Facebook or not use Facebook. Other than that I cannot really describe our plans with Facebook. You know, we have a very healthy relationship with them and I am sure it will continue to be like that in the future.

What is the next step for Zynga in terms of HTML5 games and what does the roadmap for 2012 look like?

Well, we have a lot of tricks up our sleeves, that is for sure. And a lot of prototyping to do and a lot of great stuff. Unfortunately, I cannot disclose any future products that we are releasing. But one of the things that you should definitely take a look at is our open source repositories. So, from a technology perspective, we started open sourcing tech that is in our games at github.com/zynga that will drive our current or future games. We will be allowing to continue more future code there that can help game devs but can also show you a vision of what we can do. So, there will be a lot of interesting stuff in 2012 and beyond from out games perspective.

One of the prototypes that we have released is the Zynga Jukebox that is one piece of a shared tech that we built on HTML5. That has been a pretty good success story since the Jukebox is being used on Words With Friends already. If you check out Words With Friends on Facebook, which is built on HTML5, this one is actually using that open source product. I know of other situations where some of our plugins are used. This is the essence of what we are doing here, essentially, built into small components.

There are two others there. One is called Zynga Jukebox which is meant to bring HTML5 audio to game developers across devices. The next one is the Zynga Viewporter which makes resolution and view port handling on smartphones much easier which is another pain point for many engineers. Finally we released the Zynga Scroller which is an implementation of a scrolling element like the fact many people highlighted the fact that smooth scrolling in Path is awesome. And I agree. But, I am positive we can have the same smooth scrolling affect in HTML5 with the Zynga Scroller. It really brings us the capabilities that people would only know from native apps before.

What are the best tools that Zynga uses or you could point developers to when developing HTML5 games?

Tooling is still actually a pain point. I agree. So, I don’t have a perfect answer right now. We are not running IDEs but are working with text editors. We are also writing our own tools. I think we are at a point right now where every HTML5 game developer still codes in there. The tool vendors out there simply don’t know what people need. So, eventually, game developers have to write their own tools before putting them in indigenous libraries. I think that is really what is needed. At this point I have seen a lot of great experiments like Mobi Edge or Sencha’s tools. I am reading them all on a monthly basis to see where the direction is going. There is a lot of passion and engineers working on this right now trying to solve these issues. We are not there yet. I don’t know the definite solution for game engineers for tooling. Let’s see what happens.

How long down the road before HTML5 Web apps for the browser and for mobile really hit an inflection point for popularity like the native ecosystem has?

You know what? Officially the spec says something like a couple of years. That is the usual way to do things because final spec is taking a very long time at the W3C level to major but that doesn’t keep anyone from doing stuff and I don’t think it should. So, HTML5 and what people think about HTML5, they don’t really think about HTML but also CSS3 and JavaScript extensions. So, it is a whole mindset, a whole buzzword that people will raise. I don’t think there will be a time where you point to a certain time in history where you can say “this is the first time HTML5 was done.” I think the time is now to create those things. The Web is not something that comes in release cycles. The Web is growing always and we have seen that with the current browsers and the new iterations at the browser level, the vendor level. So, if you look at Google Chrome or Firefox, you see those weekly release cycles nowadays where you see those crazy revisions of versions. I think we are now at Firefox 10 and Chrome is at 16 or 17 and that is great because when you talk to engineers that work on new game specs or features on Google Chrome, for instance, they tell you they can have something prototyped in weeks and out there for everyone to use in a matter of months which wouldn’t be possible a few years ago.

So, that shows me that there isn’t any reason to wait. If you want to start using something now, you should because you have an overlap of 75% of HTML5 capable browsers that update almost monthly. So, there is no point in waiting for a certain spec to finish. You can just start using it right now.

About ReadWrite’s Editorial Process

The ReadWrite Editorial policy involves closely monitoring the tech industry for major developments, new product launches, AI breakthroughs, video game releases and other newsworthy events. Editors assign relevant stories to staff writers or freelance contributors with expertise in each particular topic area. Before publication, articles go through a rigorous round of editing for accuracy, clarity, and to ensure adherence to ReadWrite's style guidelines.

Get the biggest tech headlines of the day delivered to your inbox

    By signing up, you agree to our Terms and Privacy Policy. Unsubscribe anytime.

    Tech News

    Explore the latest in tech with our Tech News. We cut through the noise for concise, relevant updates, keeping you informed about the rapidly evolving tech landscape with curated content that separates signal from noise.

    In-Depth Tech Stories

    Explore tech impact in In-Depth Stories. Narrative data journalism offers comprehensive analyses, revealing stories behind data. Understand industry trends for a deeper perspective on tech's intricate relationships with society.

    Expert Reviews

    Empower decisions with Expert Reviews, merging industry expertise and insightful analysis. Delve into tech intricacies, get the best deals, and stay ahead with our trustworthy guide to navigating the ever-changing tech market.