FGS 2012 Advisory Board Interview Series

This is part four in a series of interviews of the Flash Gaming Summit 2012 Advisory Board. This is your chance to get to know the folks who determine the content of Flash Gaming Summit, getting their thoughts on both the conference and the games industry in general. This week’s Advisory Board interview features Simon Lachance, co-founder of Berzerk Studio. Berzerk Studio is a highly successful game studio creating games for both online and mobile platforms.

For more information on Flash Gaming Summit, including passes, speaking, or award show nomination information please visit the conference website.

Introduce yourself- who are you, how big is your team, and how do you participate in the Flash games industry?

I’m Simon Lachance, co-founder of Berzerk Studio.  We’re a team of 7, (3 coders, 3 artists, 1 Game designer/Artist) making Flash games since the end of 2008. We have made over ten games up to this point, and recently launched our own Flash games portal.

What did you do before?

We, the 3 co-founders of Berzerk Studio, were working at the same Flash game company.  We always had the dream to start on our own, make games that we like and create a cool brand.  So we decided to quit our jobs and go full indie.

How did you first get into the Flash games industry? Tell us about your path.

As mentioned above, we were already working for another Flash Games company before Berzerk Studio.  That’s where we learned how to make a game from scratch.  After we founded Berzerk Studio, I was looking up “how to sell games” on the Internet (how to make a living out of it).  Our very first idea was to make a game on XNA and publish it on Xbox.  We had done a prototype of a Flash game ported on XNA that worked very well,  but we decided that it would have been too risky to start among the big ones.  Our strength was Flash games, and the XNA prototype would have taken too much time to make.

So back then, we did something hard but necessary-  we threw the 6-months-production-XNA-prototype in the garbage, and started another smaller game for the Flash market.  Our strategy was to create small but high quality games for the Flash market, build a reputation, a fanbase, and a brand to be able to sell on future console games.   That’s when we found Flash Game License (FGL).  Chris Hughes saw our prototype and contacted us, since then they really helped us monetize our games. You should really go see these guys if you want to know more on how to sell games and live from it.

What has been your proudest moment since joining the Flash gaming community?

It was when I went to Flash Gaming Summit (FGS) 2011. I’ve met a lot of cool people there- developers, publishers, portal owner etc. We exchanged a lot of great information on the games business. But the proudest moment was when I discovered that half of the people I’ve met knew Berzerk Studio and the Berzerk brand. There were literally people making the Berzerker’s scream from our intro in front of me saying “That’s the best intro ever!” I have never been so proud of our team.

What was the biggest challenge for Berzerk Studio in the early going? How does that compare to the challenges you face today?

I’d say the biggest challenge is monetizing your games. We knew how to make games, but to monetize them was something we had to learn. You have to make decisions when producing the games to make sure they sell well. The biggest challenge when you’re alone with no money to make a living, is time. You always have to scope small to make more games instead of risking to make a big game that won’t sell. Sometimes you have a really cool idea, but the time needed to create it is too long so you just have to leave it or save it for the sequel.

Describe the climate as a game developer today in terms of technology and monetization opportunity. How does it compare to being a game developer 2-3 years ago?

The biggest difference now is that you can think of porting your games on the mobile market.  The mobile market is way bigger than it was 2-3 years ago,  so it’s always best to think of a game that can be ported on the mobile market if the game does well on the web.  We chose Unity to port our games on iPhone and Android, which is a very strong technology that allows us now to port any of our games in 4 days.

What is it that you love the MOST about the Flash games industry?

It’s a very fast market.  You need to pump out games quickly, and it’s fairly easy to make a game that’ll be played millions of times all around the world.  It’s a very strong distribution tool for your brand.  An average Berzerk game gets 8-12 million plays,  sometimes 25 million.  That’s a lot of people that are exposed to your brand.

What do you like the least?

I’d say that it’s hard to make everybody happy.  Some players will want to tear it down, saying bad things about it. If your game is good,  people will ask for a sequel, NOW. If it’s bad, you’ll get tons of angry emails telling you what you did wrong.

How has the industry changed since you fist joined?

It’s pretty much the same.  You need a sponsor to distribute your games, it goes on thousands of portals and you start again. As said earlier, the biggest difference now for us is that we try to reach the mobile games market for games that worked well on web.

The theme for FGS 2012 is “Maximize Your Game”. How do you think Flash game developers are maximizing their games today? What could they be doing better / differently?

There’s a lot of ways to monetize your games.  Micro-transactions are one of them,  but knowing what and when to sell is a science. It’s important not to piss people off before they even play the game.  We have also found that translating our games in many languages is a really good thing to do, so you can reach new local markets.

Where do you see the Flash games industry going? What’s in store for the future?

Free small games will always be there.  It’s a great distribution tool for ads or showcasing your brand. I can’t see it going away anytime soon. Although, with Stage3D and the mobile market growing up, Flash games might finally have an impact on the mobile market.

What part of Flash Gaming Summit do you enjoy or look forward to the most?

Meeting people! Shaking hands and discussing business is my #1 plan at FGS.  If I have time, I’d also want to hop on stage to share my experiences, but there’s so many things going on here at Berzerk that I may not be able to!

In your opinion, why should people come out to FGS 2012? What should they expect?

“Maximize your games” pretty much sums it up.  Increasing revenue for each of your games is what you want, if you want to make games full-time and continue improving your games.

Thanks Simon, see you at FGS 2012!

© Colin Cupp for MochiLand, 2011. | Permalink | No comment

Add to del.icio.us

Search blogs linking this post with Technorati

Want more on these topics ? Browse the archive of posts filed under Developer Feed, Flash Development, Front Page, Games Industry, Industry News, Mochi Media Announcements, MochiLand Topics, Publisher Feed.

FGS 2012 Advisory Board Interview Series

This is part two in a series of interviews of the Flash Gaming Summit 2012 Advisory Board. This is your chance to get to know the folks who determine the content of Flash Gaming Summit, getting their thoughts on both the conference and the games industry in general. This week’s Advisory Board interview features Daniel McNeely, CEO, Armor Games.

For more information on Flash Gaming Summit, including passes, speaking, or award show information please visit the conference website.

Introduce yourself- who are you, how big is your team, and how do you participate in the Flash games industry?

My name is Daniel and I help run Armor Games with a bunch of talented indie developers. Our main team consists of 11 people.

What did you do before?

Before Armor Games I use to work in a cubicle for an online advertising company. It was a great experience and it taught me a lot about running an internet company. While in the cubicle I got addicted to several web games and decided to start a portal with a unique theme.

How did you first get into the Flash games industry? Tell us about your path.

I got introduced to many talented developers through the oldest and coolest portal around; Newgrounds. Through interacting with the developers, I found a community of people who were passionate about gaming and it inspired me to find ways we could partner together.

What was the biggest challenge for Armor Games in the early going? How does that compare to the types of challenges you face today?

The biggest challenge early on was finding a reliable webhost and someone who could manage our servers. My background isn’t in database management so finding qualified people proved to be challenging. The biggest challenge faced today is adapting quickly to the changing landscape of gaming. (Social, HTML5, etc)

What is your process for determining content for ArmorGames.com?

We play the game and see if it we enjoy it.  :)

How do you determine which game developers to work with? Is it just the developers making the best games? Anything else?

We work with a variety of developers and are open to partnering with anyone who has a talent and passion for gaming.

What has been your proudest moment since joining the Flash gaming community?

Some of my proudest moments are seeing those around me succeed. I love seeing Fancy Pants on Xbox Live or Jmtb02′s ‘Achievement Unlocked’ featured on every gaming blog, or Joey and Con’s ‘Crush the Castle’ passing 500 Million plays. Being able to share these things with the coolest people I know, makes my life very rewarding and enjoyable.

What is it that you love the MOST about the Flash games industry?

I love meeting developers and seeing the unique things they create on the platform.

What do you like the least?

Not being able to work with every developer who approaches us. We have a limited budget so turning developers away is my least favorite part.

How has the industry changed since you fist joined?

There’s been a lot more competition and the landscape has changed with the introduction of Social Games, the App Store and HTML5.

The theme for FGS 2012 is “Maximize Your Game”. How do you think Flash game developers are maximizing their games today? What could they be doing better / differently?

They maximize their games by never sticking to the status quo. The games I see released get better and better each year.

Where do you see the Flash games industry going? What’s in store for the future?

I see the games industry continuing to grow. I think developers will become less dependent on a single platform as HMTL5 and other technologies emerge.

What part of Flash Gaming Summit do you enjoy or look forward to the most?

Meeting indie developers.

In your opinion, why should people come out to FGS 2012? What should they expect?

To experience a community of people who are focused on making the world a more enjoyable place; one play at time.

Thanks for taking the time Daniel, see you at FGS 2012!

© Colin Cupp for MochiLand, 2011. | Permalink | 2 comments

Add to del.icio.us

Search blogs linking this post with Technorati

Want more on these topics ? Browse the archive of posts filed under Developer Feed, Front Page, Games Industry, Industry News, Mochi Media Announcements, MochiLand Topics, Publisher Feed.

I am happy to announce the official release of the new Mochi Achievements API!

Mochi Achievements API Summary

Flash game developers can now implement a completely customizable achievements system in your games that is free, flexible, and easy to use. The Mochi Achievements API also gives developers the flexibility of 2 toaster sizes (toaster = achievements pop-up) and 9 toaster placement options so that your achievements system looks and feels the way you want it to.

Speaking of look and feel, there is no Mochi Media branding in the default UI, and we encourage developers to implement your own UI (using the Mochi Achievements calls) for a more seamless game integration. The default UI comes with an achievements list, toasters, and graphics for the locked and unlocked states of your achievements (but you can easily customize the “unlocked state” graphics in the default UI).

We have also included a points system (points related to the achievements, developer-determined) complete with progress bars. Your players can view their points and achievements progress as they’re earned/unlocked.

Who Should Use Mochi Achievements?

Developers:

• If you don’t have the time or desire to create your own achievements system, but would love to have a quality solution that gives you control.
• If you are looking for a solution you can completely customize, either with your own branding or even a sponsor’s branding- you can be as creative as you want to be.

Publishers:

• Take advantage of the Mochi Publisher Bridge for site-specific achievements, getting more value out of your community and your players.
• You can request that developers implement Mochi Achievements with your branding for sponsorships and site-locks.

Mochi Achievements Examples

Flying Candy, Papa’s Taco Mia!, big LITTLE plagiary 3, and Flood Runner 3 are all examples of games that are using Mochi Achievements in different ways to “achieve” the same goal. Check out the two example games below to see the contrast between the default UI and what can be done with a custom UI.

The first example is big LITTLE plagiary 3, which uses the default UI. The second game is Papa’s Taco Mia, which is using custom UI created by the developer along with the Mochi Achievements calls. Note that the default UI has no branding, while the customized UI can be made to look however you want it to (including sponsor branding).

big LITTLE plagiary 3 Achievements List (default UI)

big LITTLE plagiary 3: Achievement Unlocked (default UI)

Papa’s Taco Mia: Achievement Unlocked (developer customized UI)

Papa’s Taco Mia: Achievements List (developer customized UI)

What Makes A Good Achievement?

Most game creators would agree that achievements make games more engaging and encourage players to stick around (increase replays). But how do you know if you are making a good achievements system? Here are a few resources we thought were interesting on the subject:

• Extra Credits
• The Cake is not a lie, pt.1
• Achievements 101 by Greg McClanahan

Want to try it out? Here’s how!

1. Download the latest version of the Mochi API
2. Once you have the latest API, log in to your developer dashboard
3. Select the game to which you would like to add achievements
4. Select “Achievements” in the left-hand menu
5. You should now see the information to create and edit achievements.

This new tool is a direct result of the community giving us product feedback- you wanted it, we thought it made sense, so we made it. Let us know what other products and features you would like us to work on by visiting our product feedback forums.

Be sure to let us know what you think about Mochi Achievements- we want your feedback! :)

© Colin Cupp for MochiLand, 2011. | Permalink | 5 comments

Add to del.icio.us

Search blogs linking this post with Technorati

Want more on these topics ? Browse the archive of posts filed under Developer Feed, Flash Development, Front Page, Game Design, Games Industry, Industry News, Mochi Media Announcements.

I also made a few assumptions, firstly I used my thumbs as the basis for determining the size of the controller’s thumb stick ‘head’ – I have quite big thumbs so I assumed that this would suffice for most people. The second one was more technical. As most PC games tend to rely heavily on keyboard input (and Flash web games even more so) for controlling your ship / player; I opted to emulate the 4 arrow keys – Up, Down, Left and Right instead of using co-ordinate translation*. There were a few reasons for key input emulation over co-ordinate translation. The first one I have already outlined. The second was to do with ease of conversion; as most Flash games use the keyboard already adding in the virtual controller shouldn’t require a major update to any pre-existing code. Lastly, there is the testing and debugging.

*I am working on a version that uses co-ordinate translation and will post it up soon.

Designing The Controller

The first thing to consider is the actual visual appearance of your controller – in my case this was going to be a thumb stick like those found on the Playstation or XBox controllers. For ease of mapping the users touch input on the thumb stick you really need two elements. First the thumb area, i.e. the place where the user places their thumb; secondly you need a surround. The surround is useful for two reasons. It provides a visual indication to the user on how far the thumb stick moves as well as allowing you to use this as the boundaries of your entire controller for the purpose of determining where the users thumb actually is and more importantly when they lift their thumb up. You can see a simple design for the entire thumb stick controller (including both the thumb and surround) in the image on the right.

Interestingly you don’t actually need to have any visuals if you don’t want them. Some games forgo them and just map the users thumb location. This can be confusing for some so depending on type of users you are expecting to attract to your game may determine whether you can remove the visual elements entirely. If in doubt make the controllers slightly transparent.

As their is a visual aspect to this controller it makes sense to leverage Flash Professional CS5 – you can do this all in Flash Builder if you wish, but it makes the initial set up easier using a more visual tool. Create a new FLA file and save it somewhere on your machine with the file name VirtualControllers. Next create a new ActionScript 3.0 class, call it ThumbStick.as and save it in the same directory as the one that contains VirtualControllers.fla. I use a package structure for my classes so I have nested folders as the image shows. You don’t have to do this if you don’t want to and in this article you’ll be using a flat package structure.

Before we start writing code though you need to create a symbol in the Library for the controller, and import the image assets for both the surround and the thumb stick (which you can download via the link at the bottom of this article, or create your own).

• Create a new symbol (Insert > New Symbol…)
• Call this new symbol ThumbStick
• Locate the downloaded assets for the surround and the thumb stick and import them in to your library (File > Import > Import to library)
• Flash Pro CS5 will automatically create two new symbols (Symbol1 and Symbol2) in your Symbol library
• Open the Symbol library (Window > Library)
• Select Symbol1 and rename it based on the graphic it contains (it’ll either be the surround or the thumb image)
• Repeat this process for Symbol2

Once you have renamed the symbols you need to edit them both to make sure that the enclosed image is centred in the middle of the symbol, as well as making sure that they are set as MovieClip symbols not Graphic symbols (which is what they will be by default).

• Right click on the Surround symbol in your library
• Select Properties from the context menu
• When the properties dialog opens change the top Type drop down from Graphic to MovieClip
• Click OK to apply and close this dialog window
• Repeat this for the Thumb symbol too
• With the Thumb symbol still selected double click it to enter edit mode
• The stage should update with the image asset placed approximately in the middle of the screen
• Select the image (a bounding blue box should appear)
• From the Properties panel (Window > Properties) set the X and Y values to -45, this will centre the Thumb image as it’s 90×90 pixels
• Repeat this for the Surround symbol, except set the X and Y values to -75 as the Surround image is 150×150. Again this will centre it

Now you have the main elements of your Thumb Stick controller defined you’ll need to combine them. To do this first edit the symbol you created called ThumbStick

• Double click on the ThumbStick symbol in your Library to enter edit mode
• Rename the default layer in your Timeline (Window > Timeline) to Thumb by right clicking on the layer and selecting Properties from the context menu
• A dialog will open where you can set the new layer name. You can also just double click the layer to edit it directly
• Create a new layer in the Timeline panel (click the New Layer icon in the bottom left of the Timeline) and name it Surround
• Make sure you still have the Surround layer selected
• Drag the Surround symbol from your library and make sure it is centred in the middle of your symbol
• With the Surround symbol still selected open the Properties panel and give it an instance name of surround
• Once you are happy with its position select the Thumb layer
• With the Thumb layer selected drag the Thumb symbol on to the stage of the ThumbStick symbol, making sure it’s on the Thumb layer
• Again centre the Thumb symbol so it is in the exact centre (note the cross hair in the middle of the symbols in the image)
• And as with the Surround symbol, open the Properties panel (making sure it is still selected) and give the Thumb symbol the instance name of thumb

Quick Tip

If the bitmap assets are looking a bit ‘jaggy’ you can always apply smoothing to them by right clicking on each image in the library and selecting Properties from the context menu. When the dialog opens just tick the Smoothing checkbox and click OK to apply.

Now you have the FLA and ActionScript files saved we can get about creating the initial code. The first thing you need to do is make sure your class extends Sprite (by default it doesn’t extend anything). You’re also going to need some private variables to store some of the controllers info in. To that end add the following (or just copy and paste the code below):

Defining The Controller

Now that you have a design, and you have created your actual controller symbol, you need to start thinking about adding the code to actually control it when the user interacts with it. The best approach is to break this process down initially as a bulleted list of its functional parts. The list will likely look something like this:

• Move thumb stick in a circular motion
• Limit thumb stick movement to within the surround
• Return thumb stick to centre of controller when the user removes their thumb
• Dispatch an event when the user moves the thumb stick

Obviously you are free to add more items to the list but these four cover the basic functionality. With that in mind lets start coding…

Writing The Code

The first thing you need to do is make sure that your ThumbStick class extends Sprite – by default Flash Professional creates non-inheriting classes. Now your code will look like this (I’ve applied a bit of formatting to my structure in case yours is formatted slightly differently)

package
{
  import flash.display.Sprite;

  public class ThumbStick extends Sprite
  {
    public function ThumbStick()
    {
    }
  }
}

To do this you need to add a couple of event listeners. These will deal with responding to the touch events when the user presses down with their thumb as well as when they remove it. Even though you can directly interact with the symbols you have within your controller (as you gave them instance names), the code hinting in Flash Professional’s code editor doesn’t kick in – so I tend to make a private variable that I map to the symbol to make this easier.

The code below has the handlers included as well as the event listeners so you can see the flow and structure (there is a problem with this code and I’ll explain what it is in a moment)

package
{
  import flash.display.Sprite;
  import flash.events.TouchEvent;

  public class ThumbStick extends Sprite
  {
    private var _thumb  :Sprite;
    private var _surround:Sprite;

    public function ThumbStick()
    {
      _thumb = thumb;
      _surround = surround;

      _thumb.addEventListener(TouchEvent.TOUCH_BEGIN, onThumbDown);
      _thumb.addEventListener(TouchEvent.TOUCH_END, onThumbUp);
      _surround.addEventListener(TouchEvent.TOUCH_END, onThumbUp);
    }

    protected function onThumbDown(e:TouchEvent):void
    {
      trace("Thumb Down");
    }

    protected function onThumbUp(e:TouchEvent):void
    {
      trace("Thumb Up");
    }
  }
}

One approach is to check the type of hardware you are running on and adjusting the code flow based on that by using the Capabilities() class. So if I update the code above further I can test to see if this is running on an ARM based processor or not (i.e most Smart phones and tablets). I can then tailor how the code is initialized.

package
{
  import flash.display.Sprite;
  import flash.events.TouchEvent;
  import flash.system.Capabilities;
  import flash.events.MouseEvent;

  public class ThumbStick extends Sprite
  {
    private var _thumb  :Sprite;
    private var _surround:Sprite;

    public function ThumbStick()
    {
      _thumb = thumb;
      _surround = surround;

      if(Capabilities.cpuArchitecture == "ARM")
      {
            _thumb.addEventListener(TouchEvent.TOUCH_BEGIN, onThumbDown);
        _thumb.addEventListener(TouchEvent.TOUCH_END, onThumbUp);
  _surround.addEventListener(TouchEvent.TOUCH_END, onThumbUp);
      }
      else
      {
      _thumb.addEventListener(MouseEvent.MOUSE_DOWN, onTestThumbDown);
        _thumb.addEventListener(MouseEvent.MOUSE_UP, onTestThumbUp);
  _surround.addEventListener(MouseEvent.MOUSE_UP, onTestThumbUp);
      }
    }

    protected function onThumbDown(e:TouchEvent):void
    {
      trace("Thumb Down");
    }

    protected function onThumbUp(e:TouchEvent):void
    {
      trace("Thumb Up");
    }

    // These are just for testing within Flash Pro
    protected function onTestThumbDown(e:MouseEvent):void
    {
      trace("Mouse Down");
    }

    protected function onTestThumbUp(e:MouseEvent):void
    {
      trace("Mouse Up");
    }
  }
}

The next functionality you need to implement is the actual ability to move the thumb stick. This is pretty easy to do and I’ve just created two methods to control this – one to deal with the actual movement when the user is touching the thumb stick, and one to reposition the thumb stick back to the centre of the surround

protected function initDrag():void
{
  _thumb.startDrag();
}

protected function resetThumb():void
{
  _thumb.stopDrag();
  _thumb.x = 0;
  _thumb.y = 0;
}

If you test it now it should function in a similar manner to the example below. Clicking and dragging the thumb stick moves it (try the example below). Releasing the mouse button will centre it back to its original position in the middle of the surround – note that while you can click and drag the thumb stick with your mouse, but it isn’t confined by the boundaries of the surround. This isn’t exactly what we want. Worry not though, you’ll be addressing that next.

Setting Controller Boundaries

As I mentioned earlier, this gives you basic drag functionality within your virtual controller and repositions the thumb stick on releasing the mouse button. However it doesn’t restrict the movement to within the actual controller surround. So with out further ado let’s jump right in the deep end and start with some Trigonometry :p. I’m not going to give you a trig primer here, but I will explain where applicable what is actually happening – if you want to know more there are many good resources online (a simple google search should suffice)

The first thing you need to do is add in a new event listener to monitor the thumb stick as you move it so it can be restricted when it hits the desired position at the boundaries of the controller surround. Now, normally you’d probably use the MouseEvent.MOUSE_MOVE event to monitor the movement of the thumb stick. However this event is quite expensive in terms of event dispatching and usage compared to the Event.ENTER_FRAME event. With that in mid you need to add the following line to end of the initDrag() method

addEventListener(Event.ENTER_FRAME, onThumbDrag);

removeEventListener(Event.ENTER_FRAME, onThumbDrag);

protected function onThumbDrag(e:Event):void
{
  // Store the current x/y of the knob
  var _currentX    :Number = _thumb.x;
  var _currentY    :Number = _thumb.y;

  // Store the registration point of the surrounding 'joystick holder'
  var _registrationX  :Number = _surround.x;
  var _registrationY  :Number = _surround.y;

  // Subtract the two from each other to get the actual x/y
  var _actualX  :Number = _currentX - _registrationX;
  var _actualY  :Number =  _currentY - _registrationY;

  // Calculate the degrees for use when creating the zones.
  _degrees = Math.round(Math.atan2(_actualY, _actualX) * 180/Math.PI);

  // Calculate the radian value of the knobs current position
  var _angle     :Number = _degrees * (Math.PI / 180);

  // As we want to lock the orbit of the knob we need to calculate x/y at the maximum distance
  var _maxX    :Number = Math.round((_radius * Math.cos(_angle)) + _registrationX);
  var _maxY    :Number = Math.round((_radius * Math.sin(_angle)) + _registrationY);

  // Check to make sure that the value is positive or negative
  if(_currentX > 0 && _currentX > _maxX || _currentX < 0 && _currentX < _maxX)     _thumb.x = _maxX;   if(_currentY > 0 && _currentY > _maxY || _currentY < 0 && _currentY < _maxY)
    _thumb.y = _maxY;
}

private var _degrees  :Number;
private var _radius  :Number = 25;

The Math ‘Bit’

That’s all well and good in theory, but how does that actually get applied in the code above? Well let’s start at the beginning of the method and look at each block of code so you can get a clearer understanding of the actual flow. First up you have a set of local storage variables. These just contain references to the position of the thumb stick and the surround:

// Store the current x/y of the knob
var _currentX    :Number = _thumb.x;
var _currentY    :Number = _thumb.y;

// Store the registration point of the surrounding 'joystick holder'
var _registrationX  :Number = _surround.x;
var _registrationY  :Number = _surround.y;

// Subtract the two from each other to get the actual x/y
var _actualX  :Number = _currentX - _registrationX;
var _actualY  :Number =  _currentY - _registrationY;

// Calculate the degrees for use when creating the zones.
_degrees = Math.round(Math.atan2(_actualY, _actualX) * 180/Math.PI);

// Calculate the radian value of the knobs current position
var _angle     :Number = _degrees * (Math.PI / 180);

// As we want to lock the orbit of the knob we need to calculate x/y at the maximum distance
var _maxX    :Number = Math.round((_radius * Math.cos(_angle)) + _registrationX);
var _maxY    :Number = Math.round((_radius * Math.sin(_angle)) + _registrationY);

// Check to make sure that the value is positive or negative
if(_currentX > 0 && _currentX > _maxX || _currentX < 0 && _currentX < _maxX)   _thumb.x = _maxX;     if(_currentY > 0 && _currentY > _maxY || _currentY < 0 && _currentY < _maxY)
  _thumb.y = _maxY;

Where’s The Thumb Again?

One thing you will have already noticed is that if your mouse moves outside of the thumb stick symbol, when you release it, the thumb stick doesn’t return to the centred position in the middle of the surround. This is because there is no event registered to capture the release of the thumb stick if you accidentally move out of it. This needs resolving as it is highly likely that your user will move their thumbs beyond the bounds of the thumb stick when playing your game (it’s just one of those things as they aren’t looking at the controller and as it’s virtual there isn’t any real feedback that they have extended beyond the desired bounds).

To fix this you could just register the stage and respond when the users releases the thumb stick. This is fine desktop / web apps as they don’t generally support multi-touch so you can only interact with one element at a time with the mouse. On devices this isn’t the case. Because you can have multiple touch points if you listened for the release via the stage if you have a virtual button – for firing your ships guns for example – then every time you lifted your finger off the button it would reset the thumb stick. Not ideal really.

A better way would be to create a invisible area that sits behind the actual controller graphics and listens for the release. That way it doesn’t matter if the user moves off the actual thumb stick symbol as this area would still respond to the release. Now one thing you would need to decide upon if you chose to implement this is how big should this ‘run off’ area be? Well that can be a bit subjective, but if you think about how the user will hold their device to use the controller then that should give you a good starting point.

For starters you don’t need it to cover a massive area – if fact I would say no more than a third of the width of the screen (working on the premise that the game is probably displayed as landscape). After all it’s unlikely the user will move their thumb a big distance given that they will be holding the device at the same time. If in doubt, test it out until you get a happy medium.

In the example below I have updated the ThumbStick symbol in Flash Professional by adding another layer called ‘Boundary’ and placed a new 25×25 pixel filled (red) circlular symbol in it. I gave it the instance name of boundary and made sure the layer was underneath all of the other layers in the ThumbStick symbol.

Obviously 25×25 pixels in size isn’t going to be that useful. However once you map the symbol to a variable in your ThumbStick() class you can easily set its dimensions. That way you could easily add in a getter/setter that would allow you to dynamically set the dimensions of the controller. In the code below I’ve just set this boundary symbol’s width and height with hard values within the constructor.

private var _thumb    :Sprite;
private var _surround  :Sprite;
private var _boundary  :Sprite;

private var _degrees  :Number;
private var _radius  :Number = 25;  

public function ThumbStick()
{
  _thumb = thumb;
  _surround = surround;
  _boundary = boundary;
  _boundary.width = 200;
  _boundary.height = 200;

  if(Capabilities.cpuArchitecture == "ARM")
  {
    _thumb.addEventListener(TouchEvent.TOUCH_BEGIN, onThumbDown);
    _thumb.addEventListener(TouchEvent.TOUCH_END, onThumbUp);
    _surround.addEventListener(TouchEvent.TOUCH_END, onThumbUp);
    _boundary.addEventListener(TouchEvent.TOUCH_END, onThumbUp);
  }
  else
  {
    _thumb.addEventListener(MouseEvent.MOUSE_DOWN, onTestThumbDown);
    _thumb.addEventListener(MouseEvent.MOUSE_UP, onTestThumbUp);
    _surround.addEventListener(MouseEvent.MOUSE_UP, onTestThumbUp);
    _boundary.addEventListener(MouseEvent.MOUSE_UP, onTestThumbUp);
  }
}

Summary

In this article you got a good foundation in how to approach creating a virtual controller that can be used on touch based devices (and we’ll be looking in to that part of the process in more detail in part 2). You also saw how to restrict the movement of the thumb stick to within the actual controller surround; as well as what should happen if the user accidentally moves their thumb off of the thumb stick and then removes their thumb from the screen.

With the foundation set you can now leverage this to add further enhancements such as dispatching events when the user moves the controller so that you can wire it in to your game easily.

You can read the second part of this article here: Virtual Controllers For Touch Based Devices (pt.2)

Related Files

VirtualController_pt1.zip

© MikeJones for MochiLand, 2011. | Permalink | 6 comments

Add to del.icio.us

Search blogs linking this post with Technorati

Want more on these topics ? Browse the archive of posts filed under Flash Development, Front Page, Industry News, MochiLand Topics, Tutorials.

Be sure to check out the Flash MindMeld, a virtual event where 60 experts are given 60 seconds to give their advice on how to be successful in the Flash games industry!

What Makes Or Breaks A Successful Flash Game?

That’s the question 60 of the greatest minds in Flash games answer for you — providing keen insight into the world of Flash game development.

Who are these experts? Top game developers from around the world like Tom Fulp, Brad Borne, Sean Cooper and Andy Moore. The guys who make game-changing games from the ground up.

You’ll discover… the key ingredients that make a successful Flash game as well as insight into strategic and tactical execution directly from the very trendsetters of Flash games and people who arguably create the best and most successful games in Flash.

The bottom line: Whether or not you’re just getting your feet wet in Flash game development or you’re a fully fledged veteran, with so many pieces of advice, there’s something to be learned by everyone.

Experience the Flash MindMeld today!

© Colin Cupp for MochiLand, 2011. | Permalink | No comment

Add to del.icio.us

Search blogs linking this post with Technorati

Want more on these topics ? Browse the archive of posts filed under Industry News, MochiLand Topics.

Recorded Sessions

Roberston Auditorium

• Welcome
• Flash + A Whole New Dimension for Games
• The Evolution of Flash Games at PopCap and How They Came to Facebook
• Panel: Getting Your Games Sponsored
• The Mochis Awards Show
• Panel: Polish: Making Your games Shine
• Kabam’s Studio Model
• So You Want To Make A Facebook Game?

Fisher Room

• Keeping Yourself Honest In Game Design
• Metrics From Top Game Developers
• Making a Single Player, Social Game, and Multiplayer Game on a Shoestring Budget. The Making of Snowfort.
• Kingdoms at War: Bridging an MMO World From iPhone to Flash
• How I Built a $10,000/mo Flash Game in My Spare Time
• Making a Game with Molehill: Zombie Tycoon

Photos, Videos, and More!

• View photos on the FGS Flickr group, and feel free to add your own!
• In case you missed it, there was an awesome photo booth at the after-party! Check out the photos
• Watch the Mochis Awards montage video

Coverage

• Pre-GDC 2011: Adobe 3D-Capable ‘Molehill’ Flash Beta Launches, Unity Working On Flash Export Feature (Gamasutra, February 28, 2011)
• Enemies to Friends: Unity Supports Flash (Develop, February 28, 2011)
• 2011 Flash Gaming Summit: Facebook, Flash Steering PopCap’s Future(IndustryGamers, February 27, 2011)
• Unity Exportera Vers Flash 3D (MacGeneration, February 28, 2011)
• Mochi Media CEO Jameson Hsu Talks About MM and Adobe’s Release of “Molehill” at FGS 2011(Eureka’s Castle, February 28, 2011)
• Flash Gaming Summit 2011: Frima Releases Interactive Demo of Zombie Tycoon on Molehill (IGN: PS3, February 28, 2011)
• Interview: Flash Gaming Summit 2011 (CasualGaming.biz, February 22, 2011)
• Unity, Flash & 3D on the web (blogs.unity3d.com, February 27, 2011)
• 25 Memorable Quotes from the 2011 Flash Gaming Summit (Bacon and Games, March 2, 2011)
• I Died & Went To Heaven But it Was Boring- So I Turned Up At FGS 2011… (The Rodinhoods, February 28,2011)
• Keeping Up With the Mochis #1: Bio Break (8-Bit Rocket, January 24, 2011)
• Keeping Up With The Mochis #2: A Creeping Realization (8-Bit Rocket, January 25, 2011)

Some Cool Tweets…

• @theestuarysf: “Loving the Flash Game Summit Format. Use of live streaming of both session tracks enable audiences to view content simultaneously #FGSummit”
• @stillsnowedin: “Had a blast at the Flash Gaming Summit, hope I get to go again next year.#fgs”
• @jmb02: “Flash Gaming Summit has fantastic coffee this year #fgs”
• @abavisg: “Watching the Flash Gaming Summit 2011. That’s it. I am officially a soon-to-be Flash game developer. #fevertalk”
• @itsamejohn: “Hanging out at Gaming Summit. So many awesome people here. #FGS”
• @BenOlding: “Had a great day at the #fgs. Met loads of great people”

Tune In

For all of the most up-to-date announcements and conversations, be sure you’re tuned in to the FGS social channels:

Facebook / Twitter / Convore

Slide Presentations

Thanks, and enjoy!

© Colin Cupp for MochiLand, 2011. | Permalink | 2 comments

Add to del.icio.us

Search blogs linking this post with Technorati

Want more on these topics ? Browse the archive of posts filed under Games Industry, Industry News, Mochi Media Announcements, MochiLand Topics.

To register, visit http://www.adobe.com/go/multiscreen

Series description: With the final releases of Flash Player 10.1 and AIR 2 are just around the corner, we’d like to invite you to a series of free webinars introducing the new multi-screen development capabilities of the Flash Platform. You will discover the exciting new features of Flash Player 10.1 and AIR 2 and learn the best practices from leading industry experts on how to create and optimize web content, video, and applications across desktop and mobile.

The webinars take place June 22-24 at the following times:

Tuesday, June 22, 9AM – 10AM Pacific Time
Best practices in optimizing web content for Flash Player 10.1

Tuesday, June 22, 1PM – 2PM Pacific Time
The quickest way to build cross-platform apps with AIR 2

Wednesday, June 23, 9AM – 10AM Pacific Time
Rich Internet App development with Flash Builder 4 for Flash Player 10.1 and AIR 2

Thursday, June 24 9AM – 10AM Pacific Time
Multi-screen web content development with Flash Pro CS5

© ada for MochiLand, 2010. | Permalink | No comment

Add to del.icio.us

Search blogs linking this post with Technorati

Want more on these topics ? Browse the archive of posts filed under Flash Development, Industry News, MochiLand Topics.

Meet with Mochi

Mochi Media will be in Seattle for Casual Connect next month! We always have a blast at this event and are looking forward to it again. If you’re going to be there, please stop by our booth (we’ll on the 1st tier above the grand lobby) or send us a note (team [at] mochimedia.com) to set up a meeting!

Josh Larson from Mochi will also be speaking at the following session taking place on Thursday, July 22 at 11am:

Creating Successful Games: Lessons in Virtual Currency
This presentation covers winning strategies, game-play mechanics and tips for developers to successfully integrate virtual goods into their games based on analysis and observations from Mochi Media’s network of over 100 micro-transactions enabled games. With growing interest in this area, many developers are beginning to directly interact with their gamers through virtual goods. However, successful implementation of virtual goods requires careful balancing and consideration of gameplay mechanics and strategies. What is working in other games and how can you avoid the pitfalls that others have encountered? Josh Larson will present the lessons learned for developers from other’s experiences.

Want to go? Free tickets!

We have a handful of extra tickets to attend Casual Connect next month. If you’re interested in getting a FREE ticket to attend Casual Connect, please comment below with who you are and why you want to go. (Note: this only includes your ticket, not any travel costs.)

See you soon!

UPDATE: Winners have been announced

© ada for MochiLand, 2010. | Permalink | 13 comments

Add to del.icio.us

Search blogs linking this post with Technorati

Want more on these topics ? Browse the archive of posts filed under Games Industry, Industry News, Mochi Media Announcements, MochiLand Topics.

MochiGames mobile features a growing list of over 30 games and be available upon the release of Google’s next version of Android (“FroYo”).

“The Flash game development community continually pushes the boundaries of what is possible with Flash,” said Ricky Liversidge, vice president, Product Marketing, Flash Platform at Adobe. “With the beta completion of Adobe Flash Player 10.1, sites like MochiGames are expanding the countless opportunities for developers to engage with consumers through mobile.”

Hope you get a chance to check out the video. Let us know what you think!

© ada for MochiLand, 2010. | Permalink | 16 comments

Add to del.icio.us

Search blogs linking this post with Technorati

Want more on these topics ? Browse the archive of posts filed under Games Industry, Industry News, Mochi Media Announcements, MochiLand Topics.

Meet The Finalists

The Winners

Category: Best Flash Game Port

• Canabalt onto iPhone by Semi Secret Software: Flash version – iPhone version

Category: Best Indie Game

• The Company of Myself by 2DArray

Category: Best Game Art

• Machinarium by Amanita Design

Category: Best Multiplayer Game

• Zilch by Gaby Vanhegan

Category: Best Strategy Game

• Shadez 2: Battle For Earth by Sean Cooper

Category: Best Puzzle Game

• Rustyard by Nitrome

Category: Best Social Game

• Bejeweled Blitz by Popcap

Category: Best Shooter Game

• Captain Forever by Farbs

Category: Most Creative Game

• Time Fcuk by Edmund McMillen

Category: Best Kongregate Kreds Game

• Sacred Seasons by Emerald City Games

Category: People’s Choice Award

• Cube Colossus by Lucidrine

© ada for MochiLand, 2010. | Permalink | 7 comments

Add to del.icio.us

Search blogs linking this post with Technorati

Want more on these topics ? Browse the archive of posts filed under Developer Spotlight, Game Showcase, Games Industry, Industry News, Mochi Media Announcements, MochiLand Topics.