Posts Tagged ‘Games’

Fun with Trigonometry

Monday, May 14th, 2012

To find the direction from one object to another, we need to use some trig functions. First we need to know the positions of those objects. Then we can find the change in X and Y. From there we can find the distance between them and the angle from one to the other.

Here’s an example: Point A is located at coordinates (-10, -20), and Point B is located at (110, 70). To go from A to B is a change of (120, 90).

To find the angle from A to B, we use the arc-tangent function.

var distX = objectB.x - objectA.x;
var distY = objectB.y - objectA.y;
 
var angle_radians = Math.atan2(distY, distX);
var angle_degrees = radiansToDegrees( angle_radians );
function radiansToDegrees(r){
    return r * 180 / Math.PI;
}

In Javascript and ActionScript, the Math function atan2 will take y and x, and return the direction in radians. That means the returned value will be between -π and π. to convert radians to degrees, we multiply by 180 and divide by π. In this example, the angle is about 36.87°.

To find the distance between them, we use the Pythagorean theorem: a2 + b2 = c2, or:

var dist = Math.sqrt(distX * distX + distY * distY);

In this example, the distance is 150.

Now you can set the rotation of the first object to look at the second object. OK, but how do you move it forward at a constant rate? If you update its x and y position by 120 and 90, respectively, it would reach the goal in one step. Not much of an animation. Instead, give it a speed and use trigonometry to figure out the change in the x and y positions.

var speed = 6;
 
var deltaX = Math.cos(angle_radians) * speed;
var deltaY = Math.sin(angle_radians) * speed;
 
objectA.x += deltaX;
objectA.y += deltaY;

First we decide what speed to use. This is in pixels per frame. Each frame the object will move by 6 pixels in its forward direction. Then each frame, calculate the change in the x and y positions using the cosine and sine functions. This time we need to use radians, not degrees. These functions will return a value between -1 and 1. Now just multiply by the speed and apply it to the object.

To make the object turn smoothly, as in the example above, is a little more complicated, so I’ll save that for another time. But to give you a hint, it starts with a turning speed. You can see how it’s done in the attached FLA: trigTest.fla


Flash 3D Coming Soon

Wednesday, November 10th, 2010

At MAX 2010, Adobe announced new APIs for Flash player. Code named ‘Molehill’, they give developers low level access to 3D hardware acceleration through the GPU.

The current version of Flash provides us with 2.5D content; not quite 3D. But with frameworks and libraries like Away3D, we could stuff a 3D engine into Flash. Now the engine will be built-in with GPU support, allowing content with faster frame rates, more triangles, and better lighting and shaders. But because the APIs are low-level, developers will need to use frameworks to simplify development. Check out these videos for all the details:

3D APIs for Adobe Flash Player and Adobe AIR

Flash Player 3D Future


The Pros and Cons of Rokon

Friday, September 24th, 2010

After working with the Rokon Android game library for a few weeks, I’ve been able to wrap my brain around it. This is a great library that helps set up your development to work with Sprites and Layers, helps you set up views and more. I ran into some problems, and the documentation is vast, but there are very few tutorials.

Pros:

  • Very easy to set up your view in either landscape or portrait mode, and lock it that way.
  • Moving sprites around on your display is easy, and the game loop makes complete sense.
  • Very active community, quite helpful and responsive in the forums.
  • Integrates Box2D physics.

There are many other pros to using this library, and as I’m new to Java I’m sure that I am taking many of it’s strengths for granted.  I did run into a few cons though, so lets go over those.

Cons:

  • Collision detection isn’t great – There are a few ways to check for this, but in my game I was getting some inconsistencies that kept me from properly debugging and fixing the issue.
  • Display text on screen – There is no object that I could find to print out debug messages to anything other than Android’s built in Log class.  This was also something that I was hoping for to make displaying game information easier.
  • Simple shape drawing – Drawing simple objects like squares, circles, or even line segments was either undocumented or not implemented.

For reference I was using Rokon 2.0.3, and by the end of my development with it, there was a 2.1 version release.  I didn’t switch to it because I had read that many games were failing when the core libraries were updated.  While the library didn’t end up working out for me and my current project, I wouldn’t write off Rokon completely.  It’s a great tool set and could be perfect for your project.  Look forward to my next blog post where I try to code the same game using AndEngine, and let you know the pros and cons of that engine.


Options for Online 3D Content

Thursday, September 2nd, 2010

3D movies, 3D TVs, 3D cameras and camcorders, 3D cell phone displays… The 3D craze is well underway. So here’s a list of my favorite 3D development apps.

3D in Flash – Since Flash CS4, Movie Clips could have 3D transformations (position and rotation, but not scale). It’s a primitive 3D engine. In fact, Adobe calls it 2.5D. It’s more than 2D, but not quite 3D.

There are also 3D libraries such as Papervision3D and Away3D that can be imported into your Flash project that will give you a real 3D engine. These are great if you need to use Flash for your project, but you’re still limited to bending a primarily 2D program into 3D. Also, Flash comes with a lot of overhead and it is not the most efficient or fast solution for 3D content.

Virtools – Virtools offers a unique coding experience in which the programmer adds functionality by linking together behavior blocks in a schematic drawing, similar to a flow chart. It’s a very fast way to get basic functionality on your game assets. For example, to make a box rotate, just drop the box model in the 3D view to add it to the scene, then drop the Rotate behavior on it. In the schematic view, draw a link from the output of the Rotate behavior back to its input and you’re done. There’s not a single character of code to write, and it only takes about 5 clicks of the mouse. Of course, this is a pretty simple example, but most of it really is that easy. If you want more control, you can click a few more times to specify how fast it rotates and in which axis. You can also create your own behavior blocks if the hundreds that come with Virtools doesn’t have what you need. The downside to Virtools is that it is ridiculously expensive. Seriously, Virtools, offer a free version and lower the price to build your install base. You’d make up for it in volume.

Unity3D – Like Virtools, Unity is an integrated development environment (IDE) for building 3D games and simulations. I just started playing with it, but so far I like it a lot! Programming in it is not nearly as easy as in Virtools, but it is about the same as coding with Actionscript. It beats Flash with Papervision or Away3D when it comes to everything else. It’s a pain in the neck to get 3D models into Flash. In Unity, just save your assets in the Assets folder. They’ll now show up in your assets list in Unity. Also, because Unity is a real 3D engine, Flash can’t compare in visual quality to what you can do with Unity. Unity comes in a free version and a pro version, plus add-ons for developing for iOS or Android. And Unity 3.0 is coming out soon!

So there you have it; 4½ 3D development solutions (Flash by itself only counts for ½).


Zoom Creates Cache

Wednesday, June 2nd, 2010

Our geocache is now live. On the first day, six people found it and logged their find on geocaching.com. The first-to-find gift, a prize for the first person who finds the cache, was a TorkScrew, compliments of BellaSvago.com. Also included in the cache at the time of launch was one of our trackable Zoom Creates Coin geocoins, Pink Noise stickers, Google laptop sticker, pink dice, Zoom coasters, a TorkScrew coaster, and a C3P0 Pez dispenser.

Before you are given the cache coordinates, you first must solve a slide puzzle featuring Hoss and Pepper – the same image of the dogs as on our geocoins. The next challenge is to find the camouflaged cache.

The puzzle and cache has been very well received. So get out your GPS receiver and come find it! To get started, go here: Zoom Creates Cache.


Zoom Creates Geocoins

Thursday, May 20th, 2010

If you haven’t heard of geocaching yet, you must be living under a rock. So crawl out of there, then look behind it because there might be a geocache hidden there. Then go to http://geocaching.com to find out what it is.

In our attempt to take over the world, we’ve decided it would be fun to hide a geocache. But to make it extra special, we designed up and had 100 geocoins cast. We just got them back from the coin makers.
(more…)


Database access with a Chumby

Thursday, May 6th, 2010

Chumby, Database AccessIn my earlier posts, I’ve writen about writing a Chumby widget, writing a configuration widget, and accessing the accelerometer. Now we’ll look at accessing a database from a Chumby widget.

First, you’ll need to set up a database. I’ll assume you have access to a web server and know how to create a database, tables, and code to access it. I use MySQL and PHP.

You’ll also need a Chumby widget.

And to connect the two, you’ll need a crossdomain.xml file.
(more…)


Accessing the Chumby Accelerometer

Friday, March 26th, 2010

Chumby Accelerometer
Let’s take a look at the Chumby accelerometer. It’s the thing inside Chumby that tells it if it’s looking up or down, sideways, or up-side-down. It also detects sudden changes in acceleration. It’s basically an electronic inner ear. So if you shake Chumby, knock him on the side of the head, or drop him on the floor, the accelerometer will detect this and report how hard and in what direction the jolt happened. Disclaimer: I do not recommend or endorse violent behavior to Chumby, including hitting, shaking, throwing, or dropping.

If you’re familiar with Actionscript, you know that it’s pretty easy to find the position of the mouse cursor on the stage. Well, it’s also easy to get data from the accelerometer. The trick, however, is making use of it. Let’s take a look.
(more…)


The Problem with Probability

Friday, January 22nd, 2010

If you were to flip a coin 10 times, and it comes up heads each time, you might think, “On the next flip, it’s SURE to come up tails – it’s due.” If you flip the coin 10 more times and again it comes up heads each time, you might think, “The next flip will surely be HEADS. Just look at the statistics.” Of course, we know that any flip has just as much chance as being heads as it does tails (assuming the coin is evenly weighted and symmetrical). So how many flips does it take to change our feeling about the next flip? Somewhere between 10 and 20 flips? (more…)


Mobile Mobile

Thursday, December 24th, 2009

It seems everyone here insists on torturing me with holiday music. I don’t hate it, I just don’t really like it and I definitely do not need to listen to it every day for three weeks. I can block it out with my big headphones and my own heavy metal holiday meltdown mix including Black Sabbath’s Snow Blind and Judas Priest’s Evening Star and Slayer’s Jesus Saves. Festive, eh?

Anyway, I ran across this video of Mobile Mobile an interactive installation by James Theophane and it caused me take a break from my usual metal massacre, get inspired and actually enjoy a traditional holiday song.

Experience Mobile Mobile from James Théophane Jnr on Vimeo.

Mobile Mobile is a large sculpture  made of recycled mobile phones that hangs in the lobby of LBi, a marketing and technology agency in the UK. The sculpture plays Choir of the Bells when you tweet it. You can also play it live like a great big circular piano thing with your keyboard. Check it out!

mobile tree

Happy Holidays.